:root{
  --bg:#ffffff; --bg-soft:#f0f9ff; --bg-card:#ffffff; --border:#e0f2fe;
  --text:#0f172a; --text-soft:#475569; --accent:#0284c7; --accent-2:#0ea5e9;
  --chip:#e0f2fe; --ad:#f8fafc; --shadow:0 1px 3px rgba(2,132,199,.08);
}
body.dark{
  --bg:#0b1220; --bg-soft:#0f1b2d; --bg-card:#111f33; --border:#1e3a5f;
  --text:#e2f0ff; --text-soft:#94b8d8; --accent:#38bdf8; --accent-2:#0ea5e9;
  --chip:#123453; --ad:#0f1b2d; --shadow:0 1px 3px rgba(0,0,0,.4);
}
*{margin:0;padding:0;box-sizing:border-box;font-family:'Segoe UI',system-ui,-apple-system,sans-serif}
body{background:var(--bg);color:var(--text)}
a{color:var(--accent)}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
svg.i{width:20px;height:20px;fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
header{background:var(--bg);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50}
.hrow{display:flex;align-items:center;gap:18px;padding:14px 20px;max-width:1180px;margin:0 auto}
.logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:20px;color:var(--text);white-space:nowrap;text-decoration:none}
.logo .mark{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,#0ea5e9,#0284c7);display:flex;align-items:center;justify-content:center;flex:none}
.logo .mark svg{width:19px;height:19px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.logo span.pro{color:var(--accent)}
nav{display:flex;gap:20px;font-size:14px;font-weight:600;color:var(--text-soft);margin-left:8px}
nav a{color:inherit;text-decoration:none}
nav a.on{color:var(--accent)}
.mnav-btn{display:none;width:38px;height:38px;border-radius:10px;border:1px solid var(--border);background:var(--bg-soft);color:var(--accent);font-size:16px;align-items:center;justify-content:center;cursor:pointer}
.mnav{display:none;flex-direction:column;gap:2px;padding:8px 20px 14px;border-top:1px solid var(--border);background:var(--bg)}
.mnav a{font-size:14px;font-weight:600;color:var(--text-soft);text-decoration:none;padding:8px 4px;border-bottom:1px solid var(--border)}
.mnav a:last-child{border:none}
.hsearch{flex:1;display:flex;align-items:center;background:var(--bg-soft);border:1px solid var(--border);border-radius:10px;padding:0 14px;font-size:13.5px;color:var(--text-soft);gap:8px;min-width:120px}
.hsearch svg{width:15px;height:15px;stroke:#94a3b8;fill:none;stroke-width:2;stroke-linecap:round;flex:none}
.hsearch input{flex:1;border:none;background:transparent;padding:9px 0;font-size:13.5px;color:var(--text);outline:none;font-family:inherit}
.toggle{width:38px;height:38px;border-radius:10px;border:1px solid var(--border);background:var(--bg-soft);display:flex;align-items:center;justify-content:center;flex:none;cursor:pointer}
.toggle svg{width:17px;height:17px;stroke:var(--accent);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hero{background:linear-gradient(180deg,var(--bg-soft),var(--bg));padding:52px 20px 40px;text-align:center}
.hero .pill{display:inline-block;background:var(--chip);color:var(--accent);font-size:12.5px;font-weight:700;padding:6px 14px;border-radius:999px;margin-bottom:16px}
.hero h1{font-size:42px;line-height:1.15;font-weight:800;letter-spacing:-.5px}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero p{margin:14px auto 22px;max-width:560px;color:var(--text-soft);font-size:15.5px;line-height:1.6}
.bigsearch{max-width:600px;margin:0 auto;display:flex;background:var(--bg-card);border:1.5px solid var(--border);border-radius:14px;padding:6px;box-shadow:var(--shadow)}
.bigsearch .field{flex:1;display:flex;align-items:center;gap:10px;padding:0 14px;color:var(--text-soft);font-size:14.5px}
.bigsearch .field svg{width:16px;height:16px;stroke:#94a3b8;fill:none;stroke-width:2;stroke-linecap:round;flex:none}
.bigsearch input{flex:1;border:none;background:transparent;padding:12px 0;font-size:14.5px;color:var(--text);outline:none;font-family:inherit}
.bigsearch .go{background:var(--accent);color:#fff;border:none;border-radius:10px;padding:0 24px;font-weight:700;font-size:14px;cursor:pointer;font-family:inherit}
.chips{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin-top:18px}
.chips a{background:var(--bg-card);border:1px solid var(--border);color:var(--text-soft);font-size:12.5px;font-weight:600;padding:7px 13px;border-radius:999px;text-decoration:none}
.ad{display:flex;align-items:center;justify-content:center;background:var(--ad);border:1px dashed #93c5fd;color:#64748b;font-size:12px;letter-spacing:.4px;border-radius:8px}
.ad.leader{max-width:760px;height:96px;margin:26px auto}
section{padding:34px 0}
.stitle{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:20px}
.stitle h2{font-size:24px;font-weight:800;letter-spacing:-.3px}
.stitle a{font-size:13.5px;font-weight:700;color:var(--accent);text-decoration:none;white-space:nowrap}
.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.cat{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:20px;box-shadow:var(--shadow);text-decoration:none;color:var(--text);display:block}
.cat .ic{width:44px;height:44px;border-radius:11px;background:var(--bg-soft);display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.cat h3{font-size:15.5px;font-weight:700;margin-bottom:5px}
.cat p{font-size:12.8px;color:var(--text-soft);line-height:1.5}
.cat .n{display:inline-block;margin-top:10px;font-size:11.5px;font-weight:700;color:var(--accent);background:var(--chip);padding:3px 9px;border-radius:999px}
.cat.soon{opacity:.65}
.feature{background:var(--bg-soft);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.fgrid{display:grid;grid-template-columns:1.6fr 1fr;gap:22px;align-items:stretch}
.fcard{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:26px;box-shadow:var(--shadow)}
.fcard .tag{display:inline-block;background:#fef3c7;color:#92400e;font-size:11.5px;font-weight:800;padding:4px 11px;border-radius:999px;margin-bottom:12px;letter-spacing:.3px}
body.dark .fcard .tag{background:#3a2c08;color:#fcd34d}
.fcard h3{font-size:21px;font-weight:800;margin-bottom:8px;display:flex;align-items:center;gap:10px}
.fcard h3 svg{flex:none}
.fcard>p{font-size:13.8px;color:var(--text-soft);line-height:1.6;margin-bottom:16px}
.flist{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:18px}
.flist div{display:flex;gap:8px;font-size:12.8px;color:var(--text-soft);align-items:flex-start;line-height:1.45}
.flist svg{width:14px;height:14px;flex:none;margin-top:2px;stroke:var(--accent);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.btn{display:inline-block;background:var(--accent);color:#fff;font-size:14px;font-weight:700;padding:12px 22px;border-radius:11px;text-decoration:none;border:none;cursor:pointer;font-family:inherit}
.btn.ghost{background:transparent;color:var(--accent);border:1.5px solid var(--accent);margin-left:10px}
.side-ad{display:flex;flex-direction:column;gap:16px}
.ad.rect{flex:1;min-height:250px}
.mini{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:16px;box-shadow:var(--shadow)}
.mini h4{font-size:13.5px;font-weight:700;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.mini ul{list-style:none}
.mini li{font-size:12.8px;color:var(--text-soft);padding:6px 0;border-bottom:1px solid var(--border);display:flex;justify-content:space-between}
.mini li:last-child{border:none}
.mini li b{color:var(--accent);font-weight:600}
.mini a{color:inherit;text-decoration:none;display:flex;justify-content:space-between}
.tools{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.tool{background:var(--bg-card);border:1px solid var(--border);border-radius:13px;padding:16px;box-shadow:var(--shadow);display:flex;gap:12px;align-items:flex-start;text-decoration:none;color:var(--text)}
.tool .ic{width:38px;height:38px;flex:none;border-radius:10px;background:var(--bg-soft);display:flex;align-items:center;justify-content:center}
.tool .ic svg{width:18px;height:18px}
.tool h4{font-size:13.8px;font-weight:700;margin-bottom:3px}
.tool p{font-size:12px;color:var(--text-soft);line-height:1.45}
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.titem{background:var(--bg-card);border:1px solid var(--border);border-radius:13px;padding:18px;text-align:center}
.titem .ic{width:44px;height:44px;margin:0 auto 10px;border-radius:11px;background:var(--bg-soft);display:flex;align-items:center;justify-content:center}
.titem h4{font-size:14px;font-weight:700;margin-bottom:4px}
.titem p{font-size:12.3px;color:var(--text-soft);line-height:1.5}
footer{background:var(--bg-soft);border-top:1px solid var(--border);padding:30px 0;margin-top:20px}
.fcols{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.fcols h5{font-size:13px;font-weight:800;margin-bottom:10px}
.fcols a{display:block;font-size:12.5px;color:var(--text-soft);text-decoration:none;padding:3px 0}
.copy{font-size:11.8px;color:var(--text-soft);margin-top:22px;text-align:center;line-height:1.6}
.cookiebar{padding:0 0 26px;background:var(--bg-soft)}
.cookie{max-width:820px;margin:0 auto;background:var(--bg-card);border:1.5px solid var(--border);border-radius:14px;padding:16px 18px;box-shadow:0 8px 30px rgba(2,132,199,.14);display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.cookie p{flex:1;min-width:240px;font-size:12.5px;color:var(--text-soft);line-height:1.5;display:flex;gap:8px;align-items:flex-start}
.cookie p svg{flex:none;margin-top:1px;width:15px;height:15px}
.cookie .cbtns{display:flex;gap:10px;flex-wrap:wrap}
.cookie button{font-family:inherit;cursor:pointer}
.cookie .cbtn{background:var(--accent);color:#fff;font-size:12.5px;font-weight:700;padding:9px 16px;border-radius:9px;white-space:nowrap;border:none}
.cookie .crej{background:transparent;color:var(--text-soft);border:1.5px solid var(--border);font-size:12.5px;font-weight:700;padding:9px 16px;border-radius:9px;white-space:nowrap}
.cookie .cghost{font-size:12.5px;font-weight:700;color:var(--accent);white-space:nowrap;padding:9px 4px;background:none;border:none}
/* tool pages */
.crumb{font-size:12.5px;color:var(--text-soft);padding:16px 0 0;font-weight:600}
.crumb a{color:var(--text-soft);text-decoration:none}
.crumb b{color:var(--accent);font-weight:700}
.toolhero{padding:26px 0 8px}
.toolhero h1{font-size:30px;font-weight:800;letter-spacing:-.4px;display:flex;align-items:center;gap:12px}
.toolhero h1 .hic{width:46px;height:46px;flex:none;border-radius:12px;background:var(--chip);display:flex;align-items:center;justify-content:center}
.toolhero h1 .hic svg{width:22px;height:22px}
.toolhero p{margin-top:8px;color:var(--text-soft);font-size:14px;max-width:680px;line-height:1.6}
.toolgrid{display:grid;grid-template-columns:1.6fr 1fr;gap:22px;padding:22px 0 34px;align-items:start}
.panel{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:var(--shadow);margin-bottom:18px}
.panel h2{font-size:17px;font-weight:800;margin-bottom:16px;letter-spacing:-.2px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.frow.one{grid-template-columns:1fr}
label{display:block;font-size:12.5px;font-weight:700;color:var(--text-soft);margin-bottom:6px}
input.ain,select.ain{width:100%;background:var(--bg-soft);border:1.5px solid var(--border);border-radius:10px;padding:11px 13px;font-size:13.5px;color:var(--text);outline:none;font-family:inherit}
input.ain:focus,select.ain:focus{border-color:var(--accent)}
.calcbtn{display:block;width:100%;text-align:center;background:var(--accent);color:#fff;font-weight:700;font-size:14.5px;padding:14px;border-radius:12px;margin-top:6px;border:none;cursor:pointer;font-family:inherit}
.result .totalrow,.panel .totalrow{display:flex;margin-top:10px;justify-content:space-between;align-items:baseline;background:var(--bg-soft);border:1px solid var(--border);border-radius:12px;padding:16px 18px;margin-bottom:16px;gap:10px;flex-wrap:wrap}
.result .totalrow b,.panel .totalrow b{font-size:24px;font-weight:800;color:var(--accent);letter-spacing:-.5px}
.result .totalrow span,.panel .totalrow span{font-size:12px;font-weight:700;color:var(--text-soft);text-transform:uppercase;letter-spacing:.05em}
.outgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.out{background:var(--bg-soft);border:1px solid var(--border);border-radius:12px;padding:14px 16px}
.out span{display:block;font-size:11px;font-weight:700;color:var(--text-soft);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px}
.out b{font-size:18px;font-weight:800;color:var(--accent)}
table.rt{width:100%;border-collapse:collapse;font-size:12.8px}
table.rt th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-soft);padding:8px 10px;border-bottom:2px solid var(--border)}
table.rt td{padding:8px 10px;border-bottom:1px solid var(--border);color:var(--text-soft)}
table.rt td:last-child,table.rt th:last-child{text-align:right}
table.rt td b{color:var(--text);font-weight:700}
table.rt tr.tot td{font-weight:800;color:var(--text);border-bottom:none;background:var(--bg-soft)}
.note{font-size:11.5px;color:var(--text-soft);margin-top:14px;line-height:1.5;background:var(--bg-soft);border:1px solid var(--border);border-radius:10px;padding:10px 12px}
.rel{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:16px;box-shadow:var(--shadow);margin-bottom:16px}
.rel h4{font-size:13.5px;font-weight:800;margin-bottom:8px}
.rel a{display:flex;justify-content:space-between;font-size:12.8px;color:var(--text-soft);text-decoration:none;padding:7px 0;border-bottom:1px solid var(--border)}
.rel a:last-child{border:none}
.rel a b{color:var(--accent);font-weight:600}
.hidden{display:none!important}
.err{color:#b91c1c;font-size:12.5px;font-weight:600;margin-top:10px}
body.dark .err{color:#fca5a5}
/* content pages */
.content{max-width:820px;margin:0 auto;padding:30px 20px}
.content h1{font-size:26px;font-weight:800;margin-bottom:14px;letter-spacing:-.3px}
.content h2{font-size:17px;font-weight:800;margin:22px 0 8px}
.content p,.content li{font-size:14px;color:var(--text-soft);line-height:1.7;margin-bottom:10px}
.content ul{padding-left:20px}
.sr{display:flex;flex-direction:column;gap:12px}
.sr .tool{padding:18px}
@media(max-width:860px){
  nav{display:none}
  .mnav-btn{display:flex}
  .mnav.open{display:flex}
  .hero h1{font-size:29px}
  .cats,.tools{grid-template-columns:1fr 1fr}
  .fgrid,.trust{grid-template-columns:1fr}
  .flist{grid-template-columns:1fr}
  .hsearch{display:none}
  .cookie{flex-direction:column;align-items:stretch}
  .toolgrid,.frow{grid-template-columns:1fr}
  .outgrid{grid-template-columns:1fr 1fr}
  .toolhero h1{font-size:22px}
}
@media print{
  header,footer,.cookiebar,.side-ad,.calcbtn,.actions,.mnav,.ad{display:none!important}
  .toolgrid{grid-template-columns:1fr}
}

/* fixes + new components (74-tool build) */
.fcols a.logo{display:flex}
.mini li{display:block}
.mini li a{width:100%;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.mini li a b{flex:none}
textarea.ain{width:100%;background:var(--bg-soft);border:1.5px solid var(--border);border-radius:10px;padding:11px 13px;font-size:13.5px;color:var(--text);outline:none;font-family:ui-monospace,Menlo,Consolas,monospace;resize:vertical}
textarea.ain:focus{border-color:var(--accent)}
input.filein{padding:9px}
.filehint{font-size:11.5px;color:var(--text-soft);margin-top:6px;word-break:break-all}
.outwrap{position:relative;margin-top:14px}
.outpre{background:var(--bg-soft);border:1px solid var(--border);border-radius:10px;padding:14px;font-size:12.5px;line-height:1.55;white-space:pre-wrap;word-break:break-word;max-height:340px;overflow:auto;font-family:ui-monospace,Menlo,Consolas,monospace;color:var(--text)}
.copybtn{position:absolute;top:8px;right:8px;padding:6px 14px;font-size:12px;margin:0}
.dbtn{display:inline-block;margin-top:14px;background:var(--accent);color:#fff;font-weight:700;font-size:13.5px;padding:12px 22px;border-radius:12px;text-decoration:none}
.serp{background:#fff;border:1px solid var(--border);border-radius:10px;padding:14px 16px;margin-top:14px}
.serp-url{font-size:12px;color:#202124;margin-bottom:4px;word-break:break-all}
.serp-title{color:#1a0dab;font-size:18px;line-height:1.3;margin-bottom:4px}
.serp-desc{font-size:13px;color:#4d5156;line-height:1.5}
body.dark .serp{background:#111f33}
body.dark .serp-url{color:#c2d5e8}
body.dark .serp-title{color:#8ab4f8}
body.dark .serp-desc{color:#b7c4d4}
@media print{.cookiebar{display:none!important}}

/* formula reference cards (maths pages) */
.fref .fsec{margin:18px 0 8px;font-size:15px}
.fref .flist{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fref .frow{background:var(--bg-soft);border:1px solid var(--border);border-radius:12px;padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.fref .frow .fn{font-size:13px;font-weight:700;color:var(--text-soft)}
.fref .frow .fm{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:17px;color:var(--text);text-align:right}
.fref .frow .fc{display:block;font-size:11.5px;color:var(--text-soft);font-style:normal;margin-top:2px}
.fref .fm .fline{display:block;white-space:nowrap;margin-top:3px}
.fref .fm .fline:first-child{margin-top:0}
@media(max-width:640px){.fref .flist{grid-template-columns:1fr}}