:root{--bg: #14130f;--panel: #1f1d16;--panel2: #2a2719;--line: #3a3526;--ink: #f3ecd8;--dim: #b6ad92;--accent: #d0a040;--ok: #6fbf73;--bad: #e06a5a;--hint: #69a7d6}*{box-sizing:border-box}html,body{margin:0}body{background:radial-gradient(1200px 600px at 50% -10%,#26230f 0%,var(--bg) 60%);color:var(--ink);font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-tap-highlight-color:transparent}.wrap{max-width:820px;margin:0 auto;padding:18px 16px 60px}header h1{margin:4px 0 2px;font-size:34px;letter-spacing:6px;color:var(--accent);text-shadow:0 2px 0 #6b531c}header .sub{margin:0 0 12px;color:var(--dim);font-size:13px}.controls,.hud{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}.hud{margin-bottom:6px}.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}.seg button{background:var(--panel);color:var(--dim);border:0;padding:7px 13px;font-size:13px;cursor:pointer}.seg button+button{border-left:1px solid var(--line)}.seg button.on{background:var(--accent);color:#2a210b;font-weight:700}.ghost,.primary{border:1px solid var(--line);background:var(--panel);color:var(--ink);padding:7px 14px;border-radius:10px;font-size:13px;cursor:pointer}.ghost:hover{background:var(--panel2)}.primary{background:var(--accent);color:#2a210b;font-weight:700;border-color:var(--accent)}.stat{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:13px;color:var(--ink);font-variant-numeric:tabular-nums}.status{min-height:22px;font-size:14px;margin:4px 0 12px;color:var(--dim)}.status.ok{color:var(--ok)}.status.bad{color:var(--bad)}.status.hint{color:var(--hint)}.lbl{font-size:14px;color:var(--dim);margin:14px 0 8px;font-weight:600}.lbl small{color:#8a8264;font-weight:400}.timeline{display:flex;flex-direction:column;gap:8px}.timeline .empty,.hand .empty{border:1px dashed var(--line);border-radius:10px;padding:16px;color:var(--dim);text-align:center;font-size:13px}.placed{border:1px solid var(--line);border-left:4px solid var(--accent);background:linear-gradient(90deg,#241f10,var(--panel));border-radius:10px;padding:9px 12px}.ptop{display:flex;justify-content:space-between;align-items:center}.yr{color:var(--accent);font-size:12px;font-variant-numeric:tabular-nums}.pname{font-weight:700;margin:3px 0 1px}.pnote{font-size:12px;color:var(--dim)}.nextslot{margin-top:8px}.lock{border:1px dashed var(--accent);border-radius:10px;padding:10px 12px;color:var(--accent);font-size:13px;background:#211c0d}.hand-sec{margin-top:6px}.hand{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}.handcard{text-align:left;cursor:pointer;border:1px solid var(--line);background:var(--panel2);border-radius:12px;padding:11px 12px;color:var(--ink);transition:transform .08s ease,border-color .12s ease}.handcard:hover{transform:translateY(-2px);border-color:var(--accent)}.handcard.sel{border-color:var(--accent)}.handcard.hint{border-color:var(--hint);box-shadow:0 0 0 2px #69a7d659}.htop{margin-bottom:4px}.hname{font-weight:700;font-size:15px}.hnote{font-size:12px;color:var(--dim);margin:3px 0 6px}.hcta{font-size:12px;color:var(--accent);font-weight:600}.handcard.shake{animation:shake .42s;border-color:var(--bad)}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.era{display:inline-block;font-size:10px;letter-spacing:.5px;text-transform:uppercase;padding:2px 7px;border-radius:999px;font-weight:700;background:#3a3422;color:var(--ink)}.era-barter{background:#4a3b2a}.era-commodity{background:#4a4326}.era-coinage{background:#5a4a1c;color:#ffe8a8}.era-banking{background:#2f4630}.era-paper{background:#2d3a4a}.era-credit{background:#43304a}.era-digital{background:#1f4a47}.overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#080704b8;padding:20px;z-index:30}.overlay.hidden{display:none}.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px;max-width:560px;text-align:center}.card h2{margin:0 0 8px;color:var(--accent)}.card p{color:var(--ink);font-size:14px;line-height:1.5}.full{display:block;margin-top:8px;color:var(--dim);font-size:12px}.card .primary{margin-top:14px}
