:root{
  --font:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --ink:#17213a;
  --muted:#64718b;
  --soft:#8c97ac;
  --line:#dce4f1;
  --paper:#eef3fb;
  --card:#ffffff;
  --stage:#0b1125;
  --accent:#5856e8;
  --accent-rgb:88,86,232;
  --accent-dark:#3d3bc1;
  --violet:#a36cf5;
  --cyan:#25c1c4;
  --orange:#ff9a52;
  --green:#2fb77f;
  --red:#e26464;
  --shadow:0 18px 52px rgba(31,45,83,.10);
  --radius:24px;
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{color-scheme:light;font-size:107.5%}

body{
  margin:0;
  min-width:320px;
  color:var(--ink);
  font-family:var(--font);
  background:
    radial-gradient(circle at 8% 2%,rgba(95,150,255,.18),transparent 28%),
    radial-gradient(circle at 92% 12%,rgba(170,104,255,.13),transparent 24%),
    linear-gradient(180deg,#f9fbff 0%,var(--paper) 55%,#ebf0f8 100%);
}

html.embed-mode,
body.embed-mode{
  min-height:1px;
  height:auto;
  overflow:hidden !important;
  background:transparent;
}

body.embed-mode{
  padding:0;
}

body.embed-mode .ai-shell{
  width:100%;
  padding:0;
}

body.embed-mode .ai-widget{
  width:100%;
  max-width:none;
  margin:0;
  border-radius:0;
  box-shadow:none;
}

button,input,textarea,select{font:inherit}
button{color:inherit}
button:disabled{cursor:not-allowed;opacity:.5}

button:focus-visible,
textarea:focus-visible,
input:focus-visible,
select:focus-visible{
  outline:3px solid rgba(var(--accent-rgb),.25);
  outline-offset:2px;
}

.ai-shell{width:100%;padding:14px}

.ai-widget{
  width:min(1420px,100%);
  margin:0 auto;
  padding:30px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.88);
  border-radius:34px;
  background:rgba(249,251,255,.91);
  box-shadow:0 30px 90px rgba(34,49,91,.13);
  backdrop-filter:blur(18px);
}

.ai-widget[data-model="claude"]{--accent:#d67443;--accent-rgb:214,116,67;--accent-dark:#aa542e;--violet:#e49a67}
.ai-widget[data-model="gemini"]{--accent:#3478e5;--accent-rgb:52,120,229;--accent-dark:#245bb8;--violet:#9864e8}

h1,h2,h3,p{overflow-wrap:anywhere}
h2,h3{letter-spacing:-.025em}

.eyebrow,.section-kicker{
  margin:0;
  color:var(--accent-dark);
  font-size:.7rem;
  font-weight:850;
  letter-spacing:.135em;
  text-transform:uppercase;
}

.eyebrow{display:flex;align-items:center;gap:9px;margin-bottom:13px}
.eyebrow span{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 6px rgba(var(--accent-rgb),.1)}

.hero{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(320px,.5fr);
  gap:38px;
  align-items:start;
  padding:8px 5px 26px;
}

h1{
  max-width:880px;
  margin:0;
  color:#111a31;
  font-size:clamp(2.4rem,4.55vw,4.85rem);
  line-height:.98;
  letter-spacing:-.058em;
}

h1 em{color:var(--accent);font-family:Georgia,"Times New Roman",serif;font-weight:500}

.hero-lede{
  max-width:850px;
  margin:18px 0 0;
  color:var(--muted);
  font-size:clamp(1rem,1.35vw,1.16rem);
  line-height:1.63;
}

.hero-control{
  display:grid;
  width:min(100%,380px);
  justify-self:end;
  align-self:start;
  overflow:hidden;
  border:1px solid rgba(var(--accent-rgb),.18);
  border-radius:20px;
  background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(var(--accent-rgb),.055));
  box-shadow:0 13px 34px rgba(40,52,86,.07);
}

.explore-guide{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;padding:16px;border-bottom:1px solid rgba(var(--accent-rgb),.13)}
.explore-guide__number{display:grid;width:38px;height:38px;place-items:center;border-radius:12px;color:#fff;background:linear-gradient(135deg,var(--accent),var(--cyan));font-weight:900;box-shadow:0 8px 18px rgba(var(--accent-rgb),.2)}
.explore-guide strong,.explore-guide small{display:block}.explore-guide strong{font-size:.86rem}.explore-guide small{margin-top:4px;color:var(--muted);font-size:.74rem;line-height:1.45}

.assistant-picker{padding:16px}
.assistant-picker > span{display:block;margin-bottom:8px;color:var(--muted);font-size:.65rem;font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.assistant-options{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.assistant-picker > small{display:block;margin-top:8px;color:var(--soft);font-size:.59rem;line-height:1.35}

.model-button{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:38px;
  padding:7px 8px;
  border:1px solid transparent;
  border-radius:10px;
  color:#5d6a82;
  background:#eef2f7;
  cursor:pointer;
  font-size:.67rem;
  font-weight:850;
  transition:.2s ease;
}

.model-button:hover{transform:translateY(-1px);color:var(--ink)}
.model-button.is-active{border-color:rgba(var(--accent-rgb),.2);color:var(--ink);background:#fff;box-shadow:0 5px 15px rgba(32,44,76,.1)}
.model-button i{display:grid;width:21px;height:21px;place-items:center;border-radius:7px;color:#fff;background:#222b42;font-size:.58rem;font-style:normal}
.model-button[data-model="claude"] i{background:#d67443}.model-button[data-model="gemini"] i{background:linear-gradient(135deg,#3478e5,#9864e8)}

.anatomy-strip,.route-compare{
  margin-bottom:14px;
  border:1px solid var(--line);
  border-radius:22px;
  background:rgba(255,255,255,.8);
}

.anatomy-strip{padding:17px 18px}
.anatomy-intro{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:14px}
.anatomy-intro h2,.route-compare h2{margin:5px 0 0;font-size:1.14rem;color:#14203a}

.anatomy-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1.08fr;align-items:stretch;gap:8px}
.anatomy-plus,.anatomy-equals{align-self:center;color:#a3adbf;font-size:1rem;font-weight:900}
.anatomy-card{position:relative;display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;min-width:0;padding:25px 12px 12px;border:1px solid #e1e7f1;border-radius:15px;background:#fafbfe}
.anatomy-card--assistant{border-color:rgba(var(--accent-rgb),.32);background:rgba(var(--accent-rgb),.055)}
.anatomy-time{position:absolute;top:7px;left:11px;color:#647188;font-size:.55rem;font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.anatomy-symbol{display:grid;width:32px;height:32px;place-items:center;border-radius:10px;color:#fff;background:var(--accent);font-size:.72rem;font-style:normal;font-weight:900;box-shadow:0 7px 15px rgba(var(--accent-rgb),.18)}
.anatomy-card--now .anatomy-symbol{background:var(--violet)}.anatomy-card--tools .anatomy-symbol{background:var(--orange)}
.anatomy-card strong,.anatomy-card small{display:block}.anatomy-card strong{font-size:.74rem}.anatomy-card small{margin-top:3px;color:var(--soft);font-size:.6rem;line-height:1.3}

.route-compare{display:grid;grid-template-columns:280px 1fr;gap:20px;align-items:start;padding:16px 18px}
.route-compare__copy{align-self:start;text-align:left}
.route-lanes{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.route-lane{padding:12px 13px;border:1px solid #e1e7f0;border-radius:15px;background:#fafbfe;opacity:1;transition:.22s ease}
.route-lane.is-active{border-color:rgba(var(--accent-rgb),.42);background:rgba(var(--accent-rgb),.055);opacity:1;box-shadow:0 8px 22px rgba(var(--accent-rgb),.08)}
.route-lane__head{display:flex;justify-content:space-between;gap:10px;align-items:center}.route-lane__head span{color:var(--accent-dark);font-size:.61rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.route-lane__head strong{font-size:.66rem}
.route-lane p{margin:8px 0 0;color:var(--muted);font-size:.62rem;line-height:1.35}
.mini-route{display:flex;align-items:center;gap:5px;margin-top:10px}.mini-route i{flex:0 1 auto;padding:5px 7px;border-radius:7px;color:#5c6880;background:#eef2f7;font-size:.55rem;font-style:normal;font-weight:800;white-space:nowrap}.mini-route b{flex:1;height:2px;min-width:10px;background:linear-gradient(90deg,var(--accent),var(--cyan));position:relative}.mini-route b::after{content:"";position:absolute;right:-1px;top:-2px;border-left:5px solid var(--cyan);border-top:3px solid transparent;border-bottom:3px solid transparent}.route-repeat{display:flex;align-items:center;gap:7px;margin-top:8px;padding:6px 8px;border-radius:9px;color:#8d4b1d;background:#fff2e8}.route-repeat span{position:relative;flex:0 0 24px;width:24px;height:12px;border-left:2px solid var(--orange);border-bottom:2px solid var(--orange);border-radius:0 0 0 8px}.route-repeat span::after{content:"";position:absolute;right:-1px;bottom:-4px;border-left:6px solid var(--orange);border-top:3px solid transparent;border-bottom:3px solid transparent}.route-repeat strong{font-size:.64rem;line-height:1.3}

.workbench{display:grid;grid-template-columns:338px minmax(0,1fr);gap:15px;align-items:start}
.card{border:1px solid var(--line);border-radius:var(--radius);background:rgba(255,255,255,.95);box-shadow:var(--shadow)}
.task-panel{position:sticky;top:12px;padding:20px}
.section-head h2,.stage-head h2{margin:6px 0 0;color:#13203a;font-size:1.2rem}
.section-head > p:last-child{margin:7px 0 0;color:var(--muted);font-size:.76rem;line-height:1.45}

.task-tabs{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:15px;padding:4px;border-radius:12px;background:#eef2f7}
.task-tab{min-height:38px;border:0;border-radius:9px;color:#5c687e;background:transparent;cursor:pointer;font-size:.7rem;font-weight:850}.task-tab.is-active{color:var(--ink);background:#fff;box-shadow:0 4px 13px rgba(35,46,76,.09)}
.scenario-list{display:grid;gap:7px;margin-top:11px}

.scenario-button{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:9px;
  align-items:center;
  min-height:58px;
  padding:8px 9px;
  border:1px solid #e0e6ef;
  border-radius:13px;
  background:#fafbfe;
  text-align:left;
  cursor:pointer;
  transition:.18s ease;
}
.scenario-button:hover{transform:translateY(-1px);border-color:rgba(var(--accent-rgb),.35)}
.scenario-button.is-active{border-color:rgba(var(--accent-rgb),.5);background:rgba(var(--accent-rgb),.065);box-shadow:0 7px 18px rgba(var(--accent-rgb),.08)}
.scenario-icon{display:grid;width:34px;height:34px;place-items:center;border-radius:10px;color:var(--accent-dark);background:rgba(var(--accent-rgb),.1);font-size:.67rem;font-weight:900}
.scenario-copy{min-width:0}.scenario-copy strong,.scenario-copy small{display:block}.scenario-copy strong{font-size:.71rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.scenario-copy small{margin-top:3px;color:var(--soft);font-size:.59rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scenario-route{padding:4px 6px;border-radius:99px;color:#5c687e;background:#edf1f6;font-size:.48rem;font-weight:900;text-transform:uppercase;letter-spacing:.05em}
.scenario-button[data-complexity="complex"] .scenario-route{color:#9a5424;background:#fff0e5}

.task-recipe{margin-top:14px;padding:11px;border:1px solid #e1e7f0;border-radius:13px;background:#f8fafe}
.task-recipe__head{display:flex;align-items:center;justify-content:space-between;gap:10px}.task-recipe__head span{font-size:.65rem;font-weight:850}.task-recipe__head strong{padding:4px 7px;border-radius:99px;color:var(--accent-dark);background:rgba(var(--accent-rgb),.09);font-size:.53rem;text-transform:uppercase;letter-spacing:.06em}
.ingredient-list{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px}.ingredient-chip{display:flex;align-items:center;gap:5px;padding:5px 7px;border:1px solid #e1e6ef;border-radius:8px;color:#5d6980;background:#fff;font-size:.56rem;font-weight:750}.ingredient-chip i{width:6px;height:6px;border-radius:50%;background:var(--violet)}.ingredient-chip.is-tool i{background:var(--orange)}.ingredient-chip.is-file i{background:var(--cyan)}

.journey-column{display:grid;gap:11px;min-width:0}
.phase-map{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.phase-button{position:relative;min-width:0;min-height:76px;padding:10px 7px 9px 31px;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.82);text-align:left;cursor:pointer;transition:.18s ease}.phase-button:hover{transform:translateY(-1px);border-color:rgba(var(--accent-rgb),.32)}.phase-button > span{position:absolute;left:8px;top:10px;color:#a1aabc;font-size:.58rem;font-weight:900}.phase-button strong,.phase-button small{display:block}.phase-button strong{font-size:.66rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.phase-button small{margin-top:4px;color:var(--soft);font-size:.55rem;line-height:1.25}.phase-button.is-active{border-color:rgba(var(--accent-rgb),.55);background:linear-gradient(145deg,#fff,rgba(var(--accent-rgb),.085));box-shadow:0 7px 19px rgba(var(--accent-rgb),.09)}.phase-button.is-active > span{color:var(--accent)}.phase-button.is-optional small::after{content:" may skip";color:#a25a28}

.stage-card{padding:16px}
.stage-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding:2px 3px 13px}.stage-head > div:first-child{min-width:0}.stage-head h2{font-size:1.28rem}.stage-head > div:first-child > p:last-child{margin:5px 0 0;color:var(--muted);font-size:.72rem}.simulation-tag{display:inline-block;margin-left:5px;padding:3px 6px;border-radius:99px;color:#5d6980;background:#edf0f5;font-size:.51rem;letter-spacing:.05em;vertical-align:middle}.stage-status{text-align:right;flex:0 0 auto}.stage-status span,.stage-status strong{display:block}.stage-status span{color:var(--soft);font-size:.59rem}.stage-status strong{margin-top:3px;color:var(--accent-dark);font-size:.68rem}

.visual-stage{
  position:relative;
  min-height:450px;
  overflow:hidden;
  border-radius:19px;
  color:#eef3ff;
  background:
    radial-gradient(circle at 78% 20%,rgba(var(--accent-rgb),.18),transparent 34%),
    linear-gradient(145deg,#111a35 0%,#0a1125 55%,#101832 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.055);
}

.visual-stage::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.34;background-image:radial-gradient(rgba(255,255,255,.16) 1px,transparent 1px);background-size:28px 28px}
.scene{position:relative;z-index:1;width:100%;height:450px;padding:24px;animation:sceneIn .45s ease both}
@keyframes sceneIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.scene-label{color:#8795b3;font-size:.58rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.scene-title{margin-top:5px;color:#fff;font-size:.78rem;font-weight:850}.scene-note{color:#929fba;font-size:.59rem;line-height:1.4}

.flow-arrow{position:relative;flex:1;min-width:25px;height:2px;background:linear-gradient(90deg,var(--accent),var(--cyan))}.flow-arrow::after{content:"";position:absolute;right:-1px;top:-3px;border-left:7px solid var(--cyan);border-top:4px solid transparent;border-bottom:4px solid transparent}.flow-arrow::before{content:"";position:absolute;top:-3px;left:0;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 12px #fff;animation:travel 1.8s linear infinite}@keyframes travel{to{left:calc(100% - 8px)}}

/* Scene 1: context */
.context-scene{display:grid;grid-template-columns:minmax(250px,.9fr) 80px minmax(290px,1.1fr);align-items:center;gap:12px}
.context-inputs{display:grid;min-width:0;gap:9px}.input-card{display:grid;grid-template-columns:auto minmax(0,1fr);min-width:0;gap:10px;align-items:center;padding:11px 12px;border:1px solid rgba(255,255,255,.1);border-radius:13px;background:rgba(255,255,255,.045);animation:cardSlide .5s ease both;animation-delay:var(--delay,0s)}.input-card > div{min-width:0}@keyframes cardSlide{from{opacity:0;transform:translateX(-15px)}to{opacity:1;transform:none}}.input-card i{display:grid;width:32px;height:32px;place-items:center;border-radius:9px;color:#fff;background:var(--card-color,var(--accent));font-size:.63rem;font-style:normal;font-weight:900}.input-card strong,.input-card small{display:block}.input-card strong{font-size:.65rem}.input-card small{margin-top:3px;color:#97a4bd;font-size:.55rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.context-funnel{display:flex;align-items:center}.context-window{position:relative;padding:18px;border:1px solid rgba(var(--accent-rgb),.56);border-radius:22px;background:rgba(var(--accent-rgb),.1);box-shadow:0 0 42px rgba(var(--accent-rgb),.12)}.context-window::before{content:"temporary workspace";position:absolute;right:14px;top:12px;color:#7e8ba7;font-size:.48rem;text-transform:uppercase;letter-spacing:.08em}.context-stack{display:grid;gap:7px;margin-top:14px}.context-band{position:relative;padding:10px 11px 10px 15px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(255,255,255,.045);overflow:hidden}.context-band::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--band-color,var(--accent))}.context-band span,.context-band strong{display:block}.context-band span{color:#8794ad;font-size:.51rem;font-weight:800;text-transform:uppercase}.context-band strong{margin-top:3px;font-size:.61rem}.context-capacity{display:flex;justify-content:space-between;gap:10px;margin-top:12px;color:#8290aa;font-size:.51rem}.context-meter{height:5px;margin-top:5px;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.08)}.context-meter i{display:block;width:var(--fill,46%);height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent),var(--cyan));animation:growWidth .8s ease both}@keyframes growWidth{from{width:0}}

/* Scene 2: tokens */
.token-scene{display:grid;grid-template-rows:auto 1fr auto;gap:16px}.token-sentence{padding:13px 15px;border:1px solid rgba(163,108,245,.28);border-radius:13px;background:rgba(163,108,245,.08);font-size:.68rem;line-height:1.5}.token-sentence strong{color:#caaafa}.token-transform{display:grid;grid-template-columns:1fr 55px 1fr;gap:12px;align-items:center}.token-cloud{display:flex;flex-wrap:wrap;align-content:center;gap:7px;padding:18px;border:1px solid rgba(255,255,255,.09);border-radius:17px;background:rgba(255,255,255,.035)}.token-pill{padding:7px 9px;border:1px solid rgba(163,108,245,.34);border-radius:9px;color:#eee7ff;background:rgba(163,108,245,.12);font-size:.59rem;font-weight:800;animation:tokenPop .35s ease both;animation-delay:var(--delay,0s)}@keyframes tokenPop{from{opacity:0;transform:scale(.75)}to{opacity:1;transform:none}}.vector-board{display:grid;gap:8px;padding:18px;border:1px solid rgba(37,193,196,.25);border-radius:17px;background:rgba(37,193,196,.055)}.vector-row{display:grid;grid-template-columns:45px 1fr;gap:8px;align-items:center}.vector-row > span{overflow:hidden;color:#a5b1c7;font-size:.54rem;font-weight:750;text-overflow:ellipsis;white-space:nowrap}.vector-dots{display:flex;align-items:center;gap:5px}.vector-dots i{width:var(--dot,7px);height:var(--dot,7px);border-radius:50%;background:var(--dot-color,var(--cyan));box-shadow:0 0 9px color-mix(in srgb,var(--dot-color,var(--cyan)) 55%,transparent);animation:dotIn .4s ease both;animation-delay:var(--delay,0s)}@keyframes dotIn{from{opacity:0;transform:translateY(7px)}}.token-caption{display:flex;justify-content:space-between;gap:16px;color:#8e9bb5;font-size:.56rem}.token-caption strong{color:#dce4f6}

/* Scene 3: transformer */
.transformer-scene{display:grid;grid-template-rows:auto 1fr auto;gap:12px}.attention-example{display:flex;justify-content:center;gap:9px;align-items:center}.attention-word{position:relative;padding:7px 9px;border-radius:8px;color:#9da9c0;background:rgba(255,255,255,.055);font-size:.58rem;font-weight:800}.attention-word.is-focus{color:#fff;background:rgba(var(--accent-rgb),.28);box-shadow:0 0 18px rgba(var(--accent-rgb),.24)}.attention-word.is-linked{color:#d9fbfb;background:rgba(37,193,196,.16)}.attention-word.is-linked::after{content:"matters here";position:absolute;left:50%;bottom:-18px;transform:translateX(-50%);color:#62d3d4;font-size:.43rem;white-space:nowrap}.transformer-machine{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;align-items:center;padding:12px 25px}.layer-column{position:relative;display:grid;gap:9px}.layer-column::after{content:"";position:absolute;left:100%;top:50%;width:12px;height:1px;background:rgba(255,255,255,.16)}.layer-column:last-child::after{display:none}.neuron{width:10px;height:10px;margin:auto;border-radius:50%;background:var(--accent);box-shadow:0 0 8px rgba(var(--accent-rgb),.3);animation:neuronPulse 1.6s ease-in-out infinite;animation-delay:var(--delay,0s)}.layer-column:nth-child(even) .neuron{background:var(--cyan);box-shadow:0 0 8px rgba(37,193,196,.3)}@keyframes neuronPulse{50%{transform:scale(1.45);background:#fff}}.layer-name{text-align:center;color:#707e9a;font-size:.48rem;font-weight:850}.attention-lines{position:absolute;inset:100px 45px 68px;pointer-events:none}.attention-lines svg{width:100%;height:100%;overflow:visible}.attention-lines path{fill:none;stroke:rgba(88,86,232,.22);stroke-width:1.2;stroke-dasharray:5 7;animation:dashFlow 2.2s linear infinite}.attention-lines path:nth-child(even){stroke:rgba(37,193,196,.19);animation-direction:reverse}@keyframes dashFlow{to{stroke-dashoffset:-24}}.transformer-output{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.meaning-chip{padding:9px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(255,255,255,.04);text-align:center}.meaning-chip span,.meaning-chip strong{display:block}.meaning-chip span{color:#7f8da7;font-size:.48rem;text-transform:uppercase}.meaning-chip strong{margin-top:3px;font-size:.58rem}

/* Scene 4: route */
.decision-scene{display:grid;grid-template-columns:.75fr 1.25fr;gap:24px;align-items:center}.decision-core{text-align:center}.model-orb{position:relative;width:124px;height:124px;margin:0 auto;border-radius:50%;background:radial-gradient(circle at 35% 32%,#fff 0 4%,var(--cyan) 5% 20%,var(--accent) 48%,transparent 50%);box-shadow:0 0 0 12px rgba(var(--accent-rgb),.08),0 0 0 25px rgba(var(--accent-rgb),.04),0 0 55px rgba(var(--accent-rgb),.27);animation:orbFloat 2.4s ease-in-out infinite}.model-orb::before,.model-orb::after{content:"";position:absolute;inset:18px;border:1px solid rgba(255,255,255,.42);border-radius:44% 56% 55% 45%;animation:orbSpin 5s linear infinite}.model-orb::after{inset:31px;animation-direction:reverse;animation-duration:3.5s}@keyframes orbFloat{50%{transform:translateY(-5px)}}@keyframes orbSpin{to{transform:rotate(360deg)}}.decision-core strong,.decision-core span{display:block}.decision-core strong{margin-top:24px;font-size:.7rem}.decision-core span{margin-top:4px;color:#8f9cb6;font-size:.56rem}.route-options{position:relative;display:grid;gap:10px}.route-option{display:grid;grid-template-columns:auto 1fr auto;gap:11px;align-items:center;padding:12px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:rgba(255,255,255,.035);opacity:.42;transform:scale(.98);transition:.3s}.route-option.is-chosen{border-color:var(--route-color,var(--accent));background:color-mix(in srgb,var(--route-color,var(--accent)) 12%,transparent);opacity:1;transform:none;box-shadow:0 0 28px color-mix(in srgb,var(--route-color,var(--accent)) 14%,transparent)}.route-option i{display:grid;width:35px;height:35px;place-items:center;border-radius:10px;color:#fff;background:var(--route-color,var(--accent));font-size:.62rem;font-style:normal;font-weight:900}.route-option strong,.route-option small{display:block}.route-option strong{font-size:.64rem}.route-option small{margin-top:3px;color:#8f9cb6;font-size:.53rem}.route-option b{padding:4px 6px;border-radius:99px;color:#dfe6f7;background:rgba(255,255,255,.07);font-size:.47rem}.decision-caption{grid-column:1/-1;text-align:center;color:#8b98b2;font-size:.56rem}

/* Scene 5: loop */
.loop-scene{display:grid;grid-template-columns:1fr 1.15fr;gap:22px;align-items:center}.loop-scene.is-bypass{grid-template-columns:1fr}.bypass-card{max-width:600px;margin:auto;padding:25px;border:1px solid rgba(47,183,127,.35);border-radius:20px;background:rgba(47,183,127,.08);text-align:center}.bypass-icon{display:grid;width:52px;height:52px;margin:0 auto 13px;place-items:center;border-radius:50%;color:#fff;background:var(--green);font-size:1rem;font-weight:900}.bypass-card h4{margin:0;color:#fff;font-size:.82rem}.bypass-card p{max-width:480px;margin:8px auto 0;color:#9dadc2;font-size:.61rem;line-height:1.5}.bypass-route{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:18px}.bypass-route span{padding:8px 10px;border-radius:9px;background:rgba(255,255,255,.06);font-size:.56rem;font-weight:800}.bypass-route i{color:var(--green);font-style:normal}
.loop-wheel{position:relative;width:260px;height:260px;margin:auto;border:1px dashed rgba(255,255,255,.18);border-radius:50%;animation:slowSpin 18s linear infinite}@keyframes slowSpin{to{transform:rotate(360deg)}}.loop-node{position:absolute;display:grid;width:74px;height:74px;place-items:center;padding:7px;border:1px solid rgba(255,255,255,.12);border-radius:50%;background:#151f3c;text-align:center;box-shadow:0 10px 24px rgba(0,0,0,.22);animation:counterSpin 18s linear infinite}.loop-node strong,.loop-node small{display:block}.loop-node strong{font-size:.58rem}.loop-node small{margin-top:2px;color:#8d9ab3;font-size:.44rem}.loop-node--plan{top:-10px;left:93px}.loop-node--act{right:-8px;top:93px;border-color:rgba(255,154,82,.42)}.loop-node--check{bottom:-10px;left:93px;border-color:rgba(37,193,196,.4)}.loop-node--revise{left:-8px;top:93px;border-color:rgba(163,108,245,.4)}@keyframes counterSpin{to{transform:rotate(-360deg)}}.loop-center{position:absolute;inset:82px;display:grid;place-items:center;border-radius:50%;color:#fff;background:linear-gradient(135deg,var(--accent),var(--cyan));font-size:.65rem;font-weight:900;box-shadow:0 0 35px rgba(var(--accent-rgb),.24)}.loop-details{display:grid;gap:9px}.cycle-card{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:11px 12px;border:1px solid rgba(255,255,255,.09);border-radius:12px;background:rgba(255,255,255,.035);animation:cycleIn .4s ease both;animation-delay:var(--delay,0s)}@keyframes cycleIn{from{opacity:0;transform:translateX(12px)}}.cycle-number{display:grid;width:26px;height:26px;place-items:center;border-radius:8px;color:#fff;background:rgba(var(--accent-rgb),.5);font-size:.57rem;font-weight:900}.cycle-card strong,.cycle-card small{display:block}.cycle-card strong{font-size:.61rem}.cycle-card small{margin-top:3px;color:#8d9ab3;font-size:.52rem}.cycle-card > span:last-child{color:var(--green);font-size:.5rem;font-weight:850}.loop-caption{padding:10px 12px;border-left:3px solid var(--orange);border-radius:0 10px 10px 0;color:#aab6ca;background:rgba(255,154,82,.07);font-size:.56rem;line-height:1.45}

/* Scene 6: output */
.output-scene{display:grid;grid-template-columns:.42fr .8fr 1.15fr;gap:18px;align-items:center}.output-model{text-align:center}.output-model .model-orb{width:94px;height:94px}.output-model strong{display:block;margin-top:20px;font-size:.62rem}.candidate-board{padding:15px;border:1px solid rgba(255,255,255,.09);border-radius:16px;background:rgba(255,255,255,.04)}.candidate-board > span{color:#8290aa;font-size:.51rem;font-weight:900;text-transform:uppercase;letter-spacing:.07em}.candidate-row{display:grid;grid-template-columns:60px 1fr 30px;gap:7px;align-items:center;margin-top:12px}.candidate-row > span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#a6b1c6;font-size:.55rem;font-weight:750}.candidate-row > span:first-child.is-top{color:#fff}.candidate-track{height:6px;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.08)}.candidate-track i{display:block;width:var(--probability);height:100%;border-radius:inherit;background:#4f5c78;animation:growWidth .55s ease both}.candidate-row:first-of-type .candidate-track i{background:var(--accent)}.candidate-row > span:last-child{text-align:right;color:#7e8aa4;font-size:.49rem}.answer-board{min-height:275px;padding:17px;border:1px solid rgba(var(--accent-rgb),.44);border-radius:18px;background:rgba(var(--accent-rgb),.075)}.answer-board__top{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#8491ab;font-size:.5rem;font-weight:850;text-transform:uppercase;letter-spacing:.07em}.stream-text{margin:16px 0 0;color:#eef3ff;font-size:.64rem;font-weight:650;line-height:1.58;white-space:pre-wrap}.stream-cursor{display:inline-block;width:6px;height:12px;margin-left:3px;border-radius:2px;background:var(--accent);vertical-align:-2px;animation:cursorBlink .7s steps(1) infinite}@keyframes cursorBlink{50%{opacity:0}}.answer-checks{display:flex;flex-wrap:wrap;gap:5px;margin-top:16px;padding-top:12px;border-top:1px solid rgba(255,255,255,.08)}.answer-check{padding:5px 7px;border-radius:8px;color:#aab6ca;background:rgba(255,255,255,.055);font-size:.48rem;font-weight:750}.answer-check.is-done{color:#baf0d8;background:rgba(47,183,127,.1)}

.watch-bar{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;margin-top:10px;padding:9px 11px;border:1px solid #e4e9f1;border-radius:12px;background:#f8fafe}.watch-bar > span{color:var(--accent-dark);font-size:.55rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.watch-bar strong{font-size:.63rem;line-height:1.35}.watch-bar button{min-height:30px;padding:5px 9px;border:0;border-radius:8px;color:var(--accent-dark);background:rgba(var(--accent-rgb),.09);cursor:pointer;font-size:.57rem;font-weight:850}

.lesson-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.lesson-card{min-height:205px;padding:18px}.lesson-card h3{margin:7px 0 0;font-size:1rem}.lesson-card > p:not(.section-kicker){margin:8px 0 0;color:var(--muted);font-size:.73rem;line-height:1.52}.analogy-box,.myth-box{margin-top:13px;padding:10px 11px;border-left:3px solid var(--accent);border-radius:0 10px 10px 0;background:rgba(var(--accent-rgb),.055)}.myth-box{border-left-color:var(--orange);background:rgba(255,154,82,.065)}.analogy-box span,.analogy-box strong,.myth-box span,.myth-box strong{display:block}.analogy-box span,.myth-box span{color:var(--accent-dark);font-size:.52rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.myth-box span{color:#a65c27}.analogy-box strong,.myth-box strong{margin-top:4px;font-size:.65rem;line-height:1.4}

.footer-note{display:flex;justify-content:space-between;gap:25px;padding:15px 5px 0;color:#778298;font-size:.6rem;line-height:1.45}.footer-note p{margin:0}.footer-note p:first-child{max-width:940px}.footer-note strong{color:#566177}

.embed-mode body,.embed-mode{background:transparent}.embed-mode .ai-shell{padding:0}.embed-mode .ai-widget{width:100%;border-radius:0;box-shadow:none}

@media (max-width:1180px){
  .ai-widget{padding:23px}.workbench{grid-template-columns:300px minmax(0,1fr)}.task-panel{padding:17px}.phase-button{padding-left:27px}.phase-button > span{left:7px}.visual-stage,.scene{height:430px;min-height:430px}.context-scene{grid-template-columns:minmax(210px,.85fr) 45px minmax(250px,1.15fr)}.output-scene{grid-template-columns:.35fr .85fr 1.1fr;gap:12px}
}

@media (max-width:980px){
  .hero{grid-template-columns:1fr;gap:19px}.hero-control{width:min(100%,720px)}.anatomy-intro{display:block}.anatomy-flow{grid-template-columns:1fr auto 1fr;gap:7px}.anatomy-card--tools{grid-column:1}.anatomy-equals{grid-column:2}.route-compare{grid-template-columns:1fr}.workbench{grid-template-columns:1fr}.task-panel{position:static}.scenario-list{grid-template-columns:repeat(3,1fr)}.scenario-button{grid-template-columns:auto minmax(0,1fr)}.scenario-route{display:none}.phase-button{min-height:70px}.visual-stage,.scene{height:450px;min-height:450px}
}

@media (max-width:760px){
  .ai-shell{padding:8px}.ai-widget{padding:16px;border-radius:25px}h1{font-size:clamp(2.2rem,10.5vw,3.5rem)}.hero{padding-bottom:19px}.hero-control{width:100%}.anatomy-flow{grid-template-columns:1fr}.anatomy-plus,.anatomy-equals{display:none}.anatomy-card--tools{grid-column:auto}.route-lanes{grid-template-columns:1fr}.scenario-list{grid-template-columns:1fr}.phase-map{grid-template-columns:1fr 1fr 1fr}.phase-button{min-height:62px}.stage-head{align-items:flex-start}.visual-stage{min-height:520px}.scene{height:520px;padding:18px}.context-scene{grid-template-columns:1fr;align-content:center}.context-inputs{grid-template-columns:1fr 1fr;gap:6px}.context-funnel{height:32px;justify-content:center;transform:rotate(90deg)}.context-window{padding:14px}.token-transform{grid-template-columns:1fr;gap:8px}.token-transform > .flow-arrow{height:25px;width:2px;min-width:2px;margin:auto}.token-transform > .flow-arrow::after{right:-3px;top:auto;bottom:-1px;border-top:7px solid var(--cyan);border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:0}.token-transform > .flow-arrow::before{top:0;left:-3px;animation:travelDown 1.8s linear infinite}@keyframes travelDown{to{top:calc(100% - 8px)}}.transformer-machine{padding:10px 8px;gap:7px}.attention-lines{inset:105px 25px 75px}.decision-scene{grid-template-columns:1fr 1.2fr;gap:14px}.loop-scene{grid-template-columns:1fr 1fr;gap:10px}.loop-wheel{width:220px;height:220px}.loop-node{width:64px;height:64px}.loop-node--plan,.loop-node--check{left:78px}.loop-node--act,.loop-node--revise{top:78px}.loop-center{inset:70px}.output-scene{grid-template-columns:.4fr 1fr;align-items:start}.answer-board{grid-column:1/-1;min-height:185px}.lesson-grid{grid-template-columns:1fr}.lesson-card{min-height:0}.footer-note{flex-direction:column;gap:6px}
}

@media (max-width:500px){
  .context-scene.has-many-inputs .context-inputs{grid-template-columns:1fr 1fr;gap:6px}
  .context-scene.has-many-inputs .input-card{min-width:0;padding:7px}
  .context-scene.has-many-inputs .input-card i{width:27px;height:27px}
  .context-scene.has-many-inputs .input-card strong{font-size:.61rem}
  .context-scene.has-many-inputs .input-card small{font-size:.51rem}
  .context-scene.has-many-inputs .context-window{padding:12px}
  .context-scene.has-many-inputs .context-stack{gap:5px;margin-top:11px}
  .context-scene.has-many-inputs .context-band{padding:7px 8px 7px 12px}
}

@media (max-width:500px){
  .ai-widget{padding:12px;border-radius:20px}.hero{padding-inline:3px}.hero-lede{font-size:.91rem}.assistant-options{grid-template-columns:repeat(3,1fr)}.model-button{font-size:.59rem}.model-button i{display:none}.anatomy-strip,.route-compare{padding:14px}.route-lane__head{display:block}.route-lane__head strong{display:block;margin-top:3px}.workbench{gap:10px}.task-panel,.stage-card,.lesson-card{border-radius:18px}.task-panel{padding:15px}.phase-map{gap:5px}.phase-button{padding:8px 6px 8px 28px}.phase-button strong{font-size:.61rem}.phase-button small{font-size:.51rem}.stage-head{display:block}.stage-status{display:flex;justify-content:space-between;margin-top:9px;text-align:left}.visual-stage{min-height:570px}.scene{height:570px;padding:15px}.context-inputs{grid-template-columns:1fr}.input-card{padding:8px}.context-funnel{height:22px}.token-cloud,.vector-board{padding:12px}.attention-example{gap:4px;flex-wrap:wrap}.transformer-machine{grid-template-columns:repeat(5,1fr)}.layer-column:nth-child(n+6){display:none}.decision-scene{grid-template-columns:1fr}.model-orb{width:90px;height:90px}.route-option{padding:9px}.loop-scene{grid-template-columns:1fr}.loop-wheel{width:200px;height:200px}.loop-node{width:58px;height:58px}.loop-node--plan,.loop-node--check{left:70px}.loop-node--act,.loop-node--revise{top:70px}.loop-center{inset:64px}.cycle-card:nth-child(n+4){display:none}.output-scene{grid-template-columns:1fr}.output-model{display:none}.answer-board{min-height:215px}.watch-bar{grid-template-columns:auto 1fr}.watch-bar button{grid-column:1/-1}.footer-note{font-size:.56rem}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

/* Round 2: comparison clarity, readable visual labels, and source notes. */
.model-differences{
  display:grid;
  grid-template-columns:auto 1fr minmax(260px,.8fr);
  gap:11px;
  align-items:center;
  margin-top:11px;
  padding-top:11px;
  border-top:1px solid #e7ebf2;
}
.model-differences > span{color:#69758b;font-size:.58rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.difference-chips{display:flex;flex-wrap:wrap;gap:5px}
.difference-chips i{padding:5px 7px;border-radius:8px;color:#5e6a80;background:#eef2f7;font-size:.53rem;font-style:normal;font-weight:800}
.model-differences p{margin:0;color:var(--muted);font-size:.56rem;line-height:1.4}
.scene-label{font-size:.63rem}
.scene-title{font-size:.86rem}
.scene-note{font-size:.64rem}
.input-card i{font-size:.67rem}
.input-card strong{font-size:.71rem}
.input-card small{font-size:.59rem}
.context-window::before{font-size:.52rem}
.context-band span{font-size:.54rem}
.context-band strong{font-size:.66rem}
.context-capacity{font-size:.55rem}
.cycle-number{font-size:.61rem}
.cycle-card strong{font-size:.67rem}
.cycle-card small{font-size:.57rem}
.cycle-card > span:last-child{font-size:.53rem}
.loop-caption{font-size:.61rem}
.answer-board__top{font-size:.54rem}
.stream-text{font-size:.7rem}
.answer-check{font-size:.52rem}

.footer-note{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(270px,.9fr) auto;
  gap:20px;
}
.footer-note p:first-child{max-width:none}
.source-links a{color:var(--accent-dark);font-weight:750;text-decoration-thickness:1px;text-underline-offset:2px}

@media (max-width:980px){
  .model-differences{grid-template-columns:1fr}
  .footer-note{grid-template-columns:1fr 1fr}
  .footer-note p:last-child{grid-column:1/-1}
}

@media (max-width:760px){
  .footer-note{grid-template-columns:1fr;gap:6px}
  .footer-note p:last-child{grid-column:auto}
}

/* Readable type system: supporting text stays legible without zooming. */
:root{
  --soft:#5f6c83;
}

.eyebrow,.section-kicker{font-size:.78rem;line-height:1.3}
.assistant-picker > span{font-size:.75rem}
.assistant-picker > small{font-size:.75rem;line-height:1.5}
.model-button{font-size:.78rem}

.model-button i,.anatomy-time,.scenario-icon{font-size:.7rem}
.anatomy-card strong{font-size:.86rem}
.anatomy-card small{font-size:.76rem;line-height:1.45}
.model-differences > span{font-size:.72rem}
.difference-chips i{font-size:.7rem}
.model-differences p{font-size:.74rem;line-height:1.5}

.route-lane__head span{font-size:.75rem}
.route-lane__head strong{font-size:.8rem}
.route-lane p{font-size:.78rem;line-height:1.5}
.mini-route i{font-size:.7rem}
.route-repeat strong{font-size:.72rem}

.section-head > p:last-child{font-size:.88rem;line-height:1.55}
.task-tab{font-size:.82rem}
.scenario-copy strong{font-size:.82rem}
.scenario-copy small{font-size:.73rem}
.scenario-route{font-size:.7rem}
.task-recipe__head span{font-size:.78rem}
.task-recipe__head strong{font-size:.7rem}
.ingredient-chip{font-size:.72rem}
.phase-button{min-height:88px;padding-top:12px;padding-bottom:11px}
.phase-button > span{font-size:.72rem}
.phase-button strong{font-size:.76rem}
.phase-button small{font-size:.72rem;line-height:1.35}
.stage-head > div:first-child > p:last-child{font-size:.84rem;line-height:1.45}
.simulation-tag{font-size:.7rem}
.stage-status span{font-size:.72rem}
.stage-status strong{font-size:.8rem}

.visual-stage,.scene{height:520px;min-height:520px}
.scene-label{font-size:.72rem}
.scene-title{font-size:.94rem}
.scene-note{font-size:.76rem;line-height:1.5}
.input-card i{font-size:.7rem}
.input-card strong{font-size:.78rem}
.input-card small{font-size:.7rem}
.context-window::before{font-size:.7rem}
.context-band span{font-size:.7rem}
.context-band strong{font-size:.78rem}
.context-capacity{font-size:.7rem}

.token-sentence{font-size:.82rem}
.token-pill{font-size:.72rem}
.vector-row > span{font-size:.7rem}
.token-caption{font-size:.72rem;line-height:1.4}
.attention-word{font-size:.72rem}
.attention-word.is-linked::after{font-size:.7rem}
.layer-name{font-size:.7rem}
.meaning-chip span{font-size:.7rem}
.meaning-chip strong{font-size:.74rem}

.decision-core strong{font-size:.82rem}
.decision-core span{font-size:.72rem}
.route-option strong{font-size:.78rem}
.route-option small{font-size:.7rem;line-height:1.4}
.route-option i{font-size:.7rem}
.route-option b{font-size:.7rem}
.decision-caption{font-size:.72rem}

.bypass-card p{font-size:.76rem}
.bypass-route span{font-size:.72rem}
.loop-node strong{font-size:.7rem}
.loop-node small{font-size:.7rem;line-height:1.2}
.loop-center{font-size:.76rem}
.cycle-number{font-size:.7rem}
.cycle-card strong{font-size:.76rem}
.cycle-card small{font-size:.7rem;line-height:1.35}
.cycle-card > span:last-child{font-size:.7rem}
.loop-caption{font-size:.72rem;line-height:1.5}

.output-model strong{font-size:.74rem}
.candidate-board > span{font-size:.7rem}
.candidate-row > span{font-size:.7rem}
.candidate-row > span:last-child{font-size:.7rem}
.answer-board__top{font-size:.7rem}
.stream-text{font-size:.82rem;line-height:1.65}
.answer-check{font-size:.7rem}

.watch-bar > span{font-size:.7rem}
.watch-bar strong{font-size:.78rem;line-height:1.45}
.watch-bar button{min-height:36px;font-size:.72rem}
.lesson-card > p:not(.section-kicker){font-size:.88rem;line-height:1.6}
.analogy-box span,.myth-box span{font-size:.7rem}
.analogy-box strong,.myth-box strong{font-size:.8rem;line-height:1.5}
.footer-note{font-size:.75rem;line-height:1.55}

@media (max-width:760px){
  .visual-stage,.scene{height:680px;min-height:680px}
  .phase-button{min-height:86px}
}

@media (max-width:500px){
  .model-button{font-size:.72rem}
  .phase-map{grid-template-columns:1fr 1fr}
  .visual-stage,.scene{height:720px;min-height:720px}
  .phase-button strong{font-size:.72rem}
  .phase-button small{font-size:.7rem}
  .context-scene.has-many-inputs .input-card strong{font-size:.72rem}
  .context-scene.has-many-inputs .input-card small{font-size:.7rem}
  .context-window::before{position:static;display:block;margin-bottom:8px;text-align:left}
  .output-scene{align-content:start;gap:18px}
  .route-repeat{align-items:flex-start}
}

/* Simple route: visually explains why the assistant can skip outside work. */
.direct-route-story{display:grid;grid-template-columns:.9fr 1.1fr;gap:22px;align-items:stretch}
.direct-route-check,.direct-route-path,.tool-detour-intro,.tool-detour-flow,.work-loop-explainer,.work-cycle-story{min-width:0;padding:18px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:rgba(255,255,255,.045)}
.direct-route-check h4,.tool-detour-intro h4,.work-loop-explainer h4{margin:8px 0 0;color:#fff;font-size:.92rem;line-height:1.3}
.direct-proof-list{display:grid;gap:8px;margin-top:15px}
.direct-proof-list > div{display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:center;padding:9px 10px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.04);animation:storyCardIn .45s ease both}
.direct-proof-list > div:nth-child(2){animation-delay:.1s}.direct-proof-list > div:nth-child(3){animation-delay:.2s}
.direct-proof-list i{display:grid;width:27px;height:27px;place-items:center;border-radius:9px;color:#baf0d8;background:rgba(47,183,127,.16);font-size:.7rem;font-style:normal;font-weight:900}
.direct-proof-list strong,.direct-proof-list small{display:block}.direct-proof-list strong{font-size:.75rem}.direct-proof-list small{margin-top:2px;color:#9eabc1;font-size:.7rem;line-height:1.35}
.direct-verdict{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;margin-top:13px;padding:11px;border:1px solid rgba(47,183,127,.35);border-radius:14px;background:rgba(47,183,127,.1)}
.direct-verdict > b{display:grid;width:46px;height:46px;place-items:center;border-radius:50%;color:#081b14;background:#62d6a5;font-size:.7rem;box-shadow:0 0 25px rgba(47,183,127,.27);animation:verdictPulse 1.8s ease-in-out infinite}
.direct-verdict small,.direct-verdict strong{display:block}.direct-verdict small{color:#aee7ce;font-size:.7rem}.direct-verdict strong{margin-top:2px;font-size:.78rem}
@keyframes verdictPulse{50%{transform:scale(1.05);box-shadow:0 0 35px rgba(47,183,127,.38)}}
.direct-path-line{display:grid;grid-template-columns:1fr 20px 1fr 20px 1fr;align-items:center;margin-top:18px}
.direct-path-line article{min-height:125px;padding:13px 11px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:rgba(255,255,255,.045);animation:storyCardIn .45s ease both}
.direct-path-line article:nth-of-type(2){animation-delay:.14s}.direct-path-line article:nth-of-type(3){animation-delay:.28s}
.direct-path-line article > b{display:grid;width:28px;height:28px;place-items:center;border-radius:9px;color:#fff;background:var(--accent);font-size:.7rem}
.direct-path-line article strong,.direct-path-line article small{display:block}.direct-path-line article strong{margin-top:11px;font-size:.75rem;line-height:1.3}.direct-path-line article small{margin-top:5px;color:#9ba9c0;font-size:.7rem;line-height:1.4}
.direct-path-line article.is-skip{border-color:rgba(47,183,127,.3);background:rgba(47,183,127,.075)}.direct-path-line article.is-skip > b{background:var(--green)}
.direct-path-line article.is-finish{border-color:rgba(37,193,196,.3);background:rgba(37,193,196,.07)}.direct-path-line article.is-finish > b{background:var(--cyan)}
.direct-path-line > i{position:relative;height:2px;background:linear-gradient(90deg,var(--accent),var(--cyan))}.direct-path-line > i::after{content:"";position:absolute;top:-3px;left:0;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 10px #fff;animation:signalTravel 1.6s linear infinite}
.direct-path-line > i:nth-of-type(2)::after{animation-delay:.8s}
@keyframes signalTravel{to{left:calc(100% - 8px)}}
.unused-tools{display:flex;flex-wrap:wrap;gap:6px;margin-top:15px;padding-top:12px;border-top:1px solid rgba(255,255,255,.08)}
.unused-tools span{width:100%;color:#8795ad;font-size:.7rem;font-weight:850;text-transform:uppercase;letter-spacing:.06em}.unused-tools i{padding:5px 7px;border-radius:8px;color:#76839a;background:rgba(255,255,255,.045);font-size:.7rem;font-style:normal;text-decoration:line-through}

/* Simple route with a tool: one visible request-and-return detour. */
.tool-detour-story{display:grid;grid-template-columns:.72fr 1.28fr;gap:20px;align-items:stretch}
.tool-detour-intro{display:flex;flex-direction:column;justify-content:center;text-align:center}
.tool-detour-icon{display:grid;width:78px;height:78px;margin:18px auto 4px;place-items:center;border-radius:24px;color:#fff;background:linear-gradient(135deg,var(--orange),#ffbd6c);font-size:1.25rem;font-weight:950;box-shadow:0 0 0 11px rgba(255,154,82,.08),0 0 38px rgba(255,154,82,.2);animation:toolFloat 2s ease-in-out infinite}
@keyframes toolFloat{50%{transform:translateY(-5px)}}
.tool-detour-intro p{margin:9px 0 0;color:#a6b2c7;font-size:.73rem;line-height:1.55}.tool-detour-intro p strong{color:#ffd2b1}
.tool-detour-flow{display:grid;gap:8px;align-content:center}
.tool-detour-flow > article{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:11px;align-items:center;padding:11px 12px;border:1px solid rgba(255,255,255,.09);border-radius:13px;background:rgba(255,255,255,.045);animation:toolStepIn .45s ease both;animation-delay:var(--delay,0s)}
.tool-detour-flow > article:not(.is-finish)::after{content:"";position:absolute;left:26px;top:100%;width:2px;height:9px;background:linear-gradient(var(--orange),var(--cyan))}
.tool-detour-flow > article > b{display:grid;width:29px;height:29px;place-items:center;border-radius:9px;color:#fff;background:var(--orange);font-size:.7rem}.tool-detour-flow > article.is-finish > b{background:var(--green)}
.tool-detour-flow article span,.tool-detour-flow article strong{display:block}.tool-detour-flow article span{color:#94a1b8;font-size:.7rem}.tool-detour-flow article strong{margin-top:3px;font-size:.76rem;line-height:1.35}
@keyframes toolStepIn{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
.tool-detour-caption{display:grid;grid-template-columns:auto 1fr;gap:2px 9px;align-items:center;margin-top:3px;padding:10px 11px;border-left:3px solid var(--cyan);border-radius:0 11px 11px 0;background:rgba(37,193,196,.08)}
.tool-detour-caption i{grid-row:1/3;width:10px;height:10px;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px var(--cyan);animation:returnPulse 1.4s ease-in-out infinite}.tool-detour-caption strong{font-size:.72rem}.tool-detour-caption span{color:#9cabc1;font-size:.7rem;line-height:1.4}
@keyframes returnPulse{50%{opacity:.45;transform:scale(.75)}}

/* Complex route: shows repeated model/tool turns as accumulating evidence. */
.complex-work-story{display:grid;grid-template-columns:.82fr 1.18fr;gap:18px;align-items:stretch}
.work-loop-explainer{display:flex;flex-direction:column;justify-content:center}
.work-loop-steps{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:15px}
.work-loop-steps article{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center;padding:10px;border:1px solid rgba(255,255,255,.09);border-radius:12px;background:rgba(255,255,255,.04);animation:storyCardIn .45s ease both}
.work-loop-steps article:nth-child(2){animation-delay:.1s}.work-loop-steps article:nth-child(3){animation-delay:.2s}.work-loop-steps article:nth-child(4){animation-delay:.3s}
.work-loop-steps b{display:grid;width:27px;height:27px;place-items:center;border-radius:9px;color:#fff;background:var(--accent);font-size:.7rem}.work-loop-steps article:nth-child(2) b{background:var(--orange)}.work-loop-steps article:nth-child(3) b{background:var(--cyan)}.work-loop-steps article:nth-child(4) b{background:var(--violet)}
.work-loop-steps strong,.work-loop-steps small{display:block}.work-loop-steps strong{font-size:.73rem}.work-loop-steps small{margin-top:2px;color:#95a2b9;font-size:.7rem;line-height:1.3}
.work-loop-return{position:relative;display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;margin-top:11px;padding:11px;border:1px solid rgba(37,193,196,.25);border-radius:13px;background:rgba(37,193,196,.075)}
.work-loop-return::before{content:"REPEAT";position:absolute;right:9px;top:7px;color:rgba(122,230,230,.5);font-size:.62rem;font-weight:900;letter-spacing:.08em}
.work-loop-return > i{width:34px;height:34px;border:3px solid var(--cyan);border-left-color:transparent;border-radius:50%;animation:returnSpin 2s linear infinite}.work-loop-return > i::after{content:"";position:absolute;margin:22px 0 0 -2px;border-top:5px solid var(--cyan);border-left:4px solid transparent;border-right:4px solid transparent}
@keyframes returnSpin{to{transform:rotate(360deg)}}
.work-loop-return strong,.work-loop-return small{display:block}.work-loop-return strong{font-size:.73rem}.work-loop-return small{max-width:250px;margin-top:3px;color:#9eabc0;font-size:.7rem;line-height:1.35}
.work-loop-explainer > p{margin:11px 0 0;color:#9eabc0;font-size:.7rem;line-height:1.5}
.work-cycle-story{display:grid;grid-template-rows:auto 1fr auto;gap:9px}
.work-cycle-story__head{display:flex;justify-content:space-between;gap:12px;align-items:end}.work-cycle-story__head span,.work-cycle-story__head strong{display:block}.work-cycle-story__head span{color:#ffbd8d;font-size:.7rem;font-weight:900;text-transform:uppercase;letter-spacing:.07em}.work-cycle-story__head strong{font-size:.76rem;text-align:right}
.work-cycle-list{display:grid;gap:7px;align-content:center}
.work-cycle-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 10px;border:1px solid rgba(255,255,255,.09);border-radius:12px;background:rgba(255,255,255,.045);animation:cycleStoryIn .45s ease both;animation-delay:var(--delay,0s)}
@keyframes cycleStoryIn{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
.work-cycle-card > b{display:grid;width:36px;height:36px;place-items:center;border-radius:10px;color:#fff;background:rgba(var(--accent-rgb),.65);font-size:.82rem;line-height:1}.work-cycle-card > b small{display:block;font-size:.48rem;text-transform:uppercase}
.work-cycle-card > div strong,.work-cycle-card > div small{display:block}.work-cycle-card > div strong{font-size:.74rem}.work-cycle-card > div small{margin-top:3px;color:#9aa7bc;font-size:.7rem;line-height:1.3}
.work-cycle-card > span{display:flex;align-items:center;gap:5px;color:#aee7ce;font-size:.7rem;font-weight:850;white-space:nowrap}.work-cycle-card > span i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 10px rgba(47,183,127,.7);animation:returnPulse 1.4s ease-in-out infinite}
.work-cycle-result{padding:10px 11px;border-left:3px solid var(--orange);border-radius:0 11px 11px 0;background:rgba(255,154,82,.08)}.work-cycle-result span,.work-cycle-result strong{display:block}.work-cycle-result span{color:#ffbd8d;font-size:.7rem;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.work-cycle-result strong{margin-top:3px;color:#dce5f5;font-size:.7rem;line-height:1.4}
@keyframes storyCardIn{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}

@media (max-width:980px){
  .direct-route-story,.tool-detour-story,.complex-work-story{gap:12px}
  .direct-path-line{grid-template-columns:1fr 13px 1fr 13px 1fr}.direct-path-line article{min-height:140px;padding:11px 9px}
  .work-cycle-card > span{white-space:normal}
}

@media (max-width:760px){
  .direct-route-story,.tool-detour-story,.complex-work-story{grid-template-columns:1fr;align-content:center}
  .direct-route-check{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.direct-route-check > .scene-label,.direct-route-check > h4,.direct-route-check > .direct-verdict{grid-column:1/-1}.direct-proof-list{margin-top:12px}.direct-verdict{margin-top:10px}
  .direct-route-path{padding:14px}.direct-path-line{margin-top:10px}
  .tool-detour-intro{display:grid;grid-template-columns:auto 1fr;gap:0 13px;text-align:left}.tool-detour-intro .scene-label{grid-column:1/-1}.tool-detour-icon{grid-row:2/4;width:64px;height:64px;margin:12px 0 0}.tool-detour-intro h4{margin-top:12px}.tool-detour-flow{grid-template-columns:1fr 1fr}.tool-detour-caption{grid-column:1/-1}
  .complex-work-story{grid-template-columns:1fr 1fr;align-items:stretch}.work-loop-explainer,.work-cycle-story{padding:13px}.work-loop-steps{grid-template-columns:1fr}.work-loop-explainer > p{display:none}.work-cycle-card{grid-template-columns:auto 1fr}.work-cycle-card > span{grid-column:2}
  .visual-stage[data-scene="4"][data-route="direct"],.visual-stage[data-scene="4"][data-route="direct"] .scene{height:780px;min-height:780px}
  .visual-stage[data-scene="4"][data-route="tool"],.visual-stage[data-scene="4"][data-route="tool"] .scene{height:790px;min-height:790px}
  .visual-stage[data-scene="4"][data-route="complex"],.visual-stage[data-scene="4"][data-route="complex"] .scene{height:850px;min-height:850px}
}

@media (max-width:500px){
  .direct-route-story,.tool-detour-story{align-content:start}.direct-route-check{display:block;padding:13px}.direct-proof-list{gap:6px}.direct-proof-list > div{padding:7px}.direct-route-path{padding:13px}.direct-path-line{grid-template-columns:1fr;gap:6px}.direct-path-line > i{width:2px;height:10px;margin:auto;background:linear-gradient(var(--accent),var(--cyan))}.direct-path-line > i::after{top:0;left:-3px;animation:signalTravelDown 1.4s linear infinite}.direct-path-line article{display:grid;grid-template-columns:auto 1fr;gap:9px;min-height:0;padding:9px}.direct-path-line article strong{margin-top:0}.direct-path-line article small{margin-top:3px}.unused-tools{margin-top:9px;padding-top:8px}
  @keyframes signalTravelDown{to{top:calc(100% - 8px)}}
  .tool-detour-intro{padding:13px}.tool-detour-flow{grid-template-columns:1fr;padding:13px}.tool-detour-caption{grid-column:auto}
  .complex-work-story{grid-template-columns:1fr;align-content:start}.work-loop-explainer{padding:12px}.work-loop-steps{grid-template-columns:1fr 1fr;margin-top:10px}.work-loop-return{margin-top:8px;padding:8px}.work-loop-return::before{display:none}.work-cycle-story{padding:12px}.work-cycle-story__head{display:block}.work-cycle-story__head strong{margin-top:4px;text-align:left}.work-cycle-list{gap:5px}.work-cycle-card{padding:7px 8px}.work-cycle-card > b{width:31px;height:31px}.work-cycle-result{padding:8px}
  .visual-stage[data-scene="4"][data-route="direct"],.visual-stage[data-scene="4"][data-route="direct"] .scene{height:860px;min-height:860px}
  .visual-stage[data-scene="4"][data-route="tool"],.visual-stage[data-scene="4"][data-route="tool"] .scene{height:720px;min-height:720px}
  .visual-stage[data-scene="4"][data-route="complex"],.visual-stage[data-scene="4"][data-route="complex"] .scene{height:900px;min-height:900px}
  .visual-stage[data-scene="4"][data-route="complex"][data-cycles="5"],.visual-stage[data-scene="4"][data-route="complex"][data-cycles="5"] .scene{height:1010px;min-height:1010px}
}

/* Interaction clarity: controls look actionable; teaching cards stay visibly informational. */
button{touch-action:manipulation}
a:focus-visible{outline:3px solid rgba(var(--accent-rgb),.25);outline-offset:3px;border-radius:3px}
.info-card,.visual-stage,.visual-stage *{cursor:default}

.control-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.control-heading > span{color:#4f5c73;font-size:.75rem;font-weight:900;text-transform:uppercase;letter-spacing:.075em}
.control-heading > small,.scene-picker-head > span{display:inline-flex;align-items:center;gap:6px;padding:5px 8px;border:1px solid rgba(var(--accent-rgb),.16);border-radius:99px;color:var(--accent-dark);background:rgba(var(--accent-rgb),.065);font-size:.7rem;font-weight:850;white-space:nowrap}
.control-heading > small i,.scene-picker-head > span i{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(var(--accent-rgb),.1)}
.assistant-picker > .control-heading{margin-bottom:9px}
.assistant-picker > .control-heading > span{margin:0;color:#4f5c73;font-size:.75rem}
.control-heading--section{margin-top:16px;margin-bottom:7px;padding-top:13px;border-top:1px solid #e6eaf1}
.control-heading--examples{margin-top:12px}

.model-button{position:relative;min-height:44px;border-color:#dce2ec;background:linear-gradient(180deg,#f7f9fc,#e9eef5);box-shadow:0 3px 0 #d8deea,0 5px 12px rgba(34,47,78,.07)}
.model-button::after{content:"";position:absolute;right:6px;top:6px;width:6px;height:6px;border:2px solid #a9b3c4;border-radius:50%;background:#fff}
.model-button.is-active{border-color:rgba(var(--accent-rgb),.46);background:#fff;box-shadow:0 3px 0 rgba(var(--accent-rgb),.28),0 7px 16px rgba(var(--accent-rgb),.13)}
.model-button.is-active::after{border-color:var(--accent);background:var(--accent);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.1)}

.task-tabs{border:1px solid #dce2eb;box-shadow:inset 0 1px 2px rgba(31,43,72,.05)}
.task-tab{position:relative;min-height:44px;border:1px solid transparent}
.task-tab:not(.is-active){background:#e4e9f1;box-shadow:inset 0 -2px 0 #d5dce7}
.task-tab.is-active{border-color:rgba(var(--accent-rgb),.28);color:var(--accent-dark);box-shadow:0 3px 0 rgba(var(--accent-rgb),.22),0 5px 12px rgba(var(--accent-rgb),.1)}
.task-tab.is-active::before{content:"";display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.1);vertical-align:1px}

.scenario-button{min-height:64px;border-width:1.5px;background:linear-gradient(180deg,#fff,#f6f8fc);box-shadow:0 3px 0 #dce2eb,0 6px 13px rgba(35,48,78,.06)}
.scenario-button.is-active{border-width:2px;box-shadow:0 3px 0 rgba(var(--accent-rgb),.3),0 8px 18px rgba(var(--accent-rgb),.12)}
.scenario-action{display:grid;justify-items:end;gap:4px;min-width:49px;color:var(--accent-dark)}
.scenario-action small{font-size:.68rem;font-weight:900;text-transform:uppercase;letter-spacing:.04em}
.scenario-action i{position:relative;width:24px;height:18px;border-radius:99px;background:rgba(var(--accent-rgb),.1)}
.scenario-action i::before{content:"";position:absolute;left:7px;top:8px;width:9px;height:2px;background:var(--accent)}
.scenario-action i::after{content:"";position:absolute;right:6px;top:5px;width:6px;height:6px;border-top:2px solid var(--accent);border-right:2px solid var(--accent);transform:rotate(45deg)}
.scenario-button.is-active .scenario-action i{background:var(--green)}
.scenario-button.is-active .scenario-action i::before{left:7px;top:9px;width:6px;background:#fff;transform:rotate(42deg)}
.scenario-button.is-active .scenario-action i::after{right:5px;top:5px;width:9px;height:5px;border-color:#fff;transform:rotate(135deg)}

.scene-picker-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:12px 14px;border:1px solid #dce3ee;border-radius:15px;background:#fff;box-shadow:0 4px 13px rgba(35,48,78,.055)}
.scene-picker-head strong,.scene-picker-head small{display:block}.scene-picker-head strong{font-size:.86rem}.scene-picker-head small{margin-top:3px;color:var(--muted);font-size:.74rem}
.phase-button{min-height:94px;padding-bottom:28px;border-width:1.5px;background:linear-gradient(180deg,#fff,#f6f8fc);box-shadow:0 3px 0 #dce2eb,0 5px 12px rgba(35,48,78,.055)}
.phase-button.is-active{border-width:2px;box-shadow:0 3px 0 rgba(var(--accent-rgb),.32),0 8px 18px rgba(var(--accent-rgb),.12)}
.phase-action{position:absolute;left:31px;bottom:8px;padding:3px 7px;border-radius:99px;color:var(--accent-dark);background:rgba(var(--accent-rgb),.085);font-size:.68rem;font-style:normal;font-weight:900;text-transform:uppercase;letter-spacing:.04em}
.phase-button.is-active .phase-action{color:#fff;background:var(--accent)}

.card-kind{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;padding-top:9px;border-top:1px dashed #dbe1eb;color:#647188;font-size:.68rem;font-weight:850;text-transform:uppercase;letter-spacing:.055em}
.card-kind span::before{content:"i";display:inline-grid;width:17px;height:17px;margin-right:6px;place-items:center;border:1px solid #bdc6d5;border-radius:50%;color:#68758c;font-family:Georgia,serif;font-size:.7rem;text-transform:none;vertical-align:-1px}
.card-kind strong{display:none;padding:4px 7px;border-radius:99px;color:#2e6a51;background:#e7f7ef;font-size:.66rem;letter-spacing:0;text-transform:none}
.route-lane.is-active .card-kind strong{display:inline-block}
.anatomy-card,.route-lane,.task-recipe,.lesson-card{box-shadow:none}

.watch-bar button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 12px;border:1px solid rgba(var(--accent-rgb),.24);background:linear-gradient(180deg,#f4f3ff,#e8e7ff);box-shadow:0 3px 0 rgba(var(--accent-rgb),.2);font-size:.72rem}
.watch-bar button i{position:relative;width:15px;height:15px;border:2px solid currentColor;border-left-color:transparent;border-radius:50%}
.watch-bar button i::after{content:"";position:absolute;left:-3px;top:-1px;border-right:5px solid currentColor;border-top:3px solid transparent;border-bottom:3px solid transparent;transform:rotate(-28deg)}

.source-links a{padding:2px 1px;cursor:pointer;text-decoration-thickness:2px}
.source-links a::after{content:" >";font-weight:900;text-decoration:none}

@media (hover:hover){
  .model-button:hover,.task-tab:hover,.scenario-button:hover,.phase-button:hover,.watch-bar button:hover{border-color:rgba(var(--accent-rgb),.58);color:var(--accent-dark);background:#fff;box-shadow:0 4px 0 rgba(var(--accent-rgb),.23),0 9px 18px rgba(var(--accent-rgb),.13);transform:translateY(-2px)}
  .source-links a:hover{color:#252399;background:rgba(var(--accent-rgb),.07)}
}
.model-button:active,.task-tab:active,.scenario-button:active,.phase-button:active,.watch-bar button:active{box-shadow:0 1px 0 rgba(var(--accent-rgb),.25);transform:translateY(2px)}

@media (max-width:760px){
  .scene-picker-head{align-items:flex-start}.scene-picker-head > span{white-space:normal;text-align:right}
  .phase-button{min-height:98px}
}

@media (max-width:500px){
  .control-heading > small,.scene-picker-head > span{font-size:.68rem}
  .scene-picker-head{display:block}.scene-picker-head > span{margin-top:8px}
  .scenario-action{min-width:45px}.scenario-action small{font-size:.66rem}
  .phase-button{min-height:104px;padding-bottom:29px}.phase-action{left:28px;font-size:.66rem}
  .watch-bar button{width:100%}
}

@media (max-width:340px){
  .visual-stage[data-scene="1"],.visual-stage[data-scene="1"] .scene{height:820px;min-height:820px}
  .visual-stage[data-scene="3"],.visual-stage[data-scene="3"] .scene{height:810px;min-height:810px}
  .visual-stage[data-scene="5"],.visual-stage[data-scene="5"] .scene{height:810px;min-height:810px}
  .visual-stage[data-scene="4"][data-route="direct"],.visual-stage[data-scene="4"][data-route="direct"] .scene{height:1060px;min-height:1060px}
  .visual-stage[data-scene="4"][data-route="tool"],.visual-stage[data-scene="4"][data-route="tool"] .scene{height:860px;min-height:860px}
  .visual-stage[data-scene="4"][data-route="complex"],.visual-stage[data-scene="4"][data-route="complex"] .scene{height:1140px;min-height:1140px}
  .visual-stage[data-scene="4"][data-route="complex"][data-cycles="5"],.visual-stage[data-scene="4"][data-route="complex"][data-cycles="5"] .scene{height:1180px;min-height:1180px}
}

/* Premium scene system: every scene shows input, transformation, outcome, and takeaway. */
.visual-stage{isolation:isolate;background:radial-gradient(circle at 82% 14%,rgba(var(--accent-rgb),.24),transparent 30%),radial-gradient(circle at 15% 85%,rgba(37,193,196,.11),transparent 31%),linear-gradient(145deg,#121c39 0%,#091126 58%,#111b37 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),inset 0 -80px 100px rgba(0,0,0,.12),0 18px 45px rgba(18,28,58,.17)}
.visual-stage::after{content:"";position:absolute;z-index:0;inset:-40%;pointer-events:none;background:conic-gradient(from 0deg,transparent,rgba(var(--accent-rgb),.06),transparent 23%,rgba(37,193,196,.05),transparent 48%);animation:ambientSweep 18s linear infinite}
@keyframes ambientSweep{to{transform:rotate(360deg)}}
.scene{z-index:2}
.scene-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.scene-panel-head > strong{color:#a9b6cb;font-size:.7rem;text-align:right}

/* Scene 1: context assembly */
.context-scene{grid-template-columns:minmax(235px,.9fr) minmax(120px,.48fr) minmax(315px,1.25fr);gap:15px;align-items:stretch}
.context-inputs{align-content:center;padding:15px;border:1px solid rgba(255,255,255,.09);border-radius:18px;background:linear-gradient(150deg,rgba(255,255,255,.065),rgba(255,255,255,.025));box-shadow:inset 0 1px rgba(255,255,255,.05)}
.input-card{grid-template-columns:auto minmax(0,1fr) auto;padding:10px 11px;background:rgba(7,15,34,.42);box-shadow:0 8px 18px rgba(0,0,0,.12)}
.input-card b{align-self:start;padding:3px 6px;border-radius:99px;color:#b9c7db;background:rgba(255,255,255,.07);font-size:.7rem;white-space:nowrap}
.context-funnel{display:flex;flex-direction:column;justify-content:center;gap:9px;padding:10px;text-align:center}
.context-filter{position:relative;display:grid;grid-template-columns:auto auto;gap:4px 6px;align-items:center;padding:9px;border:1px solid rgba(255,255,255,.09);border-radius:12px;background:rgba(255,255,255,.04);animation:filterIn .45s ease both}.context-filter:nth-of-type(2){animation-delay:.14s}
.context-filter > i{grid-row:1/3;width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px var(--cyan);animation:returnPulse 1.6s ease-in-out infinite}.context-filter b{font-size:.68rem}.context-filter small{color:#9aa8bd;font-size:.66rem;line-height:1.25}
@keyframes filterIn{from{opacity:0;transform:scale(.88)}to{opacity:1;transform:none}}
.context-funnel .flow-arrow{flex:0 0 auto;width:100%;margin-top:5px}
.context-window{display:flex;flex-direction:column;justify-content:center;padding:18px;background:linear-gradient(145deg,rgba(var(--accent-rgb),.15),rgba(37,193,196,.055));box-shadow:inset 0 1px rgba(255,255,255,.06),0 0 52px rgba(var(--accent-rgb),.14)}
.context-window::before{display:none}
.context-window__head{display:flex;align-items:start;justify-content:space-between;gap:12px}.context-window__head > b{display:flex;align-items:center;gap:6px;padding:5px 8px;border-radius:99px;color:#baf0d8;background:rgba(47,183,127,.12);font-size:.65rem;white-space:nowrap}.context-window__head > b i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green);animation:returnPulse 1.5s ease-in-out infinite}
.context-band{display:grid;grid-template-columns:minmax(0,1fr) auto;padding-right:10px;animation:contextBandIn .5s ease both;animation-delay:var(--delay,0s)}.context-band span,.context-band strong{grid-column:1}.context-band i{grid-column:2;grid-row:1/3;align-self:center;color:#baf0d8;font-size:.7rem;font-style:normal;font-weight:850}
@keyframes contextBandIn{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:none}}
.context-takeaway{display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:center;margin-top:12px;padding:9px 10px;border-left:3px solid var(--orange);border-radius:0 11px 11px 0;background:rgba(255,154,82,.08)}.context-takeaway > i{display:grid;width:25px;height:25px;place-items:center;border-radius:8px;color:#161c31;background:var(--orange);font-style:normal;font-weight:950}.context-takeaway strong,.context-takeaway small{display:block}.context-takeaway strong{font-size:.7rem}.context-takeaway small{margin-top:2px;color:#a4b0c4;font-size:.66rem;line-height:1.35}

/* Scene 2: tokenization and embeddings */
.token-scene{grid-template-rows:auto 1fr auto;gap:13px}
.token-request{padding:12px;border:1px solid rgba(163,108,245,.24);border-radius:15px;background:linear-gradient(145deg,rgba(163,108,245,.12),rgba(163,108,245,.045))}
.token-request .scene-label{display:block;margin-bottom:7px}.token-sentence{padding:10px 12px;background:rgba(5,11,27,.38)}
.token-transform{grid-template-columns:minmax(0,1fr) 90px minmax(0,1fr);gap:14px}
.token-cloud,.vector-board{height:100%;align-content:center;padding:15px;background:linear-gradient(150deg,rgba(255,255,255,.06),rgba(255,255,255,.025));box-shadow:inset 0 1px rgba(255,255,255,.04)}
.token-cloud .scene-panel-head,.vector-board .scene-panel-head{width:100%}
.token-pill{display:grid;grid-template-columns:auto auto;gap:5px;align-items:center;padding:6px 8px}.token-pill strong{font-size:.72rem}.token-pill small{padding:2px 4px;border-radius:5px;color:#bca9e8;background:rgba(0,0,0,.18);font-size:.67rem;font-weight:800}
.token-bridge{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center}.token-bridge .flow-arrow{flex:0 0 auto;width:100%}.token-bridge b{color:#e9effa;font-size:.7rem}.token-bridge small{color:#8f9db4;font-size:.64rem;line-height:1.3}
.vector-row{grid-template-columns:60px 1fr;padding:4px 0;border-bottom:1px solid rgba(255,255,255,.045)}.vector-row:last-child{border-bottom:0}
.token-caption{display:grid;grid-template-columns:1fr 1fr;gap:8px}.token-caption > span{padding:9px 11px;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:rgba(255,255,255,.035)}.token-caption strong,.token-caption small{display:block}.token-caption small{margin-top:3px;color:#929fb5;font-size:.66rem;line-height:1.35}

/* Scene 3: attention and transformer layers */
.transformer-scene{grid-template-rows:auto 1fr auto;gap:12px}
.attention-workbench{padding:13px 15px;border:1px solid rgba(37,193,196,.2);border-radius:16px;background:linear-gradient(145deg,rgba(37,193,196,.09),rgba(255,255,255,.025))}
.attention-example{flex-wrap:wrap}.attention-word{animation:attentionWordIn .42s ease both;animation-delay:var(--delay,0s)}
@keyframes attentionWordIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.attention-word.is-focus{transform:scale(1.06);border:1px solid rgba(var(--accent-rgb),.7)}.attention-word.is-linked::after{display:none}.attention-word.is-linked{box-shadow:inset 0 0 0 1px rgba(37,193,196,.24);animation:attentionWordIn .42s ease both,linkedPulse 2.1s ease-in-out infinite;animation-delay:var(--delay,0s),.7s}
@keyframes linkedPulse{50%{box-shadow:inset 0 0 0 1px rgba(37,193,196,.5),0 0 16px rgba(37,193,196,.13)}}
.attention-explanation{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;margin-top:11px;color:#93a1b7;font-size:.68rem}.attention-explanation b{padding:4px 7px;border-radius:8px;color:#fff;background:rgba(var(--accent-rgb),.28)}.attention-explanation strong{color:#bff0f0}
.transformer-machine{display:block;padding:13px 16px;border:1px solid rgba(255,255,255,.08);border-radius:17px;background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018))}
.transformer-machine__head{display:flex;justify-content:space-between;gap:12px;align-items:center}.transformer-machine__head > strong{color:#95a3b9;font-size:.68rem;text-align:right}
.layer-pipeline{position:relative;display:grid;grid-template-columns:repeat(7,1fr);gap:11px;margin-top:14px;padding:10px 14px}.layer-pipeline::before{content:"";position:absolute;left:5%;right:5%;top:50%;height:2px;background:linear-gradient(90deg,var(--accent),var(--cyan),var(--violet));opacity:.45}.layer-pipeline::after{content:"";position:absolute;top:calc(50% - 4px);left:5%;width:9px;height:9px;border-radius:50%;background:#fff;box-shadow:0 0 13px #fff;animation:layerSignal 2.4s linear infinite}
@keyframes layerSignal{to{left:calc(95% - 9px)}}
.layer-column{z-index:1;padding:8px 4px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:#111b38;animation:layerRise .45s ease both;animation-delay:var(--layer-delay,0s)}
@keyframes layerRise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.layer-column::after{display:none}.layer-name{margin-top:4px}.layer-story{display:flex;align-items:center;gap:10px;margin-top:9px;color:#93a0b6;font-size:.67rem}.layer-story i{flex:1;height:1px;background:linear-gradient(90deg,var(--accent),var(--cyan))}
.transformer-output{gap:9px}.meaning-chip{position:relative;overflow:hidden;padding:10px;animation:meaningIn .45s ease both;animation-delay:var(--delay,0s)}.meaning-chip i{position:absolute;left:0;bottom:0;width:100%;height:3px;background:linear-gradient(90deg,var(--accent),var(--cyan));animation:growWidth .7s ease both;animation-delay:var(--delay,0s)}
@keyframes meaningIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* Scene 4: explicit routing gates */
.decision-scene{grid-template-columns:.67fr .95fr 1.18fr;grid-template-rows:1fr auto;gap:14px;align-items:stretch}
.decision-core,.decision-gates,.route-options{padding:15px;border:1px solid rgba(255,255,255,.09);border-radius:17px;background:linear-gradient(150deg,rgba(255,255,255,.055),rgba(255,255,255,.02))}
.decision-core{display:flex;flex-direction:column;align-items:center;justify-content:center}.decision-core .model-orb{width:94px;height:94px;margin:14px auto 0}.decision-core strong{margin-top:18px}.decision-task{display:flex;align-items:center;gap:7px;margin-top:13px;padding:7px 9px;border-radius:10px;background:rgba(255,255,255,.05)}.decision-task b{padding:3px 6px;border-radius:7px;color:#d8d5ff;background:rgba(var(--accent-rgb),.25);font-size:.64rem}.decision-task small{color:#b2bdd0;font-size:.68rem}
.decision-gates{display:grid;align-content:center;gap:8px}.decision-gates .scene-panel-head{margin-bottom:2px}.decision-gates article{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:center;padding:10px;border:1px solid rgba(255,255,255,.075);border-radius:11px;background:rgba(5,11,27,.25);animation:gateIn .42s ease both;animation-delay:var(--delay,0s)}
@keyframes gateIn{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
.decision-gates article > i{display:grid;width:25px;height:25px;place-items:center;border-radius:8px;color:#fff;background:rgba(var(--accent-rgb),.65);font-size:.66rem;font-style:normal;font-weight:900}.decision-gates strong,.decision-gates small{display:block}.decision-gates strong{font-size:.7rem;line-height:1.3}.decision-gates small{margin-top:2px;color:#d8e0ef;font-size:.72rem;font-weight:900}.decision-gates article > b{padding:4px 6px;border-radius:99px;font-size:.67rem}.decision-gates .is-pass{color:#baf0d8;background:rgba(47,183,127,.13)}.decision-gates .is-flag{color:#ffd0ad;background:rgba(255,154,82,.14)}
.route-options{display:grid;align-content:center;gap:8px}.route-options .scene-panel-head{margin-bottom:2px}.route-option{padding:10px;opacity:.5}.route-option.is-chosen{opacity:1;animation:routeChosen 1.8s ease-in-out infinite}
@keyframes routeChosen{50%{box-shadow:0 0 34px color-mix(in srgb,var(--route-color,var(--accent)) 20%,transparent)}}
.decision-caption{grid-column:1/-1;margin:0;padding:9px 11px;border-left:3px solid var(--orange);border-radius:0 10px 10px 0;background:rgba(255,154,82,.075);text-align:left}.decision-caption strong{color:#ffd0ad}

/* Scene 5: visible evidence accumulation */
.direct-verdict{grid-template-columns:auto minmax(0,1fr) auto}.direct-verdict > i{display:grid;gap:3px;padding-left:10px;border-left:1px solid rgba(255,255,255,.12);font-style:normal}.direct-verdict > i span{color:#aee7ce;font-size:.67rem}.direct-verdict > i strong{margin:0;color:#fff;font-size:.8rem}
.context-before-after{display:grid;grid-template-columns:1fr 34px 1fr;gap:8px;align-items:center;padding:9px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.035)}.context-before-after > span{padding:7px;border-radius:9px;background:rgba(5,11,27,.28)}.context-before-after small,.context-before-after strong{display:block}.context-before-after small{color:#8e9bb2;font-size:.67rem}.context-before-after strong{margin-top:3px;font-size:.68rem}.context-before-after > i{position:relative;height:2px;background:linear-gradient(90deg,var(--orange),var(--cyan))}.context-before-after > i::after{content:"";position:absolute;right:-1px;top:-3px;border-left:6px solid var(--cyan);border-top:4px solid transparent;border-bottom:4px solid transparent}
.work-cycle-card > b{width:42px;height:42px}.work-cycle-card > b small{font-size:.65rem}
.work-cycle-card > span{display:grid;grid-template-columns:auto 1fr;white-space:normal}.work-cycle-card > span em{grid-column:1/-1;display:block;width:100%;height:4px;margin-top:5px;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.08)}.work-cycle-card > span em u{display:block;width:var(--progress);height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent),var(--green));animation:growWidth .7s ease both;animation-delay:var(--delay,0s)}

/* Scene 6: live token generation */
.output-scene{grid-template-columns:1fr 1.08fr;grid-template-rows:1fr auto;gap:14px;align-items:stretch}
.generation-engine,.answer-board{padding:16px;border:1px solid rgba(255,255,255,.09);border-radius:18px;background:linear-gradient(150deg,rgba(255,255,255,.055),rgba(255,255,255,.02))}
.generation-loop{display:grid;grid-template-columns:.72fr 15px 1fr 15px 1fr 15px 1fr;gap:5px;align-items:center;margin-top:10px}.generation-loop .output-model .model-orb{width:64px;height:64px}.generation-loop .output-model strong{margin-top:12px;font-size:.68rem}.generation-loop > div:not(.output-model){display:grid;grid-template-columns:auto 1fr;gap:6px;align-items:center;padding:8px;border:1px solid rgba(255,255,255,.075);border-radius:10px;background:rgba(5,11,27,.25)}.generation-loop > div > b{display:grid;width:23px;height:23px;place-items:center;border-radius:7px;color:#fff;background:var(--accent);font-size:.64rem}.generation-loop > div > span{font-size:.66rem;line-height:1.25}.generation-loop > i{height:2px;background:linear-gradient(90deg,var(--accent),var(--cyan))}
.candidate-board{margin-top:13px;padding:12px}.candidate-board__head{display:flex;justify-content:space-between;gap:10px}.candidate-board__head span{color:#9aa7bc;font-size:.68rem;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.candidate-board__head strong{color:#baf0d8;font-size:.66rem}.candidate-list{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.candidate-row{grid-template-columns:55px 1fr 28px;margin-top:9px}
.answer-board{display:flex;flex-direction:column;min-height:0}.generation-progress{height:6px;margin-top:10px;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.08)}.generation-progress i{display:block;width:var(--progress);height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent),var(--cyan),var(--green));transition:width .14s ease}
.stream-text{flex:1;min-height:175px;margin:13px 0 0;padding:13px;border:1px solid rgba(var(--accent-rgb),.25);border-radius:12px;background:rgba(5,11,27,.27)}.stream-cursor.is-complete{display:none}
.answer-status{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center;margin-top:10px;padding:9px;border-radius:11px;background:rgba(var(--accent-rgb),.08)}.answer-status > i{width:10px;height:10px;border-radius:50%;background:var(--orange);box-shadow:0 0 14px var(--orange);animation:returnPulse 1s ease-in-out infinite}.answer-status strong,.answer-status small{display:block}.answer-status strong{font-size:.7rem}.answer-status small{margin-top:2px;color:#98a6bc;font-size:.65rem}.answer-status.is-complete{background:rgba(47,183,127,.09)}.answer-status.is-complete > i{background:var(--green);box-shadow:0 0 14px var(--green);animation:none}
.output-validation{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr minmax(220px,.7fr);gap:11px;align-items:center;padding:10px 12px;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(255,255,255,.035)}.output-validation .answer-checks{margin:0;padding:0;border:0}.output-validation p{margin:0;color:#95a2b7;font-size:.66rem;line-height:1.35}.answer-check{transition:.3s ease}.answer-check.is-done{box-shadow:inset 0 0 0 1px rgba(47,183,127,.16)}

@media (max-width:1180px){
  .context-scene{grid-template-columns:minmax(210px,.85fr) 105px minmax(270px,1.15fr)}
  .decision-scene{grid-template-columns:.65fr .95fr 1.1fr;gap:10px}
  .generation-loop{grid-template-columns:.55fr 10px 1fr 10px 1fr 10px 1fr}
}

@media (max-width:760px){
  .visual-stage[data-scene="0"],.visual-stage[data-scene="0"] .scene{height:820px;min-height:820px}
  .visual-stage[data-scene="1"],.visual-stage[data-scene="1"] .scene{height:850px;min-height:850px}
  .visual-stage[data-scene="2"],.visual-stage[data-scene="2"] .scene{height:790px;min-height:790px}
  .visual-stage[data-scene="3"],.visual-stage[data-scene="3"] .scene{height:900px;min-height:900px}
  .visual-stage[data-scene="5"],.visual-stage[data-scene="5"] .scene{height:900px;min-height:900px}
  .context-scene{grid-template-columns:1fr 110px 1fr;align-content:center}.context-inputs{padding:12px}.input-card{grid-template-columns:auto minmax(0,1fr)}.input-card b{grid-column:2;justify-self:start}.context-window{padding:14px}
  .token-transform{grid-template-columns:1fr;gap:8px}.token-bridge{min-height:55px}.token-bridge .flow-arrow{width:2px;height:34px}.token-bridge .flow-arrow::after{right:-3px;top:auto;bottom:-1px;border-top:7px solid var(--cyan);border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:0}.token-bridge .flow-arrow::before{top:0;left:-3px;animation:travelDown 1.8s linear infinite}.token-bridge b,.token-bridge small{display:none}
  .decision-scene{grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto}.decision-core{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;gap:0 15px;text-align:left}.decision-core .scene-label{grid-column:1/-1}.decision-core .model-orb{grid-row:2/5;width:74px;height:74px;margin:10px 0 0}.decision-core strong{align-self:end;margin:10px 0 0}.decision-core > span:not(.scene-label){align-self:start}.decision-task{grid-column:2;margin-top:7px}.decision-caption{grid-column:1/-1}
  .generation-loop{grid-template-columns:1fr 12px 1fr 12px 1fr}.generation-loop .output-model{display:none}.generation-loop > i:first-of-type{display:none}.output-validation{grid-template-columns:1fr}.output-validation .scene-label{display:none}
}

@media (max-width:500px){
  .visual-stage[data-scene="0"],.visual-stage[data-scene="0"] .scene{height:1050px;min-height:1050px}
  .visual-stage[data-scene="1"],.visual-stage[data-scene="1"] .scene{height:1040px;min-height:1040px}
  .visual-stage[data-scene="2"],.visual-stage[data-scene="2"] .scene{height:930px;min-height:930px}
  .visual-stage[data-scene="3"],.visual-stage[data-scene="3"] .scene{height:1090px;min-height:1090px}
  .visual-stage[data-scene="5"],.visual-stage[data-scene="5"] .scene{height:1080px;min-height:1080px}
  .context-scene{grid-template-columns:1fr;align-content:start}.context-funnel{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:4px}.context-funnel > .scene-label,.context-funnel > .flow-arrow{grid-column:1/-1}.context-funnel .flow-arrow{width:2px;height:24px;margin:auto}.context-funnel .flow-arrow::after{right:-3px;top:auto;bottom:-1px;border-top:7px solid var(--cyan);border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:0}.context-funnel .flow-arrow::before{top:0;left:-3px;animation:travelDown 1.8s linear infinite}.context-window__head{display:block}.context-window__head > b{display:inline-flex;margin-top:7px}
  .token-caption{grid-template-columns:1fr}.vector-dots{gap:3px}.vector-row{grid-template-columns:50px 1fr}
  .attention-workbench,.transformer-machine{padding:11px}.transformer-machine__head{display:block}.transformer-machine__head > strong{display:block;margin-top:4px;text-align:left}.layer-pipeline{gap:5px;padding-inline:2px}.layer-column{padding-inline:2px}.layer-name{font-size:.58rem}.layer-story{display:block}.layer-story i{display:block;margin:6px 0}
  .decision-scene{grid-template-columns:1fr;align-content:start}.decision-core,.decision-gates,.route-options{grid-column:auto;padding:12px}.decision-core{grid-template-columns:auto 1fr}.decision-gates article{padding:8px}.decision-caption{grid-column:auto}
  .direct-verdict{grid-template-columns:auto 1fr}.direct-verdict > i{grid-column:1/-1;grid-template-columns:1fr auto;margin-top:7px;padding:7px 0 0;border-left:0;border-top:1px solid rgba(255,255,255,.12)}
  .context-before-after{grid-template-columns:1fr}.context-before-after > i{width:2px;height:14px;margin:auto;background:linear-gradient(var(--orange),var(--cyan))}.context-before-after > i::after{right:-3px;top:auto;bottom:-1px;border-top:6px solid var(--cyan);border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:0}
  .output-scene{grid-template-columns:1fr;grid-template-rows:auto auto auto;align-content:start}.generation-engine,.answer-board{padding:12px}.generation-loop{grid-template-columns:1fr 10px 1fr 10px 1fr}.candidate-list{grid-template-columns:1fr}.answer-board{grid-row:2}.output-validation{grid-column:auto;grid-row:3}.stream-text{min-height:185px}
}

@media (max-width:340px){
  .visual-stage[data-scene="0"],.visual-stage[data-scene="0"] .scene{height:1190px;min-height:1190px}
  .visual-stage[data-scene="1"],.visual-stage[data-scene="1"] .scene{height:1150px;min-height:1150px}
  .visual-stage[data-scene="2"],.visual-stage[data-scene="2"] .scene{height:1010px;min-height:1010px}
  .visual-stage[data-scene="3"],.visual-stage[data-scene="3"] .scene{height:1190px;min-height:1190px}
  .visual-stage[data-scene="5"],.visual-stage[data-scene="5"] .scene{height:1210px;min-height:1210px}
}

/* Second refinement pass: keep every lesson legible and purposeful on phones. */
@media (max-width:760px){
  .context-funnel{height:auto;min-height:0;transform:none}
}

@media (max-width:500px){
  .visual-stage[data-scene="0"],.visual-stage[data-scene="0"] .scene{height:1100px;min-height:1100px}
  .visual-stage[data-scene="1"],.visual-stage[data-scene="1"] .scene{height:1100px;min-height:1100px}
  .visual-stage[data-scene="2"],.visual-stage[data-scene="2"] .scene{height:750px;min-height:750px}
  .visual-stage[data-scene="3"],.visual-stage[data-scene="3"] .scene{height:940px;min-height:940px}
  .visual-stage[data-scene="5"],.visual-stage[data-scene="5"] .scene{height:890px;min-height:890px}
  .visual-stage[data-scene="4"][data-route="complex"][data-cycles="4"],.visual-stage[data-scene="4"][data-route="complex"][data-cycles="4"] .scene{height:980px;min-height:980px}
  .visual-stage[data-scene="4"][data-route="complex"][data-cycles="5"],.visual-stage[data-scene="4"][data-route="complex"][data-cycles="5"] .scene{height:1120px;min-height:1120px}
  .visual-stage[data-scene="4"][data-route="direct"],.visual-stage[data-scene="4"][data-route="direct"] .scene{height:910px;min-height:910px}
  .visual-stage[data-scene="4"][data-route="tool"],.visual-stage[data-scene="4"][data-route="tool"] .scene{height:790px;min-height:790px}
  .context-scene.has-many-inputs .context-inputs{grid-template-columns:1fr}
  .context-inputs .scene-panel-head{grid-column:1/-1}
  .context-funnel{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:6px}
  .context-funnel > .scene-label,.context-funnel > .flow-arrow{grid-column:1/-1}
  .context-funnel .flow-arrow{width:2px;height:22px;margin:0 auto}
  .transformer-scene{grid-template-rows:auto auto auto;align-content:start}
  .layer-name{font-size:.66rem}
  .transformer-machine .layer-column:nth-child(3),.transformer-machine .layer-column:nth-child(5){display:none}
  .transformer-machine .layer-column:nth-child(6),.transformer-machine .layer-column:nth-child(7){display:grid}
  .work-cycle-card > b{width:40px;height:40px}
}

@media (max-width:340px){
  .visual-stage[data-scene="0"],.visual-stage[data-scene="0"] .scene{height:1280px;min-height:1280px}
  .visual-stage[data-scene="1"],.visual-stage[data-scene="1"] .scene{height:1360px;min-height:1360px}
  .visual-stage[data-scene="2"],.visual-stage[data-scene="2"] .scene{height:830px;min-height:830px}
  .visual-stage[data-scene="3"],.visual-stage[data-scene="3"] .scene{height:1100px;min-height:1100px}
  .visual-stage[data-scene="5"],.visual-stage[data-scene="5"] .scene{height:970px;min-height:970px}
  .visual-stage[data-scene="4"][data-route="complex"][data-cycles="4"],.visual-stage[data-scene="4"][data-route="complex"][data-cycles="4"] .scene{height:1200px;min-height:1200px}
  .visual-stage[data-scene="4"][data-route="complex"][data-cycles="5"],.visual-stage[data-scene="4"][data-route="complex"][data-cycles="5"] .scene{height:1340px;min-height:1340px}
  .visual-stage[data-scene="4"][data-route="direct"],.visual-stage[data-scene="4"][data-route="direct"] .scene{height:1100px;min-height:1100px}
  .visual-stage[data-scene="4"][data-route="tool"],.visual-stage[data-scene="4"][data-route="tool"] .scene{height:1010px;min-height:1010px}
}