:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f8fafc;--panel:#111827;--panel-strong:#172033;--border:#94a3b859;--muted:#cbd5e1;--subtle:#94a3b8;--accent:#38bdf8;--accent-strong:#0ea5e9;--mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;background:#0f172a;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{color:#f8fafc;background:radial-gradient(circle at 18% -10%,#38bdf82e,#0000 34rem),radial-gradient(circle at 100% 0,#6366f129,#0000 30rem),#0f172a;min-height:100vh;margin:0;font-size:14px;line-height:1.4}a{color:#93c5fd;text-underline-offset:3px}h1,h2,p{margin:0}h1{font-size:clamp(2rem,5vw,3.5rem);line-height:1}h2{font-size:1rem}p,.toolbar-status{color:var(--muted)}.back-link{margin-bottom:8px}code,pre,textarea{font-family:var(--mono)}button,input,select,textarea,output{font:inherit}button,input,select,textarea{border:1px solid var(--border);color:#f8fafc;background:#020617;border-radius:8px;min-height:36px;padding:7px 10px}button{cursor:pointer}button:hover:not(:disabled),button:focus-visible:not(:disabled),button.primary,.project-button.is-active{border-color:var(--accent)}button:disabled{cursor:wait;opacity:.55}label{flex-wrap:wrap;align-items:center;gap:8px;display:flex}:is(label:has(input:not([type=checkbox])),label:has(select),label:has(textarea)){align-items:start;display:grid}input[type=checkbox]{width:16px;height:16px;min-height:0;accent-color:var(--accent);padding:0}input[type=range]{height:36px;min-height:36px;accent-color:var(--accent);flex:1;padding:0}.panel .row>output,.panel .row>span{border:1px solid var(--border);min-height:36px;color:var(--muted);background:#020617;border-radius:8px;padding:7px 10px}.panel .row>span{align-items:center;gap:6px;display:inline-flex}input[type=text],input[type=url],textarea{width:100%;min-width:0}textarea{resize:vertical}pre{border:1px solid var(--border);background:var(--panel);color:#dbeafe;white-space:pre-wrap;border-radius:10px;max-height:360px;margin:0;padding:12px;overflow:auto}pre:empty:before{content:"No output yet.";color:var(--muted)}.page-layout{gap:18px;width:min(100%,1040px);margin:0 auto;padding:40px 24px;display:grid}.page-layout--wide{width:100%}.split-layout{grid-template-columns:minmax(0,3fr) minmax(320px,2fr);align-items:start;gap:18px;display:grid}.split-layout__main{gap:12px;display:grid;position:sticky;top:18px}.split-layout__side{gap:18px;min-width:0;display:grid}.grid{grid-template-columns:repeat(auto-fill, minmax(var(--grid-min,240px), 1fr));gap:12px;display:grid}.groups{gap:16px;display:grid}.group{gap:14px;display:grid}.group.panel{width:100%}.group__header{justify-content:space-between;align-items:center;gap:12px;display:flex}.group__header h2{font-size:1.15rem}.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.row--between{justify-content:space-between}.row--right{justify-content:flex-end}.toolbar{z-index:20;border-bottom:1px solid var(--border);background:#0f172a;min-height:56px;padding:10px 16px;position:sticky;top:0}.toolbar h1{font-size:1rem;line-height:1.2}.page-hero{background:linear-gradient(135deg,#0f172aeb,#111827b8),radial-gradient(circle at 100% 0,#38bdf83d,#0000 24rem);border:1px solid #94a3b838;border-radius:22px;gap:10px;padding:28px;display:grid;box-shadow:0 24px 80px #0206173d}.eyebrow{color:var(--accent);letter-spacing:.11em;text-transform:uppercase;font-size:.75rem;font-weight:700}.button-link{border:1px solid var(--border);color:#f8fafc;background:#020617;border-radius:10px;justify-content:center;align-items:center;width:fit-content;min-height:38px;padding:8px 13px;font-weight:700;text-decoration:none;display:inline-flex}.button-link:hover,.button-link:focus-visible{border-color:var(--accent)}.button-link.primary{background:linear-gradient(135deg, var(--accent-strong), #2563eb);color:#fff;border-color:#38bdf8b3}.card,.panel{border:1px solid var(--border);background:linear-gradient(#172033f0,#111827f0);border-radius:14px;box-shadow:0 14px 42px #0206172e}.card{min-height:100px;color:inherit;padding:16px;text-decoration:none;display:block}.card:hover,.card:focus-visible{border-color:var(--accent);transform:translateY(-1px);box-shadow:0 18px 52px #02061747,inset 0 0 0 1px #38bdf82e}.card strong{display:block}.panel{gap:12px;width:min(100%,980px);padding:16px;display:grid}.panel.row{align-items:end;display:flex}.panel>.row{align-items:end}.control-panel{width:100%}.control-row{align-items:end}.control-field{min-width:150px}.control-field--wide{width:100%}.control-field--range{flex:1;min-width:min(360px,100%)}.control-field>span{color:var(--subtle);letter-spacing:.04em;font-size:.78rem;font-weight:700}.page-layout--wide .panel{width:100%}.dev-error-boundary{border-color:#f871718c;width:100%}.dev-error-boundary h1{color:#fecaca}.dev-error-boundary pre{border-color:#f8717159}.dev-dashboard{grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);gap:16px;display:grid}.dev-dashboard__intro{background:linear-gradient(135deg,#0ea5e92e,#0000 52%),linear-gradient(#172033fa,#111827fa);width:100%;padding:22px;overflow:hidden}.dev-dashboard__intro h2{font-size:clamp(1.35rem,3vw,2.2rem)}.dev-dashboard__stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.stat-card{border:1px solid var(--border);background:#0206179e;border-radius:14px;align-content:center;min-height:96px;padding:14px;display:grid}.stat-card span{color:var(--subtle);letter-spacing:.08em;text-transform:uppercase;font-size:.75rem}.stat-card strong{color:#e0f2fe;text-overflow:ellipsis;white-space:nowrap;font-size:1.75rem;line-height:1.1;overflow:hidden}.card-nav{gap:10px;display:grid}.card-nav--grid{grid-template-columns:repeat(auto-fill, minmax(var(--grid-min,240px), 1fr))}.nav-card{justify-content:space-between;align-items:center;gap:14px;min-height:0;padding:14px;display:flex}.nav-card__content{gap:4px;min-width:0;display:grid}.nav-card__content>span:not(.nav-card__eyebrow){color:var(--muted)}.nav-card code{width:fit-content;max-width:100%;color:var(--subtle);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.nav-card__eyebrow,.nav-card__badge{color:var(--accent);letter-spacing:.09em;text-transform:uppercase;font-size:.72rem;font-weight:700}.nav-card__badge{color:#bae6fd;background:#0ea5e91a;border:1px solid #38bdf847;border-radius:999px;flex:none;padding:4px 8px}.player-grid{--grid-min:280px;padding:12px}.player-grid--fixed-2{grid-template-columns:repeat(2,minmax(0,1fr))}.player-layer-stage{aspect-ratio:16/9;width:min(960px,100%);min-height:180px;position:relative;overflow:hidden}.hint{height:100%;color:var(--muted);place-items:center;display:grid}.player-card{min-width:0;position:relative;overflow:hidden}.player-host{width:100%;height:100%}.player-host--hide-controls webout-player-controls{display:none}.player-badge{z-index:12;color:#fff;pointer-events:none;background:#000000b3;border-radius:999px;padding:2px 6px;font-size:11px;position:absolute}.player-badge--muted{color:#bfdbfe}.player-badge--top-left{top:6px;left:6px}.player-badge--bottom-right{bottom:6px;right:6px}.aspect-16-9{aspect-ratio:16/9}.aspect-9-16{aspect-ratio:9/16}.aspect-1-1{aspect-ratio:1}.aspect-4-3{aspect-ratio:4/3}.aspect-3-4{aspect-ratio:3/4}.aspect-21-9{aspect-ratio:21/9}.aspect-32-9{aspect-ratio:32/9}.aspect-2-3{aspect-ratio:2/3}.project-storybook{grid-template-columns:minmax(320px,480px) minmax(0,1fr);gap:16px;width:100%;padding:16px;display:grid}.project-storybook__sidebar{flex-direction:column;align-self:start;height:calc(100dvh - 32px);display:flex;position:sticky;top:16px;overflow:hidden}.project-storybook__sidebar>*{flex-shrink:0}.project-storybook__sidebar>.project-list{flex:auto;align-content:start;min-height:0;margin-right:-8px;padding-right:8px;overflow-y:auto}.project-storybook__sidebar h1,.project-storybook__sidebar h2{margin:0}.project-storybook__sidebar h1{font-size:1.25rem}.project-storybook__stage{align-content:start;gap:16px;min-width:0;display:grid}.project-storybook__stage>.panel{width:100%}.row--wrap{flex-wrap:wrap}.project-list,.project-list-group,.project-list-group__items{gap:8px;display:grid}.project-list{gap:18px}.project-list-group__heading{z-index:1;background:var(--panel);color:#f8fafc;letter-spacing:.08em;text-transform:uppercase;margin:0;padding:6px 0;font-size:.78rem;position:sticky;top:0}.project-list-item{text-align:left;gap:6px;width:100%;min-height:0;padding:12px;display:grid}.project-list-item.is-active{border-color:var(--accent);background:#38bdf81a}.project-list-item--limitation{border-color:#fbbf248c}.project-list-item--invalid{border-color:#f87171a6}.project-feature-row{flex-wrap:wrap;gap:6px;display:flex}.feature-badge,.project-expectation{color:#dbeafe;background:#020617;border:1px solid #94a3b84d;border-radius:999px;align-items:center;min-height:24px;padding:2px 8px;font-size:12px;display:inline-flex}.project-expectation{width:fit-content}.project-expectation--playable{color:#bbf7d0;border-color:#22c55ea6}.project-expectation--limitation{color:#fde68a;border-color:#fbbf24a6}.project-expectation--invalid{color:#fecaca;border-color:#f87171a6}.project-meta,.project-warnings{gap:8px;display:grid}.project-stage-tabs{border-bottom:1px solid var(--border);align-items:flex-end;gap:0;padding:0 12px;display:flex}.project-stage-tab{border:1px solid #0000;border-bottom-color:var(--border);color:var(--muted);cursor:pointer;background:0 0;border-radius:10px 10px 0 0;padding:10px 16px;position:relative;bottom:-1px}.project-stage-tab:hover{color:#f8fafc}.project-stage-tab.is-active{border-color:var(--border);color:#f8fafc;background:#020617;border-bottom-color:#020617}.project-stage-panel{margin-top:0}.project-export-toolbar{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px;display:flex}.project-export-progress{width:120px;height:8px}.project-stage-panel.is-hidden{display:none}.project-playlist-json{border:1px solid var(--border);color:#e2e8f0;background:#020617;border-radius:0 0 12px 12px;width:100%;max-height:700px;margin:0;padding:16px;font-size:.85rem;line-height:1.5;overflow:auto}.project-warnings{color:#fde68a;margin:0;padding-left:20px}.content-reaction-form{gap:14px;display:grid}.content-reaction-form label{align-items:center;gap:8px;display:inline-flex}.content-reaction-form input[type=text]{min-width:min(520px,100%)}.content-reaction-form input[type=number]{width:90px}.player-storybook-host{border:1px solid var(--border);background:#020617;border-radius:0 0 12px 12px;width:100%;max-width:100%;height:700px;min-height:240px;position:relative;overflow:hidden}#warnings{gap:10px;display:grid}.status-pill:empty,#warnings:empty{display:none}.status-pill,.warning,.summary-item{padding:8px 10px}.summary-item span{color:#94a3b8;font-size:12px}#summary:empty:before{content:"Load a playlist to see graph stats.";color:#64748b}#variables-json,#dot-output{width:100%;min-width:0}#graph-canvas{min-width:100%;min-height:480px;position:relative}#graph-svg{pointer-events:none;position:absolute;inset:0;overflow:visible}.graph-node{border:1px solid var(--border);background:#020617;border-left:4px solid #94a3b8;border-radius:8px;gap:6px;width:230px;min-height:78px;padding:10px;display:grid;position:absolute}.graph-node--entry{border-left-color:#38bdf8}.graph-node--selected{border-left-color:#22c55e}.graph-node--missing{border-left-color:#f87171}.graph-node--unreachable{opacity:.5}.node-slug,.node-meta,.node-id{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.node-slug{font-weight:700}.edge-path{fill:none;stroke:#64748b;stroke-width:2px}.edge-path--selected{stroke:#22c55e;stroke-width:3px}.edge-path--matching{stroke:#3b82f6}.edge-path--unresolved,.edge-path--missing{stroke:#fbbf24;stroke-dasharray:6 4}.edge-path--missing{stroke:#f87171}.edge-label{fill:#dbeafe;paint-order:stroke;stroke:#020617;stroke-width:4px;font:11px var(--mono)}.edge-table-wrapper{max-height:380px;overflow:auto}table{border-collapse:collapse;width:100%;font-size:12px}th,td{border-bottom:1px solid var(--border);text-align:left;vertical-align:top;padding:8px 10px}th{background:#020617;position:sticky;top:0}tr.edge-row--selected{background:#22c55e2e}tr.edge-row--matching:not(.edge-row--selected){background:#3b82f61f}tr.edge-row--unresolved{background:#fbbf241a}.scenario-index-intro{width:100%}.scenario-index-list{gap:14px;display:grid}.scenario-index-item{grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:18px;width:100%;display:grid}.scenario-index-item__number{color:#bae6fd;background:#0ea5e91f;border:1px solid #38bdf859;border-radius:14px;place-items:center;width:48px;height:48px;font-weight:800;display:grid}.scenario-index-item__main{gap:8px;min-width:0;display:grid}.scenario-index-item__details{grid-template-columns:minmax(220px,.75fr) minmax(260px,1fr);gap:14px;margin-top:4px;display:grid}.scenario-index-item__details h3{color:var(--subtle);letter-spacing:.06em;text-transform:uppercase;margin-bottom:6px;font-size:.78rem}.scenario-index-item__details ul{flex-wrap:wrap;gap:6px;padding:0;list-style:none;display:flex}.scenario-index-item__details li{color:var(--muted);background:#0f172a94;border:1px solid #94a3b82e;border-radius:999px;padding:4px 8px;font-size:.85rem}.scenario-index-item__details code{white-space:normal;background:#0206176b;border:1px solid #94a3b82e;border-radius:10px;padding:8px 10px;display:block}.scenario-index-item__action{white-space:nowrap;align-self:start}.scenario-layout{grid-template-columns:minmax(260px,360px) minmax(0,1fr);align-items:start;gap:16px;display:grid}.scenario-guide{position:sticky;top:16px}.scenario-guide ol,.scenario-guide ul{gap:8px;padding-left:1.25rem;display:grid}.scenario-workspace{gap:14px;min-width:0;display:grid}.scenario-player-stage{background:#020617b3;width:min(640px,100%)}.scenario-player-frame{width:fit-content;min-width:240px;max-width:100%;min-height:135px;overflow:auto}.scenario-event-logs{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:14px;display:grid}.scenario-event-logs>.panel{min-width:0}.scenario-event-logs textarea{box-sizing:border-box;width:100%}.scenario-status-grid{--grid-min:300px}@media (width<=900px){.scenario-index-item,.scenario-layout{grid-template-columns:1fr}.scenario-index-item__action{justify-self:start}.scenario-guide{position:static}}@media (width<=640px){.scenario-index-item__details{grid-template-columns:1fr}}@media (width<=900px){.dev-dashboard{grid-template-columns:1fr}.dev-dashboard__stats{grid-template-columns:repeat(2,minmax(0,1fr))}.split-layout{grid-template-columns:1fr}.split-layout__main{position:static}.project-storybook{grid-template-columns:1fr}.project-storybook__sidebar{height:auto;max-height:60vh;position:static}.player-storybook-host{height:520px}}@media (width<=640px){.page-layout{padding:20px 12px}.page-hero{padding:20px}.dev-dashboard__stats{grid-template-columns:1fr}.nav-card{flex-direction:column;align-items:flex-start}}