:root{--bg:#0f1117;--card:#1b1f2a;--card2:#202532;--text:#f3f5f8;--muted:#b9c2d0;--line:#364055;--accent:#d2a925;--accentText:#17130a;--danger:#ff9b9b;--ok:#79d7ae;--radius:18px}*{box-sizing:border-box}html{color-scheme:dark}body{margin:0;background:linear-gradient(180deg,#0c0f15,#121722 45%,#0f131b);color:var(--text);font:16px/1.6 Arial,sans-serif}a{color:#f6d365}a:hover{text-decoration-thickness:2px}.site-header{border-bottom:1px solid var(--line);background:#121722}.nav{max-width:1080px;margin:auto;padding:12px 16px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}.brand{font-weight:800;color:#fff;text-decoration:none;margin-right:auto}.nav a:not(.brand){font-size:.9rem}.container{max-width:980px;margin:auto;padding:24px 16px 48px}.breadcrumbs{font-size:.9rem;color:var(--muted);margin-bottom:14px}.breadcrumbs a{color:#d8deea}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(18px,4vw,30px);margin-bottom:20px;box-shadow:0 16px 36px rgba(0,0,0,.22)}h1,h2,h3{line-height:1.2;color:#fff}h1{font-size:clamp(2rem,5vw,2.8rem);margin:.15em 0}h2{margin-top:1.5em}h2:first-child{margin-top:0}.lede{font-size:1.08rem;color:#d0d7e2;max-width:760px}.privacy-note{color:var(--ok);font-size:.92rem}.tool-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.8fr);gap:24px;align-items:stretch}.fields{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.field label,.paste-field label{display:block;font-weight:700;margin-bottom:5px}.field small{display:block;color:var(--muted)}input[type=number],input[type=text]{width:100%;border:1px solid #515d73;border-radius:10px;background:#10141e;color:#fff;padding:12px;font:inherit}input:focus,button:focus-visible,a:focus-visible{outline:3px solid #73bfff;outline-offset:2px}.paste-field{margin:16px 0}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}button{border:0;border-radius:10px;padding:12px 16px;background:var(--accent);color:var(--accentText);font:700 .95rem Arial,sans-serif;cursor:pointer}button.secondary{background:#343d50;color:#fff;border:1px solid #566079}button:hover{filter:brightness(1.08)}.preview{min-height:190px;border-radius:15px;border:1px solid #59647a;background:#ff5733;display:flex;align-items:flex-end;padding:14px}.result-panel{background:var(--card2);border:1px solid var(--line);border-radius:14px;padding:16px;margin-top:14px}.result-label{color:var(--muted);font-size:.85rem;text-transform:uppercase;letter-spacing:.05em}.result-value{font:700 clamp(1.35rem,4vw,2rem)/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;word-break:break-word}.error{min-height:1.6em;color:var(--danger);font-weight:700;margin:8px 0 0}.status{min-height:1.6em;color:var(--ok);font-weight:700}.output-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}.output-row:last-child{border:0}.output-row code{font-size:1rem;word-break:break-word}.output-row button{padding:8px 12px}.slider-row{display:grid;grid-template-columns:100px 1fr 95px;gap:12px;align-items:center;margin:14px 0}.slider-row label{font-weight:700}.slider-row input[type=range]{width:100%;accent-color:var(--accent)}table{width:100%;border-collapse:collapse;margin:12px 0;display:block;overflow-x:auto}th,td{text-align:left;padding:10px 12px;border:1px solid var(--line);white-space:nowrap}th{background:#252b39}code{background:#111520;border-radius:5px;padding:.12em .35em}.steps li{margin-bottom:8px}.related{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}.related a{display:block;background:#222937;border:1px solid var(--line);border-radius:12px;padding:14px;font-weight:700}.faq h3{margin-bottom:.25em}.faq p{margin-top:0}.site-footer{border-top:1px solid var(--line);color:var(--muted);text-align:center;padding:24px 16px}.site-footer a{margin:0 6px}@media(max-width:720px){.tool-grid{grid-template-columns:1fr}.fields{grid-template-columns:1fr}.slider-row{grid-template-columns:1fr 80px}.slider-row label{grid-column:1/-1}.nav{gap:10px}.nav a:not(.brand){font-size:.82rem}.preview{min-height:150px}}
