:root{--bg:#f6f7fb;--card:#fff;--ink:#16203a;--muted:#5b6782;--line:#dde2ee;--accent:#1d4ed8;--warn:#b45309;--ok:#047857;--bad:#b91c1c;--font:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);line-height:1.55}
a{color:var(--accent)}
.site-header{display:flex;justify-content:space-between;align-items:center;max-width:1000px;margin:0 auto;padding:12px 16px}
.brand{font-weight:800;text-decoration:none;color:var(--ink);font-size:1.1rem}.dot{color:var(--accent)}
.site-header nav a{margin-left:16px;color:var(--muted);text-decoration:none;font-weight:600;font-size:.92rem}
main{max-width:1560px;margin:0 auto;padding:0 16px 24px}
.hero{text-align:center;max-width:820px;margin:8px auto 18px}
.hero h1{margin:0;font-size:clamp(1.7rem,4.6vw,2.6rem);letter-spacing:-.02em}
.hero .sub{margin:6px 0;color:var(--muted);font-size:1.05rem}
.status{font-size:.9rem;color:var(--muted)}
.pill{display:inline-block;background:#fef3c7;color:var(--warn);border:1px solid #fcd34d;border-radius:999px;padding:1px 10px;font-weight:700;margin-right:6px}
.stage-row{display:block}.stage-center{max-width:1000px;margin:0 auto}
.rail{display:none}
@media(min-width:1280px){.stage-row{display:grid;grid-template-columns:180px minmax(0,1000px) 320px;gap:16px;align-items:start;justify-content:center}.stage-center{margin:0}.rail{display:block;position:sticky;top:12px;min-height:250px}}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.card h2{font-size:1.15rem;margin:18px 0 4px}.card h2:first-child{margin-top:0}
.hint{color:var(--muted);margin:0 0 10px;font-size:.93rem}
.row{display:flex;flex-wrap:wrap;gap:16px;align-items:end}
label{display:flex;flex-direction:column;font-size:.85rem;font-weight:600;color:var(--muted);gap:4px}
input,select{font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}
.eff{padding:8px 12px;background:#eef2ff;border-radius:10px}
.presets{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0;font-size:.88rem;color:var(--muted)}
button{font:inherit;cursor:pointer;border-radius:10px;border:1px solid var(--line);background:#fff;padding:6px 12px;color:var(--ink)}
.presets button:hover,button.ghost:hover{border-color:var(--accent);color:var(--accent)}
.step{display:grid;grid-template-columns:28px 1.3fr 1fr auto auto;gap:10px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:12px;margin-bottom:8px}
.step .n{font-weight:800;color:var(--accent);text-align:center}
.step .fee{font-weight:800;min-width:92px;text-align:right}
.fee.z{color:var(--ok)}.fee.h{color:var(--bad)}.fee.m{color:var(--warn)}
.step .x{border:0;color:var(--muted);font-size:1.1rem}
@media(max-width:640px){.step{grid-template-columns:22px minmax(0,1fr) auto;gap:6px 8px}.step .n{grid-row:1/3}.step label{grid-column:2}.step .fee{grid-column:3;grid-row:1;min-width:0}.step .x{grid-column:3;grid-row:2}.step select,.step input{width:100%;min-width:0}}
.result{margin-top:16px;padding:16px;border-radius:14px;background:#0f172a;color:#e2e8f0}
.result .big{font-size:2rem;font-weight:900;color:#fff}
.result ul{margin:8px 0 0;padding-left:18px}
.result .note{color:#94a3b8;font-size:.88rem;margin-top:8px}
.content{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;margin-top:18px}
.content h2{margin-top:0}
table{width:100%;border-collapse:collapse;font-size:.93rem}th,td{border-bottom:1px solid var(--line);padding:8px;text-align:left;vertical-align:top}
details{border-bottom:1px solid var(--line);padding:10px 0}summary{font-weight:700;cursor:pointer}
.ad-slot{max-width:1000px;margin:28px auto 8px;text-align:center}.ad-slot:empty{display:none}
.site-footer{max-width:1000px;margin:0 auto;padding:16px;color:var(--muted);font-size:.85rem;text-align:center}