/* Storyboard workspace. Existing calendar and stored content stay unchanged. */
#detail{width:min(1080px,calc(100% - 28px));max-height:92dvh;padding:0;border:1px solid var(--border);border-radius:18px;box-shadow:0 28px 120px #0008;--plan-soft:#b2b2bc;--plan-blue:#8dbdff;--plan-rose:#f2b4a2;--plan-violet:#c4b0ff}
:root[data-theme=light] #detail{--plan-soft:#545460;--plan-blue:#235da4;--plan-rose:#a34128;--plan-violet:#6950a5}
#detail-content{padding:32px;overflow-wrap:anywhere}
#detail h2{font-size:clamp(1.8rem,4vw,2.7rem);line-height:1.06;max-width:850px;margin:8px 55px 20px 0}
#detail .modal-close{position:sticky;top:14px;float:right;margin:14px 14px -55px 0;z-index:3;border-radius:8px;background:var(--panel);min-height:42px}
#detail .plan-eyebrow{font-size:.75rem;letter-spacing:.11em;text-transform:uppercase;color:var(--plan-soft);margin:0 0 8px}
#detail .d-specs{margin:0;gap:8px}
#detail .d-spec{font-size:.8125rem;border-radius:6px}
.detail-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:24px}
#detail .status-row{margin:0}
#detail .status-row label{font-size:.8125rem}
#detail select{border-radius:6px;font-size:.875rem}
.plan-point{display:flex;align-items:center;gap:20px;padding:24px;border:1px solid var(--border);border-radius:12px;background:linear-gradient(115deg,color-mix(in srgb,var(--accent) 8%,var(--panel)),var(--panel))}
.point-mark{font-size:3rem;line-height:1;color:var(--accent)}
.plan-point p:last-child{font-family:system-ui,sans-serif;font-size:1.2rem;line-height:1.5;margin:0;max-width:740px}
.story-map{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:0;margin:22px 0 30px;gap:8px;list-style:none}
.story-map li{display:flex;align-items:center;gap:10px;border-top:3px solid var(--border);padding:14px 8px;opacity:.72}
.story-map li:nth-child(1){--phase-color:var(--plan-rose)}
.story-map li:nth-child(2){--phase-color:var(--plan-blue)}
.story-map li:nth-child(3){--phase-color:var(--plan-violet)}
.story-map li:nth-child(4){--phase-color:var(--accent)}
.story-map li.is-current{border-color:var(--phase-color);opacity:1;background:linear-gradient(color-mix(in srgb,var(--phase-color) 8%,transparent),transparent)}
.phase-num{font:700 2rem 'Big Shoulders Display',sans-serif;color:var(--phase-color)}
.story-map b{display:block;font-family:system-ui,sans-serif;font-size:1rem}
.story-map div>span{display:block;font-size:.75rem;color:var(--plan-soft);line-height:1.5;margin-top:4px}
.plan-section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:14px}
.plan-section-heading h3{font:700 1.7rem 'Big Shoulders Display',sans-serif;margin:0}
.plan-muted{font-size:.8125rem;color:var(--plan-soft);line-height:1.6}
.scene-picker{display:flex;gap:8px;overflow-x:auto;padding-bottom:12px;margin-bottom:12px;scrollbar-width:thin}
.scene-picker button{flex:0 0 148px;display:flex;align-items:flex-start;gap:9px;min-height:68px;border-radius:8px;font:500 .8125rem/1.45 system-ui,sans-serif;text-align:left;background:var(--bg)}
.scene-picker button>span{color:var(--plan-soft);font-family:'JetBrains Mono',monospace;font-size:.75rem}
.scene-picker button[aria-pressed=true]{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 7%,var(--panel))}
.scene-picker button[aria-pressed=true]>span{color:var(--accent)}
.scene-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:28px;align-items:start}
.scene-visual{margin:0;min-width:0;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:var(--bg);background-image:radial-gradient(var(--border) 1px,transparent 1px);background-size:16px 16px}
.frame-label{display:flex;justify-content:space-between;gap:10px;padding:14px 16px;font-size:.75rem;color:var(--plan-soft);border-bottom:1px solid var(--border);background:var(--panel)}
.scene-diagram{min-height:220px;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:16px;padding:28px 18px}
.scene-visual figcaption{font-size:.75rem;color:var(--plan-soft);padding:12px 16px;border-top:1px solid var(--border);background:var(--panel)}
.diagram-path,.diagram-pair{display:flex;gap:8px;align-items:center;justify-content:center}
.diagram-node{display:block;min-width:0;flex:1;padding:15px 8px;border:1px solid var(--border);border-radius:8px;background:var(--panel);text-align:center;font:500 .875rem/1.5 system-ui,sans-serif}
.diagram-node.highlight{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 9%,var(--panel))}
.diagram-node b{display:block;font-size:1.2rem;margin-top:4px}
.diagram-arrow{color:var(--plan-soft)}
.diagram-stack{display:grid;gap:8px;max-width:240px;width:100%;align-self:center}
.diagram-caption{font-size:.8125rem;color:var(--plan-soft);text-align:center}
.diagram-stop{border:1px dashed var(--plan-rose);border-radius:8px;text-align:center;padding:10px;font-size:.8125rem;color:var(--plan-rose)}
.diagram-verdict{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;font-size:.8125rem;color:var(--plan-violet)}
.scene-direction h4{font:700 1.5rem/1.15 'Big Shoulders Display',sans-serif;margin:0 0 20px}
.scene-cue{display:grid;grid-template-columns:76px 1fr;gap:12px;margin-bottom:16px}
.scene-cue>span{font-size:.75rem;color:var(--accent);padding-top:3px}
.scene-cue p{font:400 1rem/1.5 system-ui,sans-serif;margin:0}
#detail details summary{cursor:pointer;line-height:1.5}
#detail details summary:focus-visible,#detail button:focus-visible,.card:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.scene-more{border-top:1px solid var(--border);padding-top:12px;font:400 1rem/1.6 system-ui,sans-serif}
.scene-more summary{font-family:'JetBrains Mono',monospace;font-size:.8125rem;color:var(--plan-soft)}
.scene-more p{white-space:pre-wrap}
.scene-navigation{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:22px 0 28px}
.scene-navigation button{border-radius:8px;font-size:.8125rem;min-height:42px}
.scene-navigation button:disabled{opacity:.35;cursor:default}
.recording-plan{border:1px solid var(--border);border-radius:10px;padding:16px 20px;background:var(--bg)}
.recording-plan>summary{font-size:.9375rem}
.recording-plan>summary span{float:right;color:var(--plan-soft);font-size:.8125rem}
.recording-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding:14px 0 0 22px;font-family:system-ui,sans-serif}
.recording-steps li{padding-left:4px}
.recording-steps b{display:block;margin-bottom:8px}
.recording-steps span{font-size:.9375rem;line-height:1.5;color:var(--plan-soft)}
.brief-library{margin-top:28px;padding-top:8px;border-top:1px solid var(--border)}
.brief-library>h3{font:700 1.4rem 'Big Shoulders Display',sans-serif;margin:14px 0}
.brief-fold{border-bottom:1px solid var(--border);padding:16px 0}
.brief-fold>summary{font-size:.9375rem}
.brief-fold>summary>span{float:right;color:var(--plan-soft);font-size:.8125rem}
.brief-fold .fold-body{font:400 1rem/1.65 system-ui,sans-serif;padding:12px 0}
.brief-fold a{color:var(--accent)}
#detail .script-beat{font:400 1rem/1.65 system-ui,sans-serif;padding:16px 0}
#detail .script-beat .sb-label{font-size:.8125rem}
#detail .notice{font-size:.875rem;color:var(--plan-soft)}
#detail .titles-list{font-size:1rem}
.plan-caution{border-left:2px solid var(--plan-rose);padding-left:14px;margin:20px 0 0}
@media(max-width:720px){#detail-content{padding:24px 18px}.story-map{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin-bottom:24px}.scene-layout{grid-template-columns:1fr;gap:20px}.scene-diagram{min-height:175px}.recording-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.plan-point{padding:18px;gap:12px}.point-mark{font-size:2rem}.plan-point p:last-child{font-size:1.0625rem}.scene-cue{grid-template-columns:70px 1fr;gap:8px}.plan-section-heading{flex-wrap:wrap;gap:6px}.scene-navigation button{font-size:.75rem;padding:8px}.brief-fold>summary>span{float:none;display:block;margin-left:18px}}
@media(prefers-reduced-motion:reduce){.card{transition:none}.card:hover{transform:none}}
