:root{font-family:Arial,Helvetica,sans-serif;color:#f7eedc;background:#171326;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 40%,#49315f55,transparent 68%);min-height:100dvh}button,a,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #ffe49c;outline-offset:5px}.app{max-width:530px;margin:auto;padding:26px 24px;padding-top:max(26px,env(safe-area-inset-top));padding-bottom:max(26px,env(safe-area-inset-bottom))}header{display:flex;align-items:center;gap:15px}.logo{font-weight:900;font-size:25px;letter-spacing:-1.5px;color:#f7eedc;text-decoration:none}.logo span{display:block;font-size:7px;letter-spacing:2px;margin-top:3px}.online{margin-left:auto;font-size:7px;letter-spacing:1px;color:#b6a6ca;display:flex;gap:6px;align-items:center}.online i{height:5px;width:5px;border-radius:50%;background:#c9d99c;box-shadow:0 0 9px #c9d99c}.sound{height:34px;width:34px;border-radius:50%;border:1px solid #655373;color:#d0badc;background:transparent;font-size:22px}.sound[aria-pressed=false]{opacity:.5}.intro{text-align:center;margin:30px 0 24px}.eyebrow{font-size:7px;letter-spacing:1.8px;color:#c8aacd}h1{font-size:39px;letter-spacing:-1.7px;margin:12px 0 10px;line-height:1.05}h1 em{font-family:Georgia,serif;color:#ffc798;font-weight:400}.intro p{font-size:11px;color:#b6a5bd;margin:0}.machine{position:relative;background:#b76552;border:2px solid #edac83;border-radius:32px 32px 22px 22px;box-shadow:0 9px 0 #693849,0 12px 0 #392635,0 25px 65px #06020d80;overflow:hidden}.marquee{display:flex;justify-content:center;gap:25px;align-items:center;text-align:center;background:#793c47;border-bottom:2px solid #f6bc85;padding:20px 12px 14px;position:relative}.marquee:before,.marquee:after{content:'';position:absolute;left:15px;right:15px;height:5px;background:radial-gradient(circle,#ffdb95 2px,transparent 3px) 0 0/19px 5px;filter:drop-shadow(0 0 4px #ffba62)}.marquee:before{top:8px}.marquee:after{bottom:6px}.marquee-small{font-size:7px;letter-spacing:3px;color:#f5c6a2}.marquee h2{font-size:46px;line-height:1;margin:5px 0 0;letter-spacing:-2px;font-weight:1000;color:#ffe1a0;text-shadow:0 3px #ae554d,0 5px #43232f}.marquee h2 span{color:#fff0cf}.spark{font-size:31px;color:#ffd38d}.machine-body{padding:19px;background:linear-gradient(120deg,#c77d5e,#a55850)}.scoreboard{display:flex;align-items:center;justify-content:space-between;background:#332331;border:1px solid #efbd8777;border-radius:11px;padding:12px 15px;margin-bottom:15px;box-shadow:inset 0 2px 6px #0005}.scoreboard>div:last-child{text-align:right}.scoreboard span{display:block;font-size:7px;letter-spacing:1px;color:#c4a098}.scoreboard strong{display:block;font-family:monospace;font-size:26px;color:#ffdfa0;margin-top:5px;font-weight:400}.score-label{font-size:7px;line-height:1.8;letter-spacing:2px;text-align:center;color:#a67e79}.reel-frame{position:relative;border:7px solid #633641;box-shadow:0 2px 0 #f1b381,inset 0 0 12px #000;border-radius:17px;background:#f5e4c6;padding:0 6px;overflow:hidden}.reels{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.reel{height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;overflow:hidden;position:relative;background:linear-gradient(#c9bba4,#fff4df 32%,#fff4df 68%,#c9bba4);border-inline:1px solid #d1bea1}.symbol{height:77px;display:flex;align-items:center;justify-content:center;font-size:61px;line-height:1;font-weight:1000;font-family:Georgia,serif;color:#b94444;text-shadow:1px 2px #fff2bb,3px 4px #78334d33;z-index:2}.ghost{font-size:29px;opacity:.3;filter:grayscale(.3);line-height:1}.reel.spinning .symbol{filter:blur(2px);animation:roll .12s linear infinite}.reel.landed .symbol{animation:bounce .3s}.reel.winner{background:linear-gradient(#d8bb73,#fff4bd,#d8bb73)}.payline{position:absolute;left:0;right:0;top:50%;height:1px;background:#b2504626;pointer-events:none}.line-arrow{position:absolute;top:calc(50% - 8px);font-size:14px;color:#a24740;z-index:3}.left{left:0}.right{right:0}.result{min-height:49px;display:flex;align-items:center;justify-content:center;gap:12px;font-size:9px;letter-spacing:1.2px;font-weight:bold;color:#ffead2}.result strong{font-size:23px;color:#ffe49c;letter-spacing:-1px}.spin{width:100%;border:1px solid #fff1b2;border-radius:13px;background:linear-gradient(#ffe5a1,#efba66);color:#4d2c35;box-shadow:0 5px 0 #7a3f3d,0 7px 10px #51243244;display:flex;align-items:center;justify-content:center;gap:22px;height:59px;font-weight:900;letter-spacing:3px;font-size:19px;transition:filter .15s,transform .15s}.spin>span:last-child{font-size:34px;font-weight:400;line-height:1}.spin:hover:not(:disabled){filter:brightness(1.08)}.spin:active:not(:disabled){transform:translateY(3px);box-shadow:0 2px 0 #7a3f3d}.spin:disabled{cursor:wait;filter:saturate(.6);opacity:.85}.spin-caption{text-align:center;font-size:6px;letter-spacing:1.5px;margin-top:15px;color:#ffdab8}.machine-bottom{padding:11px 22px;display:flex;justify-content:space-between;background:#80444a;color:#e4ad8c;font-size:7px;letter-spacing:1.5px;border-top:1px solid #ecaa7833}.host{display:flex;gap:12px;align-items:center;margin:28px 0 22px}.portrait{flex:0 0 54px;width:54px;height:54px;transform:rotate(-5deg)}.portrait svg{width:100%;height:100%;border:2px solid #cdb795;border-radius:18px}.host-name{color:#f3d6ad;font-size:9px;letter-spacing:1px;font-weight:bold}.host-name small{font-size:8px;color:#9f8dac;letter-spacing:0;font-weight:normal;margin-left:7px}.host p{font-size:11px;color:#d6c5dd;line-height:1.6;margin:6px 0 0}details{border-top:1px solid #45334f;border-bottom:1px solid #45334f}summary{padding:16px 0;cursor:pointer;list-style:none;display:flex;justify-content:space-between;font-size:11px;color:#cdb8d4}summary::-webkit-details-marker{display:none}summary span{color:#f4c58c}details[open] summary span{transform:rotate(45deg)}.rules{padding-bottom:15px}.rules>div{display:flex;justify-content:space-between;padding:9px 12px;border-radius:5px;font-size:12px}.rules>div:nth-child(even){background:#ffffff06}.rules b{color:#f4cd8e}.rules p{color:#ac98b8;font-size:10px;line-height:1.7}.sevens{color:#e9a38e;font-weight:900}footer{display:flex;justify-content:space-between;margin-top:19px;color:#8b7897;font-size:7px;letter-spacing:1px}footer b{color:#c7b2ce}#confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden}#confetti i{position:absolute;left:50%;top:42%;width:8px;height:12px;background:var(--color);animation:confetti 1.5s ease-out forwards}@keyframes confetti{to{transform:translate(var(--x),var(--y)) rotate(600deg);opacity:0}}@keyframes roll{from{transform:translateY(-14px)}to{transform:translateY(14px)}}@keyframes bounce{50%{transform:scale(1.15)}}@media(max-width:380px){.app{padding:20px 17px}h1{font-size:34px}.machine-body{padding:14px}.marquee h2{font-size:41px}.symbol{font-size:52px}.reel{height:162px}.online{font-size:6px;letter-spacing:.3px}.host-name small{font-size:7px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media(max-width:450px){.marquee{gap:12px}.marquee h2{font-size:40px}.spark{font-size:22px}.marquee-small{font-size:6px;letter-spacing:2px}}
[hidden]{display:none!important}.ban-screen{min-height:100dvh;display:grid;place-items:center;padding:24px 18px;padding-top:max(24px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom))}.ban-card{width:min(100%,420px);text-align:center;padding:32px 24px;background:linear-gradient(145deg,#372337,#241c30);border:1px solid #805764;border-radius:28px;box-shadow:0 22px 65px #0004}.ban-art{font-size:83px;position:relative;display:inline-block;margin:26px 0 18px}.ban-art span{font-size:48px;position:absolute;right:-28px;bottom:-2px;transform:rotate(-12deg)}.ban-stamp{display:table;margin:0 auto 21px;border:2px solid #f2ad89;color:#f2ad89;padding:7px 12px;font-size:10px;letter-spacing:2px;font-weight:bold;transform:rotate(-5deg)}.ban-card h1{font-size:39px;line-height:1.15;margin:0 0 18px}.ban-card>p{color:#d2bdcf;font-size:13px;line-height:1.8}.ban-card blockquote{margin:24px 0;padding:18px 8px;border-block:1px solid #654655;color:#eed7b6;font-size:13px;line-height:1.8}.ban-card cite{display:block;margin-top:10px;font-style:normal;font-size:9px;color:#af94b2}.ban-card .spin{font-size:11px;letter-spacing:.6px;gap:0}.ban-note{font-size:7px;letter-spacing:1px;line-height:1.8;margin-top:19px;color:#aa8fa7}
.ban-art{display:block;margin:20px auto 15px;max-width:320px;font-size:initial}.ban-art svg{display:block;width:100%;height:auto}.ban-card{padding-top:25px}.ban-stamp{margin-bottom:18px}