:root {
  --bg: #060910;
  --bg-soft: #0d1324;
  --surface: #101827cc;
  --border: #2a3655;
  --text: #e8edff;
  --muted: #9eaccd;
  --primary: #7aa8ff;
  --primary-2: #5f8fff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--text);font-family:Inter,"Segoe UI",system-ui,sans-serif;font-size:clamp(.95rem,.3vw + .9rem,1.05rem);line-height:1.55;background:radial-gradient(circle at 50% 20%,#1d2f57 0%,transparent 35%),linear-gradient(165deg,var(--bg),#0a1020)}

.topbar{position:relative;z-index:30;background:transparent;border-bottom:0;backdrop-filter:none}
.topbar-inner{max-width:1200px;margin:0 auto;padding:14px clamp(12px,2.5vw,24px) 8px;min-height:72px;display:flex;align-items:center;gap:22px;justify-content:space-between;flex-wrap:nowrap}
.brand{display:inline-flex;align-items:center;gap:12px;color:#fff;text-decoration:none}
.brand strong{font-size:1.75rem;line-height:1}
.brand span{font-size:1.05rem;letter-spacing:.16em;color:#cfd5e7}

.nav-links{display:flex;gap:18px;flex-wrap:nowrap;align-items:center;white-space:nowrap}
.nav-links a{display:inline-flex;align-items:center;color:#9aa6bf;text-decoration:none;font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:8px 0;border-bottom:2px solid transparent;transition:.18s ease}
.nav-links a:hover{color:#fff;border-bottom-color:#6d7687}
.menu-toggle{display:none!important}

.container{max-width:1200px;margin:0 auto;padding:clamp(14px,2.6vw,24px) clamp(10px,2.2vw,18px) clamp(18px,2.8vw,34px);display:grid;gap:clamp(12px,1.8vw,18px)}
.card{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:clamp(14px,2.1vw,20px);backdrop-filter:blur(10px);box-shadow:0 16px 30px #02061266}

.hero{min-height:70vh;display:grid;align-content:center;justify-items:center;text-align:center;gap:16px;position:relative;overflow:hidden;padding:clamp(16px,4vw,34px)}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle,#8ef3ff33 0,#9f7dff14 35%,transparent 60%);pointer-events:none}
.hero>*{position:relative;z-index:1}
.kicker{margin:0;color:#9ec0ff;letter-spacing:.11em;text-transform:uppercase;font-weight:700;font-size:.8rem}
.hero h1{margin:0;line-height:1.05;font-size:clamp(2rem,4vw,4rem);font-family:Georgia,"Times New Roman",serif}
.muted{color:var(--muted);line-height:1.65;font-size:clamp(.95rem,.45vw + .82rem,1.08rem)}
#subtitleText{max-width:760px;margin:0 auto}
.hero-badges{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.badge{border:1px solid #3a4d76;background:#101d38;border-radius:999px;padding:7px 12px;font-size:.8rem}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px;margin-bottom:4px;justify-content:center}
.hero-actions .btn{min-height:50px;padding:12px 24px;border-radius:14px;font-size:clamp(1rem,.3vw + .92rem,1.12rem);font-weight:700;letter-spacing:.01em;box-shadow:0 12px 24px rgba(5,10,20,.28)}
.hero-actions .btn.primary{background:linear-gradient(180deg,#78a9ff,#5f8fff);border-color:#8eb6ff}
.hero-actions .btn:not(.primary){background:#081229;border-color:#3a4f79;color:#eef3ff}
.hero-actions .btn:hover{transform:none}
.hero-actions .btn.primary:hover{background:linear-gradient(180deg,#89b4ff,#6a98ff);border-color:#9abfff}
.hero-actions .btn:not(.primary):hover{background:#2c333d;border-color:#6d7687}

.info-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:14px}
.clean-list{margin:8px 0 0;padding-left:18px;display:grid;gap:7px}

.grid{display:grid;gap:10px}
textarea,pre,.btn{border:1px solid #33496f;border-radius:12px;background:#0b1428;color:var(--text)}
textarea{width:100%;min-height:120px;padding:12px;resize:vertical}
pre{white-space:pre-wrap;word-break:break-word;margin:0;padding:12px;min-height:86px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px clamp(12px,1.8vw,16px);text-decoration:none;cursor:pointer;transition:.18s ease}
.btn:hover{transform:translateY(-1px);border-color:#5a7db8}
.btn.primary{background:linear-gradient(180deg,var(--primary),var(--primary-2));color:#fff;border-color:#7aa8ff;font-weight:700}
.tutorial-cta-wrap{display:grid;gap:12px;justify-items:center;text-align:center;padding:18px 0 16px;margin:10px 0 14px}
.tutorial-cta-wrap .muted{margin:0}
.tutorial-cta-btn{display:inline-flex;align-items:center;gap:10px;width:fit-content;padding:12px 24px;border-radius:999px;border:1px solid #3e4654;background:#242a33;color:#fff;text-decoration:none;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.82rem;transition:.2s ease}
.tutorial-cta-btn i{transition:transform .2s ease}
.tutorial-cta-btn:hover{border-color:#6d7687;background:#2c333d}
.tutorial-cta-btn:hover i{transform:translateX(5px)}

.app-showcase{position:relative;overflow:hidden;padding:clamp(18px,3vw,32px) clamp(12px,2.2vw,22px);border-radius:20px;background:radial-gradient(circle at 50% 20%,#12335d55 0%,transparent 55%),#0c111b;border:1px solid #2a3344;display:grid;gap:18px}
.showcase-head{text-align:center;max-width:860px;margin:0 auto;display:grid;gap:10px}
.showcase-badge{justify-self:center;display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:12px;background:#1a2639;border:1px solid #35527a;color:#7fd0ff;font-weight:700;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase}
.app-showcase h2,.cli-showcase h2{margin:0;font-size:clamp(1.8rem,4vw,3.1rem);line-height:1.12;color:#dbe8ff;font-family:Georgia,"Times New Roman",serif}
.showcase-video{width:min(1120px,100%);height:auto;max-height:78vh;margin:0 auto;display:block;border:0;border-radius:14px;background:#000;object-fit:contain}

.cli-showcase{position:relative;overflow:hidden;padding:clamp(18px,3vw,32px) clamp(12px,2.2vw,22px);border-radius:20px;background:radial-gradient(circle at 50% 22%,#12335d55 0%,transparent 56%),#0c111b;border:1px solid #2a3344;display:grid;gap:18px}
.cli-code-shell{position:relative;border:1px solid #313d52;background:#0b1018;border-radius:16px;padding:clamp(18px,2.6vw,24px) clamp(10px,2vw,16px) clamp(14px,2vw,18px);max-width:1080px;width:100%;margin:0 auto;display:grid;gap:14px}
.cli-fig{position:absolute;left:50%;transform:translateX(-50%);top:-14px;white-space:nowrap;padding:4px 10px;border-radius:6px;border:1px solid #3a455f;background:#0a0f17;color:#b8c4df;font-style:italic}
.cli-preview{margin:0;background:transparent;border:0;padding:0;max-height:300px;overflow:hidden;position:relative;font-family:Consolas,Monaco,monospace;color:#e4ecff;line-height:1.45}
.cli-preview::after{content:"";position:absolute;left:0;right:0;bottom:0;height:86px;background:linear-gradient(180deg,transparent,#0b1018)}
.cli-preview.expanded{max-height:2000px}
.cli-preview.expanded::after{display:none}
.cli-code-shell #cliToggleBtn{justify-self:center;min-width:0;padding-inline:20px;text-align:center}

.cli-toggle-btn{position:relative;z-index:2;margin-top:2px;background:#3a424c;border-color:#525b69;color:#fff !important}
.cli-toggle-btn span,.cli-toggle-btn{justify-content:center}
.cli-toggle-btn{letter-spacing:.04em}
.cli-toggle-btn:hover{background:#4a5563;border-color:#6b7686}
.cli-preview code{display:block;white-space:pre-wrap}
.cli-cyan{color:#3fb8ff}.cli-green{color:#00e65f}.cli-yellow{color:#f2c94c}.cli-blue{color:#38a3ff}.cli-white{color:#f0f4ff}.cli-dim{color:#9ca6bd}
.actions{display:flex;gap:10px;flex-wrap:wrap}
.result-actions{margin-top:10px}

.download-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.download-btn{justify-content:space-between;text-align:left}
.download-btn span{display:inline-flex;gap:8px;align-items:center}

.cmd-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.cmd-block{display:grid;gap:8px;grid-template-rows:auto minmax(180px,1fr) auto}
.cmd-block h3{margin:0;display:flex;gap:8px;align-items:center;font-size:1rem}

.tutorial-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tutorial-item{margin:0;padding:10px;border-radius:12px;border:1px solid #32486e;background:#0b1428;display:grid;gap:8px;min-height:220px}
.tutorial-item figcaption{font-weight:700;color:#d6e2ff}
.tutorial-item img{width:100%;height:auto;border-radius:10px;border:1px solid #2a3b5a}
.tutorial-item.missing{color:#94a5cc;align-content:center}

.lang-wrap{display:grid;gap:6px;min-width:170px;margin-left:auto}
.lang-control{position:relative;max-width:170px}
.lang-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid #2f3848;border-radius:999px;background:#1f242d;color:var(--text);padding:9px 12px;cursor:pointer;font-size:.85rem}
#langFlag{font-size:18px}
#langCurrent{font-weight:600}
.lang-menu{position:absolute;z-index:9999;top:calc(100% + 8px);left:0;width:min(230px,100%);margin:0;padding:8px;list-style:none;border-radius:12px;border:1px solid #3b5a96;background:#f1f2f4;color:#1f2937;max-height:300px;overflow:auto;display:none;box-shadow:0 10px 26px rgba(0,0,0,.3)}
.lang-menu.open{display:grid;gap:2px}
.lang-menu li{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;cursor:pointer}
.lang-menu li:hover,.lang-menu li.active{background:#dde4ef}

.legacy-site-footer{max-width:1200px;margin:8px auto 30px;padding:8px 16px}
.legacy-footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:16px;border-top:1px solid #2a3d69;padding-top:16px}
.legacy-site-footer h3{margin:0 0 8px}.legacy-site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}.legacy-site-footer a{color:#bfd0f3;text-decoration:none}.legacy-site-footer a:hover{text-decoration:underline}

@media (max-width:980px){
  .topbar-inner{min-height:62px;padding:10px 14px 6px;gap:14px}
  .brand strong{font-size:1.35rem}
  .brand span{font-size:.92rem;letter-spacing:.12em}
  .nav-links{gap:14px;overflow:auto;scrollbar-width:thin}
  .lang-wrap{min-width:156px}
  .info-grid,.cmd-grid,.tutorial-grid{grid-template-columns:1fr}
  .hero{min-height:58vh}
}
@media (max-width:700px){
  .container{padding:12px 10px}
  .topbar-inner{padding:10px 10px 4px;min-height:58px;gap:10px}
  .brand strong{font-size:1.15rem}
  .brand span{font-size:.8rem}
  .lang-wrap{min-width:132px}
  .lang-control{max-width:150px}
  .nav-links{gap:12px}
  .nav-links a{font-size:.76rem;letter-spacing:.06em}
  .download-grid{grid-template-columns:1fr}
  .actions>.btn,.hero-actions .btn{width:auto;min-width:148px}
  .actions,.hero-actions{justify-content:center}
  .tutorial-cta-wrap{padding:14px 0 12px;margin:6px 0 10px}
  .tutorial-cta-btn{width:fit-content;max-width:100%;justify-content:center;padding:10px 18px;letter-spacing:.06em}
  .cli-code-shell #cliToggleBtn{width:clamp(112px,34vw,132px);min-width:0;padding:8px 14px;border-radius:999px;position:absolute;left:50%;bottom:14px;transform:translateX(-50%);margin-top:0;background:rgba(58,66,76,.9);backdrop-filter:blur(4px)}
  .app-showcase{padding:22px 12px}
  .showcase-video{border-radius:10px}
  .cli-showcase{padding:22px 12px}
  .cli-code-shell{padding:20px 10px 14px}
  .cli-fig{font-size:.8rem;top:-12px}
  .cli-preview{font-size:.82rem;max-height:240px}
}

@media (max-width:560px){
  .hero{gap:12px;min-height:auto}
  .hero-badges{gap:6px}
  .badge{font-size:.74rem;padding:6px 10px}
  .nav-links a{font-size:.74rem}
  .btn{width:auto;max-width:100%}
  .info-grid,.download-grid,.cmd-grid,.tutorial-grid{gap:10px}
  .card{border-radius:14px}
  .showcase-badge{font-size:.74rem;padding:6px 10px}
}

@media (max-width:420px){
  .brand{gap:8px}
  .brand strong{font-size:1.02rem}
  .brand span{font-size:.7rem;letter-spacing:.08em}
  .lang-wrap{min-width:118px;width:auto}
  .lang-control{min-width:0;max-width:140px;width:auto}
  .lang-toggle{padding:8px 10px;font-size:.78rem}
  .hero h1{font-size:clamp(1.5rem,9vw,2rem)}
  .tutorial-cta-btn{font-size:.74rem;letter-spacing:.05em;padding:10px 14px}
  .cli-fig{position:static;transform:none;justify-self:center;margin-bottom:2px;white-space:normal;text-align:center}
}

/* Tutorial dedicated page */
.tutorial-page{font-family:"Plus Jakarta Sans","Inter","Segoe UI",system-ui,sans-serif}
.tutorial-hero h1{margin:0;font-size:clamp(2rem,4.5vw,3.3rem);letter-spacing:.01em}
.standalone-tutorial h2{margin-top:0;font-size:clamp(1.4rem,3vw,2rem)}
.standalone-tutorial .tutorial-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.standalone-tutorial .tutorial-item{border-radius:14px;padding:12px;background:#0a1326}
.standalone-tutorial .tutorial-item figcaption{font-size:.95rem;letter-spacing:.01em}
@media (max-width:980px){
  .standalone-tutorial .tutorial-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  .standalone-tutorial .tutorial-grid{grid-template-columns:1fr}
}

/* Docs-like tutorial page (no search/dashboard/signup) */
.tutorial-docs-body{background:radial-gradient(circle at 50% 20%,#1d2f57 0%,transparent 35%),linear-gradient(165deg,var(--bg),#0a1020);color:#eef2ff;font-family:Inter,"Segoe UI",system-ui,sans-serif}
.tutorial-docs-header{position:relative;z-index:40;background:transparent;border-bottom:0;backdrop-filter:none}
.tutorial-docs-inner{max-width:1200px;margin:0 auto;padding:14px 24px 8px}
.tutorial-docs-top{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:nowrap}
.tutorial-docs-brand{display:inline-flex;align-items:center;gap:12px;color:#fff;text-decoration:none}
.tutorial-docs-brand strong{font-size:1.75rem;line-height:1}
.tutorial-docs-brand span{font-size:1.45rem;letter-spacing:.18em;color:#cfd5e7}
.tutorial-docs-actions{display:flex;gap:18px;flex-wrap:nowrap;white-space:nowrap;overflow:auto;scrollbar-width:thin}
.tutorial-docs-actions a{display:inline-flex;align-items:center;color:#9aa6bf;text-decoration:none;font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:8px 0;border-bottom:2px solid transparent;transition:.18s ease}
.tutorial-docs-actions a:hover{color:#fff;border-bottom-color:#6d7687}
.tutorial-docs-tabs{display:flex;gap:20px;border-top:0;padding:2px 0 8px;overflow:auto;white-space:nowrap;scrollbar-width:thin}
.tutorial-docs-tabs a{color:#9aa6bf;text-decoration:none;font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:8px 0;border-bottom:2px solid transparent}
.tutorial-docs-tabs a:hover,.tutorial-docs-tabs a.active{color:#fff;border-bottom-color:#6d7687}

.tutorial-docs-actions a,.tutorial-docs-tabs a{white-space:nowrap}

@media (max-width:560px){
  .tutorial-docs-actions a{font-size:.76rem;padding:7px 0}
  .tutorial-docs-tabs{gap:12px;padding:2px 0 8px}
  .tutorial-docs-tabs a{font-size:.74rem}
  .tutorial-docs-main{padding-top:28px}
}

.tutorial-docs-main{max-width:1400px;margin:0 auto;padding:42px 24px 60px}
.tutorial-intro{max-width:860px;display:grid;gap:14px}
.tutorial-intro h1{margin:0;font-size:clamp(2rem,3vw,3.25rem);line-height:1.1;letter-spacing:-.02em}
.tutorial-intro p{margin:0;color:#afb9d1;font-size:1.15rem;line-height:1.6}
.tutorial-problems{margin-top:44px}
.tutorial-problems h2{margin:0 0 16px;font-size:2rem}
.tutorial-docs-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.tutorial-doc-card{border:1px solid #2a3344;border-radius:16px;background:#0c1017;padding:20px;display:grid;gap:10px;align-content:start;transition:.2s ease}
.tutorial-doc-card:hover{border-color:#3a4660;transform:translateY(-1px)}
.tutorial-icon{color:#76a8ff;font-size:1.15rem}
.tutorial-doc-card h3{margin:0;font-size:1.65rem;line-height:1.2;letter-spacing:-.01em}
.tutorial-doc-card p{margin:0;color:#acb8d4;font-size:1.02rem;line-height:1.55}
.tutorial-doc-card img{width:100%;height:auto;border-radius:12px;border:1px solid #2c374a;margin-top:6px}
.tutorial-doc-card.missing{color:#aeb9d3}
.tutorial-footer-note{display:flex;justify-content:center;margin-top:34px}

@media (max-width:1100px){
  .tutorial-docs-grid{grid-template-columns:1fr}
}
@media (max-width:800px){
  .tutorial-docs-inner,.tutorial-docs-main{padding-left:14px;padding-right:14px}
  .tutorial-docs-top{min-height:62px;flex-wrap:nowrap;padding:6px 0;gap:12px}
  .tutorial-docs-brand strong{font-size:1.4rem}
  .tutorial-docs-brand span{font-size:1.12rem;letter-spacing:.12em}
  .tutorial-docs-actions{width:auto;gap:12px}
  .tutorial-docs-tabs{gap:14px;overflow:auto;white-space:nowrap}
  .tutorial-intro p{font-size:1rem}
  .tutorial-doc-card{padding:16px}
  .tutorial-doc-card h3{font-size:1.35rem}
}

.tutorial-docs-footer{margin-top:0;background:transparent;border-top:0;position:relative;overflow:hidden}
.tutorial-docs-footer::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 72% 24%,#13304f55 0%,transparent 55%);pointer-events:none}
.tutorial-docs-footer-inner{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:56px 24px 148px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:34px}
.tutorial-docs-footer-brand{position:absolute;right:24px;bottom:30px;pointer-events:none}
.tutorial-docs-footer-brand h3{margin:0;color:#fff;display:flex;flex-direction:column;align-items:flex-end;gap:4px;line-height:.95}
.tutorial-docs-footer-brand span{font-size:clamp(3.2rem,10vw,7.4rem);line-height:.9;font-weight:800;opacity:.16;letter-spacing:-.02em}
.tutorial-docs-footer-brand small{font-size:clamp(1.05rem,2vw,1.55rem);letter-spacing:.25em;color:#a9b7d4;opacity:.75}
.tutorial-docs-footer h3,.tutorial-docs-footer h4{margin:0 0 16px;font-size:.95rem;color:#f4f7ff;letter-spacing:.08em;text-transform:uppercase}
.tutorial-docs-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tutorial-docs-footer a,.tutorial-docs-footer li{color:#aeb9d3;text-decoration:none;font-size:1.03rem;line-height:1.45}
.tutorial-docs-footer a:hover{color:#fff}
.social-links a{display:inline-flex;align-items:center;gap:8px}
.social-links i{font-size:1rem;opacity:.9}

@media (max-width:1000px){
  .tutorial-docs-footer-inner{grid-template-columns:1fr 1fr;gap:24px;padding:42px 16px 118px}
}
@media (max-width:700px){
  .tutorial-docs-footer-inner{padding:30px 14px 26px;grid-template-columns:1fr;gap:18px}
  .tutorial-docs-footer-brand{position:static;pointer-events:auto;justify-self:end}
  .tutorial-docs-footer-brand h3{align-items:flex-end}
  .tutorial-docs-footer-brand span{font-size:2.4rem;opacity:.34}
  .tutorial-docs-footer-brand small{font-size:.95rem;opacity:.9}
}

/* Download page redesign (ngrok-like layout) */
.download-showcase-body{margin:0;min-height:100vh;color:#eef2ff;font-family:Inter,"Segoe UI",system-ui,sans-serif;background:radial-gradient(circle at 50% 20%,#1d2f57 0%,transparent 35%),linear-gradient(165deg,var(--bg),#0a1020)}
.download-showcase-header{max-width:1280px;margin:0 auto;padding:18px 24px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.download-showcase-main{max-width:1280px;margin:0 auto;padding:10px 24px 54px}
.download-showcase-hero{text-align:center;padding:28px 0 38px}
.download-showcase-hero h1{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.45rem,6vw,4.15rem);font-weight:500;letter-spacing:.01em}
.download-showcase-hero p{margin:12px auto 0;max-width:660px;color:#bfc8de;font-size:clamp(1rem,1.8vw,1.12rem);line-height:1.45}
.download-showcase-layout{display:grid;grid-template-columns:210px 1fr;gap:22px;align-items:start}
.download-showcase-sidebar{padding:14px 0 0}
.download-showcase-sidebar h3{margin:0 0 10px;color:#8f9bb6;font-size:.78rem;letter-spacing:.18em;font-weight:700}
.download-showcase-sidebar ul{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:6px}
.download-showcase-sidebar li{display:flex;align-items:center;gap:9px;padding:6px 10px;border-radius:8px;color:#aab5cd}
.download-showcase-sidebar li.active{background:linear-gradient(90deg,#3f67f5,#4d77fb);color:#fff}
.download-showcase-panel{background:#0e1118e6;border:1px solid #2b3245;border-radius:16px;padding:22px;box-shadow:0 18px 34px #0008}
.download-showcase-panel-head{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.download-os-icon{width:84px;height:84px;border-radius:16px;background:#0a0d12;border:1px solid #32384a;display:grid;place-items:center}
.windows-logo-svg{width:42px;height:42px;display:block}
.download-tag{display:inline-block;background:#2a303d;border:1px solid #3b4455;color:#dce4f7;padding:2px 8px;border-radius:7px;font-size:.75rem}
.download-showcase-panel h2{margin:8px 0 0;font-size:2.6rem;line-height:1.1}
.download-inline-tabs{display:flex;gap:22px;border-bottom:1px solid #2c3447;padding-bottom:12px;margin:12px 0 16px;overflow:auto}
.download-inline-tabs a{color:#9ca8c6;text-decoration:none;padding-bottom:10px;border-bottom:2px solid transparent;white-space:nowrap}
.download-inline-tabs a.active,.download-inline-tabs a:hover{color:#74a2ff;border-bottom-color:#74a2ff}
.download-panel-desc{margin:0 0 16px;color:#c3cbe1}
.download-arch-intro{font-size:1.02rem;max-width:920px;line-height:1.45;margin-bottom:16px}
.download-arch-intro a{color:#66a2ff;text-decoration:none}
.download-arch-intro a:hover{text-decoration:underline}
.download-arch-list{display:grid;gap:10px;margin-bottom:10px}
.download-arch-row{display:grid;gap:8px}
.download-arch-row label{font-size:.95rem;font-weight:600;color:#dce5fb}
.download-arch-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}
.download-arch-select{appearance:none;-webkit-appearance:none;width:100%;min-height:44px;padding:10px 42px 10px 14px;border-radius:10px;border:1px solid #2f3d61;background:#0a0e18;color:#eef3ff;font-size:1rem;line-height:1.2;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23c7d2ef' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
.download-arch-select:focus{outline:none;border-color:#5d8dff;box-shadow:0 0 0 2px #3868d544}
.download-action-btn{min-height:44px;padding:10px 20px;border-radius:8px;background:linear-gradient(180deg,#4f7dff,#3e6dfa);border-color:#6f93ff;color:#fff;font-weight:700}
.download-action-btn:hover{border-color:#89a9ff;background:linear-gradient(180deg,#5e89ff,#4c78fa);transform:none}
.download-tab-panels{display:grid}
.download-tab-panel{display:none}
.download-tab-panel.active{display:block}
.download-tab-panel .cmd-block{background:#0a0f1a;border:1px solid #2f3c5d;border-radius:12px;padding:12px;display:grid;gap:8px}
.download-tab-panel .cmd-block h4{margin:0;font-size:1rem}
.download-tab-panel pre{min-height:180px;background:#060a13;border-color:#24314e}
.download-tab-panel .btn{min-height:40px;background:#101a30;border-color:#2f436d;width:fit-content}
.download-showcase-panel .download-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.download-showcase-panel .download-btn{background:#0b101d;border-color:#2e3c5e;justify-content:space-between}
.quickcmd-shell{margin-top:18px;padding-top:14px;border-top:1px solid #2c3447}
.quickcmd-shell h3{margin:0 0 4px;font-size:1.45rem}
.quickcmd-shell .muted{margin:0 0 10px;color:#a9b3cc}
.quickcmd-shell .cmd-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.quickcmd-shell .cmd-block{background:#0a0f1a;border:1px solid #2f3c5d;border-radius:12px;padding:12px;display:grid;gap:8px}
.quickcmd-shell .cmd-block h4{margin:0;font-size:1rem}
.quickcmd-shell pre{min-height:70px;background:#060a13;border-color:#24314e}
.quickcmd-shell .btn{min-height:40px;background:#101a30;border-color:#2f436d}

@media (max-width:980px){
  .download-showcase-layout{grid-template-columns:1fr}
  .download-showcase-sidebar{padding:0}
  .download-showcase-sidebar ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quickcmd-shell .cmd-grid,.download-showcase-panel .download-grid{grid-template-columns:1fr}
  .download-arch-controls{grid-template-columns:1fr}
}

@media (max-width:620px){
  .download-showcase-header,.download-showcase-main{padding-left:14px;padding-right:14px}
  .download-showcase-header{flex-direction:column;align-items:flex-start}
  .download-showcase-hero{padding-top:12px}
  .download-showcase-panel{padding:16px}
  .download-showcase-panel-head{align-items:flex-start}
  .download-showcase-panel h2{font-size:2rem}
}