:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ink:#f3f1ec;--ink-soft:#c9ced9;--ink-muted:#a9b0bf;--ground:#161a23;--ground-hi:#2b3345;--line:#ffffff1a;--field:#ffffff0f;--gold:#e8b04a;--gold-soft:#f0c36e;--gold-ink:#1a1408;font-family:Inter,system-ui,sans-serif}html,body{height:100%;color:var(--ink);margin:0;overflow:hidden}body{background:radial-gradient(ellipse 60% 55% at 50% 48%, var(--ground-hi), var(--ground) 78%) var(--ground);flex-direction:column;height:100dvh;display:flex}#tray{touch-action:none;flex:1 1 0;width:100%;min-width:0;min-height:0;display:block}#overlay{flex-direction:column;flex:none;align-items:center;gap:16px;padding:0 24px 24px;display:flex}#result{text-align:center;flex-direction:column;flex:none;align-items:center;gap:2px;max-width:100%;display:flex}#natural{letter-spacing:.16em;text-transform:uppercase;color:var(--gold-soft);font-size:12px;font-weight:700}#natural[hidden]{display:none}#total{letter-spacing:-.03em;font-variant-numeric:tabular-nums;font-size:76px;font-weight:800;line-height:.9}#total.pending{opacity:.5}#breakdown{overscroll-behavior:contain;min-height:1.4em;max-height:2.8em;color:var(--ink-muted);font-variant-numeric:tabular-nums;font-size:14px;line-height:1.4;overflow-y:auto}.rerolled,.dropped{opacity:.6}.exploded{color:var(--ink);font-weight:600}#hand-controls{flex-direction:column;flex:none;align-items:center;gap:14px;width:min(600px,100%);display:flex}#die-buttons{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}#notation-row{gap:10px;width:100%;display:flex}button{font:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border:0;border-radius:999px}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.4;cursor:default}button:focus-visible,#notation:focus-visible{outline:2px solid var(--gold);outline-offset:2px}#die-buttons button{border:2px solid var(--die-colour);width:56px;height:56px;color:var(--ink);background:0 0;padding:0;font-size:15px;font-weight:700;transition:background .15s,color .15s;position:relative}@media (hover:hover){#die-buttons button:hover{background:color-mix(in srgb, var(--die-colour) 18%, transparent)}#clear:hover{background:var(--field)}}#die-buttons button.in-hand{background:var(--die-colour);color:var(--die-ink)}#die-buttons button[data-count]:after{content:attr(data-count);box-sizing:border-box;background:var(--ink);min-width:22px;height:22px;color:var(--ground);text-align:center;border-radius:11px;padding:0 6px;font-size:12px;font-weight:800;line-height:22px;position:absolute;top:-6px;right:-6px}#notation{box-sizing:border-box;border:1px solid var(--line);background:var(--field);min-width:0;height:52px;color:var(--ink);border-radius:26px;flex:1 1 0;padding:0 22px;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:18px}#notation::placeholder{color:var(--ink-muted)}#notation[aria-invalid=true]{border-color:#e06c5a}#notation-error{box-sizing:border-box;color:#f0907f;width:100%;min-height:1.3em;margin-top:-6px;padding:0 22px;font-size:14px}#clear{height:52px;color:var(--ink);background:0 0;border:1px solid #ffffff24;padding:0 22px;font-size:15px;font-weight:600}#roll{background:var(--gold);height:52px;color:var(--gold-ink);padding:0 40px;font-size:17px;font-weight:800;box-shadow:0 8px 24px #e8b04a47}#roll:disabled{box-shadow:none}#history-panel{flex-direction:column;width:min(260px,100% - 64px);max-height:40vh;display:flex;position:fixed;top:24px;right:32px}#history-panel:has(#history:empty){display:none}#history-heading{text-transform:uppercase;letter-spacing:.16em;color:var(--ink-muted);margin:0 0 6px;font-size:12px;font-weight:600}#history{margin:0;padding:0;list-style:none;overflow-y:auto}#history button{text-align:left;width:100%;color:var(--ink-soft);background:0 0;border-bottom:1px solid #ffffff14;border-radius:0;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:12px;padding:10px 0;display:grid}#history li:first-child button{color:var(--ink)}@media (hover:hover){#history button:hover .history-notation{text-decoration:underline}}#history-toggle,#history-empty{display:none}.history-notation{font-variant-numeric:tabular-nums;overflow-wrap:anywhere;font-size:14px;font-weight:600}.history-total{font-variant-numeric:tabular-nums;grid-row:span 2;font-size:22px;font-weight:700}.history-breakdown{color:var(--ink-muted);font-variant-numeric:tabular-nums;font-size:12px}@media (width<=1023px),(height<=500px) and (aspect-ratio>=3/2){#history-toggle{z-index:40;width:44px;height:44px;color:var(--ink-soft);background:0 0;place-items:center;padding:0;display:grid;position:fixed;top:24px;right:24px}#history-toggle[aria-expanded=true]{color:var(--gold);background:#e8b04a1f}#history-panel{z-index:40;box-sizing:border-box;border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);background:#161a23f0;border-radius:18px;width:min(320px,100% - 32px);max-height:50vh;padding:14px 16px 6px;display:none;top:76px;right:16px;box-shadow:0 10px 30px #00000059}:is(#history-panel.open,#history-panel.open:has(#history:empty)){display:flex}#history-empty{color:var(--ink-muted);margin:0 0 10px;font-size:14px;display:block}#history:not(:empty)+#history-empty{display:none}}@media (width<=640px){body{background:radial-gradient(ellipse 90% 50% at 50% 42%, var(--ground-hi), var(--ground) 80%) var(--ground)}#overlay{align-items:stretch;padding:0 16px 24px}#total{font-size:64px}#breakdown{font-size:13px}#die-buttons{flex-wrap:nowrap;gap:4px;width:100%}#die-buttons button{aspect-ratio:1;flex:1 1 0;width:auto;min-width:0;max-width:52px;height:auto;font-size:min(13px,3.4vw)}#die-buttons button[data-count]:after{min-width:20px;height:20px;padding:0 5px;font-size:11px;line-height:20px}#notation-row{gap:8px}#notation{height:50px;padding:0 18px;font-size:16px}#clear{height:50px;padding:0 16px;font-size:14px}#roll{height:50px;padding:0 26px;font-size:16px}#history-toggle{top:16px;right:56px}#history-panel{width:auto;top:68px;left:12px;right:12px}}@media (width>=760px){#overlay{flex-direction:row;align-items:flex-end;gap:40px;padding:0 32px 28px}#overlay:after{content:"";flex:0 200px}#result{text-align:right;flex:0 200px;align-items:flex-end;gap:4px;min-width:120px}#breakdown{max-height:4.2em}#hand-controls{flex:0 600px;width:auto;min-width:452px}}@media (width>=760px) and (height<=760px){#total{font-size:60px}#overlay{padding-bottom:20px}#hand-controls{gap:10px}}@media (height<=500px) and (aspect-ratio>=3/2){:root{--side-width:clamp(260px, 40vw, 380px)}body{background:radial-gradient(ellipse 45% 70% at 32% 50%, var(--ground-hi), var(--ground) 80%) var(--ground);flex-direction:row}#overlay{flex:0 0 var(--side-width);box-sizing:border-box;overscroll-behavior:contain;flex-direction:column;align-items:stretch;gap:10px;padding:64px 12px 12px;overflow-y:auto}#overlay:after{content:none}#result{text-align:center;flex:none;align-items:center;gap:0;min-width:0;margin-top:auto}#natural{font-size:11px}#total{font-size:44px}#breakdown{max-height:2.8em;font-size:12px}#hand-controls{flex:none;gap:10px;width:100%;min-width:0}#die-buttons{flex-wrap:wrap;gap:6px;width:100%}#die-buttons button{aspect-ratio:auto;flex:none;width:44px;max-width:none;height:44px;font-size:13px}#notation-row{gap:6px}#notation{height:44px;padding:0 14px;font-size:16px}#clear{height:44px;padding:0 12px;font-size:14px}#roll{height:44px;padding:0 18px;font-size:15px;box-shadow:0 4px 14px #e8b04a3d}#notation-error{margin-top:-4px;padding:0 14px;font-size:12px}#notation-error:empty{min-height:0}#history-toggle{top:8px;right:12px}#history-panel{width:calc(var(--side-width) - 24px);max-height:calc(100% - 72px);top:60px;left:auto;right:12px}}@media (height<=500px) and (aspect-ratio>=3/2) and (width>=820px){#die-buttons{flex-wrap:nowrap;gap:4px}#die-buttons button{aspect-ratio:1;flex:1 1 0;width:auto;min-width:0;max-width:48px;height:auto}}@media (width<=640px) and (height<=620px){#overlay{gap:10px;padding-bottom:16px}#total{font-size:48px}#hand-controls{gap:10px}#notation,#clear,#roll{height:46px}}
