:root{--bg:#07101d;--panel:#0d1928;--panel2:#111f30;--line:#203247;--text:#edf6ff;--muted:#90a3b8;--accent:#3ee0b2;--accent2:#4da3ff;--shadow:0 18px 50px rgba(0,0,0,.28);color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);min-height:100vh}.skip{position:fixed;top:-100px;left:12px;background:var(--accent);color:#04130f;padding:10px;z-index:99}.skip:focus{top:12px}button,input{font:inherit}button{cursor:pointer}.sidebar{position:fixed;inset:0 auto 0 0;width:250px;padding:25px 18px;background:#091421;border-right:1px solid var(--line);z-index:20;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:11px;padding:0 8px 28px}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--accent);color:#071611;font-weight:900;letter-spacing:-1px}.brand strong,.brand small{display:block}.brand strong{font-size:16px}.brand small{font-size:12px;color:var(--muted);margin-top:3px}.sidebar nav{display:grid;gap:5px}.nav-button{border:0;background:transparent;color:var(--muted);text-align:left;padding:11px 12px;border-radius:9px;display:flex;align-items:center;gap:10px;font-size:14px}.nav-button:hover,.nav-button.active{background:rgba(62,224,178,.1);color:var(--text)}.nav-button.active{box-shadow:inset 3px 0 var(--accent)}.nav-icon{font-size:17px;width:22px;text-align:center}.sidebar-foot{margin-top:auto;padding:15px 9px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.pulse{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px rgba(62,224,178,.09);margin-right:7px}main{margin-left:250px;min-height:100vh}.topbar{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 clamp(20px,4vw,56px);gap:15px;position:sticky;top:0;background:rgba(7,16,29,.91);backdrop-filter:blur(15px);z-index:10}.search-wrap{max-width:670px;flex:1;position:relative}.search-wrap svg{position:absolute;left:15px;top:14px;width:18px;fill:none;stroke:var(--muted);stroke-width:2}.search-wrap input{width:100%;height:46px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--text);padding:0 70px 0 44px;outline:0;font-size:15px}.search-wrap input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(62,224,178,.12)}kbd{position:absolute;right:12px;top:11px;border:1px solid var(--line);border-radius:6px;padding:4px 7px;color:var(--muted);font:12px inherit}.icon-button{margin-left:auto;width:42px;height:42px;border:1px solid var(--line);border-radius:11px;background:var(--panel);color:var(--text);font-size:20px}.menu-button{display:none;margin-left:0}.welcome{padding:55px clamp(20px,4vw,56px) 48px;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr);gap:48px;align-items:center;background:radial-gradient(circle at 90% 20%,rgba(77,163,255,.1),transparent 28%),linear-gradient(180deg,#0a1625 0,var(--bg) 100%);border-bottom:1px solid var(--line)}.eyebrow,#resultLabel{font-size:12px;letter-spacing:.17em;color:var(--accent);font-weight:800}.welcome h1{font-size:clamp(38px,5vw,64px);line-height:1.03;letter-spacing:-.055em;margin:15px 0 19px}.welcome h1 em{font-style:normal;color:var(--accent)}.welcome p{max-width:700px;color:var(--muted);font-size:18px;line-height:1.65;margin:0}.quick-actions{display:flex;gap:10px;margin-top:28px}.quick-actions button,.empty button{border:0;background:var(--accent);color:#041712;font-weight:750;padding:12px 17px;border-radius:9px}.quick-actions .ghost{border:1px solid var(--line);background:transparent;color:var(--text)}.status-card{background:linear-gradient(145deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:var(--shadow)}.status-head{display:flex;justify-content:space-between;font-size:13px;color:var(--muted)}.live{color:var(--accent);font-size:10px;font-weight:800;letter-spacing:.08em}.metric{display:flex;align-items:baseline;gap:10px;margin:22px 0}.metric strong{font-size:54px;line-height:1}.metric span{color:var(--muted)}.mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mini-grid div{background:rgba(255,255,255,.03);border:1px solid var(--line);padding:12px;border-radius:9px}.mini-grid b,.mini-grid small{display:block}.mini-grid b{font-size:13px}.mini-grid small{color:var(--muted);margin-top:4px;font-size:11px}.content-head{padding:38px clamp(20px,4vw,56px) 20px;display:flex;justify-content:space-between;align-items:end}.content-head h2{font-size:27px;margin:8px 0 0}.content-head>span{font-size:13px;color:var(--muted)}.cards{padding:0 clamp(20px,4vw,56px) 70px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.card{border:1px solid var(--line);background:var(--panel);border-radius:15px;padding:20px;min-height:210px;display:flex;flex-direction:column;transition:.2s ease}.card:hover{transform:translateY(-3px);border-color:#37516c;box-shadow:var(--shadow)}.card-icon{width:44px;height:44px;border-radius:11px;background:rgba(62,224,178,.09);color:var(--accent);display:grid;place-items:center;font-size:20px}.card-meta{display:flex;justify-content:space-between;align-items:center;margin:16px 0 8px;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.level{color:#7dbaff}.card h3{font-size:19px;margin:0 0 9px}.card p{font-size:14px;line-height:1.55;color:var(--muted);margin:0 0 18px}.card button{margin-top:auto;width:max-content;border:0;background:transparent;color:var(--accent);padding:0;font-weight:700}.empty{text-align:center;padding:60px 20px;color:var(--muted)}.empty strong{display:block;color:var(--text);font-size:21px}.empty button{margin-top:12px}.overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:15}dialog{width:min(820px,calc(100% - 30px));max-height:88vh;border:1px solid var(--line);border-radius:18px;background:var(--panel);color:var(--text);padding:0;box-shadow:var(--shadow)}dialog::backdrop{background:rgba(0,0,0,.65);backdrop-filter:blur(3px)}.dialog-close{position:sticky;top:15px;float:right;margin:15px 15px 0 0;width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:var(--panel2);color:var(--text);font-size:24px;z-index:2}.article{padding:35px clamp(22px,5vw,52px) 50px}.article .article-icon{font-size:27px}.article h2{font-size:clamp(28px,4vw,42px);letter-spacing:-.035em;margin:13px 50px 8px 0}.article .intro{color:var(--muted);font-size:17px;line-height:1.65}.article h3{margin:31px 0 11px;font-size:20px}.article ol,.article ul{color:#c2d0dd;line-height:1.7;padding-left:22px}.article li{margin:8px 0}.article pre{background:#050b13;border:1px solid var(--line);border-radius:11px;padding:16px;overflow:auto;color:#87efce;font:14px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace}.note{border-left:3px solid var(--accent2);background:rgba(77,163,255,.08);padding:13px 15px;border-radius:0 8px 8px 0;color:#c7d8e8;margin:20px 0}.checklist{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:0!important;list-style:none}.checklist li{padding:10px 12px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:8px;margin:0}.checklist li:before{content:'✓';color:var(--accent);font-weight:900;margin-right:8px}body.light{--bg:#f3f7fa;--panel:#fff;--panel2:#f8fbfd;--line:#d8e3ec;--text:#102235;--muted:#607387;--shadow:0 18px 50px rgba(31,50,68,.12);color-scheme:light}body.light .sidebar{background:#fff}body.light .topbar{background:rgba(243,247,250,.91)}body.light .welcome{background:radial-gradient(circle at 90% 20%,rgba(45,135,220,.1),transparent 28%),linear-gradient(180deg,#f8fbfd,var(--bg))}body.light .article pre{background:#102235;color:#87efce}
@media(max-width:1050px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.welcome{grid-template-columns:1fr}.status-card{max-width:600px}}
@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:.2s ease}.sidebar.open{transform:translateX(0)}.overlay.show{display:block}main{margin-left:0}.menu-button{display:block}.topbar{padding:0 15px}.welcome{padding-top:38px}.welcome h1{font-size:40px}.cards{grid-template-columns:1fr}.search-wrap kbd{display:none}.search-wrap input{padding-right:15px}.quick-actions{flex-direction:column;align-items:flex-start}.checklist{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.guide-hero{grid-template-columns:minmax(300px,.8fr) minmax(520px,1.2fr);padding-top:40px;padding-bottom:35px}.guide-hero h1{font-size:clamp(38px,4vw,54px);margin-bottom:12px}.learning-path{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:17px}.learning-path>span{grid-column:1/-1;color:var(--muted);font-size:11px;letter-spacing:.12em;font-weight:800;margin-bottom:4px}.learning-path button{min-height:48px;border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:9px;padding:8px;font-weight:700}.learning-path button:hover{border-color:var(--accent);color:var(--accent)}.learning-path i{color:var(--accent);font-style:normal}.article-top{display:flex;gap:13px;align-items:center}.howto h3{display:flex;align-items:center;gap:10px}.howto h3 b{display:grid;place-items:center;min-width:30px;height:30px;border-radius:8px;background:rgba(62,224,178,.11);color:var(--accent);font-size:14px}.howto ol{counter-reset:steps;list-style:none;padding-left:0}.howto ol li{position:relative;padding:14px 14px 14px 50px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.025);margin:9px 0}.howto ol li:before{counter-increment:steps;content:counter(steps);position:absolute;left:13px;top:13px;display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--accent);color:#041712;font-weight:900;font-size:13px}.troubles{display:grid;gap:8px}.troubles details{border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.025);padding:12px 14px}.troubles summary{cursor:pointer;font-weight:700;color:#ffbd75}.troubles p{color:var(--muted);line-height:1.55;margin:10px 0 2px}.card{min-height:225px}.card .level{font-size:10px}
@media(max-width:1100px){.guide-hero{grid-template-columns:1fr}.learning-path{max-width:800px}}
@media(max-width:650px){.learning-path{grid-template-columns:1fr}.learning-path i{display:none}.guide-hero{padding-top:30px}.howto ol li{padding-left:46px}}
.contact{margin:0 clamp(20px,4vw,56px) 28px;padding:32px;border:1px solid rgba(62,224,178,.28);border-radius:18px;background:linear-gradient(135deg,rgba(62,224,178,.09),rgba(77,163,255,.08));display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}.contact h2{font-size:32px;margin:8px 0}.contact p{color:var(--muted);line-height:1.6;margin:0;max-width:580px}.contact-actions{display:grid;gap:10px}.contact-actions a{display:flex;align-items:center;gap:13px;padding:15px;border:1px solid var(--line);border-radius:11px;background:var(--panel);color:var(--text);text-decoration:none;transition:.2s}.contact-actions a:hover{border-color:var(--accent);transform:translateX(3px)}.contact-actions a>span{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:rgba(62,224,178,.1);color:var(--accent);font-size:18px}.contact-actions small,.contact-actions strong{display:block}.contact-actions small{color:var(--muted);font-size:12px;margin-bottom:3px}footer{margin:0 clamp(20px,4vw,56px);padding:26px 0 35px;border-top:1px solid var(--line);display:flex;align-items:center;gap:25px;color:var(--muted);font-size:13px}footer .footer-brand{display:flex;align-items:center;gap:10px;color:var(--text)}footer .brand-mark{width:36px;height:36px;font-size:13px}footer strong,footer small{display:block}footer small{color:var(--muted);margin-top:2px}footer p{margin-left:auto}footer>a{color:var(--accent);text-decoration:none}
@media(max-width:800px){.contact{grid-template-columns:1fr}footer{align-items:flex-start;flex-direction:column;gap:14px}footer p{margin:0}.contact-actions strong{font-size:14px;overflow-wrap:anywhere}}
footer a.footer-brand{text-decoration:none;padding:7px;border-radius:10px;transition:.2s}footer a.footer-brand:hover{background:rgba(62,224,178,.09);color:var(--accent);transform:translateY(-2px)}
.library-stats{display:grid;grid-template-columns:repeat(4,1fr);margin:24px clamp(20px,4vw,56px) 0;border:1px solid var(--line);border-radius:14px;background:var(--panel);overflow:hidden}.library-stats div{padding:18px 20px;border-right:1px solid var(--line)}.library-stats div:last-child{border:0}.library-stats strong,.library-stats span{display:block}.library-stats strong{font-size:25px;color:var(--accent)}.library-stats span{font-size:12px;color:var(--muted);margin-top:3px}@media(max-width:700px){.library-stats{grid-template-columns:1fr 1fr}.library-stats div:nth-child(2){border-right:0}.library-stats div:nth-child(-n+2){border-bottom:1px solid var(--line)}}
.scope-box{display:flex;justify-content:space-between;gap:20px;margin:22px 0;padding:14px 16px;border:1px solid rgba(62,224,178,.25);border-radius:10px;background:rgba(62,224,178,.06)}.scope-box span{color:var(--muted);text-align:right}.port-box{padding:16px;border-radius:10px;border:1px solid var(--line);background:#050b13;color:#87efce;font:14px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace}.related{display:grid;grid-template-columns:1fr 1fr;gap:8px}.related button{border:1px solid var(--line);border-radius:9px;background:var(--panel2);color:var(--text);padding:12px;text-align:left}.related button:hover{border-color:var(--accent);color:var(--accent)}body.light .port-box{background:#102235}@media(max-width:650px){.scope-box{flex-direction:column}.scope-box span{text-align:left}.related{grid-template-columns:1fr}}
