:root{--room:#0b0907;--room-2:#1a130d;--panel:#120d09;--panel-2:#1b140e;--felt-1:#157a4d;--felt-2:#0e5d3a;--felt-3:#073522;--leather-1:#3d281b;--leather-2:#1c110b;--wood-1:#8a4d26;--wood-2:#4b250f;--gold:#d6b26e;--gold-hi:#f3dca0;--gold-lo:#9c7a3c;--ivory:#f7f1e3;--ivory-2:#e7dcc4;--ink:#0d0c0b;--burgundy:#a3202b;--burgundy-2:#5e0f16;--text:#f0e8d6;--muted:#a8997c;--line:#d6b26e38;--serif:"Playfair Display", Georgia, "Times New Roman", serif;--sans:Inter, system-ui, -apple-system, "Segoe UI", sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--room);color:var(--text);font:400 15px/1.45 var(--sans);-webkit-font-smoothing:antialiased;overflow:hidden}button{font:inherit;color:inherit}button:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}[hidden]{display:none!important}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.app{background:radial-gradient(ellipse 70% 60% at 40% 45%, #ffd69617, transparent 70%), radial-gradient(ellipse at 40% 40%, var(--room-2), var(--room) 75%);grid-template-columns:minmax(0,1fr) 360px;height:100dvh;display:grid}.stage{min-height:0;position:relative;overflow:hidden}.panel{scrollbar-width:thin;scrollbar-color:#d6b26e4d transparent;background:linear-gradient(180deg, #ffffff06, transparent 30%), var(--panel);border-left:1px solid var(--line);flex-direction:column;gap:22px;padding:26px 24px 24px;display:flex;overflow-y:auto;box-shadow:-20px 0 40px #00000059}.table{--r-out:calc(var(--rc) + var(--rail));width:calc(var(--w) + 2 * var(--rail));height:calc(var(--h) + 2 * var(--rail));transform-origin:50%;border-radius:var(--r-out);position:absolute;top:50%;left:50%}.lens-box{inset:calc(-1 * var(--lens-pad));position:absolute}.lens-box.lensed{filter:url(#lens)}.board{inset:var(--lens-pad);border-radius:var(--r-out);background:radial-gradient(ellipse at 50% 0%, #ffffff1a, transparent 60%), linear-gradient(180deg, var(--leather-1), var(--leather-2));position:absolute;box-shadow:0 50px 90px #000000b3,0 0 0 2px #0a0604,inset 0 2px 1px #ffffff1f,inset 0 -12px 20px #0000008c}.defs{width:0;height:0;position:absolute;overflow:hidden}.board:before{content:"";border-radius:calc(var(--r-out) - 10px);pointer-events:none;border:1.5px dashed #d6b26e4d;position:absolute;inset:10px}.track{border-radius:calc(var(--r-out) - 26px);background:repeating-linear-gradient(100deg, #00000014 0 3px, transparent 3px 11px), linear-gradient(180deg, var(--wood-1), var(--wood-2));position:absolute;inset:26px;box-shadow:inset 0 1px #ffdcaa59,inset 0 -2px 3px #00000080,0 0 0 1px #0009}.felt,.play{left:var(--rail);top:var(--rail);width:var(--w);height:var(--h);position:absolute}.felt{border-radius:var(--rc);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .5 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"), radial-gradient(ellipse 75% 70% at 50% 42%, var(--felt-1) 0%, var(--felt-2) 50%, var(--felt-3) 100%);box-shadow:inset 0 0 0 1px #00000073,inset 0 12px 30px #0000008c,inset 0 -6px 22px #00000059}.felt-print{pointer-events:none;position:absolute;inset:0}.felt-line{border:2px solid #d6b26e38;border-radius:4px;position:absolute;inset:36px}.felt-logo{text-align:center;color:#f3dca021;text-shadow:0 1px #0000002e;-webkit-user-select:none;user-select:none;place-content:center;display:grid;position:absolute;inset:0}.felt-logo span{font:italic 700 92px/1 var(--serif);letter-spacing:.02em}.felt-logo small{font:600 15px/1 var(--sans);letter-spacing:.55em;text-transform:uppercase;margin-top:14px}.shadows,.dice{pointer-events:none;position:absolute;inset:0}.dice{perspective-origin:50%}.dice.appear,.shadows.appear{animation:.35s ease-out appear}@keyframes appear{0%{opacity:0}}.crt{z-index:1;pointer-events:none;background:repeating-linear-gradient(#0000 0,#0000001a 1.5px,#0000 3px),radial-gradient(85% 85%,#0000 55%,#00000038 100%);position:absolute;inset:0;overflow:hidden}.crt:before{content:"";opacity:0;background:#000;animation:5.3s step-end infinite crt-flicker;position:absolute;inset:0}.crt:after{content:"";background:linear-gradient(#0000,#fff0d206 50%,#0000);height:30%;animation:9s linear infinite crt-roll;position:absolute;top:0;left:0;right:0}@keyframes crt-flicker{0%{opacity:0}11%{opacity:.025}13%{opacity:0}47%{opacity:.015}50%{opacity:0}78%{opacity:.03}79%{opacity:.01}82%{opacity:0}}@keyframes crt-roll{0%{transform:translateY(-100%)}to{transform:translateY(334%)}}.die{width:var(--s);height:var(--s);transform-style:preserve-3d;will-change:transform;position:absolute;top:0;left:0}.face{inset:calc(var(--s) * var(--edge) - var(--seam));background:var(--die-base);backface-visibility:hidden;position:absolute}.face .pips{--w:calc(var(--s) * var(--fit,1));left:calc(50% - var(--w) / 2);top:calc(50% - var(--w) / 2);width:var(--w);height:var(--w);position:absolute}.face .shade{opacity:0;pointer-events:none;will-change:opacity;background:#1b1208;position:absolute;inset:0}.piece{transform-origin:0 0;background:var(--die-base);backface-visibility:hidden;position:absolute;top:50%;left:50%}.piece .shade,.piece .ramp{opacity:0;will-change:opacity;background:#1b1208;position:absolute;inset:0}.piece .ramp{background:linear-gradient(to right, transparent var(--seam), #1b1208 calc(100% - var(--seam)));will-change:opacity, transform}.pip{width:var(--pip);height:var(--pip);box-shadow:0 calc(var(--s) * .008) 0 #ffffffb3, inset 0 calc(var(--s) * .014) calc(var(--s) * .02) #000000e6;background:radial-gradient(circle at 40% 34%,#4a4643 0%,#161412 48%,#000 78%);border-radius:50%;position:absolute;transform:translate(-50%,-50%)}.die-shadow{width:var(--s);height:var(--s);filter:blur(calc(var(--s) * .07));will-change:transform, opacity;background:#000c06d9;border-radius:24%;position:absolute;top:0;left:0}.brand{justify-content:space-between;align-items:center;gap:12px;display:flex}.brand h1{font:900 34px/1 var(--serif);letter-spacing:.01em;background:linear-gradient(180deg, var(--gold-hi), var(--gold) 55%, var(--gold-lo));color:#0000;-webkit-background-clip:text;background-clip:text;margin:0}.brand h1 em{font:italic 700 .62em var(--serif);color:var(--muted);-webkit-text-fill-color:var(--muted);margin-left:4px}.icon-btn{border:1px solid var(--line);width:40px;height:40px;color:var(--gold);cursor:pointer;-webkit-tap-highlight-color:transparent;background:#ffffff08;border-radius:50%;flex:none;place-items:center;padding:0;transition:background .15s,border-color .15s;display:grid}.icon-btn:hover{background:#d6b26e14;border-color:#d6b26e73}.icon-btn svg,.peek-show svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}.block h2,.block h3,.block legend{font:600 11px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin:0 0 12px;padding:0}.block-head{justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px;display:flex}.block-head h3{margin:0}.link{color:var(--gold-hi);text-underline-offset:3px;cursor:pointer;background:0 0;border:0;padding:2px 0;font-size:13px;text-decoration:underline}.link:disabled{color:var(--muted);cursor:default;opacity:.6;text-decoration:none}.stepper{justify-content:center;align-items:center;gap:18px;display:flex}.step{border:1px solid var(--gold-lo);width:44px;height:44px;color:var(--gold-hi);font:600 24px/1 var(--sans);cursor:pointer;-webkit-tap-highlight-color:transparent;background:radial-gradient(circle at 50% 30%,#3a291d,#1b120c);border-radius:50%;padding:0;transition:transform 80ms;box-shadow:0 4px 10px #00000073,inset 0 1px #ffffff1a}.step:active:not(:disabled){transform:scale(.94)}.step:disabled{opacity:.35;cursor:default}.chip{--c:#b3202a;--c2:#7c1219;background:radial-gradient(circle, var(--c) 0 50%, var(--c2) 50.5% 54%, transparent 54.5%), repeating-conic-gradient(from 7deg, var(--ivory) 0 16deg, var(--c) 16deg 45deg);border-radius:50%;place-items:center;width:92px;height:92px;display:grid;position:relative;box-shadow:0 0 0 2px #00000059,0 8px 18px #0000008c,inset 0 0 0 4px #00000026,inset 0 2px 2px #ffffff40}.chip[data-color=blue]{--c:#1d4f8f;--c2:#12345f}.chip[data-color=green]{--c:#1c7a4a;--c2:#0f4d2d}.chip[data-color=black]{--c:#222;--c2:#0c0c0c}.chip output{font:900 32px/1 var(--serif);font-variant-numeric:lining-nums tabular-nums;text-box:trim-both cap alphabetic;color:var(--ivory);text-shadow:0 2px #00000059}.chip.bump{animation:.25s ease-out bump}@keyframes bump{40%{transform:rotate(14deg)scale(1.06)}}.roll{cursor:pointer;width:100%;min-height:68px;color:var(--ivory);background:radial-gradient(130% 160% at 50% 0%, #c62b36 0%, var(--burgundy) 42%, var(--burgundy-2) 100%);box-shadow:0 0 0 2px var(--gold-lo), 0 0 0 4px #1a110b, 0 0 0 5px #d6b26e59, 0 14px 26px #0000008c, inset 0 2px 0 #fff3, inset 0 -5px 12px #00000059;-webkit-tap-highlight-color:transparent;border:0;border-radius:16px;justify-content:center;align-items:center;gap:14px;transition:transform 80ms,filter .2s;display:flex;position:relative}.roll span{font:700 28px/1 var(--serif);letter-spacing:.14em;text-transform:uppercase;text-shadow:0 2px #0006}.roll kbd{font:500 11px/1 var(--sans);letter-spacing:.06em;color:#f7f1e3bf;background:#00000047;border-radius:5px;padding:4px 7px}.roll:hover{filter:brightness(1.08)}.roll:active{transform:translateY(2px)scale(.99)}.results{border:1px solid var(--line);background:linear-gradient(#0e5d3a2e,#0735221f);border-radius:14px;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:14px 12px;padding:16px;display:grid;position:relative}.results h2{margin:0}.results .total{grid-column:2}.peek-hide{grid-column:3;width:36px;height:36px}.results .result-dice,.results .placeholder,.results .peek-show{grid-column:1/-1}.result-dice{flex-wrap:wrap;align-items:flex-start;gap:12px 10px;min-height:56px;display:flex}.result-item{justify-items:center;gap:4px;animation:.3s cubic-bezier(.3,1.5,.5,1) both pop;display:grid}.result-item span{font:600 12px/1 var(--sans);color:var(--muted)}@keyframes pop{0%{opacity:0;transform:scale(.6)}}.mini{--s:38px;width:var(--s);height:var(--s);background:radial-gradient(circle at 32% 26%,#fffdf8,#f2ead7 70%,#e3d7bb);border-radius:16%;position:relative;box-shadow:0 3px 8px #00000073,inset 0 0 0 1px #78603c4d}.result-dice.many{gap:10px 8px}.result-dice.many .mini{--s:30px}.total{align-items:baseline;gap:8px;display:flex}.total small{letter-spacing:.2em;text-transform:uppercase;color:var(--muted);font-size:11px}.total b{font:900 30px/1 var(--serif);font-variant-numeric:lining-nums tabular-nums;color:var(--gold-hi)}.placeholder{color:var(--muted);margin:0;font-size:14px}.placeholder.rolling{font-style:italic;animation:.9s ease-in-out infinite alternate breathe}@keyframes breathe{to{opacity:.4}}.peek-show{border:1px solid var(--gold-lo);min-height:52px;color:var(--gold-hi);font:600 15px/1 var(--sans);letter-spacing:.02em;cursor:pointer;-webkit-tap-highlight-color:transparent;background:linear-gradient(#d6b26e24,#d6b26e0d);border-radius:12px;justify-content:center;align-items:center;gap:10px;padding:0 18px;transition:background .15s;display:flex}.peek-show:hover{background:linear-gradient(#d6b26e38,#d6b26e14)}.peek-show svg{width:26px;height:26px}.settings{border:0;border-left:1px solid var(--line);background:var(--panel-2);width:min(400px,100%);max-width:none;height:auto;max-height:none;color:var(--text);overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d6b26e4d transparent;--hidden:translateX(100%);transform:var(--hidden);transition:transform .32s cubic-bezier(.2, .9, .3, 1), overlay .32s allow-discrete, display .32s allow-discrete;margin:0;padding:0;position:fixed;inset:0 0 0 auto;overflow-y:auto;box-shadow:-24px 0 60px #0009}.settings[open]{transform:none}@starting-style{.settings[open]{transform:var(--hidden)}}.settings::backdrop{transition:background-color .32s, overlay .32s allow-discrete, display .32s allow-discrete;background:0 0}.settings[open]::backdrop{background:#0000008c}@starting-style{.settings[open]::backdrop{background:0 0}}.settings-body{min-height:100%;padding:calc(20px + env(safe-area-inset-top)) calc(24px + env(safe-area-inset-right)) calc(28px + env(safe-area-inset-bottom)) 24px;flex-direction:column;gap:30px;display:flex}.settings-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.settings-head h2{font:700 26px/1 var(--serif);color:var(--gold-hi);margin:0}.cards{--s:52px;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px 10px;display:grid}.card{aspect-ratio:1;cursor:pointer;perspective:500px;-webkit-tap-highlight-color:transparent;background:0 0;border:0;padding:0;position:relative}.card-inner{transform-style:preserve-3d;transition:transform .5s cubic-bezier(.3,1.35,.5,1);position:absolute;inset:0}.card[aria-pressed=false] .card-inner{transform:rotateY(180deg)}.card-front,.card-back{backface-visibility:hidden;border-radius:12%;position:absolute;inset:0;box-shadow:0 4px 10px #00000073}.card-front{background:radial-gradient(circle at 32% 26%,#fffdf8,#f2ead7 70%,#e3d7bb);box-shadow:0 4px 10px #00000073,inset 0 0 0 1px #78603c4d}.card-back{background:repeating-linear-gradient(45deg, #ffebc829 0 1.5px, transparent 1.5px 6px), repeating-linear-gradient(-45deg, #ffebc829 0 1.5px, transparent 1.5px 6px), linear-gradient(160deg, var(--burgundy), var(--burgundy-2));box-shadow:0 4px 10px #00000073, inset 0 0 0 3px var(--ivory), inset 0 0 0 4px #00000059;transform:rotateY(180deg)}.card-num{font:600 12px/1 var(--sans);color:var(--muted);transition:color .2s;position:absolute;top:calc(100% + 5px);left:0;right:0}.card[aria-pressed=true] .card-num{color:var(--text)}.card:hover .card-inner{translate:0 -2px}.card.shake{animation:.35s shake}@keyframes shake{20%,60%{transform:translate(-4px)}40%,80%{transform:translate(4px)}}.hint{min-height:1.4em;color:var(--muted);margin:30px 0 0;font-size:13px}.hint.warn{color:var(--gold-hi)}.mode-block{border:0;min-width:0;margin:0;padding:0}.mode-block legend{float:left;width:100%}.segmented{clear:both;border:1px solid var(--line);background:#00000040;border-radius:12px;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px;display:grid}.segmented label{display:block;position:relative}.segmented input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.segmented span{text-align:center;font:500 13px/1.2 var(--sans);color:var(--muted);border-radius:9px;padding:11px 4px;transition:background .15s,color .15s;display:block}.segmented input:hover+span{color:var(--text)}.segmented input:checked+span{color:var(--gold-hi);box-shadow:inset 0 0 0 1px var(--gold-lo), 0 2px 6px #0006;background:linear-gradient(#3d2b1e,#261a11)}.segmented input:focus-visible+span{outline:2px solid var(--gold-hi);outline-offset:2px}.mode-block .hint{margin-top:12px}.sound-row{align-items:center;gap:14px;display:flex}.sound-btn .speaker{fill:currentColor}.sound-btn[aria-pressed=true] .off,.sound-btn[aria-pressed=false] .on{display:none}.sound-btn[aria-pressed=false]{color:var(--muted)}.volume{--fill:70%;cursor:pointer;appearance:none;background:0 0;flex:1;min-width:0;height:32px;margin:0}.volume::-webkit-slider-runnable-track{background:linear-gradient(90deg, var(--gold) var(--fill), #ffffff1f var(--fill));border-radius:3px;height:6px}.volume::-moz-range-track{background:linear-gradient(90deg, var(--gold) var(--fill), #ffffff1f var(--fill));border-radius:3px;height:6px}.volume::-webkit-slider-thumb{background:radial-gradient(circle at 40% 35%, var(--gold-hi), var(--gold) 60%, var(--gold-lo));-webkit-appearance:none;border:0;border-radius:50%;width:22px;height:22px;margin-top:-8px;box-shadow:0 2px 6px #00000080}.volume::-moz-range-thumb{background:radial-gradient(circle at 40% 35%, var(--gold-hi), var(--gold) 60%, var(--gold-lo));border:0;border-radius:50%;width:22px;height:22px;box-shadow:0 2px 6px #00000080}.volume:focus-visible{outline:2px solid var(--gold-hi);outline-offset:2px;border-radius:4px}.volume.muted{opacity:.4}.volume-value{text-align:right;font-variant-numeric:tabular-nums;min-width:5.6em;color:var(--muted);font-size:13px}@media (orientation:portrait),(width<=859px) and (height>=521px){.app{padding-bottom:calc(14px + env(safe-area-inset-bottom));background:radial-gradient(ellipse 90% 50% at 50% 40%, #ffd69614, transparent 70%), radial-gradient(ellipse at 50% 40%, var(--room-2), var(--room) 80%);grid-template:"brand brand brand brand""stage stage stage stage"minmax(0,1fr)".results results."".count roll."/minmax(16px,1fr) auto minmax(0,380px) minmax(16px,1fr)}.panel{display:contents}.brand{padding:calc(10px + env(safe-area-inset-top)) 16px 0;grid-area:brand}.brand h1{font-size:24px}.stage{grid-area:stage}.results{contain:inline-size;grid-area:results;align-items:center;gap:12px;height:64px;margin:4px 0 14px;padding:0 10px 0 12px;display:flex}.results h2{display:none}.results .result-dice,.results .placeholder{flex:1;min-width:0}.results .total{order:2}.peek-hide{order:3}.results[data-state=hidden]{background:0 0;border-color:#0000;padding:0}.results .peek-show{border-radius:14px;flex:1;align-self:stretch}.result-dice{scrollbar-width:none;flex-wrap:nowrap;align-items:center;gap:8px;min-height:0;padding-right:20px;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),#0000);mask-image:linear-gradient(90deg,#000 calc(100% - 24px),#0000)}.result-dice.many{gap:6px}.total small{display:none}.total b:before{content:"=" / "";font:600 .8em/1 var(--sans);vertical-align:.1em;color:var(--muted);margin-right:.3em}.result-item{gap:3px}.mini,.result-dice.many .mini{--s:30px}.result-item span{font-size:10px}.total b{font-size:24px}.count-block{grid-area:count;align-self:center}.count-block h2{display:none}.stepper{gap:8px}.step{width:38px;height:38px;font-size:21px}.chip{width:66px;height:66px}.chip output{font-size:25px}.roll{grid-area:roll;align-self:center;width:auto;min-height:60px;margin-left:16px}.roll span{font-size:23px}.roll kbd{display:none}.settings{border-left:0;border-top:1px solid var(--line);--hidden:translateY(100%);border-radius:20px 20px 0 0;width:100%;max-height:88dvh;inset:auto 0 0;box-shadow:0 -20px 50px #0009}.settings-body{max-width:480px;padding:18px 20px calc(24px + env(safe-area-inset-bottom));gap:26px;margin:0 auto}.settings-head h2{font-size:24px}.cards{--s:56px}}@media (orientation:landscape) and (height<=520px){.app{grid-template-columns:minmax(0,1fr) 280px}.panel{padding:calc(12px + env(safe-area-inset-top)) calc(16px + env(safe-area-inset-right)) 14px 16px;gap:14px}.brand h1{font-size:24px}.icon-btn{width:36px;height:36px}.count-block h2{display:none}.stepper{gap:12px}.step{width:38px;height:38px;font-size:21px}.chip{width:66px;height:66px}.chip output{font-size:25px}.roll{min-height:54px}.roll span{font-size:22px}.roll kbd{display:none}.results{gap:10px;padding:10px 12px}.result-dice{gap:8px 6px;min-height:0}.mini,.result-dice.many .mini{--s:26px}.result-item span{font-size:10px}.total b{font-size:24px}.peek-show{min-height:44px}.settings-body{padding-top:calc(14px + env(safe-area-inset-top));gap:22px}}@media (prefers-reduced-motion:reduce){.card-inner,.chip.bump,.result-item,.settings,.settings::backdrop,.crt:before,.crt:after{transition:none;animation:none}}