:root{
  --navy:#102433; --navy-2:#1a3851; --gold:#C9952B; --orange:#E0922A; --orange-d:#c47f1d;
  --cream:#EFEBE4; --card:#fff; --ink:#1C2A38; --muted:#6B7785; --line:#E3E1DB;
  --green:#1C7A5B; --green-bg:#E3F3EC; --red:#C0492A; --shadow:0 10px 30px rgba(16,36,51,.07);
}
*{box-sizing:border-box}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:15px;line-height:1.5}
h1,h2,.serif{font-family:"Playfair Display",Georgia,serif}
.topbar{background:var(--navy);color:#fff;position:sticky;top:0;z-index:20}
.topbar .in{max-width:1180px;margin:0 auto;padding:14px 22px;display:flex;align-items:center;gap:14px}
.brand{display:flex;align-items:baseline;gap:8px;font-weight:800;font-size:25px;font-family:"Playfair Display",Georgia,serif}
.brand .star{color:var(--gold);font-size:19px}
.brand b{color:#fff}.brand i{color:var(--gold);font-style:normal}
.brand small{font-family:Inter,sans-serif;font-weight:500;font-size:12.5px;color:#9fb2c2;margin-left:2px}
.pill{margin-left:auto;display:inline-flex;align-items:center;gap:7px;background:var(--green-bg);color:var(--green);font-weight:700;font-size:12.5px;padding:6px 13px;border-radius:999px}
.pill.off{background:#FDE7E1;color:var(--red)}
.pill .dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.center{max-width:680px;margin:30px auto;padding:0 22px}
.wide{max-width:1080px}
.card{background:var(--card);border-radius:16px;box-shadow:var(--shadow);padding:28px 30px;margin-bottom:22px}
.prog{display:flex;gap:10px;margin:0 0 24px}
.prog span{height:5px;border-radius:5px;background:#e2ddd4;flex:1}
.prog span.on{background:var(--orange)}
.eyebrow{font-weight:700;font-size:14.5px;margin:0 0 6px}
h1{margin:0;font-size:29px}
.lead{color:var(--muted);margin:3px 0 0}
label{display:block;font-weight:600;font-size:13.5px;color:#54606d;margin:0 0 7px}
.hint{color:#93a0ac;font-size:12.5px;margin:6px 0 0}
input,select{width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:11px;font:inherit;background:#fff;color:var(--ink)}
input:focus,select:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,149,43,.15)}
.field{margin-bottom:18px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px}
.btn{border:0;border-radius:12px;font:inherit;font-weight:700;padding:14px 22px;cursor:pointer}
.btn.primary{background:var(--orange);color:#fff;width:100%;font-size:16px}
.btn.primary:hover{background:var(--orange-d)}
.btn.primary:disabled{opacity:.6;cursor:progress}
.result{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:start;margin-top:4px}
.wheelbox{background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:16px}
.wheelbox svg{width:100%;height:auto;display:block}
.note{background:var(--green-bg);color:#155c45;border-radius:12px;padding:13px 15px;font-size:13.5px;margin:0 0 18px}
.note b{color:var(--green)}
.err{background:#FDE7E1;color:#8a2d18;border-radius:12px;padding:13px 15px;font-size:13.5px;margin:14px 0 0}
table{width:100%;border-collapse:collapse;font-size:14px}
th{background:var(--navy);color:#fff;text-align:left;padding:10px 12px;font-size:12.5px;font-weight:700}
th:first-child{border-radius:10px 0 0 0}th:last-child{border-radius:0 10px 0 0}
td{padding:9px 12px;border-bottom:1px solid #eee}tr:last-child td{border-bottom:0}
.glyph{font-size:17px;width:22px;display:inline-block;color:var(--navy)}
.mono{font-family:"JetBrains Mono",ui-monospace,Menlo,monospace}
.axisrow{display:flex;gap:14px;margin:16px 0 0;flex-wrap:wrap}
.axisrow div{background:#f6f4ef;border-radius:10px;padding:9px 14px;font-size:13.5px}
.axisrow b{color:var(--gold)}
.footer{max-width:1080px;margin:16px auto 40px;padding:0 22px;text-align:center;color:#9aa3ac;font-size:12.5px}
@media(max-width:820px){.result{grid-template-columns:1fr}.grid2,.grid3{grid-template-columns:1fr}}

.dg{display:inline-block;background:#f2efe8;color:#6B7785;border-radius:999px;padding:2px 9px;font-size:11.5px;font-weight:600;margin:1px 2px 1px 0}
.dg-b{background:var(--green-bg);color:var(--green)}
.dg-m{background:#FDE7E1;color:#a53d22}
.dgs{max-width:230px}
.evrow{display:flex;gap:10px;margin-bottom:10px}
.evrow input{max-width:180px}
.btn.ghost{background:#fff;border:1px solid var(--line);color:var(--ink)}
.btn.sm{padding:8px 14px;font-size:13.5px;border-radius:9px}
.btn.ghost:hover{border-color:var(--gold)}
