@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root{font-family:'Noto Sans KR',system-ui,sans-serif;color:#fff;font-synthesis:none;--yellow:#f1bc52;--ink:#20282b;--die-size:100px;--half:50px}*{box-sizing:border-box}body{margin:0;background:#747b80;background-image:radial-gradient(ellipse at 50% 35%,#92999d 0,#777f84 48%,#59636a 100%);width:100%;height:100dvh;min-height:320px;overflow:hidden;overscroll-behavior:none}button,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #ffe0a0;outline-offset:4px}button{border:0}a{color:inherit;text-decoration:none}svg{width:22px;height:22px;flex-shrink:0}[hidden]{display:none!important}.glass{display:inline-flex;align-items:center;gap:9px;min-height:46px;padding:11px 16px;border:1px solid #ffffff28;border-radius:14px;color:#fff;background:#2932387a;box-shadow:0 3px 12px #17232914;backdrop-filter:blur(14px);font-size:13px;font-weight:700}.glass:hover{background:#263138b8}.dice-header{position:absolute;z-index:4;top:calc(18px + env(safe-area-inset-top));left:max(20px,env(safe-area-inset-left));right:max(20px,env(safe-area-inset-right));display:flex;justify-content:space-between;gap:12px;pointer-events:none}.dice-header>*{pointer-events:auto}.back>span:first-child{font-size:23px}.connect{max-width:55%}.connect span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.connect.connected{background:#243e34b0;border-color:#b1dec460}.connect.connected::before{content:'';width:7px;height:7px;border-radius:50%;background:#a8edc8;flex-shrink:0}.connect.connected svg{display:none}.connect.offline{background:#593e29c9}.table{position:absolute;inset:calc(86px + env(safe-area-inset-top)) 24px calc(122px + env(safe-area-inset-bottom));display:flex;flex-direction:column}.table-heading{text-align:center;pointer-events:none}.kicker{letter-spacing:.2em;font-size:10px;font-weight:700;color:#eef2f2bb}.table-heading p{margin:8px 0 0;font-size:13px;font-weight:600;min-height:22px;color:#fff}.dice-area{flex:1;min-height:0;display:grid;place-items:center;touch-action:pinch-zoom;user-select:none;-webkit-user-select:none;padding:18px 12px 20px;overflow:hidden}.dice-grid{display:grid;gap:var(--gap,22px);grid-template-columns:repeat(var(--cols,4),var(--die-size));justify-content:center;align-content:center}.die{width:var(--die-size);height:var(--die-size);position:relative;perspective:800px;cursor:pointer;outline:none}.die::after{content:'';position:absolute;width:86%;height:22%;left:11%;bottom:-15%;background:#25303868;filter:blur(7px);border-radius:50%;z-index:-1}.cube{position:absolute;width:100%;height:100%;transform-style:preserve-3d;transform:rotateX(-12deg) rotateY(14deg);will-change:transform}.face{position:absolute;inset:calc(9% - .7px);border-radius:0;backface-visibility:hidden;background:var(--dice-front);border:0;box-shadow:var(--dice-shadow);display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);padding:8%;gap:10%}.front{transform:translateZ(var(--half))}.back-face{transform:rotateY(180deg) translateZ(var(--half))}.right{transform:rotateY(90deg) translateZ(var(--half));background:var(--dice-right)}.left{transform:rotateY(-90deg) translateZ(var(--half));background:var(--dice-left)}.top{transform:rotateX(90deg) translateZ(var(--half));background:var(--dice-top)}.bottom{transform:rotateX(-90deg) translateZ(var(--half));background:var(--dice-bottom)}.pip{border-radius:50%;background:var(--dice-pip);box-shadow:var(--dice-pip-shadow)}.landed .front{box-shadow:var(--dice-landed-shadow)}.result-strip{text-align:center;min-height:48px;pointer-events:none}.result-strip p{margin:0}.result-strip #result{font-size:15px;font-weight:700}.gesture-hint{font-size:11px;color:#e0e6e9;margin-top:7px!important}.dice-controls{position:absolute;bottom:calc(22px + env(safe-area-inset-bottom));left:max(24px,env(safe-area-inset-left));right:max(24px,env(safe-area-inset-right));height:66px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px}.utility{display:flex;gap:8px;justify-self:start}.small{padding:10px 12px;gap:5px;font-size:17px}.small span{font-size:11px}.stepper{display:flex;align-items:center;border:1px solid #ffffff35;border-radius:19px;background:#283339bd;box-shadow:0 5px 18px #1a28252b;height:60px;overflow:hidden}.stepper button{color:#fff;background:transparent;height:100%;min-width:50px;font-size:27px}.stepper #count{font-size:15px;min-width:64px;padding:0 5px}.stepper #count strong{font-size:25px;margin-right:5px;font-variant-numeric:tabular-nums}.stepper #count span{font-size:12px;color:#d9e0e3}.stepper button:hover:not(:disabled){background:#ffffff12}.roll{justify-self:end;display:flex;align-items:center;justify-content:center;gap:10px;min-height:60px;padding:16px 23px;border-radius:19px;background:var(--yellow);color:var(--ink);font-size:15px;font-weight:900;box-shadow:0 5px 0 #a67523,0 10px 24px #17222938;white-space:nowrap}.roll:hover:not(:disabled){background:#ffd279}.roll:active:not(:disabled){transform:translateY(2px);box-shadow:0 3px 0 #a67523}.roll:disabled{opacity:.65;box-shadow:none}dialog{border:1px solid #e2e5e4;border-radius:24px;padding:24px;max-width:480px;width:calc(100% - 32px);max-height:85dvh;background:#f7f8f6;color:#263239;box-shadow:0 24px 70px #0004}dialog::backdrop{background:#101c2580;backdrop-filter:blur(5px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}.dialog-heading h1{font-size:20px;margin:0}.dialog-heading button{background:#e8ece9;width:34px;height:34px;border-radius:50%;font-size:25px;color:#344148}.dialog-body p,dialog p{font-size:13px;line-height:1.7;color:#58666b}dialog button.primary,dialog a.primary{display:block;text-align:center;width:100%;margin-top:12px;background:#263b37;color:#fff;padding:13px;border-radius:12px;font-weight:700;font-size:14px}dialog button.secondary{width:100%;margin-top:10px;padding:12px;border-radius:12px;background:#e3e8e4;color:#283a34;font-weight:700}dialog input[type=text],dialog input[type=number]{display:block;width:100%;padding:13px;border-radius:12px;border:1px solid #c9d2ce;background:#fff;font-size:18px;margin-top:8px}dialog label{font-size:13px;font-weight:700}dialog .rule{border-top:1px solid #dce2de;margin:22px 0}.invite-code{display:block;text-align:center;font:800 24px ui-monospace,monospace;letter-spacing:.09em;background:#e6ebe7;border-radius:12px;padding:18px;margin:10px 0;user-select:all}.history-item{padding:13px 0;border-top:1px solid #dce2de}.history-item header{display:flex;justify-content:space-between;gap:8px;font-size:12px}.history-values{display:flex;flex-wrap:wrap;gap:5px;margin:9px 0}.history-values b{display:grid;place-items:center;width:25px;height:25px;background:#fff;border:1px solid #d4dcd7;border-radius:6px;font-size:12px}.history-item small{color:#68756b;font-size:11px}.preference{display:flex;align-items:center;justify-content:space-between;padding:15px 0;border-top:1px solid #dce2de}.preference input{width:20px;height:20px;accent-color:#345647}#toast{position:fixed;z-index:20;bottom:calc(108px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);max-width:min(520px,92vw);background:#1d282ded;color:white;box-shadow:0 5px 20px #0002;padding:12px 18px;border-radius:12px;font-size:13px;text-align:center;pointer-events:none}
@media(max-width:600px){.dice-header{left:14px;right:14px;top:calc(12px + env(safe-area-inset-top));gap:8px}.glass{min-height:42px;font-size:12px;padding:9px 11px;border-radius:12px;gap:6px}.wide{display:inline}.table{inset:calc(72px + env(safe-area-inset-top)) 9px calc(136px + env(safe-area-inset-bottom))}.table-heading p{font-size:12px}.kicker{font-size:9px}.dice-area{padding:15px 12px 20px}.dice-controls{bottom:calc(19px + env(safe-area-inset-bottom));left:14px;right:14px;height:100px;gap:11px;grid-template-columns:1fr auto 1fr;grid-template-rows:36px 56px}.utility{grid-column:1;grid-row:1 / 3;flex-direction:column;gap:7px;align-self:end}.small{min-height:34px;padding:7px 9px;gap:4px}.small span{font-size:10px}.stepper{grid-column:2;grid-row:2;height:54px;border-radius:16px}.stepper button{min-width:36px;font-size:26px}.stepper #count{min-width:48px}.stepper #count strong{font-size:23px}.roll{grid-column:3;grid-row:2;padding:13px 11px;min-height:54px;border-radius:16px;gap:5px;font-size:12px}.roll svg{width:18px;height:18px}.result-strip #result{font-size:13px}.gesture-hint{font-size:10px}#toast{bottom:calc(131px + env(safe-area-inset-bottom))}}
@media(max-width:360px){.roll span{max-width:48px;white-space:normal;line-height:1.3}.roll{padding:10px}.stepper button{min-width:31px}.connect{max-width:53%}}@media(max-height:500px){.table{top:60px;bottom:87px}.table-heading{display:none}.result-strip{min-height:24px}.gesture-hint{display:none}.dice-controls{height:50px;bottom:14px;display:grid;grid-template-columns:1fr auto 1fr;grid-template-rows:auto}.utility{grid-row:1;flex-direction:row}.stepper,.roll{grid-row:1;height:46px;min-height:46px}.dice-area{padding:10px}.dice-header{top:10px}.glass{min-height:36px;padding:7px 11px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

/* One restrained accent after a confirmed roll visibly stops. */
.dice-grid.landing-feedback{animation:dice-landing-lift 180ms ease-out}
.dice-grid.landing-feedback.landing-still{animation:dice-landing-flash 180ms ease-out}
@keyframes dice-landing-lift{0%,100%{transform:translateY(0) scale(1);filter:brightness(1)}35%{transform:translateY(-3px) scale(1.012);filter:brightness(1.1)}}
@keyframes dice-landing-flash{0%,100%{filter:brightness(1)}35%{filter:brightness(1.1)}}

/* Keep the daily quota visible in compact landscape layouts too. */
.result-strip #quotaStatus{display:block;font-size:11px;margin:0 0 4px;color:#f2f5f5}

/* Keep the original grid slots until the next accepted roll. */
.die.removed{visibility:hidden;pointer-events:none}
.die:focus-visible{outline:2px solid var(--yellow);outline-offset:9px;border-radius:10px}


/* Compact, dismissible face counts; opt-in and computed from visible dice. */
.dice-counting-popup{position:fixed;z-index:8;top:50%;left:50%;transform:translate(-50%,-50%);width:min(300px,calc(100vw - 36px));padding:16px;border:1px solid #f6d78b;border-radius:20px;background:#fbfcf9;color:#273238;box-shadow:0 14px 48px #15232b66;text-align:left;touch-action:manipulation}
.counting-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;font-size:13px}.counting-heading strong{font-weight:800}.counting-heading>span{font-size:11px;color:#59696d;font-variant-numeric:tabular-nums}
.counting-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.counting-item{display:flex;align-items:center;justify-content:center;gap:8px;padding:9px 5px;border-radius:10px;background:#edf1ed}.counting-face{display:grid;place-items:center;width:26px;height:26px;border:1px solid #c9d0c7;border-radius:7px;background:#fffefa;box-shadow:0 2px 0 #c9d0c7;font-size:14px;font-weight:800;flex-shrink:0}.counting-amount{white-space:nowrap;font-variant-numeric:tabular-nums}.counting-amount b{font-size:18px;font-weight:900}.counting-amount small{font-size:10px;margin-left:2px}.counting-item.empty{background:#f1f3f0;color:#657275}.counting-hint{display:block;margin-top:12px;text-align:center;font-size:10px;color:#62716e}
@media(max-width:360px){.dice-counting-popup{padding:14px}.counting-grid{gap:6px}.counting-item{gap:5px}.counting-amount b{font-size:16px}}

/* Undo stays directly above History, on phone and desktop alike. */
.history-tools{position:relative;display:flex}.history-tools #undo{position:absolute;bottom:calc(100% + 7px);left:0;min-width:100%;white-space:nowrap}.utility{align-items:flex-end;align-self:end}.history-tools .small{justify-content:center}

/* Local cosmetic skins share the existing geometry and unchanged face values. */
:root,[data-dice-skin="classic"]{--dice-front:linear-gradient(135deg,#fffefa,#e6e2d8);--dice-right:#cdcac1;--dice-left:#ddd9cf;--dice-top:#fffdf6;--dice-bottom:#c9c7c0;--dice-border:#fff5;--dice-shadow:inset 0 0 0 2px #fff5,inset -3px -4px 8px #b7b3a055;--dice-pip:#283239;--dice-pip-shadow:inset 0 2px 3px #0008,0 1px 1px #fff;--dice-landed-shadow:inset 0 0 0 2px #fff9,0 0 12px #ffe8b14d;--dice-gloss:0;--dice-texture-size:auto}
[data-dice-skin="burgundy-gold"]{--dice-marble:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22256%22%20height%3D%22256%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22wine%22%20x2%3D%22.8%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%23350612%22%2F%3E%3Cstop%20offset%3D%22.3%22%20stop-color%3D%22%23a71232%22%2F%3E%3Cstop%20offset%3D%22.65%22%20stop-color%3D%22%2363091e%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23c12440%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22ribbon%22%20x2%3D%221%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%23e9b8bf%22%20stop-opacity%3D%22.5%22%2F%3E%3Cstop%20offset%3D%22.24%22%20stop-color%3D%22%2362132b%22%2F%3E%3Cstop%20offset%3D%22.51%22%20stop-color%3D%22%23c25267%22%2F%3E%3Cstop%20offset%3D%22.71%22%20stop-color%3D%22%23f4c7c7%22%20stop-opacity%3D%22.45%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23700d2c%22%2F%3E%3C%2FlinearGradient%3E%3CradialGradient%20id%3D%22ruby%22%3E%3Cstop%20stop-color%3D%22%23ee2545%22%20stop-opacity%3D%22.7%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23b11835%22%20stop-opacity%3D%220%22%2F%3E%3C%2FradialGradient%3E%3Cfilter%20id%3D%22flow%22%20x%3D%22-25%25%22%20y%3D%22-25%25%22%20width%3D%22150%25%22%20height%3D%22150%25%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%22.012%20.022%22%20numOctaves%3D%222%22%20seed%3D%227%22%20result%3D%22noise%22%2F%3E%3CfeDisplacementMap%20in%3D%22SourceGraphic%22%20in2%3D%22noise%22%20scale%3D%2238%22%20xChannelSelector%3D%22R%22%20yChannelSelector%3D%22B%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22url(%23wine)%22%20d%3D%22M0%200h256v256H0z%22%2F%3E%3Cellipse%20fill%3D%22url(%23ruby)%22%20cx%3D%22206%22%20cy%3D%2252%22%20rx%3D%22100%22%20ry%3D%22145%22%2F%3E%3Cg%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20filter%3D%22url(%23flow)%22%3E%3Cpath%20stroke%3D%22%23280615%22%20stroke-width%3D%2236%22%20opacity%3D%22.6%22%20d%3D%22M-35%2017C88%2086%2031%20118%20132%20154S161%20247%20280%20238%22%2F%3E%3Cpath%20stroke%3D%22url(%23ribbon)%22%20stroke-width%3D%2226%22%20d%3D%22M-31%20-14C122%2056%20-9%20101%20107%20131S239%20164%20183%20224S221%20279%20290%20300%22%2F%3E%3Cpath%20stroke%3D%22%23e8a6b1%22%20stroke-opacity%3D%22.5%22%20stroke-width%3D%223.5%22%20d%3D%22M-32%20-14C122%2056%20-4%2098%20110%20126S239%20164%20181%20224S221%20280%20288%20300%22%2F%3E%3Cpath%20stroke%3D%22%2348091e%22%20stroke-width%3D%228%22%20d%3D%22M-32%207C96%2064%20-16%20110%2099%20141S218%20173%20166%20235S220%20287%20291%20302%22%2F%3E%3Cpath%20stroke%3D%22%23ed687d%22%20stroke-opacity%3D%22.4%22%20stroke-width%3D%224%22%20d%3D%22M-36%2010C95%2065%20-15%20113%20101%20145S219%20174%20168%20239%22%2F%3E%3Cpath%20stroke%3D%22url(%23ribbon)%22%20stroke-width%3D%2216%22%20opacity%3D%22.8%22%20d%3D%22M119%20-24C112%2019%20184%2035%20175%2067S181%20108%20294%2092%22%2F%3E%3Cpath%20stroke%3D%22%23edd0cf%22%20stroke-width%3D%222.5%22%20opacity%3D%22.55%22%20d%3D%22M116%20-25C108%2018%20180%2036%20171%2067S181%20111%20295%2095%22%2F%3E%3Cpath%20stroke%3D%22%2328081a%22%20stroke-width%3D%2212%22%20opacity%3D%22.6%22%20d%3D%22M-26%20196C46%20166%2070%20232%20112%20280%22%2F%3E%3Cpath%20stroke%3D%22%23bf6979%22%20stroke-width%3D%225%22%20opacity%3D%22.65%22%20d%3D%22M-25%20187C49%20160%2086%20245%20121%20282%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");--dice-front:linear-gradient(135deg,#ffffff1c 0%,transparent 35%,#21000d35 100%),var(--dice-marble);--dice-right:linear-gradient(#17040c48,#17040c48),var(--dice-marble);--dice-left:linear-gradient(#17040c26,#17040c26),var(--dice-marble);--dice-top:linear-gradient(135deg,#ffffff36,#ffffff08 55%,transparent),var(--dice-marble);--dice-bottom:linear-gradient(#1601096b,#1601096b),var(--dice-marble);--dice-border:#d8839070;--dice-shadow:inset 0 1px 2px #fff7,inset 1px 0 2px #f9d6d86b,inset -3px -4px 6px #2107119c;--dice-pip:radial-gradient(circle at 34% 28%,#fff0b1 0%,#e0c374 43%,#b98b39 78%,#806024 100%);--dice-pip-shadow:inset 0 1px 2px #55400b8c,0 1px 1px #ffd87d73,0 0 0 1px #280a1555;--dice-landed-shadow:inset 0 1px 2px #ffe9e0b3,inset 1px 0 2px #f9d6d86b,inset -3px -4px 6px #2107119c,0 0 10px #e7b86929;--dice-gloss:1;--dice-texture-size:100% 100%,155% 155%}
.face{background-size:var(--dice-texture-size);background-position:var(--marble-position,40% 30%)}
.die:nth-child(3n+2){--marble-position:85% 70%}.die:nth-child(3n){--marble-position:10% 95%}.face.right{background-position:70% 10%}.face.top{background-position:15% 80%}
.face::before{content:'';position:absolute;inset:2%;border-radius:inherit;background:linear-gradient(155deg,#fff8 0%,#fff1 12%,transparent 30% 72%,#efbdb326 92%,transparent);opacity:var(--dice-gloss);pointer-events:none}.pip{position:relative;z-index:1}

/* Compact preferences; explanations expand independently via accessible buttons. */
.setting-heading{display:flex;align-items:center;gap:6px;margin-bottom:12px}.setting-heading h2{font-size:14px;margin:0;font-weight:800}.preference-help{display:inline-flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;padding:7px;border-radius:50%;color:#60736a;background:transparent}.preference-help svg{width:21px;height:21px}.preference-help:hover,.preference-help[aria-expanded="true"]{background:#e2ebe3;color:#264b3b}
.skin-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0;padding:0;border:0}.skin-choice{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;padding:20px 8px 15px;min-width:0;min-height:156px;border:1px solid #ced8d1;border-radius:16px;background:#edf0eb;cursor:pointer;transition:border-color .15s,background .15s}.skin-choice.is-selected{background:#e5ece2;border:2px solid #456750;padding:19px 7px 14px}.skin-choice:focus-within{outline:3px solid #deb350;outline-offset:3px}.skin-choice input{position:absolute;top:9px;right:9px;width:17px;height:17px;margin:0;accent-color:#38563f}.skin-preview{position:relative;display:block;width:46px;height:46px;margin:9px 0 1px;perspective:400px;--half:23px}.skin-copy{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.skin-copy strong{font-size:13px;color:#273b31;line-height:1.4}.skin-copy small{font-size:10px;color:#627269;line-height:1.4}
.skin-settings{padding-bottom:20px}.preference-item{border-top:1px solid #dce2de}.preference-row{display:flex;align-items:center;gap:5px;min-height:60px;padding:9px 0}.preference-row label{cursor:pointer}.preference-row input{width:20px;height:20px;flex:0 0 20px;margin:0 0 0 auto;accent-color:#345647}.preference-detail{font-size:12px!important;line-height:1.7;color:#596b60!important;margin:0 0 14px!important;padding:12px 14px;border-radius:10px;background:#e9eee7}.preference-detail p{font-size:12px;margin:0}.preference-detail p+p{margin-top:8px}#screenAwakeStatus{font-weight:600}
@media(max-width:360px){.skin-choices{gap:8px}.skin-choice{min-height:149px}.skin-copy strong{font-size:12px}.skin-copy small{font-size:9px}}

/* Static materials: texture is shared across faces; skin selection never changes dice state. */

[data-dice-skin="vortex-blue-gold"]{--dice-marble:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22256%22%20height%3D%22256%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22wine%22%20x2%3D%22.8%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%23061b40%22%2F%3E%3Cstop%20offset%3D%22.3%22%20stop-color%3D%22%23145bb5%22%2F%3E%3Cstop%20offset%3D%22.65%22%20stop-color%3D%22%23092d6c%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23237bcc%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22ribbon%22%20x2%3D%221%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%239ec9e9%22%20stop-opacity%3D%22.5%22%2F%3E%3Cstop%20offset%3D%22.24%22%20stop-color%3D%22%23123873%22%2F%3E%3Cstop%20offset%3D%22.51%22%20stop-color%3D%22%23448bca%22%2F%3E%3Cstop%20offset%3D%22.71%22%20stop-color%3D%22%23bddfee%22%20stop-opacity%3D%22.45%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23153972%22%2F%3E%3C%2FlinearGradient%3E%3CradialGradient%20id%3D%22ruby%22%3E%3Cstop%20stop-color%3D%22%232191ec%22%20stop-opacity%3D%22.7%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23165cab%22%20stop-opacity%3D%220%22%2F%3E%3C%2FradialGradient%3E%3Cfilter%20id%3D%22flow%22%20x%3D%22-25%25%22%20y%3D%22-25%25%22%20width%3D%22150%25%22%20height%3D%22150%25%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%22.012%20.022%22%20numOctaves%3D%222%22%20seed%3D%227%22%20result%3D%22noise%22%2F%3E%3CfeDisplacementMap%20in%3D%22SourceGraphic%22%20in2%3D%22noise%22%20scale%3D%2238%22%20xChannelSelector%3D%22R%22%20yChannelSelector%3D%22B%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22url(%23wine)%22%20d%3D%22M0%200h256v256H0z%22%2F%3E%3Cellipse%20fill%3D%22url(%23ruby)%22%20cx%3D%22206%22%20cy%3D%2252%22%20rx%3D%22100%22%20ry%3D%22145%22%2F%3E%3Cg%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20filter%3D%22url(%23flow)%22%3E%3Cpath%20stroke%3D%22%23071932%22%20stroke-width%3D%2236%22%20opacity%3D%22.6%22%20d%3D%22M-35%2017C88%2086%2031%20118%20132%20154S161%20247%20280%20238%22%2F%3E%3Cpath%20stroke%3D%22url(%23ribbon)%22%20stroke-width%3D%2226%22%20d%3D%22M-31%20-14C122%2056%20-9%20101%20107%20131S239%20164%20183%20224S221%20279%20290%20300%22%2F%3E%3Cpath%20stroke%3D%22%239cbfe0%22%20stroke-opacity%3D%22.5%22%20stroke-width%3D%223.5%22%20d%3D%22M-32%20-14C122%2056%20-4%2098%20110%20126S239%20164%20181%20224S221%20280%20288%20300%22%2F%3E%3Cpath%20stroke%3D%22%230d2e58%22%20stroke-width%3D%228%22%20d%3D%22M-32%207C96%2064%20-16%20110%2099%20141S218%20173%20166%20235S220%20287%20291%20302%22%2F%3E%3Cpath%20stroke%3D%22%2365a1d3%22%20stroke-opacity%3D%22.4%22%20stroke-width%3D%224%22%20d%3D%22M-36%2010C95%2065%20-15%20113%20101%20145S219%20174%20168%20239%22%2F%3E%3Cpath%20stroke%3D%22url(%23ribbon)%22%20stroke-width%3D%2216%22%20opacity%3D%22.8%22%20d%3D%22M119%20-24C112%2019%20184%2035%20175%2067S181%20108%20294%2092%22%2F%3E%3Cpath%20stroke%3D%22%23bbdaea%22%20stroke-width%3D%222.5%22%20opacity%3D%22.55%22%20d%3D%22M116%20-25C108%2018%20180%2036%20171%2067S181%20111%20295%2095%22%2F%3E%3Cpath%20stroke%3D%22%23082846%22%20stroke-width%3D%2212%22%20opacity%3D%22.6%22%20d%3D%22M-26%20196C46%20166%2070%20232%20112%20280%22%2F%3E%3Cpath%20stroke%3D%22%23578abd%22%20stroke-width%3D%225%22%20opacity%3D%22.65%22%20d%3D%22M-25%20187C49%20160%2086%20245%20121%20282%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");--dice-front:linear-gradient(135deg,#ffffff18,transparent 40%,#030e1c20),var(--dice-marble);--dice-right:linear-gradient(#030e1c3b,#030e1c3b),var(--dice-marble);--dice-left:linear-gradient(#030e1c20,#030e1c20),var(--dice-marble);--dice-top:linear-gradient(135deg,#ffffff36,#ffffff08 60%,transparent),var(--dice-marble);--dice-bottom:linear-gradient(#030e1c59,#030e1c59),var(--dice-marble);--dice-border:#76a0d080;--dice-shadow:inset 0 1px 2px #ffffff70,inset 1px 0 2px #ffffff36,inset -3px -4px 6px #030e1c80;--dice-pip:radial-gradient(circle at 34% 28%,#fff0b1 0%,#e0c374 43%,#b98b39 78%,#806024 100%);--dice-pip-shadow:inset 0 1px 2px #493607a6,0 1px 1px #ffd87d73,0 0 0 1px #07132299;--dice-landed-shadow:inset 0 1px 2px #ffffffa0,inset -3px -4px 6px #030e1c80,0 0 10px #e7c06940;--dice-gloss:.8;--dice-texture-size:100% 100%,155% 155%}

[data-dice-skin="gemini-black-green"]{--dice-marble:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22256%22%20height%3D%22256%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22base%22%20x2%3D%221%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%23070e12%22%2F%3E%3Cstop%20offset%3D%22.55%22%20stop-color%3D%22%23102c26%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23070e12%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22pearl%22%20x1%3D%220%22%20y1%3D%22.2%22%20x2%3D%22.8%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%2356b471%22%2F%3E%3Cstop%20offset%3D%22.28%22%20stop-color%3D%22%231e7647%22%2F%3E%3Cstop%20offset%3D%22.48%22%20stop-color%3D%22%2356b471%22%2F%3E%3Cstop%20offset%3D%22.7%22%20stop-color%3D%22%231e7647%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23102c26%22%2F%3E%3C%2FlinearGradient%3E%3Cfilter%20id%3D%22flow%22%20x%3D%22-35%25%22%20y%3D%22-35%25%22%20width%3D%22170%25%22%20height%3D%22170%25%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%22.018%20.026%22%20numOctaves%3D%222%22%20seed%3D%2214%22%20result%3D%22noise%22%2F%3E%3CfeDisplacementMap%20in%3D%22SourceGraphic%22%20in2%3D%22noise%22%20scale%3D%2242%22%20xChannelSelector%3D%22R%22%20yChannelSelector%3D%22G%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22url(%23base)%22%20d%3D%22M0%200h256v256H0z%22%2F%3E%3Cg%20filter%3D%22url(%23flow)%22%3E%3Cpath%20fill%3D%22url(%23pearl)%22%20d%3D%22M-30%20-20H150C180%2032%20128%2056%20123%2089S174%20131%20129%20166S84%20211%20168%20285H-35C11%20209%20-21%20165%2025%20123S58%2042%20-30%20-20Z%22%2F%3E%3Cpath%20fill%3D%22url(%23pearl)%22%20d%3D%22M229%20-25C169%2016%20236%2053%20204%2094S260%20152%20237%20201S271%20249%20290%20281V-25Z%22%2F%3E%3Cg%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%3E%3Cpath%20stroke%3D%22%23b4d9a8%22%20stroke-opacity%3D%22.34%22%20stroke-width%3D%227%22%20d%3D%22M18%20-20C116%2039%2020%2072%2078%20133S34%20216%20121%20280%22%2F%3E%3Cpath%20stroke%3D%22%2356b471%22%20stroke-opacity%3D%22.24%22%20stroke-width%3D%223%22%20d%3D%22M128%20-19C177%2022%20106%2058%20122%2091S166%20130%20121%20169S84%20222%20149%20279%22%2F%3E%3Cpath%20stroke%3D%22%23070e12%22%20stroke-opacity%3D%22.8%22%20stroke-width%3D%2214%22%20d%3D%22M44%20-25C119%2041%2037%2091%2071%20126S77%20178%2025%20209S42%20258%2092%20288%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");--dice-front:linear-gradient(135deg,#ffffff18,transparent 40%,#030e1c20),var(--dice-marble);--dice-right:linear-gradient(#030e1c3b,#030e1c3b),var(--dice-marble);--dice-left:linear-gradient(#030e1c20,#030e1c20),var(--dice-marble);--dice-top:linear-gradient(135deg,#ffffff36,#ffffff08 60%,transparent),var(--dice-marble);--dice-bottom:linear-gradient(#030e1c59,#030e1c59),var(--dice-marble);--dice-border:#73a17b80;--dice-shadow:inset 0 1px 2px #ffffff70,inset 1px 0 2px #ffffff36,inset -3px -4px 6px #030e1c80;--dice-pip:radial-gradient(circle at 34% 28%,#fff0b1 0%,#e0c374 43%,#b98b39 78%,#806024 100%);--dice-pip-shadow:inset 0 1px 2px #493607a6,0 1px 1px #ffd87d73,0 0 0 1px #07132299;--dice-landed-shadow:inset 0 1px 2px #ffffffa0,inset -3px -4px 6px #030e1c80,0 0 10px #e7c06940;--dice-gloss:.8;--dice-texture-size:100% 100%,155% 155%}

[data-dice-skin="marble-ivory"]{--dice-marble:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22256%22%20height%3D%22256%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22ivory%22%20x2%3D%22.6%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%23fff6d9%22%2F%3E%3Cstop%20offset%3D%22.4%22%20stop-color%3D%22%23f0e2b9%22%2F%3E%3Cstop%20offset%3D%22.7%22%20stop-color%3D%22%23fcf2d7%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23d9c99b%22%2F%3E%3C%2FlinearGradient%3E%3Cfilter%20id%3D%22veins%22%20x%3D%22-30%25%22%20y%3D%22-30%25%22%20width%3D%22160%25%22%20height%3D%22160%25%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%22.025%20.04%22%20numOctaves%3D%222%22%20seed%3D%228%22%20result%3D%22n%22%2F%3E%3CfeDisplacementMap%20in%3D%22SourceGraphic%22%20in2%3D%22n%22%20scale%3D%2220%22%20xChannelSelector%3D%22R%22%20yChannelSelector%3D%22G%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22url(%23ivory)%22%20d%3D%22M0%200h256v256H0z%22%2F%3E%3Cg%20fill%3D%22none%22%20filter%3D%22url(%23veins)%22%20stroke-linecap%3D%22round%22%3E%3Cpath%20stroke%3D%22%23bca773%22%20stroke-opacity%3D%22.25%22%20stroke-width%3D%2215%22%20d%3D%22M-25%2013L37%2040L63%2026L96%2054L160%2041L239%2090L282%2067M-30%20215L50%20175L85%20202L105%20259M188%2015L176%2066L212%20114L209%20188L264%20249%22%2F%3E%3Cpath%20stroke%3D%22%239c875e%22%20stroke-opacity%3D%22.39%22%20stroke-width%3D%222%22%20d%3D%22M-25%2013L37%2040L63%2026L96%2054L160%2041L239%2090L282%2067M-30%20215L50%20175L85%20202L105%20259M188%2015L176%2066L212%20114L209%20188L264%20249%22%2F%3E%3Cpath%20stroke%3D%22%23bba06f%22%20stroke-opacity%3D%22.3%22%20stroke-width%3D%221.2%22%20d%3D%22M35%2040L15%2085L39%20115L-10%20150M95%2054L78%20110L135%20135L122%20162M51%20175L64%20132L95%20143M209%20188L169%20202L188%20254%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");--dice-front:linear-gradient(135deg,#ffffff18,transparent 40%,#62573620),var(--dice-marble);--dice-right:linear-gradient(#6257363b,#6257363b),var(--dice-marble);--dice-left:linear-gradient(#62573620,#62573620),var(--dice-marble);--dice-top:linear-gradient(135deg,#ffffff36,#ffffff08 60%,transparent),var(--dice-marble);--dice-bottom:linear-gradient(#62573659,#62573659),var(--dice-marble);--dice-border:#fff2c090;--dice-shadow:inset 0 1px 2px #ffffff70,inset 1px 0 2px #ffffff36,inset -3px -4px 6px #62573680;--dice-pip:#20262a;--dice-pip-shadow:inset 0 1px 2px #000a,0 1px 1px #fff9;--dice-landed-shadow:inset 0 1px 2px #ffffffa0,inset -3px -4px 6px #62573680,0 0 10px #e0ebef55;--dice-gloss:.35;--dice-texture-size:100% 100%,155% 155%}

[data-dice-skin="gemini-purple-steel"]{--dice-marble:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22256%22%20height%3D%22256%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22base%22%20x2%3D%221%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%23301048%22%2F%3E%3Cstop%20offset%3D%22.55%22%20stop-color%3D%22%233e1758%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23301048%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22pearl%22%20x1%3D%220%22%20y1%3D%22.2%22%20x2%3D%22.8%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%23acb8bd%22%2F%3E%3Cstop%20offset%3D%22.28%22%20stop-color%3D%22%23657585%22%2F%3E%3Cstop%20offset%3D%22.48%22%20stop-color%3D%22%23acb8bd%22%2F%3E%3Cstop%20offset%3D%22.7%22%20stop-color%3D%22%23657585%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%233e1758%22%2F%3E%3C%2FlinearGradient%3E%3Cfilter%20id%3D%22flow%22%20x%3D%22-35%25%22%20y%3D%22-35%25%22%20width%3D%22170%25%22%20height%3D%22170%25%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%22.018%20.026%22%20numOctaves%3D%222%22%20seed%3D%2222%22%20result%3D%22noise%22%2F%3E%3CfeDisplacementMap%20in%3D%22SourceGraphic%22%20in2%3D%22noise%22%20scale%3D%2242%22%20xChannelSelector%3D%22R%22%20yChannelSelector%3D%22G%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22url(%23base)%22%20d%3D%22M0%200h256v256H0z%22%2F%3E%3Cg%20filter%3D%22url(%23flow)%22%3E%3Cpath%20fill%3D%22url(%23pearl)%22%20d%3D%22M-30%20-20H150C180%2032%20128%2056%20123%2089S174%20131%20129%20166S84%20211%20168%20285H-35C11%20209%20-21%20165%2025%20123S58%2042%20-30%20-20Z%22%2F%3E%3Cpath%20fill%3D%22url(%23pearl)%22%20d%3D%22M229%20-25C169%2016%20236%2053%20204%2094S260%20152%20237%20201S271%20249%20290%20281V-25Z%22%2F%3E%3Cg%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%3E%3Cpath%20stroke%3D%22%23d4dfe0%22%20stroke-opacity%3D%22.34%22%20stroke-width%3D%227%22%20d%3D%22M18%20-20C116%2039%2020%2072%2078%20133S34%20216%20121%20280%22%2F%3E%3Cpath%20stroke%3D%22%23acb8bd%22%20stroke-opacity%3D%22.24%22%20stroke-width%3D%223%22%20d%3D%22M128%20-19C177%2022%20106%2058%20122%2091S166%20130%20121%20169S84%20222%20149%20279%22%2F%3E%3Cpath%20stroke%3D%22%23301048%22%20stroke-opacity%3D%22.8%22%20stroke-width%3D%2214%22%20d%3D%22M44%20-25C119%2041%2037%2091%2071%20126S77%20178%2025%20209S42%20258%2092%20288%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");--dice-front:linear-gradient(135deg,#ffffff18,transparent 40%,#030e1c20),var(--dice-marble);--dice-right:linear-gradient(#030e1c3b,#030e1c3b),var(--dice-marble);--dice-left:linear-gradient(#030e1c20,#030e1c20),var(--dice-marble);--dice-top:linear-gradient(135deg,#ffffff36,#ffffff08 60%,transparent),var(--dice-marble);--dice-bottom:linear-gradient(#030e1c59,#030e1c59),var(--dice-marble);--dice-border:#afa1c180;--dice-shadow:inset 0 1px 2px #ffffff70,inset 1px 0 2px #ffffff36,inset -3px -4px 6px #030e1c80;--dice-pip:radial-gradient(circle at 34% 28%,#fff 0%,#f4f5f9 63%,#c8d0dc 100%);--dice-pip-shadow:inset 0 1px 2px #52607380,0 1px 1px #fff8,0 0 0 1px #1b2039b3;--dice-landed-shadow:inset 0 1px 2px #ffffffa0,inset -3px -4px 6px #030e1c80,0 0 10px #e0ebef55;--dice-gloss:.8;--dice-texture-size:100% 100%,155% 155%}

/* Keep preferences compact; the gallery opens only on explicit request. */
.skin-current{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 13px;background:#eaf0e8;border:1px solid #d3decf;border-radius:12px}.skin-current-copy{display:flex;flex-direction:column;gap:4px;min-width:0}.skin-current-copy strong{font-size:13px;color:#273b31;line-height:1.5}.skin-current-copy small{font-size:10px;color:#627269;line-height:1.5}.skin-change{display:inline-flex;align-items:center;gap:8px;flex-shrink:0;min-height:42px;padding:10px 12px;border:1px solid #bdcdbb;border-radius:10px;background:#fff;color:#294635;font-size:12px;font-weight:700}.skin-change:hover{background:#f4f7f2}.skin-change[aria-expanded="true"] span{transform:rotate(180deg)}.skin-choices{margin-top:12px}.skin-choice{min-height:142px;padding-top:14px;padding-bottom:12px;gap:12px}.skin-choice.is-selected{padding-top:13px;padding-bottom:11px}.skin-copy small{font-size:9px}.skin-preview{margin-top:10px;margin-bottom:0}.skin-settings{padding-bottom:16px}
@media(max-width:360px){.skin-current{gap:8px;padding:10px}.skin-change{padding:10px;font-size:11px}.skin-current-copy strong{font-size:12px}.skin-current-copy small{font-size:9px}.skin-choice{min-height:140px}.skin-copy strong{font-size:11px}.skin-copy small{font-size:8px}}


/* Shared closed body. The tiny overlap hides raster seams at small/mobile
   sizes; unlike border-radius cutouts, every edge and corner has a surface. */
.dice-bevel{position:absolute;left:50%;top:50%;width:calc(var(--die-size)*var(--facet-w) + 1.4px);height:calc(var(--die-size)*var(--facet-h) + 1.4px);backface-visibility:hidden;pointer-events:none;transform:translate(-50%,-50%) translate3d(calc(var(--die-size)*var(--facet-x)),calc(var(--die-size)*var(--facet-y)),calc(var(--die-size)*var(--facet-z))) var(--facet-matrix);background:linear-gradient(rgba(255,255,255,var(--facet-highlight)),rgba(255,255,255,var(--facet-highlight))),linear-gradient(rgba(0,0,0,var(--facet-shade)),rgba(0,0,0,var(--facet-shade))),var(--dice-front);background-size:auto,auto,100% 100%,calc(var(--die-size)*1.55) calc(var(--die-size)*1.55);background-position:center,center,center,var(--marble-position,40% 30%)}
.skin-preview{--die-size:46px}

/* Highlight the body bevels, not an artificial frame around each pip face. */
.face,.landed .front{box-shadow:none}

/* Opaque border triangles close corners without clipping a 3D layer. */
[data-dice-skin="classic"]{--dice-corner:#dedbd2}
[data-dice-skin="burgundy-gold"]{--dice-corner:#8d263d}
[data-dice-skin="vortex-blue-gold"]{--dice-corner:#245d90}
[data-dice-skin="gemini-black-green"]{--dice-corner:#276b49}
[data-dice-skin="marble-ivory"]{--dice-corner:#e4d7b1}
[data-dice-skin="gemini-purple-steel"]{--dice-corner:#77758c}
.corner-cap{width:0;height:0;background:none;border-left:calc(var(--die-size)*var(--facet-w)/2 + .7px) solid transparent;border-right:calc(var(--die-size)*var(--facet-w)/2 + .7px) solid transparent;border-bottom:calc(var(--die-size)*var(--facet-h) + 1.4px) solid var(--dice-corner,#dedbd2)}

/* At large counts the bevel is only a few pixels wide. Keep its geometry,
   but skip repeated marble textures to reduce repaint work during a roll. */
.dice-grid.dense-dice .edge-bevel{background:var(--dice-corner,#dedbd2);background:color-mix(in srgb,color-mix(in srgb,var(--dice-corner,#dedbd2),white calc(var(--facet-highlight)*100%)),black calc(var(--facet-shade)*100%))}


/* Reset inherited cosmetics on each gallery card, including inside a black-red page. */
[data-dice-skin]{--dice-six-pips:block;--dice-six-skull:none}

/* Black lacquer and recessed red pips, matching the supplied physical die. */
[data-dice-skin="black-red"]{
  --dice-front:radial-gradient(ellipse at 26% 18%,#ffffff0a,transparent 58%),linear-gradient(140deg,#303438 0%,#1b1e21 43%,#111315 100%);
  --dice-right:linear-gradient(145deg,#1c1f22,#090b0d 78%);
  --dice-left:linear-gradient(135deg,#25292c,#121416);
  --dice-top:linear-gradient(130deg,#383d40,#222629 58%,#171a1c);
  --dice-bottom:linear-gradient(135deg,#16191b,#080a0b);
  --dice-corner:#171a1d;
  --dice-border:#565e6466;
  --dice-shadow:inset 0 1px 2px #89919840,inset -2px -3px 6px #0009;
  --dice-pip:#f32648;
  --dice-six-pips:none;
  --dice-six-skull:block;
  --dice-pip-shadow:inset 0 1px 2px #450010bd,0 1px 1px #f6516c70,0 0 0 1px #07090bc9;
  --dice-landed-shadow:var(--dice-shadow);
  --dice-gloss:.18;
  --dice-texture-size:auto;
}


/* All six faces retain their pip markup; only this material exposes the skull. */
.face-six>.pip{display:var(--dice-six-pips,block)}
.dice-skull{display:var(--dice-six-skull,none);position:absolute;inset:5% 8%;z-index:1;pointer-events:none;background:var(--dice-pip);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cpath%20fill%3D%22white%22%20fill-rule%3D%22evenodd%22%20d%3D%22M50%204C27%204%2012%2019%2012%2041c0%2015%206%2025%2015%2029l2%2016%209%208h24l9-8%202-16c9-4%2015-14%2015-29C88%2019%2073%204%2050%204ZM22%2040c3-4%2014-2%2021%204l-3%2012c-11%204-19-3-18-16Zm56%200c-3-4-14-2-21%204l3%2012c11%204%2019-3%2018-16ZM50%2054l-7%2014h14Zm-16%2021%201%206h30l1-6-16%203Zm5%209v9h4v-9Zm9%200v9h4v-9Zm9%200v9h4v-9Z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cpath%20fill%3D%22white%22%20fill-rule%3D%22evenodd%22%20d%3D%22M50%204C27%204%2012%2019%2012%2041c0%2015%206%2025%2015%2029l2%2016%209%208h24l9-8%202-16c9-4%2015-14%2015-29C88%2019%2073%204%2050%204ZM22%2040c3-4%2014-2%2021%204l-3%2012c-11%204-19-3-18-16Zm56%200c-3-4-14-2-21%204l3%2012c11%204%2019-3%2018-16ZM50%2054l-7%2014h14Zm-16%2021%201%206h30l1-6-16%203Zm5%209v9h4v-9Zm9%200v9h4v-9Zm9%200v9h4v-9Z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}

/* Shared champagne halo: confirmed sixes only, behind the unchanged dice faces. */
.die>.cube{z-index:1}
.dice-six-halo{display:none;position:absolute;z-index:0;pointer-events:none;left:50%;top:50%;width:190%;height:190%;transform:translate(-50%,-50%);opacity:.85;background:repeating-conic-gradient(from 21deg,transparent 0deg 23deg,#fff4d8cc 28deg,#e9d6a9b8 33deg,transparent 38deg 60deg);-webkit-mask:radial-gradient(circle,transparent 28%,#000 37% 53%,transparent 71%);mask:radial-gradient(circle,transparent 28%,#000 37% 53%,transparent 71%)}
.dice-six-halo::after{content:'';position:absolute;inset:16%;border-radius:50%;box-shadow:0 0 calc(var(--die-size)*.28) calc(var(--die-size)*.07) #f4dfad66}
body:not([data-dice-halo="off"]) .dice-grid.landed>.die:not(.removed)>.dice-six-halo{display:block;animation:dice-halo-swing 4.2s ease-in-out infinite}
@keyframes dice-halo-swing{0%,100%{transform:translate(-50%,-50%) rotate(-12deg)}50%{transform:translate(-50%,-50%) rotate(12deg)}}
@media(prefers-reduced-motion:reduce){body:not([data-dice-halo="off"]) .dice-grid.landed>.die:not(.removed)>.dice-six-halo{animation:none}}

body[data-demo=true] .back{gap:6px;flex-wrap:wrap}body[data-demo=true] .back small{color:#3e3215;background:#fff0b0;border-radius:5px;padding:3px 5px;font-size:10px;white-space:nowrap}