:root{--pink:#f000c8;--cyan:#49e8ff;--gold:#ffe45d;color-scheme:dark;font-family:Arial,Helvetica,sans-serif;color:#fff;background:#100522}*{box-sizing:border-box}body{margin:0;min-height:100svh;background:radial-gradient(ellipse at 0 55%,#8a00b84a,transparent 48%),radial-gradient(ellipse at 100% 40%,#6000ef59,transparent 50%),linear-gradient(135deg,#17082d,#250648 50%,#10031f);overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 14%,#ffc44818 14.3%,transparent 14.7%,transparent 85%,#ffc44818 85.3%,transparent 85.7%)}button,input{font:inherit}button{cursor:pointer;color:inherit}button:focus-visible,input:focus-visible{outline:3px solid var(--cyan);outline-offset:5px}.app{max-width:650px;margin:auto;padding:30px 28px 26px}header{display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{border:1px solid #ff78e7;border-radius:40px;background:#290935;padding:9px 22px;box-shadow:0 0 14px #f000c855,inset 0 0 8px #f000c866;color:var(--gold);display:flex;align-items:center;gap:12px;font-size:26px}.brand span{font-size:14px;font-weight:700;letter-spacing:3px;color:white}.brand img{max-width:180px;max-height:38px;object-fit:contain}.tools{display:flex;gap:8px}.tools button{border:1px solid #ffffff30;border-radius:50%;background:#ffffff08;width:38px;height:38px;font-size:20px}.heading{text-align:center;margin:24px 0 20px}.eyebrow{font-size:10px!important;letter-spacing:3px;color:#d5bfe8!important}h1{font-size:clamp(64px,13vw,100px);margin:4px 0 0;font-weight:1000;font-style:italic;letter-spacing:-5px;line-height:1.1;color:#ffe963;text-shadow:0 2px 0 #fff3a6,0 5px 0 #dc8713,0 8px 0 #a55212,0 11px 0 #840876,0 0 30px #efbf3540}.heading>p:last-child{margin:10px 0 0;font-size:17px}.score{display:flex;align-items:center;gap:26px;margin:0 22px 16px;padding:14px 23px;border:1px solid #d899ec88;background:linear-gradient(120deg,#3a135c,#1b0936);border-radius:20px;box-shadow:inset 0 1px 0 #f3b1ff66,0 6px 20px #0003}.score>div>span{font-size:12px;letter-spacing:2px;display:block}.score strong{display:block;font-size:38px;white-space:nowrap}.score b{color:var(--gold)}.score small{font-size:23px;font-weight:400;color:#cdbbdb}.progress-area{flex:1}.progress-area p{font-size:13px;margin:0 0 8px}.progress-area span{font-size:11px!important;letter-spacing:0!important;color:#beaed2;margin-top:5px}progress{display:block;width:100%;height:9px;appearance:none;border:0;border-radius:20px;overflow:hidden;background:#553375}progress::-webkit-progress-bar{background:#553375}progress::-webkit-progress-value{background:linear-gradient(90deg,var(--pink),#ffce51);border-radius:20px}progress::-moz-progress-bar{background:var(--pink)}.game{position:relative;padding:10px 10px 13px;border-radius:30px 30px 24px 24px;border:3px solid #ffcf62;background:linear-gradient(120deg,#e0a032,#fff8ab 12%,#b96812 20%,#ffdb6b 50%,#fff7a2 85%,#aa550f);box-shadow:0 0 0 3px #7b3419,0 0 24px #e80caa55,0 12px 0 #783719,0 20px 25px #0008;overflow:hidden}canvas{width:100%;height:auto;display:block;border-radius:19px 19px 0 0;background:radial-gradient(ellipse at top,#431169,#200638 75%);touch-action:pan-y}.slots{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;background:#542048;padding:0 6px 5px;border-radius:0 0 12px 12px}.slots div{background:linear-gradient(150deg,#fc25cd,#970263 70%);text-align:center;padding:9px 0;border:2px solid #ffcd77;border-top:4px solid #ff9cec;border-radius:0 0 8px 8px;color:#fff68d;font-size:34px;font-weight:900;box-shadow:inset 0 0 14px #f000c8}.slots div:nth-child(3){background:linear-gradient(145deg,#ffd538,#c16d06);border-top-color:#fff4a4}.slots small{display:block;color:white;font-size:12px;margin-top:1px}.slots .hit{filter:brightness(1.8);box-shadow:0 0 30px var(--gold);transform:translateY(-5px)}.controls{text-align:center;margin-top:26px}.aim{display:flex;align-items:center;justify-content:center;gap:14px;margin:0 0 16px}.aim label{font-size:12px;color:#d5c1e5}.aim input{width:140px;accent-color:var(--gold)}.primary{background:linear-gradient(#ff59e4,var(--pink) 40%,#a60086);border:2px solid #ffa8ef;border-radius:50px;padding:15px 32px;min-height:52px;color:white;font-weight:800;letter-spacing:1px;font-size:19px;box-shadow:0 0 0 3px #441463,0 0 0 5px var(--cyan),0 0 24px #29cfff66,inset 0 2px 6px #fff7;transition:transform .2s,filter .2s}.primary:hover{filter:brightness(1.13);transform:translateY(-2px)}.primary:disabled{cursor:wait;filter:saturate(.5);transform:none}.controls p{font-size:13px;color:#dbc9e9;min-height:32px;margin:18px 0 0}.text-button{background:none;border:0;text-decoration:underline;color:#ebcfff;padding:10px}footer{font-size:10px;color:#947ba8;letter-spacing:2px;text-align:center;margin-top:16px}footer i{color:#e3ba62;font-style:normal;margin:0 8px}dialog{width:min(420px,calc(100% - 32px));border:1px solid #ab67cf;background:#26103e;color:white;border-radius:24px;padding:28px;box-shadow:0 25px 100px #000b}dialog::backdrop{background:#0b001bd9;backdrop-filter:blur(7px)}dialog h2{font-size:28px;margin:4px 0 10px}dialog p{color:#cfbadd;font-size:14px}dialog label{display:block;margin:20px 0;font-size:14px}dialog input{display:block;width:100%;margin-top:8px;padding:10px;border:1px solid #704982;border-radius:8px;background:#180824;color:white}dialog input[type=color]{height:44px;padding:4px}dialog .primary{width:100%;font-size:16px;margin-top:10px}.close{float:right;border:0;background:none;font-size:28px}.hint{font-size:12px!important}@media(min-width:900px) and (min-height:750px){.app{max-width:610px;padding-top:25px}.heading{margin:14px 0}.heading h1{font-size:88px}}@media(max-width:480px){.app{padding:22px 20px}.brand{padding:7px 14px}.brand span{font-size:12px;letter-spacing:2px}.heading{margin:22px 0 18px}.eyebrow{font-size:8px!important;letter-spacing:2px}.score{margin:0 6px 16px;padding:12px 16px;gap:18px}.score strong{font-size:32px}.progress-area p{font-size:11px}.game{padding:7px 7px 9px;border-radius:23px}.slots div{font-size:27px;padding:7px 0}.slots{gap:3px;padding:0 3px 3px}.primary{font-size:16px;padding:14px 25px}footer{font-size:8px;letter-spacing:1px}.aim{gap:10px}.aim input{width:120px}}
/* Moving violet light texture; the original background palette stays intact. */
.ambient{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0;contain:strict}.app{position:relative;z-index:1}.light-wave{position:absolute;inset:-100% -25%;background:repeating-linear-gradient(168deg,transparent 0 22%,#b477ff0b 25%,#d3a1ff13 27%,transparent 30% 50%);animation:light-rise 16s linear infinite;will-change:transform}.light-dust{position:absolute;inset:-100% 0;background-image:radial-gradient(circle,#eacbff77 1px,transparent 2px),radial-gradient(circle,#dcb4ff44 1px,transparent 2px);background-size:113px 167px,193px 251px;background-position:0 0,47px 71px;opacity:.4;animation:dust-rise 38s linear infinite;will-change:transform}@keyframes light-rise{from{transform:translateY(25%)}to{transform:translateY(-25%)}}@keyframes dust-rise{from{transform:translateY(167px)}to{transform:translateY(-334px)}}.heading h1{animation:title-aura 5s ease-in-out infinite}@keyframes title-aura{50%{filter:drop-shadow(0 0 12px #f000c84a)}}.game.in-play{box-shadow:0 0 0 3px #7b3419,0 0 34px #f000c87a,0 12px 0 #783719,0 20px 25px #0008}.game.victory-glow{box-shadow:0 0 0 3px #ffec83,0 0 65px #ffd74799,0 12px 0 #783719,0 20px 25px #0008}.game{transition:box-shadow .5s}.game-event{position:absolute;z-index:3;left:5%;right:5%;top:37%;text-align:center;pointer-events:none;opacity:0;transform:translateY(16px) scale(.9);transition:opacity .25s,transform .35s;filter:drop-shadow(0 5px 10px #130020);padding:18px 6px;border-radius:18px;background:radial-gradient(ellipse,#26033eee,transparent 75%)}.game-event.visible{opacity:1;transform:translateY(0) scale(1)}.game-event strong{display:block;font-size:clamp(26px,6vw,44px);font-weight:900;color:#fff084;text-shadow:0 3px 0 #9e580c,0 0 22px #ffab4270}.game-event span{display:block;font-size:12px;font-weight:700;letter-spacing:1px;margin-top:10px;line-height:1.5}.game-event.victory strong{font-size:clamp(36px,9vw,64px)}.game-event.near strong{font-size:clamp(24px,6vw,38px);color:#8ef7ff}.game-event.result strong{font-size:clamp(21px,5vw,32px)}#score{display:inline-block}.slots div{transition:filter .2s,transform .25s,box-shadow .25s}.primary:not(:disabled){animation:button-aura 3s ease-in-out infinite}@keyframes button-aura{50%{box-shadow:0 0 0 3px #441463,0 0 0 5px var(--cyan),0 0 35px #29cfff99,inset 0 2px 6px #fff7}}@media(prefers-reduced-motion:reduce){.light-wave,.light-dust,.heading h1,.primary:not(:disabled){animation:none}.game-event,.game,.slots div{transition:none}.light-dust{opacity:.15}}

/* Taller 4:5 board and layered ambient particles. */
.app{max-width:740px}.game{aspect-ratio:4 / 5;display:grid;grid-template-rows:minmax(0,1fr) auto}.game canvas{width:100%;height:100%;min-height:0}.slots div{padding:12px 0}.light-dust{background-image:radial-gradient(circle,#eedcff99 1.8px,#d8acff38 3px,transparent 5px),radial-gradient(circle,#dcb4ff66 2.5px,#b97cff18 5px,transparent 8px);background-size:73px 107px,127px 173px;background-position:0 0,37px 51px;opacity:.65;animation-duration:32s}.light-dust:before,.light-dust:after{content:"";position:absolute;inset:0;pointer-events:none}.light-dust:before{background-image:radial-gradient(circle,#eedcff77 2px,#d7a8ff33 5px,transparent 11px),radial-gradient(circle,#b57bff55 4px,transparent 16px);background-size:197px 239px,283px 317px;background-position:79px 23px,33px 139px;animation:particle-drift 13s ease-in-out infinite alternate}.light-dust:after{background:radial-gradient(ellipse at 18% 40%,#b87aff12,transparent 35%),radial-gradient(ellipse at 85% 60%,#d296ff16,transparent 35%);animation:particle-drift 19s ease-in-out infinite alternate-reverse}.light-wave{opacity:1.25}@keyframes particle-drift{from{transform:translate(-12px,30px)}to{transform:translate(22px,-40px)}}@media(max-width:480px){.slots div{padding:8px 0}}@media(prefers-reduced-motion:reduce){.light-dust:before,.light-dust:after{animation:none}.light-dust{opacity:.3}}
body.winner-open{overflow:hidden}#winner{width:min(510px,calc(100% - 28px));max-height:92svh;padding:26px 24px 22px;border:2px solid #ffe78e;background:radial-gradient(ellipse at 50% 35%,#721374 0,#300d50 46%,#160529 100%);box-shadow:0 0 55px #f000c87a,0 0 110px #ffda5522;border-radius:30px;overflow-x:hidden;overflow-y:auto}#winner::backdrop{background:#110020db;backdrop-filter:blur(10px)}.winner-content{text-align:center;position:relative}.winner-kicker{font-size:12px!important;font-weight:800;letter-spacing:3px;color:#ffe68a!important;margin:0}.gift-stage{position:relative;height:260px;display:grid;place-items:center;isolation:isolate}.gift-rays{position:absolute;width:320px;height:320px;max-width:90vw;background:repeating-conic-gradient(from 0deg,#ffd96800 0deg 12deg,#ffe59b77 15deg 20deg,#ffd96800 24deg 36deg);border-radius:50%;mask-image:radial-gradient(circle,#000 15%,#0009 42%,transparent 69%);animation:gift-rays-spin 15s linear infinite;z-index:-2}.gift-halo{position:absolute;width:230px;height:230px;border-radius:50%;background:radial-gradient(circle,#fff0ac99,#ffdc5944 35%,#f000c820 60%,transparent 72%);animation:gift-shimmer 2.3s ease-in-out infinite;z-index:-1}.winner-gift{width:230px;height:230px;object-fit:contain;filter:drop-shadow(0 16px 20px #13001688);animation:gift-turn 6s linear infinite}#winner h2{font-size:clamp(32px,7vw,46px);line-height:1.05;margin:4px 0 14px;font-weight:900;color:#fff09b;text-shadow:0 3px 0 #9b591e,0 0 25px #ffbe3438}#winnerDetail{font-size:16px;color:#f2dffc;margin:14px 0 25px}#winner .primary{font-size:16px;width:100%;padding:16px 12px}#winnerSound{display:block;margin:18px auto 0;font-size:13px}#winner[open]{animation:win-arrive .4s ease-out}@keyframes gift-rays-spin{to{transform:rotate(360deg)}}@keyframes gift-shimmer{0%,100%{opacity:.5;transform:scale(.85)}50%{opacity:1;transform:scale(1.14)}}@keyframes gift-turn{0%{transform:perspective(700px) rotateY(-18deg) rotateZ(-6deg) translateY(0)}25%{transform:perspective(700px) rotateY(0) rotateZ(0) translateY(-12px)}50%{transform:perspective(700px) rotateY(18deg) rotateZ(6deg) translateY(0)}75%{transform:perspective(700px) rotateY(0) rotateZ(0) translateY(-12px)}100%{transform:perspective(700px) rotateY(-18deg) rotateZ(-6deg) translateY(0)}}@keyframes win-arrive{from{opacity:0;transform:translateY(25px) scale(.85)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-height:700px){.gift-stage{height:190px}.winner-gift{width:180px;height:180px}#winner{padding:20px}#winner h2{font-size:32px}}@media(prefers-reduced-motion:reduce){#winner[open],.winner-gift,.gift-rays,.gift-halo{animation:none}}

/* Entry lobby shares the existing animated atmosphere. */
[hidden]{display:none!important}.lobby{position:relative;z-index:1;min-height:100svh;max-width:660px;margin:0 auto;padding:32px 24px 42px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center}.lobby-brand{min-height:48px;justify-content:center;max-width:100%;flex-shrink:0}.lobby-brand img{max-width:220px;max-height:55px}.lobby-brand span{overflow-wrap:anywhere}.lobby h1{font-size:clamp(66px,14vw,100px);margin:0;line-height:1.12;flex-shrink:0}.lobby h1>span{display:block;font-size:22px;letter-spacing:3px;font-weight:500;font-style:normal;color:white;text-shadow:none;margin:0 0 10px}.lobby-board{display:block;width:min(100%,470px);height:auto;max-height:53svh;object-fit:contain;filter:drop-shadow(0 12px 30px #f000c830)}.lobby-start{flex-shrink:0;margin:7px 0 0;min-width:245px;max-width:100%}@media(max-width:480px){.lobby{padding:24px 22px 32px;gap:16px}.lobby h1>span{font-size:20px}.lobby-board{max-height:50svh}}@media(max-height:600px) and (min-width:700px){.lobby{min-height:600px}.lobby-board{max-height:290px}}

/* Tactile controls and dimensional lettering across both views. */
.aim{display:flex;flex-direction:column;align-items:stretch;gap:12px;width:100%;margin:0 0 24px}.aim label{text-align:left;font-size:14px}.aim input{display:block;box-sizing:border-box;width:100%;max-width:none;margin:0;height:36px;cursor:pointer;accent-color:var(--gold)}.aim input::-webkit-slider-runnable-track{height:10px;border-radius:12px;background:linear-gradient(90deg,#62227b,#a450b1,#62227b);border:1px solid #d8a3e0;box-shadow:inset 0 2px 4px #180321}.aim input::-webkit-slider-thumb{margin-top:-4px}.aim input::-moz-range-track{height:10px;border-radius:12px;background:linear-gradient(90deg,#62227b,#a450b1,#62227b);border:1px solid #d8a3e0}.aim input:disabled{cursor:wait;opacity:.55}button{transition:transform .16s,filter .16s,box-shadow .25s}button:active:not(:disabled){transform:translateY(2px) scale(.96);filter:brightness(1.2)}.primary{position:relative;text-shadow:0 1px 0 #ac358d,0 2px 0 #702358,0 3px 0 #441437,0 5px 6px #26052b88}.heading h1,.lobby h1{color:#ffe676;-webkit-text-stroke:1px #fff1a666;text-shadow:0 1px 0 #fff4b4,0 2px 0 #f6c84c,0 3px 0 #e3a92f,0 4px 0 #cb871f,0 5px 0 #b77415,0 6px 0 #955110,0 7px 0 #6b300e,0 9px 0 #6a065e,0 13px 12px #0e011c99,0 0 30px #efbf3540}.lobby h1>span{color:#fff4ff;-webkit-text-stroke:0;text-shadow:0 1px 0 #c394d4,0 2px 0 #8e509f,0 3px 0 #59286e,0 5px 8px #10001faa}.brand span,.slots div,.score strong b{text-shadow:0 1px 0 #b87b23,0 2px 0 #825017,0 3px 0 #492511,0 5px 7px #18001c88}.slots small{text-shadow:none}dialog[open]{animation:panel-arrive .28s ease-out}@keyframes panel-arrive{from{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){button{transition:none}dialog[open]{animation:none}button:active:not(:disabled){transform:none}}
