:root{--bg:#0b1011;--surface:#12191a;--surface2:#182122;--line:#293638;--text:#e9e6d9;--muted:#95a8a5;--gold:#e4ba70;--cyan:#86bbbc;--red:#c65b4b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,'Segoe UI',Arial,sans-serif;font-size:13px}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:3px}#app{min-height:100dvh;max-width:1800px;margin:auto;display:flex;flex-direction:column}.top{display:flex;align-items:center;justify-content:space-between;padding:23px 30px 21px;border-bottom:1px solid var(--line);background:linear-gradient(120deg,#121a1c,#0b1112)}.identity{display:flex;gap:20px;align-items:center}.emblem{display:grid;place-items:center;width:50px;height:50px;border:1px solid #5b5140;color:var(--gold);font-size:33px}.eyebrow{font-size:10px;color:var(--gold);letter-spacing:2.2px}.top h1{font-family:Georgia,'Times New Roman',serif;font-weight:normal;letter-spacing:1.2px;font-size:28px;margin:5px 0 3px}.top h1 span{color:var(--gold)}.top p{color:var(--muted);margin:0;font-size:11px}.top-right{display:flex;gap:15px;align-items:center}.tag{border:1px solid #5b513f;padding:8px 10px;color:#cfc1a8;font-size:9px;letter-spacing:1.1px}.perf{color:var(--cyan);font-size:10px;letter-spacing:1px}.modes{display:flex;gap:8px;padding:12px 22px;border-bottom:1px solid var(--line);background:#101718}.modes button{background:transparent;color:var(--muted);border:1px solid transparent;padding:11px 18px;border-radius:4px;transition:.15s}.modes button:hover{border-color:#53605b;color:#fff}.modes button.active{background:#3a3126;border-color:#907044;color:var(--gold)}.workspace{display:grid;grid-template-columns:272px minmax(340px,1fr) 285px;min-height:630px;flex:1}.panel{background:#11191a;padding:22px 18px}.left{border-right:1px solid var(--line)}.right{border-left:1px solid var(--line)}.heading{display:flex;justify-content:space-between;align-items:center;color:var(--gold);padding-bottom:14px;border-bottom:1px solid var(--line)}.small{font-size:10px;letter-spacing:1.35px}.tiny{font-size:9px;letter-spacing:1.2px;color:#859995}.mode-head{padding:20px 0 14px}.mode-head b{font:19px Georgia,serif}.mode-head p{color:#9cacaa;font-size:12px;line-height:1.65}.control{padding:15px 0;border-top:1px solid #273334}.control label{display:flex;justify-content:space-between;color:#c7d0c9;font-size:11px;letter-spacing:.35px;margin-bottom:13px}.control output{color:var(--gold);font-variant-numeric:tabular-nums}input[type=range]{width:100%;height:4px;accent-color:var(--gold);cursor:pointer}.lodControl{border-top:1px solid var(--line);padding:17px 0}.lodControl label{display:block;margin-bottom:11px;color:#c7d0c9}select{width:100%;background:#172122;color:#eae5d7;border:1px solid #3b4949;padding:10px}.info-card{background:#20211d;padding:14px;border-left:2px solid var(--gold)}.info-card p{font-size:11px;line-height:1.6;color:#c2c0b4;margin:8px 0 0}.stage-nav{display:flex;gap:6px;margin:10px 0}.stage-nav button{width:50%;padding:8px;color:var(--gold);background:#24302e;border:1px solid #45544c}.stage-nav button:disabled{opacity:.4}#stageName{line-height:1.4;color:var(--muted)}.scene-wrap{position:relative;min-height:630px;overflow:hidden;background:radial-gradient(circle at 50% 35%,#334042,#121b1e 70%)}#viewport{display:block;width:100%;height:100%;touch-action:none;cursor:grab;position:absolute;inset:0}#viewport:active{cursor:grabbing}.scene-overlay{position:absolute;pointer-events:none;inset:18px 20px auto;display:flex;justify-content:space-between;align-items:center}.live{color:#c3e8d5;border:1px solid #5d7e70;background:#1b3029ba;padding:7px 9px;font-size:9px;letter-spacing:1px}.scene-direction{color:#afbfba;font-size:9px;letter-spacing:.6px}.scene-direction span{color:var(--gold);margin:0 4px}.tools{position:absolute;right:17px;bottom:48px;display:flex;flex-wrap:wrap;max-width:370px;gap:5px;justify-content:flex-end}.tools button{background:#101c1ed9;border:1px solid #3f5755;color:#e0e5d9;padding:8px 9px;border-radius:4px;backdrop-filter:blur(10px);font-size:10px}.tools button:hover{background:#344442}.hud-bottom{display:flex;justify-content:space-between;position:absolute;bottom:0;left:0;right:0;background:#101719c9;padding:12px 20px;font-size:9px;letter-spacing:1.5px;color:#93b3ae}.right .readout-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:20px 0}.reading{padding:13px 8px;background:#1d2929;border:1px solid #344442;min-height:78px}.reading span{display:block;font-size:9px;letter-spacing:.5px;color:#9eb6af;line-height:1.4}.reading strong{display:block;color:#f4e5c7;font:22px Georgia,serif;margin-top:9px;white-space:nowrap}.formula{background:#142324;padding:15px;border-left:2px solid #688e8b}.formula span{font-size:9px;color:#b7c5bd;letter-spacing:1px}.formula code{display:block;font-size:15px;margin:12px 0;color:#eec58b}.formula p{font-size:11px;color:var(--muted);line-height:1.6;margin:0}.component-heading{margin-top:22px}.selected{padding:18px 0}.part-cat{font-size:9px;color:var(--gold);letter-spacing:1px}.selected h2{font:19px Georgia,serif;margin:8px 0}.selected p{font-size:11px;color:#a9bcb6;line-height:1.75}.part-props{color:#c6c9bd;font-size:10px;line-height:1.7}.part-props b{color:var(--gold)}.quiz-button{border:1px solid #b48d52;background:#5c442a;color:#ffe8bc;padding:13px;font-weight:600;font-size:10px;letter-spacing:.8px;width:100%}.loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#101b1fe8;z-index:4;gap:12px}.loading b{font:24px Georgia,serif}.loading span{font-size:11px;color:#a8bdb8}.bar{width:210px;height:3px;background:#334543;overflow:hidden}.bar i{display:block;width:45%;height:100%;background:var(--gold);animation:loading 1.8s infinite}@keyframes loading{from{transform:translateX(-120%)}to{transform:translateX(260%)}}.error{position:absolute;z-index:5;top:25%;left:10%;right:10%;padding:18px;background:#3b2422;border:1px solid #ad6961;color:#fff;line-height:1.5}footer{padding:13px 28px;border-top:1px solid var(--line);font-size:9px;color:#859c97;letter-spacing:1.3px;display:flex;justify-content:space-between}.modal[hidden],.loading[hidden],.control[hidden],.error[hidden]{display:none!important}.modal{position:fixed;inset:0;z-index:30;background:#071010ed;display:grid;place-items:center;padding:20px}.quiz-card{position:relative;width:min(530px,100%);background:#162021;border:1px solid #5e6a5f;box-shadow:0 20px 60px #0008;padding:36px}.quiz-card h2{font:24px Georgia,serif;line-height:1.3}.quiz-card .close{position:absolute;right:18px;top:17px;color:#fff;background:none;border:none;font-size:19px}.quiz-card #answers{display:grid;gap:9px}.quiz-card #answers button{display:block;text-align:left;background:#263334;border:1px solid #465652;color:#e3e4d7;padding:12px}.quiz-card #answers button.selected{border-color:var(--gold);background:#58452e}.quiz-card #answers button.correct{background:#275044}.quiz-card #answerHelp{color:#becec3;line-height:1.65;min-height:30px}.quiz-card #advanceQuiz{padding:10px 18px;background:var(--gold);border:0;color:#222}body.capture .panel,body.capture .top,body.capture .modes,body.capture footer,body.capture .tools,body.capture .scene-overlay,body.capture .hud-bottom{display:none!important}body.capture .workspace{display:block;height:100vh;min-height:100vh}body.capture .scene-wrap{height:100vh}body.capture #viewport{height:100vh}
@media(max-width:1150px){.workspace{grid-template-columns:234px minmax(300px,1fr) 240px}.panel{padding:14px}.reading strong{font-size:18px}.modes button{padding:10px 12px}}@media(max-width:920px){.workspace{grid-template-columns:260px minmax(0,1fr)}.right{grid-column:1/-1;border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:16px}.right .readout-grid{margin:0}.right .heading:nth-of-type(1){grid-column:1/-1}.right .component-heading{grid-column:1/-1;margin-top:0}.right .selected{padding:0}.right .quiz-button{align-self:start}.top h1{font-size:22px}}@media(max-width:640px){.top{padding:14px;gap:8px}.emblem{width:38px;height:38px;font-size:24px}.identity{gap:9px}.top h1{font-size:16px}.top p{font-size:9px}.eyebrow{font-size:8px}.tag{display:none}.modes{overflow-x:auto;gap:4px;padding:8px;white-space:nowrap}.modes button{flex:1;padding:9px 11px;font-size:11px}.workspace{display:flex;flex-direction:column}.scene-wrap{order:0;min-height:410px;height:57vh}.left{order:1;border-right:0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:7px 15px}.left .heading,.left .mode-head,.left .info-card{grid-column:1/-1}.left .control{padding:10px 0}.left .lodControl{grid-column:1/-1}.right{order:2;display:block}.right .readout-grid{grid-template-columns:repeat(3,1fr);margin:14px 0}.reading{min-height:67px;padding:9px 5px}.reading strong{font-size:16px}.reading span{font-size:8px}.scene-direction{display:none}.tools{left:10px;right:10px;max-width:initial;bottom:43px;justify-content:center}.tools button{padding:7px;font-size:9px}.identity{align-items:start}footer{padding:10px;gap:8px;flex-wrap:wrap}.top-right{align-self:start}.perf{font-size:8px}}

.article-link{font-size:10px;color:var(--gold);white-space:nowrap;text-decoration:none;border-bottom:1px solid #856e48;padding:8px 0}.essay{max-width:950px;margin:0 auto;padding:54px 27px 100px;line-height:1.76;color:#c6d2ce;font-size:15px}.essay-brow{font-size:10px;letter-spacing:2px;color:var(--gold);margin-bottom:20px}.essay h1{font:37px Georgia,serif;color:#f0e5d0;line-height:1.18}.essay h2{font:25px Georgia,serif;color:var(--gold);margin-top:44px}.essay h3{font:18px Georgia,serif;color:#ead4ad;margin-top:28px}.essay p{margin:15px 0}.essay strong{color:#f8e3b5}.essay a{color:#bce2da;overflow-wrap:anywhere}.essay li{margin-bottom:8px}.essay code{color:#d8d3a1;overflow-wrap:anywhere}.essay blockquote{border-left:2px solid #ae8a53;margin:25px 0;padding-left:20px}.essay img{max-width:100%}body.capture .essay{display:none!important}@media(max-width:640px){.essay{padding:35px 17px 60px;font-size:14px}.essay h1{font-size:30px}.essay h2{font-size:23px}.article-link{font-size:8px}}
.essay{overflow-wrap:anywhere;word-break:normal}.essay p,.essay li{max-width:100%}.top .identity{min-width:0}.top-right{flex-shrink:0}
