/* Shared structural layer for all three complete local theme mirrors. */
:root {
  --theme-ink:#172038;
  --theme-paper:#f6f8ff;
  --theme-card:#fff;
  --theme-accent:#ffd75a;
  --theme-secondary:#4b67ff;
  --theme-link:#3048c7;
  --theme-hot:#e83f50;
  --theme-soft:#e9edff;
  --theme-line:3px solid var(--theme-ink);
  --theme-shadow:6px 6px 0 var(--theme-ink);
  --font-display:"Arial Rounded MT Bold","Trebuchet MS",sans-serif;
  --font-body:"Trebuchet MS","Avenir Next",sans-serif;
  --font-hand:"Trebuchet MS",sans-serif;
  --font-mono:"Courier New",ui-monospace,monospace;
  --paper:var(--theme-paper);
  --paper-deep:var(--theme-soft);
  --ink:var(--theme-ink);
  --ink-soft:#58637b;
  --ink-faint:#7b849a;
  --line:#cfd6e8;
  --red:var(--theme-hot);
  --red-soft:#ffe4e7;
  --coral-ink:#b52d3c;
  --teal:var(--theme-secondary);
  --teal-soft:#e1e6ff;
  --teal-ink:#3048c7;
  --purple:var(--theme-secondary);
  --purple-soft:var(--theme-soft);
  --gold:var(--theme-accent);
  --gold-soft:#fff4ba;
  --green:#2baa77;
  --green-soft:#dcf8ed;
  --card:var(--theme-card);
  --shadow-sticker:var(--theme-shadow);
}
body {
  color:var(--theme-ink);
  background-color:var(--theme-paper);
  font-family:var(--font-body);
  background-image:radial-gradient(rgba(23,32,56,.08) 1.2px,transparent 1.6px);
  background-size:24px 24px;
}
.wrap{max-width:1120px}
#rail{background:rgba(255,255,255,.96);border-bottom:var(--theme-line)}
#rail .wrap{min-height:70px}
#rail .brand{font:950 20px/1 var(--font-display);letter-spacing:-.04em;gap:10px}
#rail .brand .theme-logo,.theme-logo{width:39px;height:39px;flex:0 0 auto;color:var(--theme-ink)}
#rail .brand .theme-brand-name{color:var(--theme-ink)}
.rail-menu summary,.rail-link{font:900 12px/1 var(--font-body);color:var(--theme-ink);border-radius:10px}
.rail-menu summary:hover,.rail-link:hover,.rail-menu[open]>summary{background:var(--theme-accent);border-color:var(--theme-ink)}
.menu-panel{border:var(--theme-line);border-radius:12px;background:#fff;box-shadow:var(--theme-shadow)}
.menu-item{border-radius:7px;font-family:var(--font-body)}
.menu-item:hover{background:var(--theme-soft)}
.menu-item.active{background:var(--theme-accent);box-shadow:inset 0 0 0 2px var(--theme-ink)}
header.hero{padding:72px 0 55px;border-bottom:var(--theme-line);background:var(--theme-hero,var(--theme-soft))}
.eyebrow{font:900 11px/1.35 var(--font-mono);color:var(--theme-hot);letter-spacing:.11em}
.eyebrow::before{background:var(--theme-hot);height:5px}
h1{font:950 clamp(43px,6.6vw,78px)/.95 var(--font-display);letter-spacing:-.055em;max-width:18ch}
h1 .hl,h1 .hl2{color:var(--theme-highlight,var(--theme-secondary))}
h2,.chapter-card h3,.vault-card h3,.story b,.dojo-q,.dojo-done .big{font-family:var(--font-display);letter-spacing:-.035em}
.lede{font-family:var(--font-body)}
.hand,.try-hint,.verdict{font-family:var(--font-body);font-weight:800}
section.step{padding:58px 0 24px}
.step-no{width:52px;height:52px;display:grid;place-items:center;border:2px solid var(--theme-ink);border-radius:14px;background:var(--theme-accent);box-shadow:4px 4px 0 var(--theme-ink);color:var(--theme-ink);-webkit-text-stroke:0;font:950 20px/1 var(--font-display)}
.step-head{align-items:center;gap:18px;margin-bottom:12px}
.move-badge{border:2px solid var(--theme-ink);border-radius:8px;background:var(--theme-secondary);box-shadow:3px 3px 0 var(--theme-ink);font:900 14px/1 var(--font-body);transform:rotate(-1deg)}
.demo,.story,.chapter-card,.vault-card,.dojo-box,.gh-box,.video-frame,.predict,#continueStrip{
  border:var(--theme-line)!important;border-radius:18px!important;background:var(--theme-card);box-shadow:var(--theme-shadow)!important;
}
.demo{padding:25px}
.demo::before{border:2px solid var(--theme-ink);border-radius:7px;background:var(--theme-accent);color:var(--theme-ink);font:900 11px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase}
.story{padding:20px}
.chapter-card{transition:transform .14s ease,box-shadow .14s ease}
.chapter-card:hover,.vault-card:hover{transform:translate(-3px,-3px);box-shadow:9px 9px 0 var(--theme-secondary)!important}
.vault-card h3{color:var(--theme-ink)!important}
.vault-card p{color:var(--ink-soft)!important}
.vault-card .go{color:var(--theme-link)!important;font-weight:900}
.vault-card[style*="background:var(--ink)"] h3{color:#fff!important}
.vault-card[style*="background:var(--ink)"] p{color:#dfe5f4!important}
.vault-card[style*="background:var(--ink)"] .go{color:var(--theme-accent)!important}
.theme-masters-card{position:relative}
.theme-masters-card::after{content:"10";position:absolute;right:16px;top:14px;color:var(--theme-secondary);font:950 34px/1 var(--font-display);opacity:.18}
.chapter-card .num,.vnum{border:2px solid var(--theme-ink)!important;border-radius:7px!important;background:var(--theme-accent)!important;color:var(--theme-ink)!important;font:900 11px/1 var(--font-mono)!important;text-transform:uppercase;letter-spacing:.05em}
.gbtn,.predict-opt,.plan-chip{border:2px solid var(--theme-ink);border-radius:9px;background:var(--theme-accent);box-shadow:3px 3px 0 var(--theme-ink);font-family:var(--font-body);font-weight:900}
.gbtn.purple,.gbtn.teal,.gbtn.red{background:var(--theme-secondary);color:#fff}
.readout{border:2px solid var(--theme-ink);border-radius:9px;background:var(--theme-soft)}
.video-frame{background:var(--theme-ink)!important;overflow:hidden}
.next-mystery{border:var(--theme-line);border-radius:16px;background:var(--theme-ink);box-shadow:6px 6px 0 var(--theme-accent)}
.next-mystery a{font-family:var(--font-body);font-weight:900}
.dojo-top{background:var(--theme-ink)}
.dojo-top .t,.gh-top .t{font-family:var(--font-display)}
.worked{border:2px solid var(--theme-ink);background:var(--gold-soft)}
.worked::before{border-radius:7px;font-family:var(--font-body);font-weight:900}
.msg.sensei{background:var(--theme-soft)}
footer{border-top:var(--theme-line);background:var(--theme-soft)}
#askPanel{border:var(--theme-line)!important;border-radius:18px!important;box-shadow:var(--theme-shadow)!important}
#askFab{border:2px solid var(--theme-ink)!important;border-radius:11px!important;background:var(--theme-accent)!important;color:var(--theme-ink)!important;box-shadow:4px 4px 0 var(--theme-ink)!important;font-weight:900!important}
.hero-ninja svg{display:none}
.hero-ninja::before{content:var(--theme-home-symbol,"✦");display:grid;place-items:center;width:175px;height:175px;border:var(--theme-line);border-radius:28px;background:var(--theme-secondary);box-shadow:10px 10px 0 var(--theme-ink);color:#fff;font:950 65px/1 var(--font-display)}
.vault-intro,.shelf-divider{border-color:var(--theme-ink)!important}
input[type=range]{accent-color:var(--theme-secondary)}
::selection{background:var(--theme-accent);color:var(--theme-ink)}
@media(max-width:640px){
  #rail .wrap{min-height:62px}
  #rail .brand{font-size:16px;max-width:72%}
  #rail .brand .theme-logo{width:32px;height:32px}
  header.hero{padding:48px 0 38px}
  h1{font-size:clamp(39px,13vw,58px)}
  section.step{padding-top:45px}
  .step-no{width:43px;height:43px;font-size:17px}
}

:root{
  --theme-ink:#17223c;--theme-paper:#f7f8ff;--theme-card:#fff;--theme-accent:#ffd75a;
  --theme-secondary:#6550ee;--theme-link:#5138cc;--theme-hot:#e66d32;--theme-soft:#dff8ef;
  --theme-hero:#a8e7d3;--theme-highlight:#6550ee;--theme-home-symbol:"⚙";
  --font-display:"Arial Rounded MT Bold","Trebuchet MS",sans-serif;
}
body{background-image:linear-gradient(#dfe4f4 1px,transparent 1px),linear-gradient(90deg,#dfe4f4 1px,transparent 1px);background-size:24px 24px}
#rail{border-bottom:3px solid var(--theme-ink)}
.rail-menu summary,.rail-link{border-radius:12px}
header.hero{background-image:radial-gradient(rgba(23,34,60,.12) 2px,transparent 2.5px);background-size:25px 25px}
header.hero::after{content:"";position:absolute;right:6%;top:20%;width:145px;height:145px;border:4px solid var(--theme-ink);border-radius:50%;background:conic-gradient(from 0deg,var(--theme-accent) 0 12.5%,#fff0a9 12.5% 25%,var(--theme-accent) 25% 37.5%,#fff0a9 37.5% 50%,var(--theme-accent) 50% 62.5%,#fff0a9 62.5% 75%,var(--theme-accent) 75% 87.5%,#fff0a9 87.5%);box-shadow:8px 8px 0 var(--theme-ink);opacity:.95}
header.hero>.wrap{position:relative;z-index:2}
.eyebrow{display:inline-flex;padding:8px 11px;border:2px solid var(--theme-ink);border-radius:8px;background:#fff;box-shadow:4px 4px 0 var(--theme-secondary);color:var(--theme-ink);letter-spacing:.07em}
.eyebrow::before{display:none}
.step-no{background:var(--theme-accent);border-radius:13px}
.story,.demo,.chapter-card,.vault-card{border-radius:20px!important}
.move-badge{background:var(--theme-secondary);border-radius:10px}
.demo{background:#fff;overflow:hidden}
.demo::after{content:var(--theme-story-label,"WORKBENCH");position:absolute;right:14px;top:9px;color:var(--theme-secondary);font:900 9px/1 var(--font-mono);letter-spacing:.08em}
.video-frame::before{content:var(--theme-video-label,"BUILD FILM");display:block;padding:8px 13px;background:var(--theme-accent);color:var(--theme-ink);font:900 10px/1 var(--font-mono);letter-spacing:.08em}
.dojo-top{background:var(--theme-secondary)}
.dojo-top .t::before{content:var(--theme-dojo-prefix,"TEST BENCH · ");color:var(--theme-accent)}
.belt{border-radius:50%;background:#fff}
.gbtn,.predict-opt,.plan-chip{border-radius:12px}
.hero-ninja::before{border-radius:30px;background:var(--theme-secondary);font-size:80px}
footer{background:#a8e7d3}
@media(max-width:900px){header.hero::after{opacity:.18;right:-30px}}
