:root{color-scheme:dark}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,main{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none;touch-action:manipulation}body{background:#070913;color:#f7f4e9;font-family:ui-rounded,SF Pro Rounded,Avenir Next,system-ui,sans-serif}#stage{position:fixed;z-index:0;inset:205px 12px 118px;overflow:hidden;border:1px solid #ffffff14;border-radius:18px;background:#070913}.hud{pointer-events:none;position:fixed;z-index:1;top:max(28px,env(safe-area-inset-top));left:24px}.eyebrow{margin:0 0 8px;color:#e8bc45;font-size:10px;letter-spacing:.22em;font-weight:800}h1{font-size:clamp(32px,10vw,50px);line-height:.87;letter-spacing:-.075em;margin:0;font-weight:900}h1 span{color:#e8bc45}.status{color:#a8adbc;max-width:220px;font-size:13px;margin:14px 0 0;line-height:1.25}.readout{position:fixed;right:24px;top:max(30px,env(safe-area-inset-top));text-align:right}#result{display:block;font-size:46px;line-height:.8;font-weight:900;color:#f7f4e9;font-variant-numeric:tabular-nums}.readout small{color:#a8adbc;font-size:11px}.controls{position:fixed;z-index:2;left:0;right:0;bottom:max(22px,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:center;gap:10px}button{appearance:none;border:0;color:#070913;background:#f7f4e9;font:800 13px ui-rounded,system-ui;letter-spacing:.03em;border-radius:999px;padding:14px 20px;box-shadow:0 8px 30px #0008}#rollButton{width:76px;height:76px;padding:0;border-radius:50%;background:#e8bc45;font-size:13px;box-shadow:0 8px 35px #e8bc4555}.dice-picker{display:flex;align-items:center;height:48px;overflow:hidden;border:1px solid #ffffff24;border-radius:999px;background:#0d1224dd;box-shadow:0 8px 30px #0008}.dice-picker button{width:42px;height:48px;padding:0;border-radius:0;color:#f7f4e9;background:transparent;box-shadow:none;font-size:22px;line-height:1}.dice-picker span{display:grid;min-width:42px;place-items:center;line-height:.8}.dice-picker b{color:#e8bc45;font-size:17px}.dice-picker small{margin-top:4px;color:#a8adbc;font-size:9px;font-weight:800;letter-spacing:.08em}button:active{transform:scale(.94)}.rotate-notice{display:none;position:fixed;z-index:4;inset:0;background:#070913;align-items:center;justify-content:center;text-transform:uppercase;letter-spacing:.12em;font-weight:800}@media(orientation:landscape)and (max-height:700px){.rotate-notice{display:flex}}@media(max-height:700px){#stage{inset:170px 12px 108px}}