@charset "UTF-8";
:root{color-scheme:dark;--black:#080909;--panel:#0d0f0e;--green:#85b941;--moss:#98bb65;--purple:#651c8c;--line:#30203c;--muted:#72904e;--ink:#080d05;font-family:"Courier New",monospace;font-synthesis:none}
html{scrollbar-gutter:stable}
*{box-sizing:border-box}body{margin:0;background:var(--black);color:var(--moss);min-width:280px}body::before{content:"";position:fixed;inset:0;pointer-events:none;background-image:radial-gradient(#51723328 .6px,transparent .6px);background-size:5px 5px;opacity:.2;z-index:-1}
button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.5}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--green);outline-offset:4px}button:focus-visible{position:relative;z-index:2}.app{width:min(1180px,calc(100% - 80px));margin:0 auto;padding:28px 0 22px}.masthead{display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding-bottom:23px}.brand{font-family:Impact,"Arial Black",sans-serif;font-size:24px;letter-spacing:1px;text-decoration:none;color:var(--green);white-space:nowrap;display:flex;gap:8px;align-items:center}.brand-mark{font:28px "Courier New",monospace;color:var(--green)}.brand-period{color:var(--purple);margin-left:-6px}.utilities{display:flex;gap:8px}.utility{min-height:40px;background:#0c0a0e;border:1px solid #46245d;color:var(--moss);padding:9px 13px;font-size:11px;font-weight:bold;letter-spacing:.4px;white-space:nowrap}.utility[aria-pressed=true]{border-color:var(--green);color:var(--green);background:#19200f}.utility:hover{background:#251031;border-color:var(--purple)}
.title-row{display:flex;justify-content:space-between;align-items:center;padding:36px 0 30px}.eyebrow{font-size:10px;letter-spacing:2.4px;margin:0 0 10px;color:var(--muted);font-weight:bold}h1{font-family:Impact,"Arial Black",sans-serif;font-size:clamp(56px,7vw,88px);line-height:.9;margin:0;color:var(--green);letter-spacing:2px}h1 span{color:var(--purple);margin-left:5px}.title-detail{text-align:right;font-size:11px;line-height:1.9;letter-spacing:1px;color:var(--muted)}
.console{display:grid;grid-template-columns:minmax(0,1fr) 338px;gap:24px;align-items:start}.tray-panel{border:1px solid #4b2362;background:var(--panel);box-shadow:5px 5px 0 #261232;min-width:0}.panel-bar{display:flex;justify-content:space-between;gap:8px;font-size:10px;font-weight:bold;letter-spacing:1px;padding:15px 18px;border-bottom:1px solid #412151;color:var(--moss)}.panel-bar>span:first-child{display:flex;align-items:center;gap:8px}.signal{width:6px;height:6px;background:var(--green);display:inline-block}#trayStatus{color:var(--green);letter-spacing:.7px}.tray{position:relative;aspect-ratio:1;background:#0b0e0b;background-image:linear-gradient(#46523510 1px,transparent 1px),linear-gradient(90deg,#46523510 1px,transparent 1px);background-size:36px 36px;overflow:hidden}.tray::after{content:"";position:absolute;inset:18px;border:1px solid #3e2650;pointer-events:none}.tray-corner{position:absolute;width:14px;height:14px;border-color:var(--purple);border-style:solid;z-index:2;pointer-events:none}.corner-tl{left:18px;top:18px;border-width:3px 0 0 3px}.corner-tr{right:18px;top:18px;border-width:3px 3px 0 0}.corner-bl{left:18px;bottom:18px;border-width:0 0 3px 3px}.corner-br{right:18px;bottom:18px;border-width:0 3px 3px 0}canvas{width:100%;height:100%;display:block}.view-label{position:absolute;bottom:26px;left:0;right:0;text-align:center;pointer-events:none;font-size:9px;letter-spacing:1.6px;color:#7b9855;margin:0;background:#0b0e0bb8;padding:4px}.results{min-height:57px;border-top:1px solid #412151;padding:16px 18px;font-size:11px;display:grid;gap:9px}.ready-note{margin:4px 0;text-align:center;color:var(--muted);font-size:9px;letter-spacing:1.4px}.result-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap;line-height:1.5}.result-label{font-size:10px;letter-spacing:.7px;min-width:64px}.result-die{min-width:24px;padding:2px 5px;text-align:center;border:1px solid #385027;color:var(--green);background:#131b0f}.result-row[data-set="2"] .result-die{border-color:#622a80;color:#b65be5;background:#20102b}.result-note{font-size:9px;color:var(--muted)}
.controls{min-width:0}.set-card{border:1px solid #382341;background:#0c0e0c;padding:19px 18px 21px;margin:0 0 20px;min-width:0}.set-card legend{padding:0 9px 0 0;display:flex;align-items:center;gap:8px;color:var(--green);font-weight:bold;font-size:11px;letter-spacing:1.1px}.set-number{padding:5px 7px;background:#1f2b14;color:var(--green);font-size:10px}.set-card:nth-child(2) .set-number{background:#39114f;color:#b65be5}.set-card label{display:block;font-size:9px;letter-spacing:1.2px;font-weight:bold;margin-bottom:9px;color:var(--muted)}select{appearance:none;width:100%;padding:12px 32px 12px 13px;border:1px solid #3c3541;background-color:#161417;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7'%3E%3Cpath fill='%2385b941' d='M0 0h10L5 7z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;color:var(--moss);font-size:12px;min-height:43px;border-radius:0;cursor:pointer}.settings-row{display:grid;grid-template-columns:1fr 128px;gap:14px;margin-top:20px}.colour-input{display:flex;align-items:center;gap:8px;min-height:40px}.colour-input span{font-size:10px;color:var(--moss)}input[type=color]{appearance:none;-webkit-appearance:none;width:39px;height:39px;padding:0;border:1px solid #495437;border-radius:0;background:none;cursor:pointer;flex-shrink:0}input[type=color]::-webkit-color-swatch-wrapper{padding:5px}input[type=color]::-webkit-color-swatch{border:0;border-radius:0}input[type=color]::-moz-color-swatch{border:5px solid var(--black);border-radius:0}.stepper{display:flex;height:40px;border:1px solid #3c3541;background:#151316}.stepper button{border:0;background:transparent;color:var(--green);width:36px;min-width:36px;font-size:19px}.stepper button:hover{background:#2b1737}.stepper input{width:54px;min-width:0;border:0;background:transparent;color:var(--moss);text-align:center;font-weight:bold;font-size:14px;appearance:textfield}.stepper input::-webkit-inner-spin-button,.stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.amount-hint{font-size:9px;color:var(--muted);margin:-5px 0 20px;line-height:1.5}.roll-button{width:100%;display:flex;align-items:center;justify-content:space-between;padding:19px 22px;background:var(--green);border:0;box-shadow:5px 5px 0 var(--purple);color:var(--ink);font-family:Impact,"Arial Black",sans-serif;font-size:35px;letter-spacing:1.7px;line-height:1.1;min-height:76px}.roll-button:hover{background:#99c952}.roll-button:active{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--purple)}.keyboard-hint{margin:20px 0 0;font-size:8px;color:var(--muted);text-align:center;line-height:1.8}.keyboard-hint span{padding:0 5px}kbd{border:1px solid #445633;padding:3px 5px;font-size:9px;color:var(--moss)}.notice{margin:20px 0 0;padding:12px 15px;border-left:3px solid var(--purple);background:#1b1021;color:var(--moss);font-size:11px;line-height:1.6}.notice:empty{display:none}.footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:15px;margin-top:34px;padding-top:17px;color:#647e43;font-size:9px;letter-spacing:.8px}#fullScreenContainer:fullscreen{width:100%;height:100%;margin:0;padding:25px max(25px,calc((100vw - 1180px)/2));overflow:auto;background:var(--black)}.app.fullscreen-fallback{position:fixed;inset:0;width:100%;margin:0;overflow:auto;background:var(--black);z-index:10;padding:20px}.fullscreen-fallback .title-row{padding-top:24px}
@media(min-width:1000px){.tray{max-height:60vh;min-height:460px;aspect-ratio:auto}.tray-panel{align-self:stretch}.console{grid-template-columns:minmax(0,1fr) 338px}.tray{height:calc(100vw * .49);max-height:620px}}
@media(max-width:900px){.app{width:calc(100% - 40px);padding-top:20px}.console{grid-template-columns:minmax(0,1fr) 310px;gap:18px}.masthead{gap:15px}.brand{font-size:21px}.utility{padding:9px;font-size:10px}.settings-row{grid-template-columns:minmax(0,1fr) 121px;gap:8px}.colour-input span{font-size:9px}.set-card{padding:18px 13px}.tray{min-height:430px;aspect-ratio:auto;height:100%}.title-row{padding:30px 0 25px}.tray-panel{align-self:stretch}.keyboard-hint{font-size:7px}}
@media(max-width:720px){.app{width:calc(100% - 32px);padding:18px 0}.masthead{flex-wrap:wrap;padding-bottom:17px;gap:17px}.brand{font-size:23px}.utilities{width:100%;justify-content:space-between;gap:8px}.utility{flex:1;min-height:42px;font-size:10px}.title-row{padding:27px 0 23px}.eyebrow{font-size:8px;letter-spacing:1.6px;margin-bottom:10px}h1{font-size:62px;letter-spacing:1px}.title-detail{font-size:8px;letter-spacing:.5px;line-height:1.8}.console{display:flex;flex-direction:column;gap:24px}.tray-panel{width:100%}.tray{aspect-ratio:1;height:auto;min-height:0}.panel-bar{padding:12px 13px;font-size:9px}.results{padding:12px 13px;min-height:50px}.controls{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.set-card{margin:0 0 15px;padding:15px 11px 17px}.set-card legend{font-size:9px;letter-spacing:.5px;gap:6px}.set-number{font-size:9px;padding:4px 5px}select{padding:11px 26px 11px 8px;font-size:10px;background-position:right 9px center}.settings-row{display:flex;flex-direction:column;gap:15px;margin-top:16px}.colour-input{min-height:36px}.colour-input span{font-size:10px}.stepper{width:100%;justify-content:space-between}.stepper input{flex:1;width:40px}.stepper button{width:42px;min-width:42px}.amount-hint,.roll-button,.keyboard-hint{grid-column:1/-1}.amount-hint{margin:0 0 17px;font-size:9px}.roll-button{min-height:72px;padding:17px 21px}.keyboard-hint{margin-top:17px;font-size:8px}.footer{font-size:8px;margin-top:27px}.view-label{font-size:8px;letter-spacing:1px}.notice{font-size:10px}.results{gap:7px}.result-label{font-size:9px;min-width:57px}.result-die{min-width:23px}}
@media(max-width:350px){h1{font-size:51px}.title-detail{display:none}.utilities{gap:5px}.utility{font-size:9px;padding:8px 5px}.controls{display:flex;flex-direction:column;gap:0}.settings-row{display:grid;grid-template-columns:minmax(0,1fr) 128px;gap:10px}.set-card{padding:14px 12px}.brand{font-size:21px}select{font-size:12px}}
.stepper button:disabled{cursor:default;opacity:.3}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}