:root{--gold:#ffce66;--bright:#fff0aa;--purple:#28073d;--dark:#110719}*{box-sizing:border-box}
html{scroll-behavior:smooth}body{margin:0;min-height:100vh;color:#fff4d5;background:radial-gradient(ellipse at 30% 15%,#461454 0,transparent 45%),radial-gradient(ellipse at 70% 70%,#39131e 0,transparent 38%),#09040d;font-family:Inter,Arial,"Segoe UI",sans-serif;overflow-x:hidden}
.layout{position:relative;z-index:1;max-width:1200px;margin:auto;display:grid;grid-template-columns:minmax(0,620px) minmax(300px,1fr);gap:24px;padding:24px 20px 38px;align-items:center}
.mobile-art{position:relative;isolation:isolate;width:100%;aspect-ratio:1086/1448;border:2px solid #f6b74c90;border-radius:24px;box-shadow:0 0 60px #e1a32924,0 35px 80px #0009;overflow:hidden;background:#120b18}
.poster{display:block;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none}
.overlay-wheel{position:absolute;width:66%;left:15%;top:19.2%;aspect-ratio:1;z-index:2;border-radius:50%;filter:drop-shadow(0 0 15px #ffd569bb);background:radial-gradient(circle at 35% 25%,#fff3a9 0%,#e7a52a 56%,#87400f 89%,#ffdb7e 100%);padding:0}
.wheel-rotator{width:100%;height:100%;transition:transform 4500ms cubic-bezier(.12,.84,.12,1);border-radius:50%;will-change:transform}
#wheelSvg{width:100%;height:100%;display:block;overflow:visible}
/* The red-gold winning arrow is fixed; only .wheel-rotator turns. */
.wheel-pointer{position:absolute;left:50%;top:-2%;width:10.5%;height:12%;transform:translateX(-50%);z-index:8;pointer-events:none;filter:drop-shadow(0 3px 5px #180515) drop-shadow(0 0 7px #ffe39a)}
.wheel-pointer svg{display:block;width:100%;height:100%;overflow:visible}

.spin-button{position:absolute;left:21%;bottom:7.2%;width:58%;height:6.6%;border:2px solid #fff5a7;border-radius:100px;z-index:5;background:linear-gradient(#fff5b4 0,#ffce55 22%,#d86b08 71%,#802e09 100%);box-shadow:0 0 21px #ffbb3188,inset 0 4px 8px #ffefc3,inset 0 -5px 7px #7b300d;color:#53120b;text-shadow:0 1px 0 #ffd77a;font-weight:1000;letter-spacing:1px;font-size:clamp(14px,2.9vw,24px);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;overflow:hidden;padding-inline:10px;line-height:1;transition:filter .15s,transform .15s}
.spin-button:hover{filter:brightness(1.08)}.spin-button:active{transform:scale(.98)}.spin-button:disabled{opacity:.8;cursor:default}#spinLabel{display:inline-block;min-width:0;max-width:100%;white-space:nowrap;flex:0 1 auto;font-size:1em;line-height:1;text-align:center}.spin-icon{font-size:.7em;flex:0 0 auto}.spark{flex:0 0 auto}.spark{color:#a9320c}
.tap-hint{position:absolute;z-index:5;bottom:3.5%;width:100%;text-align:center;color:#ffeab0;font-size:clamp(8px,1.7vw,12px);text-shadow:0 1px 3px #000;font-weight:650}
.info{border:1px solid #e9a84f6b;border-radius:25px;padding:30px 28px;background:linear-gradient(152deg,#33143fef,#170d24f5 65%,#110717f9);box-shadow:0 20px 50px #0009,inset 0 1px 0 #f4bd8130}
.eyebrow{text-align:center;font-size:12px;letter-spacing:2px;color:#f7c773;font-weight:900}h1{font-size:clamp(28px,3.3vw,40px);line-height:1.15;text-align:center;margin:20px 0 12px}h1 span{background:linear-gradient(#fff3b9,#d98c24);background-clip:text;-webkit-background-clip:text;color:transparent}.subtitle{text-align:center;color:#e0c8da;font-size:14px;line-height:1.6;margin-bottom:22px}
.fact{border:1px solid #ffc6636e;background:radial-gradient(ellipse at top,#713271,#351347 75%);border-radius:16px;text-align:center;padding:20px 12px}.fact-title{font-size:12px;letter-spacing:1px;color:#ffe29c;font-weight:900}.amount{font-weight:1000;line-height:1.1;font-size:58px;background:linear-gradient(#fff9c9,#ffcb5f 45%,#dc8127);-webkit-background-clip:text;background-clip:text;color:transparent;margin:8px 0}.amount small{font-size:25px}.fact-caption{font-size:13px;color:#f7d9e6}.claim-steps{margin:20px 0 12px;display:flex;align-items:center;justify-content:space-between;gap:5px;border:1px solid #f0ba6859;border-radius:16px;background:#170c23;padding:13px 12px}
.claim-step{display:flex;flex-direction:column;align-items:center;flex:1;gap:5px;text-align:center;color:#fce6b5;font-size:12px;font-weight:850;line-height:1.25}
.claim-step b{background:linear-gradient(130deg,#ffe89c,#c07722);color:#361026;border-radius:100%;display:grid;place-items:center;width:28px;height:28px;font-size:12px}
.claim-arrow{font-size:17px;color:#ffcf70;font-weight:900}
.claim-copy{color:#f6e3ef;line-height:1.65;font-size:14px;margin:12px 0 8px}
.claim-copy strong{color:#ffdc79}
.terms-note{font-size:12px;color:#d2b8ce;line-height:1.55;margin:0 0 16px}
.actions{display:flex;flex-direction:column;gap:10px}.start-button,.register-button{height:50px;border:0;cursor:pointer;border-radius:35px;background:linear-gradient(#fff3a1,#f4b843 47%,#c57c13);color:#331021;font-size:16px;font-weight:1000;box-shadow:inset 0 2px 2px #fff4c1,0 8px 20px #e0932244}.start-button{width:100%}.start-button span,.register-button span{margin-left:8px}.start-button:disabled{opacity:.6;cursor:default}.terms-link{text-align:center;color:#ffdf9c;font-size:13px}.feature-bar{border-top:1px solid #f1bb6a55;margin-top:24px;padding-top:16px;display:flex;justify-content:space-between;gap:8px;color:#ddbad6;font-size:12px;flex-wrap:wrap}
.gold-rain{position:fixed;inset:0;z-index:3;pointer-events:none;overflow:hidden}.coin{position:absolute;top:-60px;border-radius:50%;width:var(--sz);height:var(--sz);left:var(--left);border:2px solid #ffe8a1;background:radial-gradient(circle at 33% 25%,#fff6a5 0,#ffd560 18%,#c17714 55%,#fae07c 80%,#a35a08 100%);box-shadow:inset 0 0 0 3px #b4711c,inset 0 0 0 5px #ffcf60,0 0 8px #f7b234;display:flex;align-items:center;justify-content:center;opacity:0;animation:coinfall var(--duration) linear var(--delay) infinite;filter:brightness(var(--bri))}.coin:after{content:'♛';font-size:calc(var(--sz) * .5);font-weight:900;color:#9f5a08;text-shadow:0 1px #fff0a1}.coin:nth-child(even){transform-style:preserve-3d}
@keyframes coinfall{0%{transform:translate3d(0,-40px,0) rotate(0) rotateY(0);opacity:0}9%{opacity:.85}90%{opacity:.82}100%{transform:translate3d(var(--drift),115vh,0) rotate(560deg) rotateY(540deg);opacity:0}}
.modal[hidden]{display:none}.modal{position:fixed;inset:0;z-index:12;display:flex;align-items:center;justify-content:center;padding:18px}.modal-backdrop{position:absolute;inset:0;background:#08030bdc;backdrop-filter:blur(6px)}.result-card{position:relative;width:min(94vw,440px);padding:30px 22px 22px;border:2px solid #f7ce70;border-radius:28px;background:radial-gradient(ellipse at 50% 18%,#642578,#2e1038 58%,#10091a);box-shadow:0 0 55px #ffc35d88,inset 0 0 25px #f5bb3a42;text-align:center;animation:pop .4s ease-out}.result-small{letter-spacing:2px;color:#ffd27a;font-size:11px;font-weight:900}.result-card h2{margin:14px 0 0;font-size:25px}.result-amount{font-size:72px;line-height:1.25;font-weight:1000;color:#ffe587;text-shadow:0 5px 0 #a3530e,0 0 30px #ffce56}.result-amount small{font-size:29px}.result-desc{color:#f0dce9;font-size:14px;line-height:1.55;margin:0 0 18px}.register-button{width:100%;margin-bottom:8px}.result-disclaimer{font-size:11px;line-height:1.5;color:#d6c5d6}.close-button{background:transparent;border:0;color:#ffe4a0;text-decoration:underline;padding:9px;cursor:pointer}@keyframes pop{from{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}
.toast{position:fixed;z-index:20;left:50%;bottom:34px;transform:translateX(-50%) translateY(110px);padding:12px 18px;background:#fff2c0;color:#44231c;border-radius:12px;max-width:90%;font-size:14px;font-weight:800;box-shadow:0 10px 50px #000a;opacity:0;transition:.25s}.toast.show{transform:translateX(-50%) translateY(0);opacity:1}footer{color:#ab9aa7;text-align:center;font-size:11px;padding:0 20px 20px;line-height:1.7}
@media(max-width:810px){.layout{max-width:550px;display:block;padding:0 0 24px}.mobile-art{border:0;border-radius:0;box-shadow:none}.info{margin:16px 12px;padding:25px 20px}.spin-button{font-size:clamp(11px,3.1vw,16px);gap:4px;padding-inline:7px}.tap-hint{font-size:clamp(9px,2.6vw,14px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Romanized Nepali labels: make long words fit on small phones */
.result-card h2{overflow-wrap:anywhere}
.claim-step{overflow-wrap:anywhere}
@media(max-width:390px){.info{padding:22px 14px}.claim-steps{padding:10px 6px}.claim-step{font-size:10px}.start-button,.register-button{font-size:14px}.feature-bar{font-size:11px}}

/* v2 phone fit: never wrap or push the Romanized Nepali button label outside its pill. */
@media(max-width:370px){.spin-button{font-size:clamp(10px,3.0vw,12px);gap:2px;padding-inline:6px}.spin-icon,.spark{font-size:.7em}}
/* Wheel size is tied to poster width, NOT viewport height; the wheel remains truly round. */
.overlay-wheel{overflow:visible;transform:translateZ(0);box-shadow:0 0 0 2px #ffe29c,0 0 14px 5px #b9781b7a}
.wheel-rotator,#wheelSvg{aspect-ratio:1;transform-origin:center center}

/* Visible only if you configure the official terms URL in config.js. */
.modal-terms-link{display:block;color:#ffdf9c;font-size:12px;margin:5px auto 10px;text-decoration:underline}
.modal-terms-link[hidden]{display:none}

/* v4: force gold rain to render smoothly on phones, including mobile Safari. */
.gold-rain{isolation:isolate;-webkit-transform:translateZ(0)}
.coin{will-change:transform,opacity;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation-fill-mode:both;-webkit-animation:coinfall var(--duration) linear var(--delay) infinite}
