:root{
  --bg:#05070a;
  --sidebar:#0b1016;
  --top:#0a111a;
  --band:#0c1724;
  --card:#03070b;
  --line:#21344a;
  --line-soft:#142231;
  --text:#f5f7fa;
  --muted:#9aa7b7;
  --red:#f0333a;
  --red-dark:#db1920;
  --blue:#4da6ff;
  --side-w:222px;
  --font-body:"Plus Jakarta Sans",Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-display:"Oswald","Arial Narrow",Impact,sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,a{font:inherit;color:inherit}button{cursor:pointer}a{text-decoration:none}
.app-shell{min-height:100vh;display:grid;grid-template-columns:var(--side-w) minmax(0,1fr);background:#05070a}
.sidebar{height:100vh;position:sticky;top:0;z-index:20;display:flex;flex-direction:column;overflow:hidden;background:var(--sidebar);border-right:1px solid #121a24}
.brand-block{height:132px;padding:15px 20px 8px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}
.brand-logo{width:154px;height:66px;object-fit:contain;filter:drop-shadow(0 3px 11px rgba(240,51,58,.14))}
.brand-sub{margin-top:0;color:#8592a1;font-size:10px;font-weight:700;letter-spacing:3.9px;line-height:1}
.side-nav{padding:7px 11px 154px;overflow-y:auto;scrollbar-width:none}.side-nav::-webkit-scrollbar{display:none}
.nav-item{min-height:37px;display:flex;align-items:center;gap:11px;padding:8px 11px;border-radius:9px;color:#e0e5eb;font-size:12.3px;font-weight:600;transition:background .16s,color .16s}
.nav-item:hover{background:#121923;color:#fff}.nav-item svg{width:16px;height:16px;flex:none;fill:none;stroke:#8b98a8;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.nav-item.active{background:transparent;color:#fff}.nav-item.active svg{stroke:#35a7ff;filter:drop-shadow(0 0 5px rgba(53,167,255,.32))}
.nav-item .chevron{margin-left:auto;color:#a7b0ba;font-size:20px;font-weight:300;line-height:1}
.nav-section{padding:19px 11px 7px;color:#7e8a9a;font-size:9.8px;font-weight:800;letter-spacing:1.8px}.nav-section.two-line{line-height:1.55}
.sidebar-bottom{position:absolute;left:10px;right:10px;bottom:10px;display:grid;gap:10px;padding-top:21px;background:linear-gradient(180deg,rgba(11,16,22,0),#0b1016 18%,#0b1016)}
.plan-card,.profile-card{width:100%;min-height:58px;border:1px solid #1a2330;border-radius:12px;background:#121820;display:flex;align-items:center;gap:11px;text-align:left;padding:10px 12px}
.plan-card{background:linear-gradient(90deg,rgba(87,11,22,.48),rgba(54,16,25,.38));border-color:#35151e}.plan-card:hover,.profile-card:hover{border-color:#2a394b}
.plan-icon{width:29px;height:29px;display:grid;place-items:center;border-radius:9px;border:1px solid rgba(240,51,58,.35);color:#ff4650}.avatar{width:35px;height:35px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(135deg,#ff3037,#c4111b);font-weight:800}
.plan-card b,.profile-card b{display:block;font-size:12px}.plan-card small,.profile-card small{display:block;margin-top:3px;color:#7f8b9b;font-size:10px}
.workspace{min-width:0;background:#06080c}.topbar{height:58px;position:sticky;top:0;z-index:15;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 28px;background:rgba(10,17,26,.97);backdrop-filter:blur(14px);border-bottom:1px solid #111b27}
.topbar-left,.topbar-right{display:flex;align-items:center;gap:9px;min-width:0}.top-chip,.icon-chip{height:34px;border:1px solid #192534;border-radius:9px;background:#121c28;color:#dce3eb;font-size:11px;font-weight:650;white-space:nowrap}.top-chip{padding:0 13px}.icon-chip{width:34px;padding:0;position:relative}.top-chip:hover,.icon-chip:hover{background:#182433;border-color:#26384d}
.activation{height:34px;display:flex;align-items:center;overflow:hidden;border:1px solid #192534;border-radius:9px;background:#101823;color:#8390a0;font-size:10px;white-space:nowrap}.activation>span:not(.status-dot){padding:0 12px}.activation .status-dot{width:6px;height:6px;border-radius:50%;background:#68788c;margin-left:13px}.activation button{height:100%;border:0;padding:0 18px;background:var(--red);color:#fff;font-weight:750}.badge{position:absolute;top:-8px;right:-5px;width:18px;height:18px;display:grid;place-items:center;border:2px solid #0a1019;border-radius:50%;background:#e8232e;color:#fff;font-size:9px}.language{min-width:80px}
.content{min-height:calc(100vh - 58px);background:#06080c}
.hero{padding:30px 72px 14px;text-align:center;display:flex;flex-direction:column;align-items:center;background:radial-gradient(ellipse at 50% 54%,rgba(219,25,32,.15),rgba(77,166,255,.035) 36%,transparent 67%);position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.22;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse at 50% 33%,#000 22%,transparent 72%);mask-image:radial-gradient(ellipse at 50% 33%,#000 22%,transparent 72%)}.hero>*{position:relative;z-index:1}
.meta-pill{height:28px;display:inline-flex;align-items:center;gap:8px;padding:0 15px;border:1px solid rgba(255,255,255,.045);border-radius:18px;background:rgba(34,35,49,.86);color:#dce2e9;font-size:10px;font-weight:750;letter-spacing:.65px;box-shadow:0 7px 24px rgba(0,0,0,.2)}.meta-pill b{color:#4db7ff}.blue-dot{width:6px;height:6px;border-radius:50%;background:#4da6ff;box-shadow:0 0 10px rgba(77,166,255,.55)}
.hero-title-panel{width:min(100%,1058px);height:65px;margin-top:11px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.025);border-radius:16px;background:linear-gradient(90deg,#0b1119,#0c131d 48%,#0a1119);box-shadow:0 16px 48px rgba(0,0,0,.25)}
h1{margin:0;font-family:var(--font-display);font-size:clamp(42px,4.05vw,56px);font-weight:400;line-height:1;letter-spacing:.015em;text-transform:uppercase;color:#fff;white-space:nowrap}h1 em,h1 strong{font-style:normal;font-weight:500;color:var(--red);text-shadow:0 0 46px rgba(240,51,58,.28)}
.brand-promise{height:38px;margin-top:9px;padding:0 17px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.11);border-radius:9px;background:linear-gradient(180deg,rgba(45,32,40,.72),rgba(27,24,31,.7));font-family:var(--font-display);font-size:clamp(15px,1.35vw,19px);font-weight:400;line-height:1;letter-spacing:.02em;color:#f4f2f4}
.hero-kicker{height:24px;margin-top:9px;padding:0 18px;display:inline-flex;align-items:center;justify-content:center;background:rgba(92,12,22,.24);font-family:var(--font-display);font-size:12px;font-weight:400;letter-spacing:.02em;color:#fff}
.quick-tools{height:126px;padding:14px 60px 16px;background:#0c1724;border-top:1px solid #102031;border-bottom:1px solid #112334;display:flex;align-items:center}.quick-grid{width:min(100%,970px);margin:0 auto;display:grid;gap:10px}.quick-row{display:flex;align-items:center;justify-content:center;gap:27px;min-height:16px}.quick-link{padding:0;border:0;background:transparent;color:#fff;font-family:var(--font-display);font-size:14px;font-weight:400;line-height:1;text-transform:uppercase;letter-spacing:.01em;position:relative}.quick-link:hover{color:#55b8ff}.quick-link::after{content:"";position:absolute;left:50%;right:50%;bottom:-4px;height:1px;background:#4da6ff;transition:.16s}.quick-link:hover::after{left:0;right:0}
.tool-section{padding:31px 72px 48px;background:#05080c}.tool-grid{width:min(100%,1020px);margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:18px;row-gap:18px}
.tool-card{height:90px;min-width:0;display:grid;grid-template-columns:120px minmax(0,1fr);overflow:hidden;position:relative;border:1px solid #22364c;border-radius:10px;background:#020508;box-shadow:0 8px 22px rgba(0,0,0,.27);transition:transform .16s,border-color .16s,box-shadow .16s}.tool-card:hover{transform:translateY(-2px);border-color:#3b5d7f;box-shadow:0 14px 28px rgba(0,0,0,.36)}.tool-card.integration{border-color:#244564}
.tool-visual{position:relative;overflow:hidden;background:#08111c}.tool-visual img{width:100%;height:100%;display:block;object-fit:cover;object-position:center center}.tool-visual::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 58%,rgba(2,5,8,.3) 82%,#020508 100%)}
.tool-copy{min-width:0;position:relative;display:flex;flex-direction:column;justify-content:center;padding:11px 31px 10px 12px;background:#020508}.tool-card.integration .tool-copy{background:linear-gradient(135deg,#030609,#07111d)}.tool-title{color:#f6f7f8;font-size:11.6px;font-weight:700;line-height:1.17}.tool-desc{max-width:132px;margin-top:6px;color:#a7b2c0;font-size:9.2px;font-weight:400;line-height:1.37}
.tool-arrow{position:absolute;right:8px;bottom:8px;width:25px;height:25px;display:grid;place-items:center;border:1px solid #31506f;border-radius:50%;background:#1d3550;color:#fff;transition:background .16s,transform .16s}.tool-arrow svg{display:block;width:10px;height:10px;overflow:visible}.tool-arrow path{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.tool-card:hover .tool-arrow{background:#28577f;transform:translateX(1px)}
.site-footer{min-height:78px;display:flex;align-items:center;justify-content:center;gap:18px;padding:22px 28px 28px;color:#77879a;font-size:9.8px}.site-footer nav{display:flex;gap:18px}.site-footer a{color:#f1f3f5}.site-footer a:hover{color:#55b8ff}
.toast{position:fixed;right:24px;bottom:24px;z-index:100;max-width:360px;padding:12px 15px;border:1px solid #284059;border-radius:10px;background:#101927;color:#f3f6f8;font-size:12px;box-shadow:0 16px 48px rgba(0,0,0,.45);opacity:0;transform:translateY(12px);pointer-events:none;transition:.22s}.toast.show{opacity:1;transform:translateY(0)}
@media(max-width:1280px){:root{--side-w:210px}.topbar{padding:0 18px}.activation>span:not(.status-dot){display:none}.hero{padding-left:42px;padding-right:42px}.hero-title-panel{width:min(100%,990px)}.quick-tools{padding-left:30px;padding-right:30px}.tool-section{padding-left:48px;padding-right:48px}.tool-grid{width:min(100%,930px);column-gap:16px;row-gap:16px}.tool-card{height:86px;grid-template-columns:115px minmax(0,1fr)}.tool-title{font-size:11px}.tool-desc{font-size:8.8px}}
@media(max-width:1050px){.app-shell{grid-template-columns:76px 1fr}.brand-block{padding:14px 7px}.brand-logo{width:66px;object-fit:cover;object-position:left}.brand-sub,.nav-item span:not(.chevron),.nav-section,.sidebar-bottom b,.sidebar-bottom small{display:none}.nav-item{justify-content:center}.nav-item .chevron{display:none}.sidebar-bottom{left:8px;right:8px}.plan-card,.profile-card{justify-content:center;padding:10px}.topbar-left .top-chip:nth-child(n+2){display:none}.quick-tools{height:auto;min-height:126px}.quick-row{flex-wrap:wrap}.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:720px;column-gap:16px;row-gap:16px}.tool-card{height:104px;grid-template-columns:139px minmax(0,1fr)}h1{font-size:42px}.site-footer{flex-direction:column;gap:10px}}
@media(max-width:680px){.app-shell{display:block}.sidebar{display:none}.topbar{position:static;overflow-x:auto}.topbar-right{display:none}.hero{padding:24px 16px 14px}.hero-title-panel{height:auto;min-height:62px;padding:8px}.hero-title-panel h1{font-size:32px;white-space:normal}.brand-promise{height:auto;min-height:38px;padding:9px 14px;font-size:14px}.quick-tools{padding:14px 16px}.quick-grid{gap:13px}.quick-row{gap:12px 18px}.quick-link{font-size:12px}.tool-section{padding:20px 16px}.tool-grid{grid-template-columns:1fr;gap:16px}.tool-card{height:116px;grid-template-columns:155px minmax(0,1fr)}.tool-title{font-size:12px}.tool-desc{font-size:9.5px}.site-footer nav{flex-wrap:wrap;justify-content:center}}


/* ACCESSIBILITY RELEASE GUARD */
button:focus-visible,a:focus-visible,.tool-card:focus-visible{outline:2px solid #5eb5ff;outline-offset:3px}.tool-card:focus-visible{border-color:#5eb5ff;box-shadow:0 0 0 3px rgba(94,181,255,.12),0 14px 28px rgba(0,0,0,.36)}.quick-link:focus-visible{color:#7bc8ff}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Live release QA: keep tool forms within intermediate and mobile viewports. */
@media (min-width:1101px) and (max-width:1250px){
 body[class*="-page"] [class$="-layout"]{grid-template-columns:minmax(0,1fr) 300px}
}
@media (max-width:900px){
 body[class*="-page"] [class$="-heading"]{flex-wrap:wrap}
 body[class*="-page"] [class$="-heading"]>div:first-child{min-width:0;max-width:100%}
}
@media (max-width:940px){
 body.unit-page .unit-layout{grid-template-columns:minmax(0,1fr)}
 body.unit-page .converter-card{min-width:0}
}
@media (max-width:640px){
 body.margin-page .m-heading h1 em,body.discount-page .d-heading h1 em{display:block}
}