:root{
  color-scheme:dark;
  --bg:#050d08;
  --panel:#0e1b13;
  --panel-2:#14251a;
  --ink:#f2f3df;
  --muted:#aebdaf;
  --line:#304638;
  --green:#92df67;
  --green-2:#4fae58;
  --gold:#e8c867;
  --red:#e87d6f;
  --orange:#e6a35f;
  --blue:#6bb8b7;
  --focus:#fff0a3;
  --shadow:0 24px 70px rgba(0,0,0,.38);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  color:var(--ink);
  line-height:1.5;
  background:
    radial-gradient(circle at 12% 0%,rgba(146,223,103,.13),transparent 31rem),
    radial-gradient(circle at 92% 18%,rgba(107,184,183,.1),transparent 28rem),
    linear-gradient(180deg,#07120c,var(--bg) 70%);
}
button,input,a{font:inherit}
button,a{touch-action:manipulation}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.48}
.skip-link{position:fixed;z-index:100;top:.75rem;left:.75rem;transform:translateY(-180%);background:var(--focus);color:#111;padding:.7rem 1rem;border-radius:.65rem;font-weight:900}
.skip-link:focus{transform:none}
.site-bar{min-height:72px;padding:1rem clamp(1rem,3vw,2.5rem);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(255,255,255,.08);background:rgba(5,13,8,.86);backdrop-filter:blur(14px)}
.brand{display:flex;align-items:center;gap:.75rem;color:var(--ink);text-decoration:none}
.brand-mark{width:2.7rem;height:2.7rem;display:grid;place-items:center;border-radius:50%;font-weight:950;letter-spacing:-.06em;color:#102014;background:linear-gradient(135deg,var(--green),var(--gold));box-shadow:0 0 0 4px rgba(146,223,103,.08)}
.brand span:last-child{display:grid;line-height:1.05}.brand small{font-size:.72rem;color:var(--muted);font-weight:650;margin-top:.22rem}
.hub-link{color:var(--ink);text-decoration:none;font-weight:850;padding:.55rem .8rem;border:1px solid var(--line);border-radius:999px}
.game-shell{width:min(1280px,calc(100% - 2rem));margin:0 auto;padding:clamp(1.2rem,4vw,3.2rem) 0 4rem}
.hero,.hud,.board-card,.feedback-card,.tools-card,.code-card,.history-card,.rules-card{border:1px solid rgba(255,255,255,.09);background:linear-gradient(180deg,rgba(20,37,26,.94),rgba(10,23,15,.96));box-shadow:var(--shadow)}
.hero{border-radius:1.35rem;padding:clamp(1.35rem,3.5vw,2.6rem);display:flex;gap:1.5rem;align-items:flex-start;justify-content:space-between}
.eyebrow{margin:0 0 .35rem;text-transform:uppercase;letter-spacing:.16em;font-size:.7rem;font-weight:950;color:var(--green)}
h1,h2,p{margin-top:0}h1{margin-bottom:.6rem;font-size:clamp(2.3rem,7vw,5.5rem);line-height:.88;letter-spacing:-.055em;max-width:12ch}h2{font-size:clamp(1.2rem,2.5vw,1.65rem);letter-spacing:-.025em;margin-bottom:.35rem}
.lede{margin:0;max-width:64ch;color:var(--muted);font-size:clamp(1rem,2vw,1.18rem)}
.status-chip,.wave-status{display:inline-flex;align-items:center;padding:.5rem .72rem;border:1px solid var(--line);border-radius:999px;background:rgba(0,0,0,.17);color:var(--muted);font-size:.78rem;font-weight:800}
.hud{margin-top:1rem;border-radius:1rem;display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden}
.hud>div{padding:.8rem 1rem;display:grid;gap:.15rem;border-right:1px solid rgba(255,255,255,.07)}.hud>div:last-child{border-right:0}.hud span{font-size:.68rem;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);font-weight:850}.hud strong{font-size:1.25rem}
.play-layout{margin-top:1rem;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(310px,.7fr);gap:1rem;align-items:start}
.board-column,.side-column{display:grid;gap:1rem}.board-card{border-radius:1.3rem;padding:1.1rem;overflow:hidden;position:relative}
.board-card::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.24;background:linear-gradient(90deg,transparent 49.5%,rgba(255,255,255,.06) 50%,transparent 50.5%),linear-gradient(0deg,transparent 49.5%,rgba(255,255,255,.04) 50%,transparent 50.5%);background-size:72px 72px}
.section-heading{position:relative;z-index:1;display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.section-heading p,.section-heading h2{margin-bottom:0}.section-heading.compact{display:block}
.lanes{position:relative;z-index:1;margin-top:1rem;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.lane-card{min-width:0;position:relative;padding:.85rem;border:1px solid #395443;border-radius:1rem;background:linear-gradient(180deg,rgba(22,48,31,.94),rgba(8,20,12,.96));overflow:hidden;transition:border-color .2s ease,transform .2s ease}.lane-card:hover{border-color:#5f8069}.lane-card.lost{filter:grayscale(.8);opacity:.58}
.lane-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem}.lane-heading>div{display:grid}.lane-heading span{font-size:.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}.lane-heading strong{font-size:1rem}.lane-heading b{font-size:.8rem;color:var(--green)}
.health-track{height:.5rem;margin:.55rem 0 .5rem;border-radius:99px;overflow:hidden;background:#08110b;border:1px solid rgba(255,255,255,.08)}.health-track span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--orange),var(--green));transition:width .3s ease}
.plant-art{height:138px;position:relative;margin:.2rem 0 .65rem;filter:drop-shadow(0 13px 15px rgba(0,0,0,.32))}.plant-stem{position:absolute;left:50%;bottom:32px;width:7px;height:76px;margin-left:-3.5px;border-radius:7px;background:linear-gradient(90deg,#4b8c45,#89cb61)}.leaf{position:absolute;width:51px;height:25px;border-radius:90% 8% 90% 8%;background:linear-gradient(135deg,#79c85d,#317a42);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}.leaf-a{left:50%;bottom:74px;transform:translateX(-48px) rotate(21deg)}.leaf-b{left:50%;bottom:78px;transform:translateX(-3px) rotate(154deg)}.leaf-c{left:50%;bottom:101px;transform:translateX(-43px) rotate(7deg) scale(.82)}.leaf-d{left:50%;bottom:105px;transform:translateX(-1px) rotate(169deg) scale(.82)}.pot{position:absolute;left:50%;bottom:4px;width:64px;height:38px;transform:translateX(-50%);background:linear-gradient(90deg,#5f4733,#946949,#5b422e);clip-path:polygon(8% 0,92% 0,80% 100%,20% 100%);border-radius:5px}
.threat-stack{display:grid;gap:.45rem;min-height:88px}.clear-lane{margin:.3rem 0;color:#89a493;font-size:.8rem;text-align:center;padding:.6rem;border:1px dashed #31513b;border-radius:.7rem}
.threat-card{display:grid;grid-template-columns:auto 1fr;gap:.55rem;align-items:center;padding:.55rem;border:1px solid rgba(232,125,111,.36);border-radius:.75rem;background:rgba(88,27,25,.35)}.threat-mark,.tool-mark{display:grid;place-items:center;flex:0 0 auto;width:2.2rem;height:2.2rem;border-radius:.6rem;font-weight:950;font-size:.7rem;letter-spacing:.02em}.threat-mark{color:#ffd9cf;background:linear-gradient(135deg,#9f3d39,#62211f)}.threat-copy{min-width:0;display:grid}.threat-copy strong{font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.threat-copy small{color:#d4aaa5;font-size:.67rem}.pressure-meter{display:flex;gap:3px;margin-top:.3rem}.pressure-pip{width:14px;height:4px;border-radius:99px;background:#493330}.pressure-pip.active{background:var(--red)}
.deploy-button{width:100%;margin-top:.7rem;border:0;border-radius:.72rem;padding:.68rem .7rem;font-weight:900;color:#102014;background:linear-gradient(135deg,var(--green),#b8ef75)}
.feedback-card{border-radius:1rem;padding:1rem 1.1rem;display:grid;gap:.3rem;border-left:5px solid var(--line)}.feedback-card.strong{border-left-color:var(--green)}.feedback-card.supportive{border-left-color:var(--gold)}.feedback-card.mismatch{border-left-color:var(--red)}.feedback-card.empty{border-left-color:var(--blue)}.feedback-kicker{font-size:.68rem;letter-spacing:.15em;font-weight:950;color:var(--muted)}.feedback-card>strong{font-size:1.05rem}.feedback-card>p{margin:.2rem 0 0;color:var(--muted)}.lesson{padding-top:.55rem;border-top:1px solid rgba(255,255,255,.08)}.lesson strong{color:var(--ink)}.game-result{padding:.65rem .75rem;border-radius:.65rem}.game-result.win{background:rgba(80,156,84,.18);color:#cceebb}.game-result.loss{background:rgba(170,63,57,.18);color:#ffc8c2}
.tools-card,.code-card,.history-card,.rules-card{border-radius:1rem;padding:1rem}.tool-grid{display:grid;gap:.5rem;margin-top:.8rem}.tool-button{width:100%;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.65rem;text-align:left;border:1px solid #344c3b;border-radius:.75rem;padding:.62rem;background:#0a1710;color:var(--ink)}.tool-button:hover{border-color:#668370}.tool-button[aria-pressed="true"]{border-color:var(--green);box-shadow:0 0 0 2px rgba(146,223,103,.14);background:#10251a}.tool-mark{color:#102014;background:linear-gradient(135deg,var(--gold),#fff0a1)}.tool-button>span:last-child{min-width:0;display:grid}.tool-button strong{font-size:.82rem}.tool-button small{color:var(--muted);font-size:.67rem;line-height:1.3;margin-top:.1rem}
.selected-tool{margin-top:.75rem;padding:.7rem;border-radius:.7rem;background:#07110b;border:1px solid rgba(255,255,255,.08);display:grid}.selected-tool strong{font-size:.82rem}.selected-tool span{font-size:.72rem;color:var(--muted);margin-top:.2rem}
.code-card label{display:block;font-size:.74rem;color:var(--muted);font-weight:800;margin:.75rem 0 .35rem}.code-row{display:grid;grid-template-columns:1fr auto;gap:.5rem}.code-row input{min-width:0;width:100%;border:1px solid var(--line);border-radius:.7rem;background:#06100a;color:var(--ink);padding:.68rem .75rem;font-weight:950;letter-spacing:.16em;text-transform:uppercase}.code-row input[aria-invalid="true"]{border-color:var(--red)}.secondary-button,.primary-button{border:0;border-radius:.7rem;padding:.68rem .8rem;font-weight:900}.secondary-button{background:#2a4131;color:var(--ink);border:1px solid #49634f}.primary-button{width:100%;margin-top:.7rem;background:var(--green);color:#102014}.help-text{margin:.4rem 0 0;color:var(--muted);font-size:.72rem}
.history-list{list-style:none;padding:0;margin:.7rem 0 0;display:grid;gap:.45rem;max-height:360px;overflow:auto}.history-list li:not(.empty-state){display:grid;grid-template-columns:auto 1fr;gap:.6rem;align-items:center;padding:.45rem 0;border-bottom:1px solid rgba(255,255,255,.07)}.history-list li>span{font-size:.68rem;font-weight:950;color:var(--gold)}.history-list div{display:grid;min-width:0}.history-list strong{font-size:.78rem}.history-list small{color:var(--muted);font-size:.66rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.empty-state{color:var(--muted);font-size:.78rem;font-style:italic}
.rules-card{margin-top:1rem}.rules-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.rules-grid p{margin:0;color:var(--muted)}.rules-grid strong{color:var(--ink)}.education-note{margin:1rem 0 0;padding-top:1rem;border-top:1px solid rgba(255,255,255,.08);font-size:.78rem;color:#9eafa1}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
@media(max-width:980px){.play-layout{grid-template-columns:1fr}.side-column{grid-template-columns:repeat(2,minmax(0,1fr))}.history-card{grid-column:1/-1}}
@media(max-width:760px){.hero{display:grid}.status-chip{justify-self:start}.hud{grid-template-columns:repeat(2,1fr)}.hud>div:nth-child(2){border-right:0}.hud>div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.07)}.lanes{grid-template-columns:1fr}.plant-art{height:112px}.side-column{grid-template-columns:1fr}.history-card{grid-column:auto}.rules-grid{grid-template-columns:1fr}.section-heading{display:grid}.wave-status{justify-self:start}.lane-card{display:grid;grid-template-columns:minmax(120px,.7fr) minmax(0,1.2fr);column-gap:.8rem;align-items:center}.lane-heading,.health-track,.deploy-button{grid-column:1/-1}.plant-art{grid-column:1}.threat-stack{grid-column:2}}
@media(max-width:480px){.site-bar{padding:.8rem 1rem}.brand small{display:none}.game-shell{width:min(100% - 1rem,1280px);padding-top:.7rem}.hero,.board-card{border-radius:1rem}.lane-card{grid-template-columns:1fr}.plant-art,.threat-stack{grid-column:1}.tool-button small{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.lane-card,.health-track span{transition:none!important}}
