.dice-layout{grid-template-columns:minmax(0,1.65fr) minmax(300px,1fr);gap:22px;display:grid}.dice-stage{isolation:isolate;background:#593875 url(/assets/dice-stage.webp) 50%/cover no-repeat;border:2px solid #fff9;border-radius:24px;min-height:530px;position:relative;overflow:hidden;box-shadow:0 17px 42px #4d316b29}.dice-stage:before{content:"";z-index:-1;background:linear-gradient(#2a164b70,#0000 32%,#2c174a4d);position:absolute;inset:0}.dice-stage-top,.dice-stage-bottom{z-index:2;color:#fff;letter-spacing:.13em;text-shadow:0 2px 9px #341448;font-size:11px;font-weight:900;position:absolute;left:26px;right:26px}.dice-stage-top{justify-content:space-between;align-items:center;display:flex;top:23px}.dice-stage-top span:last-child{color:#80547b;text-shadow:none;background:#ffeddddf;border-radius:8px;padding:9px 10px;font-size:9px}.dice-stage-bottom{text-align:center;bottom:23px}.dice-area{perspective:950px;flex-wrap:wrap;place-content:center;align-items:center;gap:33px;display:flex;position:absolute;inset:78px 20px 65px}.die-wrap{--size:clamp(96px,9vw,120px);width:var(--size);height:calc(var(--size) + 34px);animation:.5s both die-appear;animation-delay:var(--delay);place-items:center;display:grid;position:relative}.die-wrap:after{content:"";filter:blur(8px);background:#260d485c;border-radius:50%;width:72%;height:17px;position:absolute;bottom:0;left:14%}.die-view{z-index:1;width:var(--size);height:var(--size);transform-style:preserve-3d;position:relative;transform:rotateX(-55deg)rotateY(-30deg)}.die{width:100%;height:100%;transform-style:preserve-3d;margin:0;padding:0;list-style:none;transition:transform 1.65s cubic-bezier(.17,.82,.24,1),translate 1.65s cubic-bezier(.17,.82,.24,1);position:relative;translate:0}.die.rolling{translate:0 -18px}.face{--half:calc(var(--size)/2);outline-offset:-1px;backface-visibility:hidden;background:linear-gradient(145deg,#fffefa,#fff4fb 48%,#ecd0e4);border-radius:3px;outline:2px solid #f8e4f3;grid-template:repeat(3,1fr)/repeat(3,1fr);padding:15%;display:grid;position:absolute;inset:-1.5px;box-shadow:inset 3px 3px 6px #fff,inset -5px -6px 9px #b578a45c}.face:before{content:"";pointer-events:none;border:1px solid #fff9;border-radius:5px;position:absolute;inset:4px}.face-front{transform:translateZ(var(--half))}.face-back{transform:rotateY(180deg) translateZ(var(--half))}.face-right{transform:rotateY(90deg) translateZ(var(--half))}.face-left{transform:rotateY(-90deg) translateZ(var(--half))}.face-top{transform:rotateX(90deg) translateZ(var(--half))}.face-bottom{transform:rotateX(-90deg) translateZ(var(--half))}.pip{z-index:1;aspect-ratio:1;background:radial-gradient(circle at 35% 30%,#a65ca4,#793278 58%,#602363);border:1px solid #955394;border-radius:50%;place-self:center;width:60%;box-shadow:inset 1px 2px 3px #431442a6,0 1px 1px #fff}.dice-controls{flex-direction:column;justify-content:center;padding:28px;display:flex}.dice-controls h2{letter-spacing:-.04em;margin:0 0 4px;font-size:21px}.dice-controls>p:not(.game-note){color:#82748d;margin:0 0 17px;font-size:13px}.dice-quantity{background:#fff;border:2px solid #e8d8ec;border-radius:13px;justify-content:space-between;align-items:center;padding:5px;display:flex;box-shadow:0 4px #e8dcec}.dice-quantity button{color:#713b83;background:#f2e6f6;border:0;border-radius:9px;width:43px;height:42px;font-size:24px}.dice-quantity button:disabled{opacity:.4;cursor:not-allowed}.dice-quantity output{font-size:28px;font-weight:900}.dice-limits{color:#a699ae;letter-spacing:.1em;justify-content:space-between;margin:13px 2px 24px;font-size:10px;font-weight:900;display:flex}.dice-result{text-align:center;background:#fcf5ff;border:2px dashed #e1cbe8;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;min-height:178px;display:flex}.dice-result span{color:#a576ad;letter-spacing:.16em;font-size:11px;font-weight:900}.dice-result strong{color:#854192;font-size:72px;font-weight:900;line-height:1.1}.dice-result small{color:#927b99;font-size:12px;font-weight:800}.dice-controls .primary-button{margin-top:25px}.dice-controls .game-note{margin:17px 0 0}.play-description{color:#746981;max-width:750px;margin:52px auto 0;line-height:1.7}.play-description h2{color:#392647;letter-spacing:-.04em;margin:0 0 6px;font-size:24px}.play-description p{margin:0}@keyframes die-appear{0%{opacity:0;transform:translateY(25px)scale(.8)}to{opacity:1;transform:translateY(0)scale(1)}}@media (max-width:920px){.dice-layout{grid-template-columns:1fr}.dice-stage{min-height:450px}.dice-controls{grid-template-columns:1fr 1fr;align-items:center;column-gap:30px;max-width:none;display:grid}.dice-controls h2,.dice-controls>p:not(.game-note),.dice-quantity,.dice-limits{grid-column:1}.dice-result{grid-area:1/2/5}.dice-controls .primary-button,.dice-controls .game-note{grid-column:1/-1}}@media (max-width:600px){.dice-stage{min-height:410px}.dice-area{gap:15px;inset:64px 10px 51px}.die-wrap{--size:clamp(70px,21vw,104px);height:calc(var(--size) + 20px)}.dice-stage-top{font-size:9px;left:16px;right:16px}.dice-stage-top span:last-child{font-size:8px}.dice-stage-bottom{font-size:9px}.dice-controls{padding:22px;display:flex}.dice-result{min-height:145px}.dice-result strong{font-size:60px}}