:root{
  --bg:#0b0a09; --card:#171411; --card2:#201b16; --line:#2e2720;
  --cream:#f3e7cf; --dim:#9a8f7c; --gold:#c9a24a; --gold2:#e6c26a; --red:#c0533f; --green:#5aa66a;
  --r:18px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--bg);color:var(--cream);font-family:-apple-system,system-ui,"Segoe UI",Roboto,sans-serif;font-size:17px;overscroll-behavior:none}
*{font-variant-numeric:lining-nums}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;touch-action:manipulation}
header{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top)) 16px 10px;background:linear-gradient(var(--bg) 70%,transparent)}
header h1{flex:1;margin:0;font:700 26px Georgia,"Times New Roman",serif;letter-spacing:.5px}
header h1 b{color:var(--gold)}
#gear{font-size:24px;width:44px;height:44px;border-radius:12px;color:var(--dim)}
.dot{width:12px;height:12px;border-radius:50%;background:var(--red)}
.dot.on{background:var(--green)}
#banner{margin:0 16px 8px;padding:10px 14px;border-radius:12px;background:#3a2c14;color:var(--gold2);font-size:14px}
main{padding:0 16px calc(110px + env(safe-area-inset-bottom));max-width:560px;margin:0 auto}
nav{position:fixed;left:0;right:0;bottom:0;z-index:6;display:flex;background:#100e0c;border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
nav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 0 8px;font-size:22px;color:var(--dim)}
nav button span{font-size:12px;letter-spacing:.3px}
nav button.on{color:var(--gold2)}
h2{font:600 15px/1 system-ui,sans-serif;text-transform:uppercase;letter-spacing:1.5px;color:var(--dim);margin:26px 2px 10px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px}

/* Split the G */
.score{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.score .p{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 6px;text-align:center}
.score .p.lead{border-color:var(--gold);background:linear-gradient(#251e10,var(--card))}
.score .n{font:700 52px/1 Georgia,serif;color:var(--gold2)}
.score .nm{margin-top:6px;font-size:15px;color:var(--cream)}
.big{display:block;width:100%;margin:14px 0 0;padding:24px 10px;border-radius:22px;background:linear-gradient(var(--gold2),var(--gold));color:#1a1305;font:800 22px system-ui,sans-serif;letter-spacing:.5px;box-shadow:0 6px 24px #c9a24a33}
.big:active{transform:scale(.98)}

/* räknare */
.row{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line)}
.row:first-child{border-top:0}
.row .nm{flex:1}
.row .c{min-width:42px;text-align:center;font:700 28px Georgia,serif}
.pm{width:56px;height:56px;border-radius:16px;background:var(--gold);color:#1a1305;font-size:30px;font-weight:700}
.pm.minus{background:var(--card2);color:var(--dim);width:44px;height:44px;font-size:24px;border-radius:12px}
.total{display:flex;justify-content:space-between;padding-top:10px;border-top:1px solid var(--line);color:var(--dim)}
.total b{color:var(--gold2);font-size:20px}
.small .pm{width:44px;height:44px;font-size:24px;border-radius:12px;background:var(--card2);color:var(--cream)}
.small .pm.minus{width:36px;height:36px;font-size:20px}
.small .c{font-size:22px}
.small.card{padding:8px 14px}

/* historik */
.hist{display:flex;align-items:center;gap:10px;padding:10px 2px;border-top:1px solid var(--line)}
.hist:first-child{border-top:0}
.hist .w{flex:1}
.hist .w small{display:block;color:var(--dim);font-size:13px}
.x{width:40px;height:40px;border-radius:10px;color:var(--dim);font-size:20px}
.empty{color:var(--dim);padding:10px 2px;font-size:15px}

/* spel */
.gbtn{display:flex;align-items:center;justify-content:space-between;width:100%;padding:18px 16px;margin-bottom:10px;border-radius:var(--r);background:var(--card);border:1px solid var(--line);font:600 20px system-ui}
.gbtn small{color:var(--dim);font-weight:400;font-size:14px}
.link{color:var(--gold2);padding:8px 2px;font-size:15px}
.sheetbtn{display:block;width:100%;padding:20px;margin:0 0 10px;border-radius:18px;background:var(--card2);border:1px solid var(--line);font:700 24px Georgia,serif}
.sheetbtn.lead{background:linear-gradient(var(--gold2),var(--gold));color:#1a1305}
.sheetbtn small{display:block;font:400 14px system-ui;opacity:.75;margin-top:2px}
table.sc{width:100%;border-collapse:collapse}
table.sc th,table.sc td{padding:4px 3px;text-align:center}
table.sc th{font-size:14px;color:var(--gold2);font-weight:600}
table.sc td:first-child,table.sc th:first-child{text-align:left;font-size:15px;color:var(--cream);padding-left:2px}
table.sc tr.sub td{color:var(--dim);font-size:14px}
table.sc tr.tot td{border-top:2px solid var(--gold);font:700 24px Georgia,serif;color:var(--gold2);padding-top:10px}
table.sc tr.tot td:first-child{font-size:16px;font-family:system-ui}
input.sc{width:100%;height:46px;border-radius:10px;border:1px solid var(--line);background:var(--card2);color:var(--cream);font:600 20px system-ui;text-align:center}
input.sc:focus{outline:2px solid var(--gold);border-color:var(--gold)}
table.sc.plump td:first-child,table.sc.plump th:first-child{width:64px;font-size:14px}
table.sc.plump td{padding:6px 2px;vertical-align:top}
.pc{display:flex;gap:3px}
input.sc.mini{height:40px;font-size:17px;padding:0;min-width:0}
input.sc.mini::placeholder{font-size:11px;font-weight:400;color:var(--dim)}
.pt{margin-top:2px;font:700 14px system-ui;color:var(--gold2)}
.warn{color:var(--red);font-size:11px;line-height:1.1}
button.p{font:inherit;color:inherit;cursor:pointer}
input.cfg{width:84px;height:46px;border-radius:10px;border:1px solid var(--line);background:var(--card2);color:var(--cream);font:700 20px system-ui;text-align:center}
input.cfg:focus{outline:2px solid var(--gold);border-color:var(--gold)}
.back{padding:6px 2px 12px;color:var(--gold2)}
.gh{display:flex;align-items:center;justify-content:space-between}
.gh h3{margin:0;font:700 28px Georgia,serif}
.btn2{display:block;width:100%;padding:16px;margin-top:12px;border-radius:16px;background:var(--card2);border:1px solid var(--line);font-weight:600}
.btn2.danger{color:var(--red)}
.btn2.gold{background:var(--gold);color:#1a1305;border:0;font-weight:800}

/* ställning */
table.st{width:100%;border-collapse:collapse}
table.st th{font-size:13px;color:var(--dim);font-weight:500;padding:6px 2px;text-align:center}
table.st td{padding:12px 2px;text-align:center;font:700 26px Georgia,serif;border-top:1px solid var(--line)}
table.st td:first-child{text-align:left;font:500 16px system-ui;color:var(--cream)}
table.st td.top{color:var(--gold2)}
table.st tr.first td{font-size:34px}
table.st tr.first td:first-child{font-size:17px;font-weight:700;color:var(--gold2)}

/* sheet + toast */
#sheet{position:fixed;inset:0;z-index:20;background:#000a;display:flex;align-items:flex-end}
#sheet[hidden],#toast[hidden],#banner[hidden]{display:none}
#sheet .in{width:100%;max-width:560px;margin:0 auto;background:var(--card);border-radius:26px 26px 0 0;padding:20px 16px calc(20px + env(safe-area-inset-bottom));max-height:88vh;overflow:auto;border-top:2px solid var(--gold)}
#sheet h3{margin:0 0 14px;font:700 24px Georgia,serif;text-align:center}
.chk{display:flex;align-items:center;gap:10px;justify-content:center;margin:6px 0 14px;color:var(--dim);font-size:15px}
.chk input{width:22px;height:22px;accent-color:var(--gold)}
#toast{position:fixed;left:16px;right:16px;bottom:calc(90px + env(safe-area-inset-bottom));z-index:30;max-width:528px;margin:0 auto;display:flex;align-items:center;gap:12px;background:var(--cream);color:#1a1305;padding:12px 14px;border-radius:14px;font-weight:600;box-shadow:0 8px 30px #000a}
#toast span{flex:1}
#toast button{background:#1a1305;color:var(--gold2);padding:10px 14px;border-radius:10px;font-weight:700}
.gate{padding-top:40px;text-align:center}
.gate input{width:100%;padding:16px;margin:16px 0;border-radius:14px;border:1px solid var(--line);background:var(--card2);color:var(--cream);font-size:20px;text-align:center}
.gate p{color:var(--dim)}
.mono{word-break:break-all;font-size:14px;color:var(--dim);margin:8px 0}
