@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#f4f5f0;--ink:#18251f;--muted:#758078;--green:#c4f36b;--line:#e0e5dc;--dark:#14281f}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px Manrope,system-ui,sans-serif}aside{position:fixed;inset:0 auto 0 0;width:244px;background:#111d17;color:#dbe5dc;padding:34px 22px;display:flex;flex-direction:column}.brand{color:#fff;text-decoration:none;font-size:20px;font-weight:800;display:flex;align-items:center;gap:12px}.brand b{background:var(--green);color:#142019;padding:7px;border-radius:9px;font-size:22px}.brand b span{font-size:18px}.caption{font-size:9px;letter-spacing:1.7px;color:#839487;margin:36px 8px 15px}nav button{display:block;width:100%;background:none;color:#a8b5ac;border:0;text-align:left;padding:13px 14px;margin:5px 0;font-size:14px;border-radius:8px;cursor:pointer}nav button.active{background:#293d2c;color:var(--green)}nav button i{display:inline-block;width:28px;font-style:normal}.sidefoot{margin-top:auto;border-top:1px solid #2c3b31;padding-top:24px;display:flex;gap:12px;font-size:13px}.avatar{width:36px;height:36px;background:#344535;border-radius:50%;display:grid;place-items:center;color:var(--green)}small{color:var(--muted);font-size:12px}main{margin-left:244px;padding:0 42px;max-width:1600px}header{height:85px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:1px;color:var(--muted)}header b{color:var(--ink);margin-left:10px}select{background:white;border:1px solid var(--line);padding:9px;border-radius:7px;margin-left:20px;color:var(--ink)}.saved{font-size:10px;letter-spacing:0;color:#64815b}h1{font-size:36px;letter-spacing:-1.4px;margin:0 0 12px;line-height:1.2}h2{font-size:21px;letter-spacing:-.5px}h3{font-size:16px}p{line-height:1.7;color:#69766d}.intro{margin:34px 0 28px;display:flex;justify-content:space-between;align-items:center}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:800;color:#6a8056}.intro p{margin:0}.pill{padding:8px 12px;background:#e9eedf;border-radius:20px;font-size:11px;white-space:nowrap}.grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(260px,1fr);gap:22px}.hero{background:var(--dark);color:#fff;border-radius:16px;padding:30px;position:relative;overflow:hidden;min-height:300px}.hero:after{content:'{ }';position:absolute;font:bold 150px monospace;right:20px;top:65px;color:#a4ce7840;transform:rotate(-12deg);pointer-events:none}.hero h2{font-size:29px;max-width:440px;margin:20px 0 10px;line-height:1.3}.hero p{color:#a8b8aa;max-width:390px}.hero .eyebrow{color:var(--green)}button,.button{font-family:inherit;cursor:pointer}.btn{border:0;background:var(--green);color:#1c321d;border-radius:7px;padding:13px 19px;font-weight:800;display:inline-block;text-decoration:none;font-size:12px}.btn.secondary{background:white;border:1px solid var(--line);color:#334638}.btn.dark{background:var(--dark);color:white}.hero .btn{position:relative;z-index:1;margin-top:12px}.card{border:1px solid var(--line);background:#fff;border-radius:14px;padding:24px}.card h2,.card h3{margin-top:0}.row{display:flex;justify-content:space-between;align-items:center;gap:12px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:22px 0}.stat{padding:20px;background:white;border:1px solid var(--line);border-radius:12px}.stat strong{display:block;font-size:27px;margin:8px 0}.stat small{font-size:11px}.progress{height:6px;background:#edf0e9;border-radius:8px;overflow:hidden;margin:16px 0}.progress>div{background:#8cae4c;height:100%;transition:width .3s}.ring{width:118px;height:118px;border-radius:50%;margin:24px auto;background:conic-gradient(#9ac54b var(--pct),#edf0e8 0);display:grid;place-items:center}.ring>div{border-radius:50%;width:96px;height:96px;background:white;display:grid;place-content:center;text-align:center;font-size:26px;font-weight:800}.ring small{display:block;font-weight:400;font-size:10px}.lessonrow{display:flex;gap:15px;align-items:center;width:100%;border:0;border-bottom:1px solid #edf0e9;background:transparent;text-align:left;padding:17px 0;color:var(--ink)}.num{background:#f0f3eb;border-radius:10px;min-width:36px;height:36px;display:grid;place-items:center;color:#7f916c;font-size:12px}.lessonrow strong{font-size:13px}.lessonrow small{display:block;margin-top:5px}.lessonrow .arrow{margin-left:auto;color:#9aab91}.sectionhead{margin:25px 0 16px}.link{border:0;background:none;color:#5f7f39;font-weight:700;font-size:11px}.reminder{background:#ebefdf;border:1px solid #dce4ca;border-radius:12px;padding:19px;margin-top:20px}.reminder p{font-size:12px;margin-bottom:0}.stack{display:grid;gap:20px}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}.tabs button{padding:10px 16px;border:1px solid var(--line);border-radius:8px;background:white}.tabs button.active{background:var(--dark);color:white}.content{max-width:900px}.content p{color:#4e6054}.content pre,pre{padding:22px;background:#13241c;color:#d5ecb8;border-radius:10px;overflow:auto;font:14px/1.9 ui-monospace,monospace;white-space:pre-wrap}.content li{line-height:1.9}.check{display:flex;gap:12px;align-items:flex-start;padding:15px 0;line-height:1.6}.check input{width:19px;height:19px;accent-color:#729b3e;flex-shrink:0}.notice{padding:15px;background:#eff3e7;border-radius:9px;color:#536b3e;font-size:13px;line-height:1.7}.quizoption{display:block;border:1px solid var(--line);padding:14px;border-radius:9px;margin:9px 0;cursor:pointer}.quizoption:has(input:checked){background:#f1f7e7;border-color:#8cb559}.quizoption input{margin-right:12px;accent-color:#678c39}.feedback{margin-top:12px;padding:12px;border-radius:8px;background:#edf3e5;line-height:1.6}textarea,input[type=text],input[type=time]{font:inherit;border:1px solid var(--line);border-radius:8px;padding:12px;max-width:100%}textarea{width:100%;min-height:180px;resize:vertical;background:#fffef9;line-height:1.7}.stage{margin:18px 0}.stage summary{cursor:pointer;padding:20px;font-weight:800;font-size:17px}.stage .stagebody{padding:0 24px 16px}footer{border-top:1px solid var(--line);margin-top:40px;padding:22px 0;color:#889287;font-size:10px;display:flex;justify-content:space-between}#toast{position:fixed;bottom:24px;right:24px;padding:14px 22px;background:var(--dark);color:white;border-radius:10px;display:none;z-index:10}.toolsgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.badge{font-size:10px;background:#f0f4e9;color:#6c843e;border-radius:5px;padding:4px 7px}.actionbar{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}a{color:#63883d}.muted{color:var(--muted)}@media(min-width:1500px){main{margin-right:auto}}@media(max-width:1050px){aside{width:205px;padding:28px 15px}main{margin-left:205px;padding:0 24px}.grid{grid-template-columns:1fr}.hero{min-height:280px}.stack{grid-template-columns:1fr 1fr}.intro .pill{display:none}}@media(max-width:650px){aside{position:static;width:100%;padding:18px}.brand{font-size:18px}.caption,.sidefoot{display:none}nav{display:flex;overflow:auto;margin-top:15px;gap:6px}nav button{min-width:max-content;width:auto;padding:9px;font-size:12px}nav button i{width:20px}main{margin:0;padding:0 18px}header{height:62px;letter-spacing:0}header .saved{display:none}h1{font-size:28px}.intro{margin:26px 0}.stats{gap:8px}.stat{padding:13px}.stat strong{font-size:22px}.stat small{font-size:10px}.stack,.toolsgrid{grid-template-columns:1fr}.card{padding:20px}.hero{padding:24px}.hero h2{font-size:26px}.hero:after{right:-25px;top:120px}footer span{display:none}.row{flex-wrap:wrap}}
/* Max-IT / Dark Tech */
:root{--green:#b8ff3b;--ink:#eaf0e7;--muted:#8b978d;--line:#26332a;--bg:#080b09;--dark:#0d1710;color-scheme:dark}body{background:var(--bg);background-image:linear-gradient(#a5ff2710 1px,transparent 1px),linear-gradient(90deg,#a5ff2710 1px,transparent 1px);background-size:64px 64px;font-family:Manrope,system-ui,sans-serif}aside{background:#090e0b;border-right:1px solid #26332a;padding:32px 20px;width:250px}.brand{letter-spacing:-.8px}.brand b{border-radius:6px;box-shadow:0 0 24px #a5ff2718}.caption{margin-top:44px;font-size:8px;letter-spacing:1.8px;color:#71816f}nav button{transition:background .2s,color .2s,transform .2s;font-size:13px;padding:14px 13px;border:1px solid transparent}nav button.active{background:linear-gradient(90deg,#b8ff3b19,#b8ff3b08);border-color:#b8ff3b29;color:var(--green);box-shadow:inset 3px 0 var(--green)}nav button:hover{background:#b8ff3b0b;color:var(--green);transform:translateX(2px)}nav button i{color:#7b9675}.sidefoot{border-color:var(--line)}.avatar{background:#b8ff3b12;border:1px solid #b8ff3b45;color:var(--green)}main{margin-left:250px;padding:0 42px;max-width:1700px}header{height:82px;border-color:var(--line);color:#83937f}header b{color:#eaf0e7}.header-actions{display:flex;align-items:center;gap:17px}.theme-toggle{background:#121a14;border:1px solid var(--line);color:var(--green);border-radius:7px;width:34px;height:34px;font-size:21px}select{margin:0;background:#101811;border-color:var(--line);color:var(--ink);font-size:11px;padding:10px 12px}.saved{color:#88ad70}.intro{margin:39px 0 29px}.intro h1{font-size:36px;font-weight:800;letter-spacing:-1.5px}.intro p{font-size:13px;color:#95a28f}.pill{background:#101a0f;border:1px solid #9be8292f;color:#bed9a2;font-size:10px;display:flex;align-items:center;gap:9px}.status-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 10px #b8ff3b88}.grid{gap:24px;grid-template-columns:minmax(0,1.85fr) minmax(270px,1fr)}.hero{border:1px solid #9bd24145;border-radius:14px;background:radial-gradient(ellipse at 95% 40%,#4d781824,transparent 58%),linear-gradient(125deg,#172311,#0a110b);padding:32px;min-height:322px;box-shadow:inset 0 1px #c4f36b16,0 16px 70px #0003}.hero:after{content:'';inset:0;background:linear-gradient(#b8ff3b07 1px,transparent 1px),linear-gradient(90deg,#b8ff3b07 1px,transparent 1px);background-size:28px 28px;transform:none;pointer-events:none}.hero h2{font-size:31px;line-height:1.25;letter-spacing:-1px;position:relative;max-width:65%;z-index:1}.hero p{max-width:60%;font-size:12px;position:relative;z-index:1;color:#abb8a1}.hero .eyebrow{font-size:9px;letter-spacing:1.6px}.eyebrow{color:#a5cc77}.hero-art{position:absolute;width:205px;height:240px;right:6px;top:36px;pointer-events:none}.code-tile{position:absolute;top:50px;left:35px;width:140px;height:150px;border:1px solid #b8ff3b75;background:linear-gradient(140deg,#283b17,#0d140b);border-radius:18px;padding:20px;transform:rotate(-9deg);box-shadow:0 0 60px #b8ff3b15,18px 18px 0 #a5ce4410}.code-tile>span{font:9px monospace;color:#b8ff3b;letter-spacing:3px}.code-tile b{display:block;font:64px/1.3 monospace;letter-spacing:-9px;color:#b8ff3b}.code-tile b span{font-size:32px;letter-spacing:0}.code-tile small{font:6px monospace;color:#96a883;letter-spacing:1px}.orbit{position:absolute;border:1px solid #b8ff3b20;border-radius:50%;width:210px;height:210px;left:0;top:22px}.orbit-two{transform:rotate(45deg);border-radius:30px;width:180px;height:180px;left:15px;top:37px}.floating-tag{position:absolute;background:#121e0f;border:1px solid #b8ff3b40;color:#b8ff3b;padding:7px 10px;border-radius:6px;font:9px monospace;box-shadow:0 6px 20px #0005}.tag-one{right:0;top:28px;transform:rotate(5deg)}.tag-two{left:4px;bottom:8px;transform:rotate(-5deg)}.btn{background:var(--green);border:1px solid #c9ff70;border-radius:7px;color:#15210b;padding:13px 20px;box-shadow:0 0 22px #b8ff3b18;transition:transform .2s,box-shadow .2s;font-size:12px}.btn:hover{transform:translateY(-2px);box-shadow:0 0 28px #b8ff3b40}.btn.secondary{background:#121b12;border:1px solid #34472c;color:#d9e9cc;box-shadow:none}.btn.dark{background:var(--green);color:#13220a}.card,.stat{background:linear-gradient(130deg,#111912,#0d130f);border-color:var(--line);box-shadow:0 8px 28px #0001;border-radius:12px}.card h2{color:#edf4e8}.card p{color:#95a28e}.stat{position:relative;padding:20px}.stat:before{content:'';position:absolute;left:20px;top:0;width:24px;height:2px;background:var(--green)}.stat small{color:#91a086;letter-spacing:.2px}.stat strong{color:#e5f2dc;font-size:29px;font-weight:600}.stat strong small{color:#6e8261}.sectionhead h2{font-size:19px}.link{color:#a9d776}.link:hover{color:#c6ff78;text-decoration:underline}.lessonrow{color:var(--ink);border-color:#263025;transition:background .2s,padding .2s;border-radius:7px}.lessonrow:hover{background:#b8ff3b08;padding-left:10px;padding-right:10px}.lessonrow strong{font-size:12px;font-weight:600}.lessonrow small{color:#83947b;font-size:10px}.num{background:#b8ff3b0a;border:1px solid #b8ff3b25;border-radius:7px;color:#a8d573;font-family:monospace}.lessonrow .arrow{color:#afdd7b}.badge{background:#b8ff3b10;border:1px solid #b8ff3b20;color:#b8da92;font-size:9px}.progress{background:#24301e;height:5px}.progress>div{background:var(--green);box-shadow:0 0 12px #b8ff3b80}.ring{background:conic-gradient(var(--green) var(--pct),#26301f 0);box-shadow:0 0 28px #b8ff3b08}.ring>div{background:#101711;color:#dff1cb}.ring small{color:#8c9e80}.reminder,.notice,.feedback{background:#a9e23e0a;border:1px solid #b8ff3b25;color:#b8ca9e}.reminder p{color:#97ab85}.tabs button{background:#111911;border-color:#2a3826;color:#9aae8d;border-radius:7px;font-size:12px}.tabs button.active{background:#b8ff3b13;border-color:#b8ff3b7a;color:var(--green)}.content{max-width:980px;padding:30px;line-height:1.7}.content p{color:#b1bda7}.content h2{margin-top:16px}.content pre,pre{background:#080e09;color:#c2ef98;border:1px solid #304528;border-left:3px solid #91c83f;font:13px/1.9 ui-monospace,monospace;box-shadow:inset 0 1px #ffffff03}.content li{color:#aebba3}.quizoption{background:#0c130e;border-color:#2a3727}.quizoption:has(input:checked){background:#b8ff3b12;border-color:#91c746;color:#dcf4be}.check input,.quizoption input{accent-color:var(--green)}textarea,input[type=text],input[type=time]{background:#0b120d;color:#d7e6cb;border-color:#35472e}textarea::placeholder{color:#718269}input:focus,textarea:focus,select:focus{outline:2px solid #b8ff3b80;outline-offset:3px}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--green);outline-offset:4px}.stage summary{font-size:15px;color:#d7eac8}.stage summary small{font-family:monospace;color:#98bc74}.stage:hover{border-color:#455f34}.muted{color:#789263}footer{color:#75856b;border-color:var(--line);letter-spacing:.3px}#toast{border:1px solid #9bce5b66;box-shadow:0 5px 30px #0006;color:#d8edbf;background:#162311}dialog{background:#101911;color:#e2efd7;border:1px solid #5e7a3f;border-radius:16px;padding:35px;max-width:520px;width:calc(100% - 32px);box-shadow:0 30px 150px #0009}dialog::backdrop{background:#020703cc;backdrop-filter:blur(6px)}dialog p,dialog li{color:#aaba9f;line-height:1.8;font-size:13px}.dialog-close{float:right;background:#1e2b18;color:#c9e6ae;border:1px solid #4b6039;border-radius:50%;width:32px;height:32px;font-size:23px}.install-symbol{width:76px;height:76px;background:var(--green);border-radius:18px;color:#14210c;font:bold 35px monospace;display:grid;place-items:center;position:relative;margin-bottom:25px;box-shadow:0 0 35px #b8ff3b20}.install-symbol span{font-size:17px;position:absolute;right:9px;bottom:4px}.install-page{padding:40px;max-width:1000px}.install-page>p{max-width:580px}.install-page h2{font-size:29px;letter-spacing:-1px}.install-features{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin:40px 0}.install-features b{color:var(--green);font:13px monospace;border:1px solid #b8ff3b35;padding:8px;border-radius:7px}.install-features h3{margin:22px 0 6px}.install-features p{font-size:12px}body{padding-bottom:env(safe-area-inset-bottom)}@media(prefers-reduced-motion:no-preference){#app{animation:appear .25s ease}@keyframes appear{from{opacity:.5;transform:translateY(5px)}to{opacity:1;transform:none}}}@media(max-width:1150px){aside{width:220px}main{margin-left:220px;padding:0 26px}.grid{grid-template-columns:1fr}.stack{grid-template-columns:1fr 1fr}.hero{min-height:300px}.hero-art{right:30px}}@media(max-width:650px){aside{position:static;width:100%;padding:calc(16px + env(safe-area-inset-top)) 18px 12px;background:#080e0a;border-bottom:1px solid #283722}.brand{font-size:18px}.brand b{padding:5px 7px;font-size:20px}.caption,.sidefoot{display:none}nav{margin:14px -4px 0;padding:0 4px 3px;scrollbar-width:none}nav::-webkit-scrollbar{display:none}nav button{padding:10px 12px;font-size:11px;border-radius:6px}nav button.active{box-shadow:inset 0 -2px var(--green)}nav button:hover{transform:none}main{margin:0;padding:0 18px}header{height:59px;font-size:9px}.header-actions{gap:10px}.theme-toggle{display:none}select{font-size:11px;padding:9px}h1,.intro h1{font-size:27px;letter-spacing:-1px}.intro{margin:27px 0 22px}.intro p{font-size:12px;max-width:310px}.hero{min-height:333px;padding:24px}.hero h2{font-size:28px;max-width:82%;margin:23px 0 14px}.hero p{max-width:77%;font-size:12px}.hero-art{width:160px;height:190px;right:-49px;top:110px;opacity:.45;transform:scale(.8)}.hero .btn{min-height:45px;margin-top:10px}.hero .eyebrow{font-size:8px;letter-spacing:1.3px}.stats{gap:8px;margin:16px 0}.stat{padding:17px 12px}.stat:before{left:12px}.stat small{font-size:8px}.stat strong{font-size:26px;margin:10px 0}.stat strong small{font-size:10px}.stack,.toolsgrid{grid-template-columns:1fr}.card{padding:20px}.content{padding:21px}.content pre{padding:16px;font-size:12px}.tabs{gap:6px}.tabs button{padding:11px 8px;font-size:10px;flex:1}.actionbar .btn{flex-grow:1;text-align:center;min-height:45px}.lessonrow{padding:17px 0}.lessonrow strong{font-size:12px}.lessonrow small{font-size:10px}.sectionhead h2{font-size:18px}.install-page{padding:24px}.install-page h2{font-size:25px}.install-features{grid-template-columns:1fr;gap:20px;margin:35px 0}.install-features>div{padding-left:45px;position:relative}.install-features b{position:absolute;left:0;top:0}.install-features h3{margin-top:0}dialog{padding:25px}.stage summary{font-size:13px}.stage summary small{float:none!important;display:block;margin:8px 0 0 32px}textarea,input,select{font-size:16px}footer{margin-top:30px;font-size:9px}#toast{left:16px;right:16px;bottom:calc(20px + env(safe-area-inset-bottom));font-size:12px}button{touch-action:manipulation}} 
.growth-hero{min-height:260px;background:radial-gradient(ellipse at right,#b8ff3b1c,transparent 60%),#101a0e}.growth-hero h2{max-width:90%;font-size:34px}.growth-hero p{max-width:650px}.roadmap-list{padding-left:22px;color:#aebda2;line-height:1.9}.roadmap-list li{padding:6px 0}@media(max-width:650px){.growth-hero h2{font-size:28px}.growth-hero p{max-width:100%}.roadmap-list{font-size:13px}}
.back-site{display:block;margin:22px 8px 0;color:#a8cf7c;font-size:10px}.caption{margin-top:26px}@media(max-width:650px){.back-site{position:absolute;right:18px;top:26px;margin:0;font-size:10px}aside{position:relative}}
aside{overflow-y:auto}.sidefoot{flex-shrink:0}
