@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#202936;background:#f4f6f8;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% 8%,#fff 0,#f4f6f8 55%)}.page-shell{max-width:920px;margin:0 auto;padding:28px 28px 36px}.topbar{height:42px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;color:#182b46;text-decoration:none;font:800 18px Manrope,sans-serif;letter-spacing:-.7px}.brand-mark{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#173d65;color:#fff;font:800 17px Manrope}.brand-light{font-weight:500;color:#6d7a89}.ad-free{font-size:12px;color:#667381;display:flex;align-items:center;gap:7px}.dot{width:7px;height:7px;border-radius:50%;background:#3eaa7d;box-shadow:0 0 0 3px #e4f4ed}.intro{text-align:center;padding:56px 0 29px}.eyebrow,.section-label{font-size:10px;letter-spacing:1.5px;font-weight:700;color:#8090a1}.eyebrow{margin:0 0 12px;text-transform:uppercase}.intro h1{font:800 clamp(32px,5vw,43px) Manrope,sans-serif;letter-spacing:-1.8px;margin:0;color:#182b46}.subtitle{font-size:15px;color:#798695;margin:10px 0 0}.roller-card{max-width:660px;margin:auto;padding:23px 28px 17px;background:#fff;border:1px solid #e8edf1;border-radius:18px;box-shadow:0 14px 45px #233b5510}.card-topline{display:flex;justify-content:space-between;align-items:center}.roll-number{font-size:12px;color:#9aa5b0}.dice-stage{min-height:224px;padding:27px 10px;display:flex;align-items:center;justify-content:center;gap:clamp(10px,2.1vw,19px);flex-wrap:wrap}.die{width:clamp(62px,10vw,82px);height:clamp(62px,10vw,82px);border-radius:17px;display:block;background:var(--die);box-shadow:inset 0 -5px 0 #00000015,0 8px 15px #24364a22;transform:translateY(0) rotate(var(--tilt,0deg));transition:filter .2s}.die.rolling{animation:bounce .58s ease-in-out infinite alternate}@keyframes bounce{from{transform:translateY(-10px) rotate(-8deg)}to{transform:translateY(7px) rotate(8deg)}}.roll-summary{min-height:30px;border-top:1px solid #edf0f3;padding-top:14px;display:flex;justify-content:center;align-items:center;gap:10px;color:#687584;font-size:13px}.roll-id-row{border-top:1px solid #edf0f3;padding:12px 2px 0;display:flex;align-items:center;justify-content:space-between;color:#82909e;font-size:11px}.roll-id-row[hidden]{display:none}.roll-id-row code{margin-left:5px;color:#34495e;font:600 11px 'DM Sans',sans-serif;letter-spacing:.4px}.roll-id-row a,.verify-link a{color:#315e84;text-decoration:none;font-weight:600}.roll-id-row a:hover,.verify-link a:hover{text-decoration:underline}.verify-link{text-align:center;margin:17px 0 0;font-size:12px}.controls{display:flex;justify-content:center;align-items:center;gap:12px;padding-top:18px}.count-control{font-size:12px;color:#778493;display:flex;align-items:center;gap:7px}.count-control select{height:42px;border:1px solid #dfe5ea;border-radius:10px;background:#fff;padding:0 11px;color:#25364a;font:600 14px 'DM Sans',sans-serif}.roll-button{height:44px;min-width:155px;border:0;border-radius:10px;background:#173d65;color:#fff;font:700 14px 'DM Sans',sans-serif;cursor:pointer;box-shadow:0 4px 9px #173d6528;transition:transform .15s,background .15s}.roll-button:hover{background:#245783;transform:translateY(-1px)}.roll-button:active{transform:translateY(1px)}.roll-button:disabled{opacity:.7;cursor:wait}.roll-button span{font-size:19px;vertical-align:-1px;margin-right:5px}.keyboard-hint{text-align:center;color:#a0aab5;font-size:10px;margin:13px 0 0}kbd{border:1px solid #e1e6eb;border-radius:4px;background:#f8f9fa;padding:1px 4px;font:10px 'DM Sans',sans-serif}.color-key{max-width:660px;margin:24px auto 0;padding:0 4px}.color-key>.section-label{display:block;text-align:center}.color-list{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin-top:13px}.color-list span{display:flex;align-items:center;gap:6px;font-size:11px;color:#687584}.swatch{width:9px;height:9px;border-radius:50%}.red{background:#ed5b5b}.orange{background:#f29d38}.yellow{background:#e6c847}.green{background:#49ad79}.blue{background:#4b8bd5}.purple{background:#9870cf}footer{text-align:center;margin-top:48px;font-size:11px;color:#9aa5b0}footer span{padding:0 5px}@media(max-width:520px){.page-shell{padding:19px 16px 28px}.intro{padding:45px 0 24px}.roller-card{padding:20px 15px 16px}.dice-stage{min-height:195px;padding:25px 2px;gap:10px}.die{border-radius:14px}.color-list{gap:12px}footer{margin-top:38px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}