@font-face{font-family: 'Barlow Semi Condensed';font-style: normal;font-weight: 400;font-display: swap;src: url(../assets/fonts/barlow-semi-condensed-400-latin-ext.woff2) format('woff2');unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family: 'Barlow Semi Condensed';font-style: normal;font-weight: 400;font-display: swap;src: url(../assets/fonts/barlow-semi-condensed-400-latin.woff2) format('woff2');unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family: 'Barlow Semi Condensed';font-style: normal;font-weight: 600;font-display: swap;src: url(../assets/fonts/barlow-semi-condensed-600-latin-ext.woff2) format('woff2');unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family: 'Barlow Semi Condensed';font-style: normal;font-weight: 600;font-display: swap;src: url(../assets/fonts/barlow-semi-condensed-600-latin.woff2) format('woff2');unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family: 'Cinzel';font-style: normal;font-weight: 500 900;font-display: swap;src: url(../assets/fonts/cinzel-500-900-latin-ext.woff2) format('woff2');unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family: 'Cinzel';font-style: normal;font-weight: 500 900;font-display: swap;src: url(../assets/fonts/cinzel-500-900-latin.woff2) format('woff2');unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}html,body{margin: 0;padding: 0;height: 100%;background: #060a12;overflow: hidden;overscroll-behavior: none}*,*::before,*::after{box-sizing: border-box}button{font: inherit;-webkit-tap-highlight-color: transparent;touch-action: manipulation}button:focus{outline: none}button:focus-visible{outline: 2px solid rgba(110,235,230,.8);outline-offset: 3px}@keyframes cjSpin{to{transform: rotate(360deg)}}.page{position: fixed;inset: 0;overflow: hidden;background: radial-gradient(ellipse 80% 60% at 50% 100%,#12263f 0%,#0a1322 50%,#05080f 100%);font-family: 'Barlow Semi Condensed',sans-serif;color: #eee3cc;-webkit-user-select: none;user-select: none;-webkit-touch-callout: none}.fx{position: absolute;inset: 0;width: 100%;height: 100%;pointer-events: none}.vignette{position: absolute;inset: 0;box-shadow: inset 0 0 220px 60px rgba(0,0,0,.85);pointer-events: none}.stage{position: relative;height: 100%;display: flex;align-items: center;justify-content: center;padding: 24px 12px 32px}.wheel{position: relative;flex-shrink: 0;width: min(88vh,94vw);height: min(88vh,94vw)}@supports (height: 1svh){.wheel{width: min(88svh,94vw);height: min(88svh,94vw)}}.halo{position: absolute;inset: -6%;border-radius: 50%;background: radial-gradient(circle,rgba(60,200,200,.14) 40%,transparent 70%)}.orbit{position: absolute;inset: -3.5%;border-radius: 50%;border: 1px dashed rgba(217,184,119,.22);animation: cjSpin 140s linear infinite}.frame{position: absolute;inset: 0;border-radius: 50%;background: conic-gradient(from 20deg,#5a4122,#f4dea6,#8b6a37,#e9cf90,#5a4122,#caa767,#fff1c8,#7c5c2e,#e2c282,#5a4122);box-shadow: 0 0 0 1px #2a1d0c,0 0 70px rgba(60,210,205,.25),0 40px 90px rgba(0,0,0,.8)}.well{position: absolute;inset: 1.2%;border-radius: 50%;background: #0b1422;box-shadow: inset 0 0 0 1px rgba(255,230,170,.35),inset 0 4px 14px rgba(0,0,0,.9)}.rotor{position: absolute;inset: 2.2%;border-radius: 50%;container-type: size;background: radial-gradient(circle,#0a1322 0%,#0e1b2e 70%,#122238 100%)}.divider{position: absolute;border-radius: 50%;border: 1px solid rgba(226,194,130,.22)}.slot{position: absolute;left: 50%;top: 1.3%;width: 6.8%;height: 35.4%;transform: translateX(-50%);border-radius: 999px;background: linear-gradient(180deg,rgba(90,230,225,.28),rgba(90,230,225,.06));box-shadow: 0 0 0 1px rgba(226,194,130,.55),0 0 24px rgba(90,230,225,.35);opacity: .35;transition: opacity .3s}.ring{position: absolute;inset: 0;will-change: transform}.arm{position: absolute;inset: 0;pointer-events: none}.tok{position: absolute;left: 50%;width: 5.4%;aspect-ratio: 1;transform: translateX(-50%);border-radius: 50%;padding: .28cqw;background: linear-gradient(160deg,#f4dea6,#7c5c2e);box-shadow: 0 0 0 1px rgba(0,0,0,.7),0 3px 8px rgba(0,0,0,.5);transition: transform .22s cubic-bezier(.3,1.6,.5,1),box-shadow .22s,opacity .3s}.tok i{display: block;width: 100%;height: 100%;border-radius: 50%;background: #0b1422 center / cover no-repeat}.rotor.judging .slot{opacity: 1}.rotor.judging .tok{opacity: .3}.rotor.judging .tok.col{opacity: 1}.rotor.landed .tok.col{opacity: .5}.rotor .tok.lit{opacity: 1;transform: translateX(-50%) scale(1.45);box-shadow: 0 0 0 2px #fff3cf,0 0 24px 8px rgba(125,235,230,.9);box-shadow: 0 0 0 2px #fff3cf,0 0 24px 8px oklch(0.85 0.13 190 / .9)}.cap{position: absolute;inset: 36%;border-radius: 50%;container-type: size;z-index: 2;background: conic-gradient(from 0deg,#5a4122,#f4dea6,#8b6a37,#e9cf90,#5a4122,#fff1c8,#7c5c2e,#5a4122);box-shadow: 0 10px 30px rgba(0,0,0,.8),0 0 0 1px #2a1d0c,0 0 40px rgba(60,210,205,.25)}.spin{position: absolute;inset: 6%;border: none;padding: 0;border-radius: 50%;cursor: pointer;background: radial-gradient(circle at 50% 110%,rgba(60,210,205,.55),transparent 60%),radial-gradient(circle at 50% 35%,#1a3754,#070d18 78%);box-shadow: inset 0 0 0 1px rgba(255,230,170,.45),inset 0 0 30px rgba(60,210,205,.35);display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 4cqw;transition: filter .2s,transform .12s}.spin:active:not(:disabled){transform: scale(.96)}.spin:disabled{cursor: default;filter: grayscale(.7) brightness(.7)}.spin-ring{position: absolute;inset: 8%;border-radius: 50%;border: 1px dashed rgba(90,210,205,.45);animation: cjSpin 20s linear infinite;pointer-events: none}.gem{width: 9cqw;aspect-ratio: 1;transform: rotate(45deg);background: linear-gradient(135deg,#e6fffd,#4fc9c6 45%,#0b4a52);background: linear-gradient(135deg,#e6fffd,oklch(0.78 0.13 190) 45%,#0b4a52);box-shadow: 0 0 14px 3px rgba(80,230,225,.65),0 0 0 1px #d9b877}.spin-label{font-family: 'Cinzel',serif;font-weight: 900;font-size: 20cqw;letter-spacing: .14em;margin-right: -.14em;line-height: 1;color: #f6e7c3;text-shadow: 0 0 14px rgba(120,240,235,.6),0 2px 0 #000}.spin:disabled .spin-label{font-size: 11cqw}.pointer{position: absolute;left: 50%;top: -4.5%;width: 6.5%;height: 8.5%;margin-left: -3.25%;transform-origin: 50% 12%;z-index: 3;filter: drop-shadow(0 6px 8px rgba(0,0,0,.8)) drop-shadow(0 0 10px rgba(80,230,225,.45));pointer-events: none}.pointer-body{position: absolute;inset: 0;clip-path: polygon(0 0,100% 0,100% 28%,50% 100%,0 28%);background: linear-gradient(180deg,#fff1c8,#c9a35e 50%,#6b4f26)}.pointer-gem{position: absolute;left: 30%;top: 12%;width: 40%;height: 52%;clip-path: polygon(50% 0,100% 40%,50% 100%,0 40%);background: linear-gradient(180deg,#e6fffd,#45bfbd);background: linear-gradient(180deg,#e6fffd,oklch(0.75 0.13 190))}.mute{position: absolute;top: 16px;right: 16px;z-index: 5;display: flex;align-items: center;gap: 8px;height: 44px;padding: 0 16px;border: 1px solid rgba(226,194,130,.45);border-radius: 999px;background: rgba(5,9,16,.7);cursor: pointer;font-family: 'Cinzel',serif;font-weight: 700;font-size: 12px;letter-spacing: .2em;text-transform: uppercase;color: #e6c887;transition: background .2s}.mute-dot{width: 8px;height: 8px;border-radius: 50%;border: 1px solid currentColor;background: #5fd8d4;background: oklch(0.82 0.12 190);box-shadow: 0 0 8px #5fd8d4;box-shadow: 0 0 8px oklch(0.82 0.12 190)}.mute.off{color: #8a857a}.mute.off .mute-dot{background: transparent;box-shadow: none}.credit{position: absolute;top: 68px;right: 16px;z-index: 5;display: flex;flex-direction: column;align-items: flex-end;gap: 1px;padding: 6px 4px;font-family: 'Barlow Semi Condensed',sans-serif;font-weight: 500;font-size: 13px;letter-spacing: .04em;color: #8a857a;text-decoration: none;transition: color .2s;-webkit-tap-highlight-color: transparent}.credit-line{display: flex;align-items: center;gap: 6px}.credit-handle{font-weight: 700;color: #d9b877;transition: color .2s}.credit-sub{font-size: 12px}.credit.low{top: auto;bottom: 12px}.credit:focus{outline: none}.credit:focus-visible{outline: 2px solid rgba(110,235,230,.8);outline-offset: 3px}.overlay{position: absolute;inset: 0;z-index: 10;display: none;align-items: center;justify-content: center;padding: 16px;cursor: pointer;background: rgba(3,6,12,.72);-webkit-backdrop-filter: blur(6px);backdrop-filter: blur(6px);opacity: 0;transition: opacity .35s}.overlay.open{display: flex}.overlay.in{opacity: 1}.card{position: relative;width: min(600px,100%);max-height: calc(100vh - 32px);padding: 3px;cursor: default;background: linear-gradient(180deg,#fff1c8,#a67d3d 40%,#4d3718 100%);transform: scale(.82) translateY(20px);transition: transform .55s cubic-bezier(.2,1.5,.4,1);box-shadow: 0 0 0 1px #000,0 0 90px rgba(60,210,205,.35),0 40px 120px rgba(0,0,0,.9)}@supports (height: 1svh){.card{max-height: calc(100svh - 32px)}}.overlay.in .card{transform: scale(1)}.card-in{position: relative;overflow: hidden;display: flex;flex-direction: column;align-items: center;gap: min(18px,2svh);text-align: center;padding: min(40px,5svh) 44px min(28px,3.5svh);background: radial-gradient(ellipse 90% 55% at 50% 0%,rgba(60,210,205,.22),transparent 70%),linear-gradient(180deg,#0f1d31,#070d18)}.hairline{position: absolute;inset: 8px;border: 1px solid rgba(226,194,130,.35);pointer-events: none}.corner{position: absolute;width: 10px;height: 10px;transform: rotate(45deg);background: #e2c282}.corner.tl{left: 4px;top: 4px}.corner.tr{right: 4px;top: 4px}.corner.bl{left: 4px;bottom: 4px}.corner.br{right: 4px;bottom: 4px}.close{position: absolute;top: 16px;right: 16px;z-index: 2;width: 44px;height: 44px;padding: 0;border: 1px solid rgba(226,194,130,.5);border-radius: 50%;background: rgba(0,0,0,.35);color: #e6c887;font-family: 'Cinzel',serif;font-size: 22px;line-height: 1;cursor: pointer;display: flex;align-items: center;justify-content: center;transition: background .2s,color .2s}.portrait{position: relative;flex-shrink: 0;margin: 6px 0;width: min(168px,20svh);height: min(168px,20svh)}.rays{position: absolute;inset: -45%;border-radius: 50%;background: repeating-conic-gradient(rgba(255,230,170,.16) 0deg 6deg,transparent 6deg 20deg);-webkit-mask: radial-gradient(circle,#000 20%,transparent 68%);mask: radial-gradient(circle,#000 20%,transparent 68%);animation: cjSpin 24s linear infinite}.glow{position: absolute;inset: -18%;border-radius: 50%;background: radial-gradient(circle,rgba(80,230,225,.4),transparent 65%)}.rim{position: absolute;inset: 0;border-radius: 50%;padding: 5px;background: conic-gradient(#5a4122,#fff1c8,#8b6a37,#e9cf90,#5a4122);box-shadow: 0 0 0 1px #000,0 12px 40px rgba(0,0,0,.8)}.face{width: 100%;height: 100%;border-radius: 50%;background: #0b1422 center / cover no-repeat;box-shadow: inset 0 0 0 2px rgba(0,0,0,.5)}.name{font-family: 'Cinzel',serif;font-weight: 900;font-size: min(52px,6.5svh);line-height: 1;letter-spacing: .04em;background: linear-gradient(180deg,#fff4d6,#e6c887 50%,#a57c3e);-webkit-background-clip: text;background-clip: text;color: transparent;-webkit-text-fill-color: transparent}.rule{width: 60%;height: 1px;flex-shrink: 0;background: linear-gradient(90deg,transparent,rgba(226,194,130,.6),transparent)}.roast{margin: 0;font-size: min(30px,4svh);font-weight: 600;line-height: 1.2;color: #f6ecd6;text-wrap: balance;max-width: 480px}.again{margin-top: min(8px,1svh);padding: 2px;border: none;flex-shrink: 0;cursor: pointer;background: linear-gradient(180deg,#fff1c8,#b08744 50%,#5e4420);clip-path: polygon(12px 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,12px 100%,0 50%);transition: filter .2s}.again span{display: flex;align-items: center;justify-content: center;height: min(60px,8svh);min-height: 46px;padding: 0 44px;background: radial-gradient(ellipse 80% 120% at 50% 110%,rgba(60,210,205,.45),transparent 60%),linear-gradient(180deg,#14283f,#0a1424);clip-path: polygon(11px 0,calc(100% - 11px) 0,100% 50%,calc(100% - 11px) 100%,11px 100%,0 50%);font-family: 'Cinzel',serif;font-weight: 900;font-size: 22px;letter-spacing: .2em;color: #f6e7c3;text-shadow: 0 0 14px rgba(120,240,235,.55)}.confetti{z-index: 20}@media (max-width: 819.98px),(max-aspect-ratio: 19/20){.card-in{padding: min(30px,4svh) 20px min(22px,3svh)}.portrait{width: min(130px,17svh);height: min(130px,17svh)}.name{font-size: min(38px,5.5svh)}.roast{font-size: min(23px,3.6svh)}}@media (hover: hover){.spin:hover:not(:disabled){filter: brightness(1.25) drop-shadow(0 0 14px rgba(80,230,225,.6))}.mute:hover{background: rgba(90,230,225,.14)}.credit:hover,.credit:hover .credit-handle{color: #e6c887}.close:hover{background: rgba(90,230,225,.18);color: #fff4d6}.again:hover{filter: brightness(1.15) drop-shadow(0 0 18px rgba(80,230,225,.5))}}@media (prefers-reduced-motion: reduce){.orbit,.rays,.spin-ring{animation: none}}