@import "https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap";:root{color:#f4f2fa;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-optical-sizing:auto;font-feature-settings:"tnum";--bg:#0b0a10;--panel:#13111a;--panel-light:#191621;--border:#ffffff13;--muted:#858091;--purple:#a66cff;--purple-bright:#bd91ff;--gold:#f4c76b;background:#0b0a10;font-family:Manrope,Arial,sans-serif;font-size:14px;font-weight:400}*{box-sizing:border-box}body{background:radial-gradient(ellipse at 50% 0%, #703db021, transparent 42%), var(--bg);min-width:320px;min-height:100vh;margin:0}button,a{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--purple-bright);outline-offset:4px}button:disabled{cursor:not-allowed}::selection{color:#fff;background:#7643bd}.app-shell{width:min(1120px,100% - 48px);margin:0 auto}.topbar{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;height:82px;display:flex}.brand{color:#f6f3fb;align-items:center;gap:11px;text-decoration:none;display:inline-flex}.brand-mark{color:#fff;background:linear-gradient(145deg,#bd8bff,#7138bd);border-radius:10px;place-items:center;width:34px;height:34px;font-size:19px;font-weight:800;display:grid;box-shadow:0 4px 20px #995be74d}.brand-name{letter-spacing:-.7px;font-size:17px;font-weight:800}.brand-name span{color:#a78bbf;font-weight:500}.topbar-right{align-items:center;gap:18px;display:flex}.demo-badge{color:#d5b879;letter-spacing:1px;background:#f4c76b0e;border:1px solid #f4c76b2e;border-radius:30px;align-items:center;gap:8px;padding:7px 11px;font-size:9px;font-weight:800;display:flex}.status-dot{background:#e4b85e;border-radius:50%;width:6px;height:6px;box-shadow:0 0 9px #f4c76bb3}.avatar{color:#d7c3f5;background:#211a2c;border:1px solid #b589ff40;border-radius:50%;place-items:center;width:34px;height:34px;font-weight:700;display:grid}.hero-section{text-align:center;padding:52px 0 38px}.eyebrow{color:#ad8bd4;letter-spacing:3px;justify-content:center;align-items:center;gap:12px;font-size:9px;font-weight:800;display:flex}.eyebrow-line{background:#71508d;width:25px;height:1px}.hero-section h1{color:#f7f4fb;letter-spacing:-2.2px;margin:17px 0 10px;font-size:clamp(32px,5vw,46px);font-weight:800;line-height:1.15}.hero-section h1 span{color:var(--purple-bright);text-shadow:0 0 35px #a66cff4d}.hero-description{color:#898494;margin:0;font-size:13px}.game-layout{grid-template-columns:minmax(0,1.55fr) minmax(280px,.8fr);align-items:stretch;gap:18px;display:grid}.wheel-panel,.attempt-card,.result-card{border:1px solid var(--border);background:linear-gradient(145deg,#1b1724f5,#110f17fa);border-radius:17px}.wheel-panel{flex-direction:column;align-items:center;min-height:550px;padding:25px 30px 22px;display:flex;position:relative;overflow:hidden}.wheel-panel:before{content:"";filter:blur(50px);pointer-events:none;background:#703ba80e;border-radius:50%;width:380px;height:380px;position:absolute;top:90px;left:50%;transform:translate(-50%)}.wheel-heading{z-index:1;justify-content:space-between;align-items:center;width:100%;display:flex;position:relative}.section-kicker{color:#827a91;letter-spacing:1.8px;font-size:9px;font-weight:800}.wheel-heading h2{color:#f4f0fa;letter-spacing:-.5px;margin:5px 0 0;font-size:17px;font-weight:700}.round-label{color:#716b7d;letter-spacing:1px;font-size:10px;font-weight:700}.wheel-stage{place-items:center;width:330px;height:330px;margin:29px auto 15px;display:grid;position:relative}.wheel-glow{filter:blur(36px);background:#9a5eeb30;border-radius:50%;width:290px;height:290px;position:absolute}.wheel{z-index:1;background:conic-gradient(#8d5ac5 0deg 45deg,#292136 45deg 90deg,#7548a8 90deg 135deg,#211b2c 135deg 180deg,#8d5ac5 180deg 225deg,#292136 225deg 270deg,#7548a8 270deg 315deg,#211b2c 315deg 360deg);border:7px solid #342641;border-radius:50%;width:290px;height:290px;transition:transform 5.2s cubic-bezier(.12,.72,.12,1);position:relative;box-shadow:0 0 0 3px #be92ff29,0 0 32px #9453d833,inset 0 0 0 2px #ffffff21,inset 0 0 25px #00000040}.wheel:before{content:"";pointer-events:none;border:1px solid #ffffff30;border-radius:50%;position:absolute;inset:8px}.wheel-label{color:#fff;text-shadow:0 2px 5px #00000040;justify-content:center;align-items:flex-start;width:46px;height:46px;margin-top:-23px;margin-left:-23px;font-size:13px;font-weight:800;display:flex;position:absolute;top:50%;left:50%}.wheel-label span{text-align:center;background:#0c091130;border-radius:6px;min-width:30px;padding:4px 3px;display:block}.wheel-center{z-index:2;background:radial-gradient(circle at 35% 25%,#39284d,#17111f 75%);border:3px solid #c69bff;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:82px;height:82px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 5px #100c168c,0 0 25px #b37eff40}.wheel-center-star{color:#f4c76b;font-size:21px;line-height:1}.wheel-center-name{color:#eee1ff;letter-spacing:1.5px;margin-top:4px;font-size:9px;font-weight:800}.wheel-pointer{z-index:4;filter:drop-shadow(0 3px 5px #00000080);width:27px;height:35px;position:absolute;top:-1px;left:50%;transform:translate(-50%)}.wheel-pointer svg{width:100%;height:100%}.spin-area{z-index:2;flex-direction:column;align-items:center;width:100%;margin-top:auto;display:flex;position:relative}.spin-button{color:#fff;background:linear-gradient(105deg,#8850c9,#a46be9 55%,#8750c5);border:1px solid #dcc3ff4d;border-radius:10px;justify-content:center;align-items:center;gap:11px;width:min(100%,310px);min-height:53px;font-size:13px;font-weight:800;transition:transform .2s,filter .2s,box-shadow .2s;display:flex;box-shadow:0 7px 25px #8248c040,inset 0 1px #ffffff2e}.spin-button:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 10px 30px #995ede59}.spin-button:active:not(:disabled){transform:translateY(0)}.spin-button:disabled{opacity:.65}.spin-button-icon{font-size:17px}.spin-caption{color:#777184;text-align:center;margin-top:11px;font-size:10px}.side-panel{flex-direction:column;gap:14px;display:flex}.attempt-card{background:radial-gradient(ellipse at 100% 0%, #955bd121, transparent 60%), var(--panel);padding:20px}.card-topline{justify-content:space-between;align-items:center;display:flex}.attempt-icon{color:#bd92ff;background:#a369eb17;border:1px solid #b487ff33;border-radius:8px;place-items:center;width:29px;height:29px;font-size:18px;display:grid}.attempt-number{color:#f4effc;letter-spacing:-2px;margin-top:15px;font-size:39px;font-weight:800;line-height:1.1}.attempt-number span{color:#777083;letter-spacing:0;font-size:17px;font-weight:600}.attempt-card>p{color:#8e879b;margin:5px 0 15px;font-size:11px}.attempt-progress{gap:6px;display:flex}.attempt-progress span{background:#302a38;border-radius:5px;flex:1;height:5px}.attempt-progress .progress-active{background:linear-gradient(90deg,#8550c3,#bb8cff);box-shadow:0 0 9px #ae78f24d}.result-card{background:var(--panel);min-height:211px;padding:20px}.result-placeholder{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:12px;min-height:145px;display:flex}.placeholder-star{color:#74569a;font-size:35px;line-height:1}.result-placeholder p{color:#777184;max-width:190px;font-size:11px;line-height:1.6}.result-visible{background:radial-gradient(ellipse at 50% 0%, #995cdd1f, transparent 75%), var(--panel);border-color:#ae7ff240}.result-symbol{color:#d4adff;margin-top:13px;font-size:29px}.result-card h3{color:#f0e6ff;margin:3px 0 7px;font-size:20px;font-weight:800}.result-card>p{color:#898294;font-size:10px;line-height:1.6}.rules-button{border:1px solid var(--border);color:#b9b1c6;text-align:left;background:#15121b;border-radius:10px;align-items:center;gap:10px;min-height:44px;padding:0 15px;font-size:11px;font-weight:600;display:flex}.rules-button>span:first-child{color:#ad83e6;font-size:15px}.rules-chevron{color:#777184;margin-left:auto;font-size:16px;transition:transform .2s}.rules-chevron.open{transform:rotate(180deg)}.rules-content{border:1px solid var(--border);background:#15121b;border-radius:10px;margin-top:-5px;padding:13px 15px}.rules-content p{color:#938b9f;margin:5px 0;font-size:10px;line-height:1.6}.reset-button{color:#756d80;text-underline-offset:3px;background:0 0;border:0;align-self:flex-start;padding:5px 0;font-size:10px;-webkit-text-decoration:underline #756d8066;text-decoration:underline #756d8066}.reset-button:disabled{opacity:.4}.footer{color:#655e70;letter-spacing:1.2px;align-items:center;gap:14px;min-height:75px;font-size:9px;font-weight:700;display:flex}.footer-divider{background:#665b77;border-radius:50%;width:3px;height:3px}.footer-version{color:#51495d;margin-left:auto;font-size:8px}@media (width<=760px){.app-shell{width:min(100% - 28px,480px)}.topbar{height:65px}.brand-name{font-size:15px}.topbar-right{gap:10px}.demo-badge{letter-spacing:.6px;padding:6px 8px;font-size:8px}.avatar{width:30px;height:30px}.hero-section{padding:39px 0 27px}.hero-section h1{letter-spacing:-1.7px;font-size:34px}.hero-description{max-width:290px;margin:0 auto;font-size:11px;line-height:1.6}.game-layout{grid-template-columns:1fr;gap:13px}.wheel-panel{min-height:0;padding:20px 15px 22px}.wheel-stage{width:300px;height:300px;margin:27px auto 20px;transform:scale(.94)}.wheel{width:270px;height:270px}.wheel-center{width:76px;height:76px}.spin-button{min-height:52px}.side-panel{grid-template-columns:1fr 1fr;gap:11px;display:grid}.attempt-card,.result-card{min-width:0;padding:15px}.attempt-number{font-size:33px}.result-card{min-height:185px}.result-placeholder{min-height:120px}.rules-button,.rules-content,.reset-button{grid-column:1/-1}.footer{letter-spacing:.7px;gap:9px;min-height:65px;font-size:8px}}@media (width<=360px){.wheel-stage{margin-top:12px;margin-bottom:12px;transform:scale(.86)}.hero-section h1{font-size:30px}.side-panel{grid-template-columns:1fr}.result-card{min-height:165px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
