:root{--blue-700:#075ed8;--blue-600:#0876f9;--blue-500:#268aff;--blue-100:#eaf4ff;--yellow-500:#ffc928;--yellow-300:#ffdc67;--navy-900:#102349;--navy-700:#33476d;--line:#d8e3f3;--white:#fff;--shadow-soft:0 10px 30px #1b549a1f;--shadow-button:0 8px 18px #0069eb3d;--wheel-size:clamp(300px, 42vw, 430px);--motion-fast:.16s}*{box-sizing:border-box}html{background:var(--white);min-width:320px;overflow-x:hidden}body{min-height:100vh;color:var(--navy-900);background:var(--white);-webkit-font-smoothing:antialiased;margin:0;font-family:Microsoft YaHei,PingFang SC,Noto Sans CJK SC,system-ui,sans-serif;overflow-x:hidden}button{font:inherit;-webkit-tap-highlight-color:transparent}button:focus-visible{outline-offset:3px;outline:3px solid #268aff61}.app-shell{width:min(100% - 32px,760px);margin:0 auto;padding:42px 0 28px}.hero{text-align:center;position:relative}.hero h1{color:var(--navy-900);letter-spacing:-.04em;margin:0;font-size:clamp(34px,6vw,54px);font-weight:900;line-height:1.08}.hero h1 span{color:var(--blue-600);margin-right:8px}.hero p{color:var(--navy-700);justify-content:center;align-items:center;gap:14px;margin:13px 0 0;font-size:17px;display:flex}.hero p:before,.hero p:after{content:"";background:var(--blue-500);border-radius:99px;width:32px;height:2px}.title-row .spark{font-size:18px;animation:1.8s ease-in-out infinite alternate twinkle;position:absolute}.title-row .spark-blue{color:var(--blue-500);top:10px;left:calc(50% - 174px)}.title-row .spark-yellow{color:var(--yellow-500);animation-delay:.5s;top:-5px;right:calc(50% - 176px)}.balance-panel{border:1px solid var(--line);background:var(--white);width:min(100%,520px);min-height:92px;box-shadow:var(--shadow-soft);border-radius:16px;justify-content:space-between;align-items:center;margin:24px auto 10px;padding:15px 18px;display:flex}.balance-info{align-items:center;gap:12px;min-width:0;display:flex}.balance-actions{flex-direction:column;flex:none;gap:8px;display:flex}.coin-mark{border:3px solid var(--white);width:48px;height:48px;color:var(--white);background:linear-gradient(145deg,#33a1ff,#0565ea);border-radius:50%;flex:0 0 48px;place-items:center;font-size:14px;font-weight:900;display:grid;box-shadow:0 0 0 2px #9dcaff,0 5px 12px #0069eb38}.balance-label,.balance-value{margin:0}.balance-label{color:var(--navy-700);font-size:14px}.balance-value{white-space:nowrap;align-items:baseline;gap:6px;display:flex}.balance-value strong{color:var(--blue-600);font-variant-numeric:tabular-nums;font-size:32px;line-height:1.05}.balance-value span{color:var(--navy-700);font-size:14px}.cloud-status{color:#6b7c99;align-items:center;gap:7px;margin-top:12px;font-size:13px;font-weight:700;display:inline-flex}.cloud-status span{background:#9dacbf;border-radius:50%;width:8px;height:8px;box-shadow:0 0 0 4px #9dacbf24}.cloud-status.is-loading span{animation:1.2s ease-in-out infinite statusPulse}.cloud-status.is-online{color:#20845b}.cloud-status.is-online span{background:#2faf78;box-shadow:0 0 0 4px #2faf7821}.cloud-status.is-error{color:#c7434a}.cloud-status.is-error span{background:#e05860;box-shadow:0 0 0 4px #e0586021}.player-identity{color:var(--navy-700);flex-wrap:wrap;gap:3px 8px;margin:4px 0 0;font-size:12px;display:flex}.player-name-row{align-items:center;gap:6px;display:inline-flex}.player-name-row>span{font-weight:800}.player-identity small{color:#8694aa;font-size:11px}.edit-nickname-button{cursor:pointer;color:#075dbf;min-height:24px;font:inherit;transition:background var(--motion-fast) ease, transform var(--motion-fast) ease;background:#f4f9ff;border:1px solid #aecdff;border-radius:7px;padding:0 8px;font-size:10px;font-weight:800}.edit-nickname-button:hover{background:#e1f0ff;transform:translateY(-1px)}.edit-nickname-button:active{transform:scale(.96)}.edit-nickname-button:disabled{cursor:not-allowed;opacity:.55;transform:none}.button,.spin-button,.modal-button{cursor:pointer;transition:transform var(--motion-fast) ease, box-shadow var(--motion-fast) ease, filter var(--motion-fast) ease, opacity var(--motion-fast) ease;border:0}.button:hover,.spin-button:hover,.modal-button:hover{filter:brightness(1.035);transform:translateY(-1px)scale(1.015)}.button:active,.spin-button:active,.modal-button:active{transform:scale(.965)}.claim-button{color:#2e2600;white-space:nowrap;background:linear-gradient(#ffd832,#ffc20e);border-radius:11px;justify-content:center;align-items:center;gap:8px;min-height:42px;padding:0 15px;font-size:14px;font-weight:800;display:inline-flex;box-shadow:0 7px 16px #e1a70033}.exchange-button{color:#075dbf;white-space:nowrap;background:#eef7ff;border:1px solid #8dc4ff;border-radius:11px;min-height:40px;padding:0 15px;font-size:14px;font-weight:800;box-shadow:0 5px 13px #0069eb1a}.exchange-button.is-unavailable{color:#7b8ba4;box-shadow:none;background:#f3f6fa;border-color:#d7e0ec}.exchange-button:disabled{cursor:wait;opacity:.72;transform:none}.claim-button svg{fill:currentColor;width:21px;height:21px}.claim-button:disabled{cursor:not-allowed;color:#8793a8;box-shadow:none;filter:none;opacity:.88;background:#e9eef5;transform:none}.game-area{text-align:center}.wheel-stage{width:var(--wheel-size);height:calc(var(--wheel-size) + 24px);margin:2px auto 0;padding-top:24px;position:relative}.wheel{width:var(--wheel-size);height:var(--wheel-size);border:clamp(8px, 1.2vw, 12px) solid var(--blue-600);background:var(--blue-600);border-radius:50%;position:relative;box-shadow:0 16px 30px #0063e238,inset 0 0 0 2px #ffffffd9}.wheel:after{z-index:3;content:"";pointer-events:none;border:2px solid #ffffffe6;border-radius:50%;position:absolute;inset:4px}.wheel-surface{will-change:transform;background:repeating-conic-gradient(from -9deg, var(--blue-500) 0 18deg, var(--yellow-300) 18deg 36deg);border-radius:50%;transition-property:transform;transition-timing-function:cubic-bezier(.12,.66,.08,1);position:absolute;inset:8px;overflow:hidden}.wheel-surface:before{z-index:1;content:"";background:repeating-conic-gradient(from -9deg, transparent 0 17.6deg, #fffffff2 17.6deg 18deg);pointer-events:none;border-radius:50%;position:absolute;inset:0}.wheel-label{z-index:2;width:44px;color:var(--white);text-align:center;text-shadow:0 1px 1px #00317333;transform-origin:50%;will-change:transform;flex-direction:column;justify-content:center;align-items:center;font-size:clamp(11px,1.7vw,14px);font-weight:900;line-height:1.04;transition-property:transform;transition-timing-function:cubic-bezier(.12,.66,.08,1);display:flex;position:absolute;transform:translate(-50%,-50%)}.wheel-label:nth-child(2n){color:#15233c;text-shadow:none}.wheel-label.is-jackpot{color:#c21f35;text-shadow:0 1px #ffffffa6;font-size:clamp(12px,1.85vw,15px)}.wheel-label small{white-space:nowrap;margin-top:2px;font-size:.54em;font-weight:800}.wheel-center-frame{z-index:4;aspect-ratio:1;border:7px solid var(--white);background:var(--blue-600);border-radius:50%;width:29%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 4px 16px #0043a04d,inset 0 0 0 2px #9ed0ff}.spin-button{z-index:6;aspect-ratio:1;width:22%;min-width:68px;max-width:96px;color:var(--white);box-shadow:var(--shadow-button);background:linear-gradient(150deg,#409dff,#0565eb);border:0;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;font-size:clamp(15px,2.3vw,21px);font-weight:900;line-height:1.05;display:flex;position:absolute;top:calc(50% + 12px);left:50%;transform:translate(-50%,-50%)}.spin-button:hover{transform:translate(-50%,-50%)scale(1.035)}.spin-button:active{transform:translate(-50%,-50%)scale(.95)}.spin-button:disabled{cursor:wait;filter:saturate(.55);opacity:.78;transform:translate(-50%,-50%)}.spin-button.is-unavailable{filter:saturate(.55);box-shadow:0 5px 14px #364e702e}.pointer{z-index:8;border:4px solid var(--white);background:var(--yellow-500);pointer-events:none;border-radius:22px 22px 28px 28px;width:40px;height:52px;position:absolute;top:3px;left:50%;transform:translate(-50%);box-shadow:0 5px 12px #32425d47}.pointer:after{content:"";background:var(--yellow-500);width:16px;height:16px;position:absolute;bottom:-7px;left:50%;transform:translate(-50%)rotate(45deg)}.pointer span{z-index:1;border:3px solid var(--white);border-radius:50%;width:13px;height:13px;position:absolute;top:8px;left:50%;transform:translate(-50%)}.remaining-text{color:var(--navy-700);margin:17px 0 0;font-size:20px}.remaining-text strong{color:var(--blue-600);font-variant-numeric:tabular-nums;margin:0 3px;font-size:30px;display:inline-block}.rules{width:min(100%,530px);margin:26px auto 0}.rules h2{align-items:center;gap:10px;margin:0 0 11px;font-size:19px;display:flex}.rules h2 svg{width:25px;height:25px;fill:var(--white);background:var(--blue-600);border-radius:6px;padding:4px}.rules ul{border:1px solid var(--line);background:linear-gradient(145deg,#fff,#f8fbff);border-radius:14px;grid-template-columns:1fr 1fr;gap:11px 20px;margin:0;padding:17px 19px;list-style:none;display:grid}.rules li{color:var(--navy-700);align-items:center;gap:9px;font-size:14px;display:flex}.rules li span{width:18px;height:18px;color:var(--white);background:var(--blue-600);border-radius:50%;flex:0 0 18px;place-items:center;font-size:12px;font-weight:900;display:grid}.leaderboard{border:1px solid var(--line);background:var(--white);width:min(100%,620px);box-shadow:var(--shadow-soft);border-radius:18px;margin:22px auto 0;padding:22px}.leaderboard-heading{justify-content:space-between;align-items:center;gap:18px;margin-bottom:16px;display:flex}.leaderboard-heading h2,.leaderboard-heading p{margin:0}.leaderboard-heading h2{font-size:21px;line-height:1.2}.leaderboard-heading p{color:#70809a;margin-top:5px;font-size:13px}.leaderboard-refresh{cursor:pointer;min-width:72px;min-height:38px;color:var(--blue-700);font:inherit;transition:transform var(--motion-fast) ease, background var(--motion-fast) ease;background:#f4f9ff;border:1px solid #b8d6ff;border-radius:10px;font-size:13px;font-weight:800}.leaderboard-refresh:hover{background:var(--blue-100);transform:translateY(-1px)}.leaderboard-refresh:active{transform:scale(.96)}.leaderboard-refresh:disabled{cursor:wait;opacity:.55}.leaderboard-table-wrap{border:1px solid #dce7f5;border-radius:12px;overflow-x:auto}.leaderboard table{border-collapse:collapse;text-align:left;width:100%;min-width:480px;font-size:13px}.leaderboard th,.leaderboard td{white-space:nowrap;border-bottom:1px solid #e7eef8;padding:12px 14px}.leaderboard th{color:#52637d;background:#f7faff;font-size:12px}.leaderboard tr:last-child td{border-bottom:0}.leaderboard td:first-child{text-align:center;width:72px}.leaderboard .is-positive{color:var(--blue-700);font-weight:900}.leaderboard .is-negative{color:#dc424b;font-weight:900}.leaderboard-empty{color:#71819a;height:86px;text-align:center!important}.admin-entry{color:#8290a5;width:max-content;margin:14px 0 0 auto;font-size:12px;text-decoration:none;display:block}.admin-entry:hover{color:var(--blue-600);text-decoration:underline}.modal{z-index:50;visibility:hidden;opacity:0;place-items:center;padding:20px;transition:opacity .18s,visibility .18s;display:grid;position:fixed;inset:0}.modal.is-open{visibility:visible;opacity:1}.modal-backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0a1f4475;position:absolute;inset:0}.modal-card{background:var(--white);text-align:center;border:1px solid #d8e3f3f2;border-radius:20px;width:min(100%,360px);padding:30px 26px 24px;transition:transform .22s cubic-bezier(.2,.8,.2,1);position:relative;transform:translateY(12px)scale(.96);box-shadow:0 24px 70px #05255747}.modal.is-open .modal-card{transform:translateY(0)scale(1)}.modal-close{cursor:pointer;color:#71809a;width:34px;height:34px;transition:background var(--motion-fast) ease, transform var(--motion-fast) ease;background:0 0;border:0;border-radius:50%;place-items:center;padding:7px;display:grid;position:absolute;top:11px;right:11px}.modal-close:hover{background:var(--blue-100);transform:rotate(4deg)}.modal-close:active{transform:scale(.92)}.modal-close svg{fill:currentColor;width:100%;height:100%}.modal-icon{color:#e79800;background:linear-gradient(145deg,#fff2a5,#ffd33d);border:5px solid #fff2ad;border-radius:50%;place-items:center;width:76px;height:76px;margin:0 auto 14px;font-size:33px;font-weight:900;display:grid;box-shadow:0 0 0 2px #ffc829}.modal-icon.is-info{color:var(--blue-600);background:var(--blue-100);border-color:#d7eaff;box-shadow:0 0 0 2px #8ec4ff}.modal-icon.is-warning{color:#bf7900;background:#fff5d7;border-color:#ffe9b1;box-shadow:0 0 0 2px #ffd66c}.modal-card h2{color:var(--blue-600);margin:0;font-size:25px}.modal-card p{min-height:46px;color:var(--navy-700);margin:10px 0 20px;font-size:16px;line-height:1.65}.modal-actions{gap:10px;display:flex}.modal-button{min-height:46px;color:var(--white);background:var(--blue-600);box-shadow:var(--shadow-button);border-radius:10px;flex:1;font-weight:800}.modal-button.secondary{color:var(--navy-700);box-shadow:none;background:#eef3f9}.modal-button.danger{background:#e84f55;box-shadow:0 8px 18px #d3374138}.nickname-card{width:min(100%,400px)}.nickname-card>p{min-height:0;margin-bottom:15px;font-size:14px}.nickname-form input{width:100%;height:46px;color:var(--navy-900);font:inherit;transition:border-color var(--motion-fast) ease, box-shadow var(--motion-fast) ease;background:#fff;border:1px solid #cbd9eb;border-radius:10px;outline:none;padding:0 14px;font-size:15px}.nickname-form input:focus{border-color:var(--blue-500);box-shadow:0 0 0 3px #0876f921}.nickname-error{text-align:left;color:#d23f48!important;min-height:20px!important;margin:6px 0 0!important;font-size:12px!important;line-height:1.5!important}.nickname-form .modal-actions{margin-top:12px}.confetti-layer{z-index:60;pointer-events:none;position:fixed;inset:0;overflow:hidden}.confetti{opacity:0;border-radius:2px;width:9px;height:14px;animation:1.9s ease-out forwards confetti-fall;position:absolute;top:-18px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}@keyframes twinkle{0%{opacity:.42;transform:scale(.82)rotate(-8deg)}to{opacity:1;transform:scale(1.12)rotate(8deg)}}@keyframes statusPulse{0%,to{opacity:.45;transform:scale(.82)}50%{opacity:1;transform:scale(1)}}@keyframes confetti-fall{0%{opacity:1;transform:translateY(-10px)rotate(0)}to{opacity:0;transform:translate3d(var(--drift), 105vh, 0) rotate(var(--turn))}}@media (width<=560px){:root{--wheel-size:min(86vw, 348px)}.app-shell{width:min(100% - 24px,480px);padding-top:28px}.hero h1{font-size:clamp(33px,10.4vw,45px)}.hero p{margin-top:9px;font-size:15px}.title-row .spark-blue{left:4%}.title-row .spark-yellow{right:4%}.balance-panel{border-radius:14px;min-height:80px;margin-top:19px;padding:12px}.coin-mark{flex-basis:40px;width:40px;height:40px;font-size:12px}.balance-info{gap:9px}.balance-value strong{font-size:27px}.claim-button{min-height:40px;padding:0 10px;font-size:13px}.claim-button svg{width:18px;height:18px}.balance-actions{gap:6px}.exchange-button{min-height:38px;padding:0 10px;font-size:13px}.wheel-stage{margin-top:5px}.wheel-label{width:38px}.remaining-text{margin-top:13px;font-size:18px}.remaining-text strong{font-size:27px}.rules{margin-top:22px}.rules ul{grid-template-columns:1fr;gap:10px;padding:15px 17px}.leaderboard{border-radius:15px;padding:18px 14px}.leaderboard-heading{align-items:flex-end}.leaderboard-heading h2{font-size:19px}.leaderboard-table-wrap{margin-inline:-2px}}@media (width<=365px){.app-shell{width:min(100% - 18px,480px)}.balance-label{font-size:12px}.balance-value strong{font-size:24px}.balance-value span{font-size:12px}.claim-button{padding:0 9px;font-size:13px}.claim-button svg{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}