/* Shares Genesis's Descent palette and typography. This review has its own route. */
:root{color-scheme:dark;--void:#030304;--ink:#f3efe6;--dim:#b9b2a5;--muted:#938c80;--gold:#d8a94e;--gold-hi:#f0c873;--cyan:#4fd8e8;--line:rgba(216,169,78,.18);--serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;--sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;--mono:ui-monospace,"Cascadia Code",Consolas,monospace;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:105px}body{margin:0;background:var(--void);color:var(--ink);font:16px/1.65 var(--sans);overflow-x:hidden}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button{border:0;background:none}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--gold-hi);outline-offset:5px}::selection{background:#684d23;color:#fff}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:400}h1,h2{font-family:var(--serif)}strong{font-weight:600;color:var(--ink)}[hidden]{display:none!important}.skip{position:fixed;top:-100px;left:12px;z-index:100;background:var(--gold-hi);color:#060606;padding:10px 20px}.skip:focus{top:12px}.ambient{position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 80% 3%,rgba(168,117,32,.11),transparent 42%),radial-gradient(ellipse at 3% 60%,rgba(46,119,127,.04),transparent 45%)}.masthead{height:86px;padding:0 clamp(20px,4vw,72px);display:flex;align-items:center;gap:34px;border-bottom:1px solid var(--line);background:rgba(3,3,4,.88);backdrop-filter:blur(18px);position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:12px;font:12px/1.2 var(--mono);letter-spacing:.2em}.brand small{display:block;font-size:8px;letter-spacing:.2em;color:var(--muted);margin-top:5px}.brand-logo{width:36px;height:36px;display:block;flex-shrink:0;border-radius:9px}.masthead nav{display:flex;gap:27px;margin-left:auto;align-items:center}.masthead nav a,.masthead nav button{font-size:13px;color:var(--dim);padding:8px 0}.masthead nav a:hover,.masthead nav button:hover{color:var(--gold-hi)}.container{max-width:1580px;margin:auto;padding:0 clamp(22px,4vw,72px)}.eyebrow{font:10px/1.5 var(--mono);letter-spacing:.2em;color:var(--gold);text-transform:uppercase}.hero{min-height:710px;display:grid;grid-template-columns:.87fr 1.13fr;gap:26px;align-items:center;position:relative;padding-top:50px;padding-bottom:58px}.hero-copy{z-index:2}.hero h1{font-size:clamp(50px,5.5vw,91px);line-height:1.01;letter-spacing:-.04em;margin:26px 0}.hero h1 em{font-weight:400;color:var(--gold-hi)}.hero-copy>p{font-size:18px;line-height:1.7;color:var(--dim);max-width:440px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:29px}.btn{border:1px solid var(--line);border-radius:8px;padding:12px 19px;display:inline-flex;align-items:center;justify-content:center;gap:16px;font-size:14px;transition:border-color .2s,background .2s,transform .2s}.btn:hover{border-color:#d8a94e77;background:#d8a94e0d;transform:translateY(-2px)}.btn.primary{background:var(--gold-hi);color:#18130b;border-color:var(--gold-hi);font-weight:600;box-shadow:0 4px 28px #d8a94e19}.btn.primary:hover{background:#ffe1a1}.btn.small{font-size:12px;padding:8px 13px}.arrow{font-family:var(--sans);font-size:18px}.hero-meta{display:flex;gap:20px;margin-top:28px;font:10px/1.6 var(--mono);color:var(--muted)}.hero-meta span{display:flex;align-items:center;gap:6px}.hero-meta b{color:var(--gold);font-weight:400}.hero-world{min-width:0;position:relative;height:490px;perspective:1600px;display:flex;align-items:center;justify-content:center}.orbit{position:absolute;width:570px;height:570px;max-width:100%;border:1px solid #d8a94e16;border-radius:50%;transform:rotateX(65deg) rotateZ(-23deg);box-shadow:0 0 60px #d8a94e05}.orbit.two{transform:rotateX(22deg) rotateY(63deg) rotateZ(30deg);width:420px;height:420px}.orbit::after{content:"";position:absolute;top:13%;left:13%;height:5px;width:5px;border-radius:50%;background:var(--gold-hi);box-shadow:0 0 20px var(--gold)}.floating-screen{position:relative;width:100%;max-width:760px;border:1px solid #d8a94e50;border-radius:12px;background:#101010;padding:7px;box-shadow:0 42px 90px #000,0 0 70px #d8a94e08;transform:rotateY(-12deg) rotateX(6deg) rotateZ(-2deg);transition:transform .7s var(--ease);transform-style:preserve-3d}.floating-screen:before{content:"";position:absolute;inset:-5px;border:1px solid #d8a94e12;border-radius:16px;transform:translateZ(-12px)}.floating-screen img{width:100%;display:block;border-radius:6px}.float-label{position:absolute;padding:15px 18px;border:1px solid #d8a94e38;border-radius:10px;background:linear-gradient(120deg,#151310ed,#080809ef);box-shadow:0 16px 36px #0008;backdrop-filter:blur(14px);font-size:13px;display:flex;align-items:center;gap:12px;z-index:3;transition:transform .35s}.float-label:hover{transform:translateY(-5px)}.float-label .pip{height:30px;width:30px;display:grid;place-items:center;border-radius:50%;background:#d8a94e15;color:var(--gold);border:1px solid #d8a94e38;font:12px var(--mono)}.float-label small{display:block;font:8px/1.6 var(--mono);letter-spacing:.12em;color:var(--gold)}.float-label.one{top:34px;right:0}.float-label.two{bottom:25px;left:10px}.float-label.three{bottom:38px;right:10px}.hero-world .halo{position:absolute;width:65%;height:50%;border-radius:50%;background:#d8a94e0a;filter:blur(40px)}.start-strip{display:grid;grid-template-columns:1.1fr 1fr 1fr 1fr;border:1px solid var(--line);border-radius:12px;margin-bottom:90px;background:linear-gradient(110deg,#d8a94e08,transparent)}.start-strip>div,.start-strip>a{padding:25px 24px}.start-strip>a{border-left:1px solid var(--line);transition:background .2s}.start-strip>a:hover{background:#d8a94e0c}.start-strip h2{font-size:27px;line-height:1.1;margin:4px 0}.start-strip p{font-size:12px;color:var(--dim)}.start-strip a span{display:block;font-size:14px}.start-strip a small{color:var(--muted);font-size:12px}.start-strip a b{color:var(--gold);font:10px var(--mono);float:right}.library-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:34px}.library-head h2{font-size:clamp(34px,4vw,54px);letter-spacing:-.03em;margin:12px 0}.library-head p{color:var(--dim);font-size:16px}.search{position:relative;max-width:370px;width:100%}.search input{background:#ffffff05;border:1px solid var(--line);border-radius:8px;padding:14px 16px 14px 42px;width:100%;color:var(--ink);font-size:14px}.search:before{content:"⌕";position:absolute;left:15px;top:7px;font-size:25px;color:var(--gold)}input::placeholder{color:var(--muted)}.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:31px}.filter{border:1px solid #d8a94e20;border-radius:999px;padding:7px 13px;font-size:12px;color:var(--dim);transition:.2s}.filter[aria-pressed=true]{background:#d8a94e1a;color:var(--gold-hi);border-color:#d8a94e60}.catalog-group{margin:0 0 55px}.group-heading{display:flex;gap:17px;align-items:center;margin-bottom:18px}.group-heading .chapter{font:13px var(--mono);color:var(--gold);border:1px solid var(--line);border-radius:50%;height:38px;width:38px;display:grid;place-items:center}.group-heading h3{font:29px/1.2 var(--serif)}.group-heading p{color:var(--muted);font-size:13px}.group-heading .count{margin-left:auto;font:10px var(--mono);color:var(--muted)}.lesson-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.lesson-card{border:1px solid var(--line);border-radius:12px;background:linear-gradient(145deg,#ffffff04,#ffffff01);overflow:hidden;position:relative;transition:transform .3s var(--ease),border-color .3s,box-shadow .3s;display:flex;flex-direction:column}.lesson-card:hover{transform:translateY(-6px);border-color:#d8a94e60;box-shadow:0 16px 48px #0008}.card-preview{aspect-ratio:2.1;position:relative;overflow:hidden;padding:20px 25px 0;background:radial-gradient(ellipse at 55% 130%,#d8a94e16,transparent 70%)}.card-preview img{width:100%;border:1px solid #d8a94e26;border-radius:6px;transform:perspective(650px) rotateX(6deg) rotateY(-5deg);box-shadow:0 15px 25px #0009;transition:transform .5s var(--ease)}.lesson-card:hover img{transform:perspective(650px) rotateX(0) rotateY(0) translateY(-4px)}.card-preview:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 65%,#080808)}.card-body{padding:20px 24px 22px;display:flex;flex-direction:column;flex:1}.card-body .eyebrow{font-size:8px;margin-bottom:9px}.card-body h3{font:23px/1.23 var(--serif);margin-bottom:10px;letter-spacing:-.01em}.card-body p{font-size:14px;line-height:1.65;color:var(--dim)}.card-meta{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:23px;font:10px var(--mono);color:var(--muted)}.card-meta .go{color:var(--gold-hi);font-size:18px}.card-status{position:absolute;top:14px;left:14px;z-index:1;background:#10100ded;color:var(--gold-hi);font:9px var(--mono);border:1px solid #d8a94e40;border-radius:20px;padding:5px 10px}.empty{padding:65px 0;color:var(--dim)}.closing{border-top:1px solid var(--line);padding:62px 0 82px;display:flex;gap:30px;justify-content:space-between;align-items:center}.closing h2{font-size:40px;line-height:1.16;margin-bottom:12px}.closing p{color:var(--dim);max-width:600px}.footer{padding:28px clamp(22px,4vw,72px);display:flex;gap:22px;align-items:center;border-top:1px solid var(--line);color:var(--muted);font-size:11px;flex-wrap:wrap}.footer .brand{font-size:10px}.footer p{margin-right:auto}.footer button{font-size:11px;color:var(--dim)}.footer button:hover{color:var(--gold-hi)}.footer>span{font:9px var(--mono)}.loading{padding:60px;text-align:center;color:var(--gold)}
img{height:auto}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* The lesson is an instrument panel: readable instructions alongside a real, clickable screen. */
.lesson-page{max-width:1740px;margin:auto;padding:34px clamp(20px,3.5vw,60px) 65px}.crumbs{display:flex;align-items:center;gap:9px;font:10px var(--mono);color:var(--muted);margin-bottom:21px}.crumbs a:hover{color:var(--gold-hi)}.lesson-title{display:flex;justify-content:space-between;gap:24px;align-items:start;margin-bottom:28px}.lesson-title h1{font-size:clamp(32px,3.2vw,52px);line-height:1.12;letter-spacing:-.03em;margin-bottom:11px}.lesson-title p{color:var(--dim);max-width:800px;font-size:15px}.lesson-tools{display:flex;gap:8px;flex-shrink:0;padding-top:8px}.lesson-tools button{font-size:12px;padding:8px 12px;border:1px solid var(--line);border-radius:7px}.lesson-tools button:hover{border-color:#d8a94e60}.lesson-workspace{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:28px;align-items:start}.screen-column{min-width:0}.screen-chrome{background:#100f0d;border:1px solid #d8a94e40;border-radius:12px;box-shadow:0 25px 80px #0008,0 0 50px #d8a94e03;overflow:hidden}.screen-bar{height:43px;display:flex;align-items:center;padding:0 17px;gap:10px;border-bottom:1px solid #d8a94e20;font:9px var(--mono);letter-spacing:.08em;color:var(--muted)}.screen-bar .dots{display:flex;gap:5px;margin-right:4px}.dots i{width:5px;height:5px;background:#d8a94e60;border-radius:50%}.screen-bar button{margin-left:auto;font-size:10px;letter-spacing:0;color:var(--gold-hi);padding:7px}.screen-stage{position:relative;line-height:0;background:#181818;aspect-ratio:1.6}.screen-stage>img{width:100%;height:auto;display:block}.screen-caption{display:flex;justify-content:space-between;align-items:start;gap:16px;font-size:11px;color:var(--muted);line-height:1.55;padding:15px 2px}.screen-caption .marker-hint{color:var(--gold);white-space:nowrap;font:9px/1.8 var(--mono)}.anchor-crop{margin-top:7px;border:1px solid var(--line);border-radius:10px;display:flex;min-height:150px;overflow:hidden;background:#ffffff03}.detail-window{flex:0 0 58%;position:relative;overflow:hidden;height:155px;border-right:1px solid var(--line);background:#181818}.detail-window img{position:absolute;max-width:none;pointer-events:none}.detail-window .detail-crosshair{position:absolute;left:50%;top:50%;width:48px;height:42px;transform:translate(-50%,-50%);border:1px solid #f0c873a0;border-radius:7px;box-shadow:0 0 0 999px #0002}.detail-caption{padding:20px 18px;align-self:center}.detail-caption b{display:block;font:9px/1.6 var(--mono);letter-spacing:.1em;color:var(--gold);margin-bottom:6px}.detail-caption p{font-size:13px;line-height:1.5;color:var(--dim)}.instruction{border:1px solid var(--line);background:linear-gradient(150deg,#d8a94e09,#ffffff02);border-radius:12px;padding:27px 28px}.step-count{display:flex;justify-content:space-between;align-items:center;font:9px var(--mono);letter-spacing:.15em;color:var(--gold);margin-bottom:15px}.step-progress{display:flex;gap:4px;margin-bottom:25px}.step-progress button{flex:1;height:4px;padding:0;background:#d8a94e22;border-radius:9px}.step-progress button.visited{background:#d8a94e70}.step-progress button.current{background:var(--gold-hi);box-shadow:0 0 12px #d8a94e40}.instruction h2{font:29px/1.18 var(--serif);letter-spacing:-.02em;margin-bottom:18px}.instruction .explanation{font-size:16px;line-height:1.8;color:var(--dim)}.checkpoint{margin-top:24px;border-top:1px solid var(--line);padding-top:20px}.checkpoint .eyebrow{font-size:8px;color:var(--cyan);letter-spacing:.13em;margin-bottom:8px}.checkpoint p{font-size:14px;color:var(--ink);line-height:1.65}.tip{margin-top:18px;background:#d8a94e07;border-left:2px solid #d8a94e60;padding:11px 13px;font-size:13px;line-height:1.7;color:var(--dim)}.step-nav{display:flex;gap:10px;margin-top:24px}.step-nav>.btn{flex:1;padding:11px 12px;font-size:13px}.shortcuts{font:9px/1.5 var(--mono);color:var(--muted);text-align:center;margin-top:13px}.lesson-prep{font-size:12px;color:var(--dim);line-height:1.7;padding:20px 4px}.lesson-prep b{color:var(--gold);font-weight:400}.step-list{margin-top:12px;border-top:1px solid var(--line);padding-top:20px}.step-list h3{font:10px var(--mono);letter-spacing:.12em;color:var(--muted);margin-bottom:12px}.step-row{width:100%;display:flex;text-align:left;gap:11px;align-items:center;padding:9px 12px;border-radius:6px;margin-bottom:3px;color:var(--dim);font-size:12px;border:1px solid transparent;line-height:1.5}.step-row span{font:10px var(--mono);color:var(--muted)}.step-row[aria-current=step]{background:#d8a94e0c;border-color:var(--line);color:var(--gold-hi)}.step-row:hover{background:#ffffff05}.lesson-below{margin-top:33px;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:28px}.lab{border:1px solid #d8a94e38;border-radius:12px;background:linear-gradient(125deg,#d8a94e09,transparent);padding:28px}.lab h2{font:28px/1.25 var(--serif);margin:9px 0}.lab>p{font-size:14px;color:var(--dim);max-width:680px}.lab-controls{display:flex;gap:22px;flex-wrap:wrap;align-items:center;margin-top:24px}.lab-controls label{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--dim)}input[type=range]{accent-color:var(--gold);max-width:140px}input[type=checkbox]{accent-color:var(--gold);width:17px;height:17px}select{background:#15130f;border:1px solid var(--line);border-radius:5px;color:var(--ink);padding:7px;max-width:100%}.result-line{margin-top:20px;padding:18px;background:#0004;border:1px solid var(--line);border-radius:8px;font-size:15px}.result-line b{color:var(--gold-hi)}.lab-flow{display:flex;align-items:stretch;gap:10px;margin-top:22px}.flow-node{flex:1;border:1px solid #d8a94e30;border-radius:9px;padding:16px 13px;background:#0004}.flow-node small{font:8px var(--mono);color:var(--gold);display:block;margin-bottom:8px;letter-spacing:.1em}.flow-node p{font-size:13px;line-height:1.5}.flow-arrow{align-self:center;color:var(--gold);font-size:20px}.quiz{border:1px solid var(--line);border-radius:12px;padding:25px}.quiz h2{font:25px/1.2 var(--serif);margin:10px 0 20px}.quiz button{display:block;width:100%;border:1px solid var(--line);background:#ffffff03;border-radius:8px;text-align:left;padding:11px 13px;font-size:13px;margin-top:8px;color:var(--dim)}.quiz button:hover,.quiz button[aria-pressed=true]{border-color:#d8a94e80;color:var(--gold-hi)}.quiz-feedback{font-size:13px;color:var(--ink);margin-top:15px;line-height:1.65}.finish-panel{padding:28px;border:1px solid var(--line);border-radius:12px;background:#d8a94e06}.finish-panel h2{font:29px var(--serif);margin:10px 0}.finish-panel p{color:var(--dim);font-size:14px;margin-bottom:20px}.finish-panel .btn{width:100%;margin-top:9px}.related{margin-top:50px}.related h2{font-size:31px;margin-bottom:18px}.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.related-card{border:1px solid var(--line);border-radius:8px;padding:19px;font-size:14px;color:var(--dim);transition:.2s}.related-card:hover{color:var(--gold-hi);border-color:#d8a94e60}.related-card small{display:block;font:9px var(--mono);color:var(--gold);margin-bottom:6px}.full-lesson{margin-top:30px;border-top:1px solid var(--line);padding-top:20px}.full-lesson summary{color:var(--gold);cursor:pointer;font-size:13px;padding:8px}.full-lesson article{padding:22px 14px;max-width:900px;border-bottom:1px solid var(--line)}.full-lesson h3{font:26px var(--serif);margin-bottom:14px}.full-lesson p{color:var(--dim);font-size:16px;margin-bottom:10px}.full-lesson .check{font-size:14px;color:var(--ink)}
dialog{background:#0a0909;color:var(--ink);border:1px solid #d8a94e40;border-radius:15px;padding:0;width:min(750px,94vw);max-width:none;max-height:92svh;box-shadow:0 30px 130px #000c}dialog::backdrop{background:#000b;backdrop-filter:blur(12px)}dialog.zoom{width:96vw;height:92svh}.dialog-head{padding:24px 28px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px}.dialog-head h2{font:30px var(--serif)}.dialog-close{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);font-size:20px;flex-shrink:0}.dialog-close:hover{color:var(--gold-hi)}.dialog-content{padding:25px 28px}.dialog-content p{color:var(--dim);margin-bottom:17px}.dialog-content .search{max-width:none;margin-bottom:20px}.glossary{display:grid;grid-template-columns:1fr 1fr;gap:20px 25px;max-height:56svh;overflow:auto;padding:5px 4px}.glossary dt{color:var(--gold-hi);font-size:15px;margin-bottom:5px}.glossary dd{margin:0;color:var(--dim);font-size:13px;line-height:1.7}.zoom-body{padding:15px 22px;overflow:auto;height:calc(92svh - 90px)}.zoom-body .screen-stage{width:1600px;max-width:none}.zoom-note{color:var(--dim);font-size:12px;margin-bottom:12px}.toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,20px);border:1px solid #d8a94e60;border-radius:9px;background:#15130ff2;padding:12px 20px;color:var(--ink);z-index:50;opacity:0;transition:.3s;font-size:13px;max-width:90vw;text-align:center;pointer-events:none}.toast.show{transform:translate(-50%,0);opacity:1}.fade-in{animation:appear .5s var(--ease) both}@keyframes breathe{50%{opacity:.35;transform:scale(1.12)}}@keyframes appear{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(min-width:1550px){.lesson-workspace,.lesson-below{grid-template-columns:minmax(0,1fr) 410px}.instruction .explanation{font-size:17px}}
@media(max-width:1100px){.hero{min-height:630px;gap:15px}.hero-world{height:380px}.float-label{padding:10px 12px;font-size:11px}.float-label.three{display:none}.hero h1{font-size:65px}.lesson-workspace,.lesson-below{grid-template-columns:minmax(0,1fr) 330px;gap:18px}.instruction{padding:23px}.instruction h2{font-size:26px}.instruction .explanation{font-size:15px}.lesson-title{flex-direction:column}.lesson-tools{padding-top:0}.detail-window{flex-basis:50%}.start-strip>div,.start-strip>a{padding:20px 17px}}
@media(max-width:820px){.masthead{height:74px;padding:0 22px;gap:15px}.masthead nav{gap:18px}.masthead nav a,.masthead nav button{font-size:12px}.masthead .brand small{display:none}.hero{grid-template-columns:1fr;padding-top:55px;gap:10px;padding-bottom:15px}.hero h1{font-size:70px}.hero-copy>p{max-width:570px}.hero-world{height:405px;margin:0 15px}.floating-screen{max-width:650px}.float-label.one{top:12px}.float-label.two{bottom:12px}.start-strip{grid-template-columns:1fr 1fr;margin-bottom:65px}.start-strip>a:nth-child(3){border-left:0;border-top:1px solid var(--line)}.start-strip>a:nth-child(4){border-top:1px solid var(--line)}.lesson-grid{grid-template-columns:repeat(2,1fr)}.library-head{align-items:start;flex-direction:column;gap:20px}.search{max-width:none}.lesson-workspace,.lesson-below{grid-template-columns:1fr}.lesson-sidebar{grid-row:1}.screen-column{grid-row:2}.step-list{display:none}.instruction h2{font-size:29px}.instruction .explanation{font-size:16px}.step-nav{margin-top:20px}.shortcuts{display:none}.lesson-below .quiz{order:2}.closing{align-items:start;flex-direction:column}.related-grid{grid-template-columns:1fr 1fr}.detail-window{flex-basis:60%}.anchor-crop{margin-top:10px}.lesson-prep{padding:15px 4px}.screen-caption .marker-hint{display:none}.footer{gap:17px}.footer p{display:none}}
@media(max-width:520px){.brand{font-size:10px;gap:8px;letter-spacing:.1em}.brand-logo{width:29px;height:29px;border-radius:7px}.masthead nav{gap:15px}.masthead nav #resumeNav{display:none}.hero h1{font-size:55px}.hero-copy>p{font-size:16px}.hero-world{height:280px;margin:0}.float-label.one{top:3px;right:-8px}.float-label.two{bottom:1px;left:0}.float-label{padding:9px;font-size:10px}.float-label .pip{height:24px;width:24px}.hero-meta{font-size:9px;gap:16px}.start-strip{margin-top:15px}.start-strip h2{font-size:24px}.start-strip>div,.start-strip>a{padding:17px 15px}.start-strip a span{font-size:13px}.start-strip a small{font-size:11px}.library-head h2{font-size:39px}.library-head p{font-size:14px}.lesson-grid{grid-template-columns:1fr}.card-preview{aspect-ratio:2.3;padding:18px 24px 0}.card-body h3{font-size:25px}.group-heading h3{font-size:23px}.group-heading .count{display:none}.group-heading p{font-size:12px}.group-heading .chapter{flex-shrink:0}.filters{gap:7px}.filter{font-size:11px;padding:7px 11px}.lesson-page{padding:23px 17px 40px}.lesson-title{margin-bottom:20px}.lesson-title h1{font-size:35px}.lesson-title p{font-size:14px}.lesson-tools{flex-wrap:wrap}.lesson-tools button{font-size:11px}.instruction{padding:22px}.instruction h2{font-size:28px}.instruction .explanation{font-size:15px}.checkpoint p{font-size:14px}.anchor-crop{flex-direction:column}.detail-window{flex-basis:auto;border-right:0;border-bottom:1px solid var(--line)}.detail-caption{padding:12px 17px;width:100%}.detail-caption b{display:inline;margin-right:9px}.detail-caption p{display:inline;font-size:12px}.screen-bar{font-size:8px;padding:0 11px}.screen-bar .dots{display:none}.screen-caption{font-size:10px}.lab{padding:22px}.lab-controls{gap:17px}.lab-controls label{flex-wrap:wrap}.lab-flow{gap:6px}.flow-node{padding:12px 8px}.flow-node p{font-size:11px}.flow-arrow{font-size:16px}.related-grid{grid-template-columns:1fr}.glossary{grid-template-columns:1fr}.dialog-head{padding:20px}.dialog-head h2{font-size:26px}.dialog-content{padding:22px}.footer>span{display:none}}
@media(max-width:520px){.hero-world .orbit{width:280px;height:280px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.floating-screen,.card-preview img{transform:none!important}.lesson-card:hover,.btn:hover{transform:none}}
/* Labels stay outside the real interface; only an unfilled outline and arrow touch it. */
.annotation-rail{padding:10px 0;background:linear-gradient(110deg,#d8a94e09,#0d0c0a);border-bottom:1px solid var(--line);line-height:1.4}
.annotation-rail.below{border-bottom:0;border-top:1px solid var(--line)}
.annotation-label{position:relative;left:clamp(170px,var(--label-x),calc(100% - 170px));transform:translateX(-50%);width:320px;max-width:calc(100% - 24px);padding:2px 12px;text-align:center;display:grid;gap:4px;color:var(--gold-hi)}
.annotation-label>span:first-child{font:8px/1.4 var(--mono);letter-spacing:.13em;color:var(--muted)}
.annotation-label b{font:500 12px/1.45 var(--sans);overflow-wrap:anywhere}.annotation-label>span:last-child{display:none}
.screen-target{position:absolute;z-index:2;padding:0;background:transparent!important;border:1.5px solid var(--gold-hi);border-radius:3px;box-shadow:0 0 0 1px #09090970;transition:border-color .2s}
.screen-target:hover{border-color:#fff0c4}.screen-target:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
.annotation-arrow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;color:var(--gold-hi)}
.annotation-arrow path{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}.annotation-arrow .pointer-line{opacity:.85}
.screen-steps{display:flex;gap:6px;flex-wrap:wrap;padding:12px 14px;border-top:1px solid var(--line);line-height:1.4;background:#0b0a08}
.screen-steps button{padding:6px 9px;border:1px solid transparent;border-radius:5px;font-size:11px;color:var(--dim);text-align:left}.screen-steps button span{font:9px var(--mono);color:var(--muted);margin-right:7px}
.screen-steps button:hover,.screen-steps button[aria-current=step]{border-color:var(--line);background:#d8a94e08;color:var(--gold-hi)}
.lesson-sidebar{min-width:0;display:grid;gap:14px}.lesson-position{font:9px/1.6 var(--mono);letter-spacing:.08em;color:var(--dim);margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--line)}
#stepTitle:focus{outline:none}
.course-panel{border:1px solid var(--line);border-radius:12px;padding:22px 25px;background:linear-gradient(145deg,#d8a94e08,#ffffff02)}
.course-panel .eyebrow{font-size:8px}.course-panel h2{font:26px/1.2 var(--serif);margin:9px 0 5px}.course-panel h2 span{color:var(--muted);font-size:19px}
.course-current{font-size:13px;line-height:1.5;color:var(--ink)}.course-total{margin:15px 0 17px;font:10px/1.5 var(--mono);color:var(--muted)}
.course-total progress{display:block;width:100%;height:3px;margin-top:9px;appearance:none;border:0;border-radius:5px;overflow:hidden;background:#d8a94e20}.course-total progress::-webkit-progress-bar{background:#d8a94e20}.course-total progress::-webkit-progress-value{background:var(--gold)}
.course-panel .btn{width:100%;font-size:12px;padding:10px 13px;margin-top:8px}.course-panel .btn[disabled]{opacity:.7;color:var(--cyan);border-color:#4fd8e830}
.course-panel .next-lesson{justify-content:space-between;background:#d8a94e0a;border-color:#d8a94e45}.next-lesson-title{font-size:11px;line-height:1.5;color:var(--dim);margin:7px 0 12px;overflow-wrap:anywhere}
.course-panel .choose-lesson{border-top:1px solid var(--line)}.progress-note{font-size:10px;line-height:1.6;color:var(--muted);margin-top:12px}.course-end{font-size:13px;line-height:1.7;color:var(--gold-hi);margin:15px 0 8px}
.picker-list{max-height:49svh;overflow:auto;overscroll-behavior:contain;padding-right:6px}.picker-group+ .picker-group{margin-top:20px}.picker-group h3{font:11px/1.5 var(--mono);color:var(--gold);padding:9px 0;letter-spacing:.03em}
.dialog-content .search{display:block}
.picker-row{display:flex;align-items:center;gap:13px;width:100%;padding:13px 11px;border:1px solid transparent;border-bottom-color:#d8a94e12;border-radius:7px;text-align:left}
.picker-row:hover{background:#d8a94e06;border-color:var(--line)}.picker-row[aria-current=page]{border-color:#d8a94e60;background:#d8a94e0a}
.picker-number{font:10px var(--mono);color:var(--muted)}.picker-name{flex:1;font-size:14px;line-height:1.45}.picker-name small{display:block;font:10px/1.6 var(--sans);color:var(--muted);margin-top:4px}
.picker-status{font:10px/1.4 var(--mono);color:var(--muted);white-space:nowrap}.picker-status.done{color:var(--cyan)}.picker-library{display:block;margin-top:20px;padding-top:15px;border-top:1px solid var(--line);font-size:12px;color:var(--gold-hi)}
.mission-lab>.btn,#missionPractice>.btn{margin-top:23px}.practice-graph{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:25px}
.practice-node{position:relative;text-align:left;padding:18px;border:1px solid var(--line);border-radius:9px;background:#050504;display:grid;gap:10px;min-width:0}.practice-node[aria-pressed=true]{border-color:var(--gold);background:#d8a94e09}.practice-node b{font-size:14px;font-weight:500}.practice-node small{font:8px/1.5 var(--mono);color:var(--muted);letter-spacing:.08em}.practice-node.table{grid-column:1/-1;grid-row:3}.practice-node.check{grid-column:1/-1;grid-row:5}
.graph-join,.graph-check{grid-column:1/-1;text-align:center;font:10px/1.6 var(--mono);color:var(--gold);padding:7px 12px;border-left:1px solid var(--line);border-right:1px solid var(--line);margin:0 20%}.graph-join{grid-row:2}.graph-check{grid-row:4}.node-state{font:10px var(--mono);color:var(--dim)}.node-state.done{color:var(--cyan)}.node-state.blocked{color:#ffa16c}.node-state.ready{color:var(--gold-hi)}
.practice-explanation{margin:18px 0;padding:15px;border:1px solid var(--line);border-radius:8px;font-size:14px;color:var(--dim);background:#0004;min-height:78px}.practice-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.practice-actions .btn{font-size:12px}.practice-complete{color:var(--cyan);font-size:13px}.practice-history{margin-top:15px;font-size:12px;color:var(--muted)}
@media(max-width:820px){.lesson-sidebar{grid-row:1}.course-panel{padding:21px 23px}.annotation-label{left:50%;transform:translateX(-50%)}.screen-steps{padding:10px}.screen-steps button{font-size:10px}}
@media(max-width:520px){.annotation-label{left:50%}.annotation-label b{font-size:11px}.picker-row{gap:9px;padding:12px 6px}.picker-name{font-size:12px}.picker-status{font-size:8px}.picker-list{padding-right:1px}.picker-filters{gap:6px;margin-bottom:15px}}
@media print{body{background:white;color:#111}.masthead,.footer,.ambient,.lesson-workspace,.lesson-below,.lesson-tools,.related,.crumbs{display:none}.lesson-title p,.full-lesson p,.full-lesson .check{color:#222}.full-lesson{display:block}.full-lesson article{break-inside:avoid}.full-lesson summary{display:none}.full-lesson h3{color:#111}.lesson-page{padding:0}.full-lesson:not([open])>article{display:block}}

/* The primary bar matches the rest of the website; learning controls stay separate. */
body{padding-top:62px}.masthead{top:62px;height:64px}.guide-title{font:12px var(--mono);color:var(--gold);letter-spacing:.08em;white-space:nowrap}.masthead nav{gap:24px}
@media(max-width:700px){.masthead{padding:0 17px;gap:12px}.guide-title{font-size:10px}.masthead nav{gap:14px}.masthead nav a,.masthead nav button{font-size:11px}}
@media(max-width:390px){.guide-title{display:none}.masthead nav{margin-left:0;justify-content:space-between;width:100%}}
