*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#f7f5f2;--surface:#fff;--surface2:#f2f0ec;
  --border:#e2dfd9;--border2:#ccc9c2;
  --text:#1a1917;--text2:#6b6860;--text3:#a09d96;
  --accent:#b8601f;--accent-light:#fdf1e8;
  --r:10px;--rl:14px;
}
@media(prefers-color-scheme:dark){:root{
  --bg:#141311;--surface:#1e1c1a;--surface2:#272421;
  --border:#2e2b28;--border2:#3d3a35;
  --text:#ede9e3;--text2:#9b9590;--text3:#5c5852;
  --accent:#e07d3a;--accent-light:#2a1f15;
}}
body{font-family:-apple-system,'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;font-size:16px;line-height:1.5}
.site-nav{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100}
.nav-inner{max-width:900px;margin:0 auto;padding:0 1.25rem;display:flex;align-items:center;height:52px;gap:2px;flex-wrap:nowrap;overflow:visible}
.nav-logo{font-size:17px;font-weight:700;text-decoration:none;color:var(--accent);margin-right:8px;letter-spacing:-0.02em;flex-shrink:0}
.nav-group{position:relative;flex-shrink:0}
.nav-btn{padding:6px 10px;border:none;background:transparent;cursor:pointer;font-size:13px;color:var(--text2);border-radius:var(--r);font-family:inherit;transition:all 0.15s;white-space:nowrap}
.nav-btn:hover,.nav-btn.open{background:var(--surface2);color:var(--text)}
.nav-drop{position:absolute;top:calc(100% + 4px);left:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--rl);padding:6px;min-width:190px;display:none;z-index:200;box-shadow:0 4px 16px rgba(0,0,0,.06)}
.nav-drop.open{display:block}
.nav-drop a{display:block;padding:7px 10px;font-size:13px;color:var(--text2);text-decoration:none;border-radius:8px;white-space:nowrap;transition:all 0.1s}
.nav-drop a:hover{background:var(--surface2);color:var(--text)}
.nav-home{margin-left:auto;font-size:13px;color:var(--text3);text-decoration:none;padding:6px 10px;border-radius:var(--r);white-space:nowrap;flex-shrink:0}
.nav-home:hover{color:var(--text2)}
.page{max-width:900px;margin:0 auto;padding:1rem 1.25rem 3rem}
.tool-head{padding:1.75rem 0 1.5rem}
.tool-head h1{font-size:1.75rem;font-weight:600;letter-spacing:-0.02em;margin-bottom:5px}
.tool-head p{font-size:15px;color:var(--text2)}
.layout{display:grid;grid-template-columns:1fr 260px;gap:1.25rem;align-items:start}
@media(max-width:660px){.layout{grid-template-columns:1fr}}
.ad{background:var(--surface2);border:1px dashed var(--border2);border-radius:var(--r);display:flex;align-items:center;justify-content:center;color:var(--text3);font-size:11px;letter-spacing:.04em;text-transform:uppercase}
.ad-top{height:90px;margin-bottom:1.5rem}
.ad-bot{height:90px;margin-top:1.5rem}
.ad-box{min-height:250px;margin-bottom:1rem}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--rl);padding:1.5rem;margin-bottom:1.25rem}
.result{text-align:center;padding:2rem 1rem;border:1px solid var(--border);border-radius:var(--r);background:var(--surface2);margin-bottom:1.25rem;min-height:110px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.result-val{font-size:2.1rem;font-weight:600;letter-spacing:-0.03em;transition:opacity 0.18s;word-break:break-all}
.result-note{font-size:14px;color:var(--text2);font-style:italic}
.result-hint{font-size:14px;color:var(--text3)}
.btn{padding:10px 22px;border:1px solid var(--border2);border-radius:var(--r);background:transparent;cursor:pointer;font-size:14px;font-weight:500;font-family:inherit;color:var(--text);transition:all 0.15s}
.btn:hover{background:var(--surface2)}
.btn:active{transform:scale(0.98)}
.btn-accent{background:var(--accent);border-color:var(--accent);color:#fff}
.btn-accent:hover{filter:brightness(1.08);background:var(--accent)}
.btn-row{display:flex;gap:8px;flex-wrap:wrap}
.btn-row.c{justify-content:center}
.field{margin-bottom:1rem}
.lbl{display:block;font-size:13px;color:var(--text2);margin-bottom:5px}
input,select,textarea{width:100%;padding:9px 12px;border:1px solid var(--border);border-radius:var(--r);background:var(--surface);color:var(--text);font-size:14px;font-family:inherit;outline:none;transition:border-color 0.15s;-webkit-appearance:none}
input:focus,select:focus,textarea:focus{border-color:var(--border2)}
textarea{resize:vertical;line-height:1.6}
input[type=range]{padding:0;border:none;background:transparent;accent-color:var(--accent);cursor:pointer}
input[type=checkbox],input[type=radio]{accent-color:var(--accent);width:15px;height:15px;flex-shrink:0}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
@media(max-width:460px){.row2,.row3{grid-template-columns:1fr}}
.chk{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:14px;color:var(--text2);cursor:pointer}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:1.25rem}
.pill{padding:6px 16px;border:1px solid var(--border);border-radius:999px;background:transparent;cursor:pointer;font-size:13px;color:var(--text2);font-family:inherit;transition:all 0.15s}
.pill:hover{border-color:var(--border2);color:var(--text)}
.pill.on{border-color:var(--accent);color:var(--accent);background:var(--accent-light)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{padding:4px 12px;border:1px solid var(--border);border-radius:999px;font-size:12px;color:var(--text2);cursor:pointer;background:transparent;font-family:inherit;transition:all 0.12s}
.chip:hover{background:var(--surface2);color:var(--text)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px;margin-bottom:1.25rem}
.stat{background:var(--surface2);border-radius:var(--r);padding:.75rem;text-align:center}
.stat-n{font-size:1.4rem;font-weight:600}
.stat-l{font-size:12px;color:var(--text3);margin-top:2px}
.about{background:var(--surface);border:1px solid var(--border);border-radius:var(--rl);padding:1.5rem;margin-top:1rem}
.about h2{font-size:1.05rem;font-weight:600;margin-bottom:.5rem}
.about p{font-size:14px;color:var(--text2);line-height:1.7;margin-bottom:.75rem}
.about p:last-child{margin-bottom:0}
.hist-lbl{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}
.cat-head{font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--text3);margin:1.75rem 0 .75rem;padding-bottom:6px;border-bottom:1px solid var(--border)}
.tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin-bottom:.5rem}
.tcard{background:var(--surface);border:1px solid var(--border);border-radius:var(--rl);padding:1.1rem;text-decoration:none;color:var(--text);transition:all 0.15s;display:block}
.tcard:hover{border-color:var(--border2);transform:translateY(-1px)}
.tcard-icon{font-size:22px;margin-bottom:.35rem}
.tcard-name{font-size:14px;font-weight:500;margin-bottom:3px}
.tcard-desc{font-size:12px;color:var(--text2);line-height:1.4}
.site-footer{border-top:1px solid var(--border);padding:2rem 1.25rem;text-align:center;font-size:12px;color:var(--text3);background:var(--surface);margin-top:2rem}
.foot-links{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-bottom:.6rem}
.foot-links a{color:var(--text3);text-decoration:none}
.foot-links a:hover{color:var(--text2)}