:root{color-scheme:dark;font-family:Trebuchet MS,Arial,sans-serif;background:#0a1920;color:#edf1df;--gold:#efcb76;--line:#294047;--muted:#9eb3b7}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 20% 0,#1a3539,transparent 55%)}main{max-width:1390px;margin:auto;padding:24px 40px}button,select,input{font:inherit}button,select{border:1px solid var(--line);background:#153039;color:inherit;border-radius:9px;padding:10px 13px}button{cursor:pointer;transition:background .15s,transform .15s}button:hover{background:#2a4b50;transform:translateY(-1px)}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:3px}button:disabled{opacity:.4;cursor:default;transform:none}a{color:var(--gold)}header{display:flex;justify-content:space-between;align-items:center;padding-bottom:22px;border-bottom:1px solid var(--line)}.brand{text-decoration:none;display:flex;align-items:center;gap:14px;color:#f6efce;letter-spacing:3px;font-size:17px}.brand b{font-weight:400;color:#92c0ba}.brandmark{font-size:40px}.brand small{display:block;font-size:9px;letter-spacing:2.7px;color:var(--muted);margin-top:8px}.header-right{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--muted)}.intro{display:flex;align-items:center;justify-content:space-between;padding:32px 0 28px}.eyebrow{font-size:10px;letter-spacing:2.2px;color:var(--gold);margin:0 0 14px}h1{font-family:Georgia,serif;font-weight:400;letter-spacing:-1px;font-size:43px;line-height:1.1;margin:0 0 14px}.intro p:last-child{color:var(--muted);font-size:14px}.chapter{width:270px;display:grid;gap:10px}.chapter small{color:var(--gold);font-size:10px;letter-spacing:2px}.chapter label{font-size:13px;color:var(--muted)}.workspace{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(340px,1fr);border:1px solid #385352;border-radius:18px;overflow:hidden;box-shadow:0 25px 65px #0005}.garden{position:relative;min-width:0;min-height:630px;background:#0c222b url('conservatory.webp') center/cover}.garden:before{content:'';position:absolute;inset:0;background:linear-gradient(#061a21bb,transparent 35%,#061a2144 70%,#061a21ee);pointer-events:none}.mission{position:absolute;z-index:1;top:26px;left:28px;right:20px}.mission span{font-size:10px;letter-spacing:2px;color:var(--gold)}h2{font-family:Georgia,serif;font-weight:400;font-size:25px;margin:10px 0}.mission p{font-size:13px;color:#c7dcd7;max-width:420px;line-height:1.5}.garden canvas{display:block;width:100%;height:auto;position:relative;margin-top:55px}.board-footer{position:absolute;bottom:22px;left:24px;right:24px;display:flex;justify-content:space-between;font-size:11px;color:#a9c6c6}.board-footer #seeds{color:var(--gold);font-size:13px}aside{padding:25px;background:#10252c;min-width:0}.panel-head{display:flex;align-items:center;justify-content:space-between}.panel-head h2{font-size:23px;margin:0}.panel-head .eyebrow{margin-bottom:9px;font-size:9px}.panel-head>span{font-size:12px;color:var(--gold)}.muted{color:var(--muted);font-size:12px;line-height:1.6}#program{min-height:108px;max-height:180px;overflow:auto;background:#091a20;border:1px solid #294047;border-radius:10px;display:flex;align-content:flex-start;flex-wrap:wrap;gap:6px;padding:12px;margin:18px 0 9px}#program:empty:before{content:'A good journey starts with one command.';color:#6b8b90;font-size:12px;padding:20px 10px;line-height:1.6}.token{font-size:12px;border-color:#3e5556;padding:8px;color:#d9e8df}.token small{color:#97adae;margin-right:6px}.token.active{border-color:var(--gold);background:#66552d}.editbar{display:flex;justify-content:space-between}.editbar button,#hint{background:transparent;border:0;padding:5px 0;color:#b8cfca;font-size:12px}.palette{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:20px 0 15px}.palette button{font-size:11px;text-align:left;padding:10px}.palette b{font-size:24px;color:var(--gold);display:block;margin-bottom:6px;font-weight:400}.palette kbd{float:right;font-size:9px;color:#8aacae}.loop{display:grid;gap:8px;font-size:11px;color:var(--muted);padding:12px;background:#173039;border-radius:8px}.loop select{padding:3px;border-radius:4px}.loop button{float:right;padding:4px 12px;font-size:11px}.runbar{display:flex;gap:8px;margin-top:20px}.runbar button{font-size:12px;padding:12px}.runbar #run{flex:1;background:var(--gold);color:#182c2d;font-weight:bold;border-color:var(--gold)}.speed{display:flex;gap:12px;align-items:center;font-size:10px;color:var(--muted);margin-top:17px}.speed input{flex:1;width:80px;accent-color:var(--gold)}#status{min-height:36px;line-height:1.6;font-size:12px;color:#b4d4c4}#hint{color:var(--gold)}#hintText{font-size:11px;color:var(--muted);line-height:1.6;margin-bottom:0}footer{display:flex;justify-content:space-between;font-size:10px;color:#819b9f;gap:20px;padding:22px 0}footer a{text-decoration:none}dialog{background:#112c32;color:#e5eee1;border:1px solid #607569;border-radius:18px;max-width:580px;line-height:1.7;padding:32px;box-shadow:0 30px 100px #000b}dialog::backdrop{background:#000b;backdrop-filter:blur(7px)}dialog p,dialog li{font-size:13px}dialog li{padding-bottom:8px}#closeHelp{float:right}#begin{background:var(--gold);color:#152b30}#victory{position:absolute;z-index:3;left:15%;right:15%;top:32%;padding:25px;text-align:center;border:1px solid #c6ac6b;border-radius:18px;background:#0c272df0;box-shadow:0 20px 80px #000b}#victory[hidden]{display:none}.seal{font-size:40px;color:var(--gold)}#victory p{font-size:13px;line-height:1.7}#victory button{font-size:12px;margin:5px}#next{background:var(--gold);color:#163038}@media(min-width:1500px){main{padding-top:35px}}@media(max-width:900px){main{padding:18px}.workspace{grid-template-columns:1fr}.garden{min-height:530px}.garden canvas{max-height:600px;object-fit:contain}.intro{padding:25px 0;gap:20px}h1{font-size:33px}.chapter{width:220px}.header-right #progress{display:none}footer{flex-direction:column;line-height:1.6}aside{padding:22px}.board-footer{font-size:10px}}@media(max-width:520px){.intro{display:block}.chapter{margin-top:22px;width:100%}h1 br{display:none}h1{font-size:31px}.brand{font-size:12px;letter-spacing:2px;gap:7px}.brand small{font-size:7px;letter-spacing:1px}.header-right{gap:5px}.header-right button{font-size:10px;padding:8px}.brandmark{font-size:28px}.garden{min-height:410px}.garden canvas{margin-top:75px}.mission{top:18px;left:18px}.mission h2{font-size:23px}.mission p{font-size:11px}.board-footer{bottom:14px;left:14px;right:14px}.board-footer span:last-child{display:none}#victory{left:8%;right:8%;top:25%;padding:16px}}