:root{--ink:#171516;--paper:#f3eee7;--cream:#fffaf2;--wine:#6f1834;--rose:#d9a9b8;--acid:#d8ff55;--line:#1715162e;--muted:#6d6668;--radius:22px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--ink);background:var(--paper);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5}button,a{font:inherit}button{color:inherit}button:focus-visible,a:focus-visible{outline-offset:3px;outline:3px solid #2671d9}.hero{min-height:88vh;color:var(--cream);background:radial-gradient(circle at 82% 24%,#d9a9b83d,#0000 25%),linear-gradient(145deg,#511329,#781b3b 55%,#37101f);padding:24px clamp(20px,5vw,72px) 64px;position:relative;overflow:hidden}.hero:after{content:"{ }";color:#ffffff0b;letter-spacing:-.2em;pointer-events:none;font:700 clamp(260px,42vw,690px)/1 ui-monospace,monospace;position:absolute;bottom:-20vw;right:-2vw}.topbar{z-index:1;border-bottom:1px solid #ffffff40;justify-content:space-between;align-items:center;padding-bottom:18px;display:flex;position:relative}.brand{color:inherit;letter-spacing:.12em;align-items:center;gap:12px;font-size:.78rem;font-weight:800;text-decoration:none;display:flex}.brand span{letter-spacing:0;border:1px solid;border-radius:50%;place-items:center;width:34px;height:34px;display:grid}.lesson-number{letter-spacing:.14em;opacity:.75;font:500 .72rem ui-monospace,monospace}.hero-grid{z-index:1;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);align-items:end;gap:clamp(40px,8vw,120px);min-height:68vh;padding-top:64px;display:grid;position:relative}.eyebrow{text-transform:uppercase;letter-spacing:.15em;margin:0 0 14px;font:700 .7rem ui-monospace,monospace}h1,h2,h3,p{margin-top:0}h1{letter-spacing:-.065em;margin-bottom:26px;font:650 clamp(3.7rem,9.5vw,9.8rem)/.82 Georgia,serif}h1 em{color:var(--rose);font-weight:400}.lede{color:#fffc;max-width:590px;font-size:clamp(1.05rem,1.8vw,1.35rem)}.primary-link{min-height:52px;color:var(--ink);background:var(--acid);border-radius:999px;align-items:center;gap:44px;margin-top:18px;padding:0 22px;font-weight:750;text-decoration:none;display:inline-flex}.brief{border-radius:var(--radius);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff0f;border:1px solid #ffffff4d;padding:28px}.brief>p:not(.brief-label){font:1.18rem/1.45 Georgia,serif}.brief-label{color:var(--rose);letter-spacing:.12em;text-transform:uppercase;font:700 .68rem ui-monospace,monospace}.brief dl{margin:30px 0 0}.brief dl div{border-top:1px solid #ffffff2e;justify-content:space-between;gap:16px;padding:12px 0;font-size:.78rem;display:flex}.brief dt{opacity:.62}.brief dd{margin:0;font-weight:700}.lesson-shell{max-width:1440px;margin:0 auto;padding:0 clamp(20px,5vw,72px) 100px}.stage-rail{border-left:1px solid var(--line);grid-template-columns:repeat(7,1fr);margin:-1px 0 90px;display:grid}.stage{border-right:1px solid var(--line);border-bottom:1px solid var(--line);color:#999;text-transform:uppercase;letter-spacing:.08em;min-width:0;padding:15px 8px;font:700 .64rem ui-monospace,monospace}.stage span{margin-bottom:4px;font-weight:400;display:block}.stage.active{background:var(--cream);color:var(--wine)}.lab-heading{grid-template-columns:1.2fr .8fr;align-items:end;gap:40px;margin-bottom:42px;display:grid}.lab-heading h2,.challenge h2,.coach-section h2,.create-section h2,.receipt h2{letter-spacing:-.04em;margin-bottom:0;font:500 clamp(2.2rem,5vw,4.7rem)/.98 Georgia,serif}.lab-heading>p{max-width:520px;color:var(--muted);font-size:1rem}.cipher-layout{border:1px solid var(--line);background:var(--cream);border-radius:var(--radius);grid-template-columns:1.1fr .9fr;display:grid;overflow:hidden}.cipher-bank{padding:clamp(20px,3vw,40px)}.section-title{justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;display:flex}.section-title h3{margin:0;font-size:1rem}.text-button{cursor:pointer;min-height:44px;color:var(--wine);background:0 0;border:0;padding:0;font-weight:700;text-decoration:underline}.movement-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.movement-list li{border:1px solid var(--line);cursor:grab;background:#fff;border-radius:14px;grid-template-columns:42px 1fr auto;align-items:center;gap:14px;min-height:90px;padding:12px 14px;display:grid}.movement-list li:active{cursor:grabbing}.order{color:var(--wine);font:.72rem ui-monospace,monospace}.move-copy{grid-template-columns:1fr auto;align-items:center;gap:2px 10px;display:grid}.move-copy strong{font:500 1.18rem Georgia,serif}.move-copy code{color:var(--wine);font:700 .7rem ui-monospace,monospace}.move-copy small{color:var(--muted);grid-column:1/-1}.move-controls{grid-template-columns:44px 44px;gap:5px;display:grid}.move-controls button{border:1px solid var(--line);background:var(--paper);cursor:pointer;border-radius:50%;width:44px;height:44px;font-size:1.1rem}.move-controls button:disabled{opacity:.3;cursor:not-allowed}.compile-button,.dark-button,.outline-button{cursor:pointer;border-radius:999px;min-height:54px;padding:0 20px;font-weight:750}.compile-button{color:#fff;background:var(--wine);border:0;justify-content:space-between;align-items:center;width:100%;margin-top:18px;display:flex}.compiler{background:var(--ink);color:#eee8e2;padding:clamp(24px,4vw,48px)}.terminal-head{color:#9b9294;border-bottom:1px solid #3c3839;justify-content:space-between;padding-bottom:16px;font:.72rem ui-monospace,monospace;display:flex}.compiler pre{color:var(--acid);white-space:pre-wrap;margin:30px 0;font:.9rem/1.8 ui-monospace,monospace}.rule-stack{gap:10px;display:grid}.rule{color:#817b7d;grid-template-columns:22px 1fr;gap:10px;display:grid}.rule.pass{color:#f5eee9}.rule>span{color:var(--acid)}.rule.fail>span{color:#ff8f9b}.rule strong{font-size:.8rem;display:block}.rule small{color:#c1b9ba;margin-top:3px;display:block}.status{border:1px solid;border-radius:10px;margin:24px 0 0;padding:12px;font:700 .72rem ui-monospace,monospace}.status.good{color:var(--acid)}.status.bad{color:#ff8f9b}.challenge{color:#fff;background:var(--wine);border-radius:var(--radius);grid-template-columns:120px 1fr;gap:20px;margin-top:90px;padding:clamp(26px,5vw,70px);display:grid}.challenge-number{color:var(--rose);font:500 5rem/1 Georgia,serif}.challenge-copy{max-width:900px}.glitch-code{flex-wrap:wrap;gap:8px;margin:30px 0;display:flex}.glitch-code code{border:1px solid #ffffff4d;border-radius:8px;padding:10px 12px;font-size:.72rem}.choice-grid{gap:9px;display:grid}.choice-grid button,.quality-grid button{text-align:left;min-height:54px;color:inherit;cursor:pointer;background:0 0;border:1px solid #ffffff59;border-radius:10px;padding:12px 16px}.choice-grid button:hover,.choice-grid button.selected{background:var(--acid);color:var(--ink);border-color:var(--acid)}.success-note{background:#00000038;border-radius:10px;margin-top:20px;padding:16px}.reveal{animation:.45s both reveal}@keyframes reveal{0%{opacity:0;transform:translateY(12px)}}.coach-section{border-bottom:1px solid var(--line);grid-template-columns:1fr 1fr;align-items:center;gap:50px;padding:100px 0;display:grid}.coach-section>div>p:not(.eyebrow){color:var(--muted);max-width:600px}.button-row{flex-wrap:wrap;gap:10px;margin-top:24px;display:flex}.dark-button{border:1px solid var(--ink);color:#fff;background:var(--ink)}.outline-button{border:1px solid var(--ink);background:0 0}.dark-button:disabled{opacity:.6}.coach-card{background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;justify-content:center;min-height:310px;padding:clamp(24px,4vw,44px);display:flex}.coach-card .source{color:var(--wine);text-transform:uppercase;background:#f0dfe5;border-radius:6px;align-self:flex-start;padding:5px 8px;font:700 .62rem ui-monospace,monospace}.coach-card h3{margin:22px 0 10px;font:500 2rem Georgia,serif}.coach-card blockquote{border-left:3px solid var(--wine);margin:18px 0 0;padding-left:16px;font-family:Georgia,serif;font-style:italic}.empty{color:var(--muted)}.create-section{grid-template-columns:1fr 1fr;align-items:start;gap:30px 60px;padding:100px 0;display:grid}.create-section>div:first-child{grid-row:1/span 2}.create-section fieldset{border:0;margin:0;padding:0}.create-section legend{margin-bottom:12px;font-weight:800}.quality-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.quality-grid button{text-align:center;color:var(--ink);border-color:var(--line);background:var(--cream);text-transform:capitalize}.quality-grid button.selected{color:#fff;background:var(--wine);border-color:var(--wine)}.variation-code{color:var(--acid);background:var(--ink);border-radius:12px;margin:0;padding:20px;font:.75rem/1.6 ui-monospace,monospace;overflow:auto}.create-section .compile-button{grid-column:2}.receipt{background:var(--acid);border-radius:var(--radius);grid-template-columns:160px 1fr;gap:40px;padding:clamp(30px,6vw,80px);display:grid}.receipt-mark{border:2px solid var(--ink);border-radius:50%;place-items:center;width:140px;height:140px;font:700 2.5rem Georgia,serif;display:grid}.receipt dl{border-top:1px solid #00000040;grid-template-columns:repeat(3,1fr);margin:28px 0;display:grid}.receipt dl div{padding:14px 12px 0 0}.receipt dt{color:#00000094;font-size:.7rem}.receipt dd{overflow-wrap:anywhere;margin:3px 0 0;font:700 .84rem ui-monospace,monospace}footer{color:#fff;background:var(--ink);grid-template-columns:.35fr 1fr .55fr;gap:30px;margin-top:90px;padding:50px clamp(20px,5vw,72px);font-size:.8rem;display:grid}footer p{color:#bbb3b5}footer span{color:var(--acid)}@media (max-width:900px){.hero-grid,.lab-heading,.cipher-layout,.coach-section,.create-section{grid-template-columns:1fr}.hero-grid{align-items:start;min-height:auto}.brief{max-width:560px}.cipher-layout{border-radius:18px}.compiler{min-height:480px}.create-section>div:first-child{grid-row:auto}.create-section .compile-button{grid-column:1}footer{grid-template-columns:1fr}}@media (max-width:620px){.hero{min-height:auto;padding-bottom:48px}.hero-grid{gap:38px;padding-top:48px}h1{font-size:clamp(3.6rem,19vw,5.4rem)}.stage-rail{grid-template-columns:repeat(4,1fr);margin-bottom:60px}.stage:nth-child(n+5){border-top:0}.lab-heading{gap:12px}.movement-list li{grid-template-columns:30px 1fr}.move-controls{grid-column:2;grid-template-columns:52px 52px}.move-controls button{width:52px;height:52px}.challenge{grid-template-columns:1fr;margin-top:60px;padding:26px 20px}.challenge-number{font-size:3.3rem}.quality-grid,.receipt{grid-template-columns:1fr}.receipt-mark{width:92px;height:92px;font-size:1.7rem}.receipt dl{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
