/* Small visual agents use the program's own palette. */
.preview-agents{position:fixed;inset:0;pointer-events:none;z-index:80;overflow:hidden}
.preview-agent{position:absolute;left:0;top:0;display:flex;align-items:center;gap:2px;opacity:0;will-change:transform;transition:opacity .3s;--agent-tone:var(--palette-6);color:var(--agent-tone);font-family:var(--sans)}
.preview-agent--coordinator{--agent-tone:var(--palette-5)}
.preview-agent--scheduler{--agent-tone:var(--palette-3)}
.preview-agent--reviewer{--agent-tone:var(--palette-8)}
.preview-agent.is-visible{opacity:1}
.preview-task-enter{animation:preview-task-enter .45s ease-out}
.preview-typing::after{content:'';display:inline-block;width:1px;height:1em;margin-left:2px;background:var(--palette-6);vertical-align:-.1em;animation:preview-caret .8s steps(2,end) infinite}
.preview-drag-ghost{position:fixed;left:0;top:0;z-index:70;pointer-events:none;filter:drop-shadow(0 12px 16px #17231d20);will-change:transform}
.preview-motion-paused *{animation-play-state:paused!important}
#root [data-preview-section]{cursor:pointer;pointer-events:auto}
#root [data-preview-section]:focus-visible{outline:2px solid var(--palette-5);outline-offset:2px}
@keyframes preview-task-enter{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@keyframes preview-caret{50%{opacity:0}}
@media(prefers-reduced-motion:reduce){.preview-agent{transition:none}.preview-task-enter,.preview-typing::after{animation:none}}
/* Decorative macOS window controls, inside the existing canvas. */
.preview-window-chrome{display:flex;align-items:center;flex:0 0 auto;height:2.5rem;background:transparent;user-select:none}
.preview-window-controls{display:flex;gap:8px;align-items:center;margin-left:2px}
.preview-window-controls>span{display:block;width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 0 1px #0000000d}
.preview-window-close{background:#ff5f57}.preview-window-minimize{background:#febc2e}.preview-window-expand{background:#28c840}

/* Align traffic lights with the project name inside the existing toolbar. */
.board-toolbar-sidebar .board-sidebar-top-row{display:flex;align-items:center;gap:12px;padding-right:calc(var(--board-toolbar-control-height) + 4px)}
.board-toolbar-sidebar .board-sidebar-top-row .board-project-switcher{flex:1;min-width:0;width:auto;max-width:none}
.board-toolbar-sidebar .board-project-switcher-trigger{padding-left:0;padding-right:0}

/* Sidebar labels share the category edge; content has room below the toolbar. */
.board-sidebar-primary-nav .board-nav-section--views .board-nav-item{padding-left:.75rem;gap:.55rem}
.board-sidebar-primary-nav .board-nav-view-icon{display:inline-block;width:1.25rem!important;height:1.25rem!important;flex:0 0 1.25rem}
.board-main{padding-top:10px}

/* More space below the project and between sidebar entries. */
.board-sidebar .board-sidebar-primary-nav{margin-top:12px}
.board-sidebar .board-nav{gap:14px}
.board-sidebar .board-nav-section--views .board-nav-list{gap:4px}
.board-sidebar .board-nav-section--space{gap:6px}
.board-sidebar .board-nav-section .board-nav-item{min-height:36px}

/* Original icon images work without cross-origin CSS masks in the sandboxed preview. */
.board-sidebar-primary-nav .preview-native-nav-icon{object-fit:contain;background:none;opacity:.65}

/* Rounded presentation cursors replace agent dots; no task outlines on interaction. */
.preview-agent-cursor{display:block;overflow:visible;transform:translate(-5px,-4px) rotate(var(--cursor-angle,0deg));transform-origin:5px 4px;filter:drop-shadow(0 2px 2px #17231d26)}
.preview-agent.is-clicking .preview-agent-cursor{animation:preview-cursor-tap .3s ease}
@keyframes preview-cursor-tap{0%,100%{transform:translate(-5px,-4px) rotate(var(--cursor-angle,0deg)) scale(1)}50%{transform:translate(-5px,-4px) rotate(var(--cursor-angle,0deg)) scale(.86)}}
@media(prefers-reduced-motion:reduce){.preview-agent.is-clicking .preview-agent-cursor{animation:none}}

/* Name badges use Sprout's native capability-badge shape, spacing and color mix. */
.preview-agent-name{--badge-tone:var(--agent-tone);display:inline-flex;align-items:center;gap:.35rem;padding:.3rem .55rem;border-radius:var(--radius-pill);font-size:.8rem;font-weight:500;line-height:1.2;white-space:nowrap;color:color-mix(in srgb,var(--badge-tone) 70%,var(--text-primary));background:color-mix(in srgb,var(--badge-tone) 15%,var(--surface-panel))}

/* Original Sprout document-table styling. */
.tasklist-info-overview-table{--overview-table-add-control-size: 1.35rem;--overview-table-add-control-gap: .4rem;position:relative;width:100%;min-width:0;margin:.7rem 0 .9rem}.tasklist-info-overview-table-scroll{box-sizing:border-box;padding:1px;width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;overscroll-behavior-inline:contain;scrollbar-width:thin}.tasklist-info-overview-table table{width:max-content;min-width:100%;table-layout:fixed;border-collapse:collapse;color:var(--text-primary);font-size:.9rem;line-height:1.45}.tasklist-info-overview-table th,.tasklist-info-overview-table td{position:relative;min-width:0;border:1.25px solid color-mix(in srgb,var(--text-primary) 17%,transparent);background:transparent;padding:0;text-align:left;vertical-align:top}.tasklist-info-overview-table th{background:transparent;color:var(--text-primary);font-weight:650}.tasklist-info-overview-table-cell{min-height:1.45rem;padding:.42rem .55rem;border:0;background:transparent;outline:0;overflow-wrap:anywhere;word-break:break-word;cursor:text}

/* Compact document content preserves a clear heading, list and table hierarchy. */
.board-overview .preview-overview-document{font-size:1rem;line-height:1.55}
.board-overview .preview-overview-document .preview-overview-intro{margin:0 0 1.1rem;color:var(--text-secondary)}
.board-overview .preview-overview-document h2{font-size:1.2rem;font-weight:600;line-height:1.3;letter-spacing:-.02em;margin:1rem 0 .45rem}
.board-overview .preview-overview-priorities{list-style:disc;margin:.35rem 0 1.15rem;padding-left:1.15rem}
.board-overview .preview-overview-priorities li{margin:.25rem 0;padding-left:.15rem}
.board-overview .preview-overview-priorities li::marker{color:var(--text-secondary)}
.preview-overview-document .tasklist-info-overview-table table{width:100%;table-layout:fixed}
.preview-overview-document .tasklist-info-overview-table th:first-child{width:46%}
.preview-overview-document .tasklist-info-overview-table th:nth-child(2){width:23%}
.preview-overview-document .tasklist-info-overview-table th:nth-child(3){width:31%}