:root{--bg: #0c1512;--felt: #12211c;--felt-2: #16281f;--line: #2a3f35;--text: #e8f0ec;--muted: #8ba79a;--gold: #f6c453;--gold-deep: #d9a326;--win: #56d98a;--lose: #f4736b;font-synthesis:none}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(120% 80% at 50% -10%,#1b3128 0%,var(--bg) 60%),var(--bg);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}.shell{display:flex;justify-content:center;align-items:flex-start;gap:22px;min-height:100%}.app{width:520px;max-width:100%;padding:max(16px,env(safe-area-inset-top)) 16px 32px;min-height:100%;display:flex;flex-direction:column;gap:16px}.hand-guide{width:244px;flex-shrink:0;margin-top:max(16px,env(safe-area-inset-top));background:linear-gradient(180deg,var(--felt-2),var(--felt));border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 18px 40px -24px #000}.guide-head{display:flex;align-items:center;justify-content:space-between}.guide-head h3{margin:0;font-size:15px;letter-spacing:2px;text-transform:uppercase;color:var(--gold)}.guide-close{display:none;background:none;border:none;color:var(--muted);font-size:20px;cursor:pointer}.guide-note{color:var(--muted);font-size:11.5px;line-height:1.5;margin:8px 0 12px}.guide-note em{color:var(--text);font-style:normal}.guide-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.guide-list li{border-top:1px solid var(--line);padding-top:10px}.guide-dice{display:flex;gap:4px;margin-bottom:5px}.mini-die{width:22px;height:22px;border-radius:6px;background:#0e1a15;border:1px solid var(--line);color:var(--text);font-size:12px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums}.guide-meta{display:flex;align-items:baseline;justify-content:space-between}.guide-name{font-size:13px;font-weight:600}.guide-pts{font-size:13px;font-weight:800;color:var(--gold);font-variant-numeric:tabular-nums}.guide-toggle{display:none;position:absolute;top:14px;background:#12211c;border:1px solid var(--line);color:var(--text);border-radius:10px;padding:7px 11px;font-size:13px;font-weight:700;cursor:pointer}.guide-toggle.left{left:14px}.guide-toggle.right{right:14px}.bag-side{width:200px;flex-shrink:0;margin-top:max(16px,env(safe-area-inset-top));background:linear-gradient(180deg,var(--felt-2),var(--felt));border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 18px 40px -24px #000}.bag-side .guide-head h3{color:var(--gold)}.tray{display:flex;flex-wrap:wrap;gap:7px}.tray-heading{margin:16px 0 8px;font-size:11.5px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);font-weight:700}.manage-tray{min-height:44px;gap:9px}.panel.manage .tray-die{width:42px;height:42px;font-size:13px}.tray-die{width:34px;height:34px;border-radius:9px;border:2px solid;background:#0e1a15;font-size:12px;font-weight:800;cursor:default;display:inline-flex;align-items:center;justify-content:center;transition:transform .1s}.tray-die:not(:disabled){cursor:pointer}.tray-die.sel{transform:translateY(-3px)}.draft-actions{display:flex;gap:12px;margin-top:18px}.draft-actions .btn{flex:1}.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--text)}.card-tag{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;padding:3px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}.upgrade-card{display:flex;align-items:center;justify-content:space-between;gap:10px}.upgrade-card.kind-dice .card-tag{color:#2dd4bf;border-color:#2dd4bf55}.upgrade-card.kind-flat .card-tag{color:#f59e0b;border-color:#f59e0b55}.upgrade-card.kind-mult .card-tag{color:#f472b6;border-color:#f472b655}.upgrade-card.kind-mult:hover{border-color:#f472b6}.preview .mult{color:#f472b6}.preview .doggo-pts{color:#7dd3fc}.doggo-draft h2{color:var(--gold)}.doggo-card{display:flex;align-items:center;gap:14px;text-align:left;border-color:#3a3320;background:linear-gradient(180deg,#1a2418,#141d13)}.doggo-card:hover{border-color:var(--gold);background:#1d2a1a}.doggo-emoji{font-size:34px;line-height:1;flex-shrink:0}.doggo-info{display:flex;flex-direction:column;gap:3px}.doggo-name{font-size:15.5px;font-weight:800;color:var(--gold)}.doggo-blurb{font-size:13px;color:var(--muted);font-weight:500}.pack{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}.pack h4{margin:0 0 8px;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}.pack-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.pack-list li{display:flex;align-items:center;gap:8px;font-size:13px}.pack-emoji{font-size:18px}.pack-name{color:var(--text);font-weight:600}.die-mod{font-weight:800}.die-mod.loaded{color:var(--gold)}.die-mod.lucky{color:var(--win)}.die-mod.fixed{color:#f472b6}.die-mod.twice{color:#7dd3fc}.die-mod.bonus{color:var(--win)}.die-mods{position:absolute;top:3px;left:5px;display:flex;gap:1px;font-size:10px}.tray-die .die-mod{font-size:9px;margin-left:1px}.upgrade-card.kind-modify .card-tag{color:var(--gold);border-color:#f6c45355}.upgrade-card.kind-modify:hover{border-color:var(--gold)}.upgrade-card.kind-rollSlot .card-tag{color:#7dd3fc;border-color:#7dd3fc55}.panel.manage.modding{border-color:var(--gold);box-shadow:0 0 44px -16px var(--gold-deep)}.panel.manage.modding h2{color:var(--gold)}.bag-mods{display:flex;gap:8px;margin:0 0 12px;flex-wrap:wrap}.bag-mods span{font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:999px}.mod-flat{color:#f59e0b;background:#f59e0b1a}.mod-mult{color:#f472b6;background:#f472b61a}@media(max-width:900px){.hand-guide,.bag-side{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;width:auto;margin:0;border:none;border-radius:0;overflow-y:auto;background:#08100df7;display:none;padding:20px}.hand-guide.open,.bag-side.open,.guide-close{display:block}.guide-toggle{display:inline-flex;align-items:center;gap:4px}}.topbar{text-align:center;padding-top:8px;position:relative}.topbar h1{margin:0;font-size:34px;letter-spacing:6px;font-weight:800}.topbar h1 span{color:var(--gold)}.tagline{margin:2px 0 0;color:var(--muted);font-size:12px;letter-spacing:3px;text-transform:uppercase}.panel{background:linear-gradient(180deg,var(--felt-2),var(--felt));border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:0 18px 40px -24px #000}.lede{line-height:1.55;color:#d6e2db;margin-top:0}.rules{color:var(--muted);line-height:1.6;padding-left:18px;font-size:14px}.rules strong,.lede strong{color:var(--text)}.btn{border:none;border-radius:12px;font-weight:700;font-size:15px;padding:12px 20px;cursor:pointer;transition:transform .08s ease,filter .15s ease,opacity .15s;color:#1a1205;background:linear-gradient(180deg,var(--gold),var(--gold-deep))}.btn:hover{filter:brightness(1.08)}.btn:active{transform:translateY(1px) scale(.99)}.btn:disabled{opacity:.4;cursor:not-allowed;filter:grayscale(.4)}.btn.big{width:100%;padding:15px;font-size:17px;margin-top:18px;letter-spacing:1px}.rolls-left{opacity:.7;font-weight:600}.board-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}.act-label{font-size:13px;font-weight:700;letter-spacing:.4px;color:var(--muted);display:flex;align-items:center;gap:8px}.boss-badge{font-size:10px;font-weight:800;letter-spacing:1px;color:#1a1205;background:linear-gradient(180deg,var(--lose),#c9463e);padding:2px 7px;border-radius:6px}.panel.board.boss{border-color:var(--lose);box-shadow:0 0 44px -16px var(--lose)}.panel.board.boss .threshold{color:var(--lose)}.dots{display:flex;gap:7px}.dot{width:10px;height:10px;border-radius:50%;background:#2b3d34;border:1px solid var(--line)}.dot.done{background:var(--win);border-color:var(--win)}.dot.current{background:var(--gold);border-color:var(--gold);box-shadow:0 0 10px var(--gold)}.bag-label{font-size:12.5px;color:var(--muted);text-align:right}.score{display:flex;align-items:baseline;justify-content:center;gap:10px;font-variant-numeric:tabular-nums;margin:6px 0 12px}.score .total{font-size:52px;font-weight:800;line-height:1;transition:color .2s}.score .total.met{color:var(--gold);text-shadow:0 0 18px var(--gold-deep)}.score .slash{font-size:26px;color:var(--muted)}.score .threshold{font-size:30px;font-weight:700;color:var(--muted)}.bar{height:10px;border-radius:6px;background:#0d1a15;border:1px solid var(--line);overflow:hidden}.bar-fill{height:100%;background:linear-gradient(90deg,#3d7a5c,#56d98a);border-radius:6px;transition:width .45s cubic-bezier(.22,1,.36,1)}.bar-fill.met{background:linear-gradient(90deg,var(--gold-deep),var(--gold))}.hand{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;min-height:92px;align-items:center;margin:16px 0 6px}.hint{color:var(--muted);font-size:14px}.die-wrap{animation:pop .34s cubic-bezier(.18,1.3,.4,1) both}@keyframes pop{0%{transform:translateY(-10px) scale(.6) rotate(-8deg);opacity:0}}.die{position:relative;width:54px;height:54px;border-radius:13px;border:2px solid;background:#0e1a15;display:flex;align-items:center;justify-content:center}.die-face{font-size:24px;font-weight:800}.die-tag{position:absolute;bottom:4px;right:7px;font-size:10px;color:var(--muted);font-weight:700}.reshuffle{text-align:center;color:var(--gold);font-size:12.5px;margin:2px 0 0;letter-spacing:.5px}.board-foot{display:flex;align-items:center;justify-content:space-between;margin-top:18px;gap:14px}.piles{display:flex;gap:14px;color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#040907b8;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:24px;z-index:10;animation:fade .2s ease both}@keyframes fade{0%{opacity:0}}.result-card{background:linear-gradient(180deg,var(--felt-2),var(--felt));border:1px solid var(--line);border-radius:18px;padding:30px 34px;text-align:center;animation:rise .28s cubic-bezier(.18,1.1,.4,1) both}@keyframes rise{0%{transform:translateY(14px) scale(.96);opacity:0}}.result-card h2{margin:0 0 6px;font-size:30px;letter-spacing:3px}.result-card.win h2{color:var(--win)}.result-card.lose h2{color:var(--lose)}.result-card p{color:var(--muted);font-variant-numeric:tabular-nums;margin:0 0 18px}.draft h2,.end h2{margin:0 0 6px;letter-spacing:2px}.cards{display:flex;flex-direction:column;gap:12px;margin-top:16px}.upgrade-card{text-align:left;padding:18px;border-radius:14px;border:1px solid var(--line);background:#0f1c16;color:var(--text);font-size:15.5px;font-weight:600;cursor:pointer;transition:border-color .15s,transform .08s,background .15s}.upgrade-card:hover{border-color:var(--gold);background:#13241b;transform:translateY(-2px)}.upgrade-card:active{transform:translateY(0)}.end{text-align:center}.end.victory{border-color:var(--gold);box-shadow:0 0 40px -14px var(--gold-deep)}.end .bag-label{text-align:center;margin:14px 0 0}.hand-label{text-align:center;color:var(--muted);font-size:12.5px;letter-spacing:.4px;margin:16px 0 8px}.die-btn{background:none;border:none;padding:0;cursor:pointer;border-radius:16px;transition:transform .12s cubic-bezier(.18,1.2,.4,1)}.die-btn:disabled{cursor:default}.die-btn.selected{transform:translateY(-9px)}.die-btn.selected .die{box-shadow:0 0 0 3px var(--gold) inset,0 10px 20px -6px var(--gold-deep)}.die-btn.selected:after{content:"✓";position:absolute;margin-top:-8px;margin-left:-14px;color:var(--gold);font-size:13px;font-weight:800}.preview{text-align:center;min-height:24px;margin:4px 0 2px;font-size:15px;font-variant-numeric:tabular-nums;color:#c9d6cf}.preview .combo{color:var(--gold)}.preview-total{color:var(--text)}.preview .need{color:var(--lose);font-style:normal;font-size:12.5px}.roll-zone{text-align:center;padding:26px 0 10px}.roll-zone .hint{margin:0 0 18px}.roll-btn{width:auto;padding:15px 28px;font-size:18px}.hand{perspective:700px}.die-btn{transform-style:preserve-3d}@keyframes tumble{0%{transform:translateY(-72px) rotateX(0) rotate(0) scale(.55);opacity:0}30%{opacity:1}70%{transform:translateY(6px) rotateX(300deg) rotate(280deg) scale(1.1)}85%{transform:translateY(-4px) rotateX(348deg) rotate(330deg) scale(.98)}to{transform:translateY(0) rotateX(360deg) rotate(360deg) scale(1)}}.die-btn.rolling .die{animation:tumble var(--dur, .52s) cubic-bezier(.2,.75,.3,1) var(--delay, 0ms) both}.die-btn.rolling .die-face{opacity:.85}@media(prefers-reduced-motion:reduce){.die-btn.rolling .die,.die-wrap{animation:none}}