*{box-sizing:border-box} :root{--bg:#06030b;--panel:#0b0817;--line:rgba(255,160,96,.18);--text:#fff9f4;--muted:#a79a9d;--cyan:#7deaff;--violet:#8b55ff;--pink:#ff3b91;--gold:#ffd46b;--fire:#ff6b2f;--deep:#120615}
html,body{margin:0;min-height:100%;background:#040208;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif}body{overflow-x:hidden}.ambient-bg{position:fixed;inset:0;z-index:-2;overflow:hidden;background:radial-gradient(circle at 50% 18%,rgba(255,72,23,.14),transparent 25%),radial-gradient(circle at 20% 65%,rgba(121,31,255,.12),transparent 28%),linear-gradient(180deg,#0c0510,#040208 70%)}.phoenix-aura{position:absolute;width:80vw;height:80vw;max-width:1000px;max-height:1000px;left:50%;top:-30vw;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,114,43,.09),rgba(255,35,122,.035) 35%,transparent 68%);filter:blur(12px);animation:auraPulse 5s ease-in-out infinite}.ambient-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 0,rgba(255,103,35,.015) 50%,rgba(120,40,255,.03) 100%);pointer-events:none}@keyframes auraPulse{50%{transform:translateX(-50%) scale(1.08);opacity:.8}}
.topbar{height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 max(12px,calc((100vw - 1120px)/2));border-bottom:1px solid rgba(255,150,95,.14);background:rgba(7,4,12,.82);backdrop-filter:blur(20px);position:sticky;top:0;z-index:20}.brand-wrap,.top-actions{display:flex;align-items:center;gap:8px}.brand{line-height:1}.brand strong{display:block;font-size:14px;letter-spacing:.18em}.brand span{display:block;color:#ff9a55;font-size:9px;letter-spacing:.35em;margin-top:4px}.icon-btn{width:42px;height:42px;border:1px solid rgba(255,169,107,.17);border-radius:13px;background:linear-gradient(180deg,#171020,#0c0915);color:#fff;font-size:25px;cursor:pointer;box-shadow:inset 0 0 20px rgba(255,84,38,.03)}.icon-btn.small{font-size:17px;width:38px;height:38px}.icon-btn.off{opacity:.55}.balance{font-weight:950;background:linear-gradient(180deg,#151021,#0b0815);border:1px solid rgba(255,166,98,.22);padding:10px 15px;border-radius:14px;box-shadow:0 0 28px rgba(255,75,29,.08)}.balance small{color:#ff9c5d;font-size:9px;letter-spacing:.12em}
.shell{width:min(1120px,calc(100% - 16px));margin:auto;padding:22px 0 55px}.intro{display:flex;justify-content:space-between;align-items:end;margin-bottom:14px}.eyebrow{color:#ff9a55;font-size:9px;letter-spacing:.28em;font-weight:900}.intro h1{font-size:clamp(30px,6vw,50px);margin:5px 0 0;letter-spacing:.04em;text-shadow:0 0 25px rgba(255,85,36,.16)}.intro p{margin:4px 0 0;color:var(--muted)}.stats{display:grid;grid-template-columns:auto auto;gap:2px 8px;text-align:right;color:#7e7075;font-size:8px;letter-spacing:.16em}.stats b{font-size:15px;color:#fff}
.game-card{border:1px solid rgba(255,147,82,.2);border-radius:28px;padding:8px;background:linear-gradient(145deg,rgba(255,72,26,.08),rgba(91,48,255,.05));box-shadow:0 30px 100px rgba(0,0,0,.58),0 0 55px rgba(255,54,28,.04)}.board{--play-left:4%;--play-right:4%;--bin-gap:3px;height:min(700px,72vh);min-height:510px;position:relative;overflow:hidden;border-radius:21px;background:radial-gradient(circle at 50% 16%,rgba(255,110,42,.15),transparent 26%),radial-gradient(circle at 50% 65%,rgba(92,46,255,.1),transparent 48%),linear-gradient(180deg,#140817,#080610 78%);box-shadow:inset 0 0 100px rgba(255,73,24,.06),inset 0 -70px 100px rgba(76,36,170,.06)}.board:before{content:"";position:absolute;left:50%;top:5%;width:34%;height:25%;transform:translateX(-50%);background:radial-gradient(ellipse,rgba(255,130,57,.13),transparent 70%);filter:blur(14px)}.board-sun{position:absolute;width:130px;height:130px;left:50%;top:4%;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,246,201,.08),rgba(255,96,35,.06) 38%,transparent 70%);filter:blur(2px)}.glow{position:absolute;width:55%;height:35%;left:22.5%;top:5%;background:radial-gradient(circle,rgba(255,109,46,.11),transparent 70%);filter:blur(12px)}
.pegs{position:absolute;left:var(--play-left);right:var(--play-right);top:58px;bottom:150px;display:flex;flex-direction:column;justify-content:space-between;z-index:2}.peg-row{position:relative;height:8px;width:100%}.peg{position:absolute;top:0;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#9defff 35%,#ffb65e 72%,#ff5c36);box-shadow:0 0 8px rgba(255,120,59,.75),0 0 18px rgba(98,217,255,.25);transform:translateX(-50%)}
.bins{position:absolute;left:var(--play-left);right:var(--play-right);bottom:18px;height:70px;display:grid;grid-template-columns:repeat(var(--slot-count,7),minmax(0,1fr));gap:var(--bin-gap);z-index:4}.bin{min-width:0;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,166,91,.2);border-radius:10px;background:linear-gradient(180deg,#1a112a,#0d0919);color:#ffd7b0;font-weight:950;font-size:clamp(8px,1.25vw,14px);letter-spacing:-.2px;transition:.18s;overflow:hidden;white-space:nowrap;box-shadow:inset 0 0 18px rgba(255,72,30,.025)}.bin span{display:block;transform:scaleX(.9);transform-origin:center}.bin.hot{color:#ffe17e;border-color:rgba(255,196,74,.55);box-shadow:inset 0 0 24px rgba(255,92,36,.12),0 0 15px rgba(255,121,48,.06)}.bin.win{animation:binWinPulse .72s ease-out;border-color:var(--gold)}@keyframes binWinPulse{0%{transform:translateY(0) scale(1);box-shadow:inset 0 0 0 rgba(255,215,90,0)}35%{transform:translateY(-4px) scale(1.045);box-shadow:0 0 28px rgba(255,145,42,.5),inset 0 0 24px rgba(255,74,28,.16)}100%{transform:translateY(0) scale(1);box-shadow:0 0 0 rgba(255,210,80,0),inset 0 0 24px rgba(255,95,192,.05)}}
.ball{position:absolute;width:24px;height:24px;border-radius:50%;left:50%;top:27px;margin-left:-12px;z-index:5;opacity:0;background:radial-gradient(circle at 28% 23%,#fff 0 7%,#fff7ce 12%,#ffd45b 25%,#ff7a2e 43%,#ff315e 68%,#7b1cff 100%);box-shadow:0 0 9px rgba(255,255,240,.98),0 0 18px rgba(255,169,54,.95),0 0 38px rgba(255,66,34,.8),0 0 68px rgba(255,23,105,.35),inset -4px -5px 8px rgba(80,0,50,.42);will-change:transform,left,top}.ball:before{content:"";position:absolute;width:8px;height:6px;left:5px;top:4px;border-radius:50%;background:#fff;box-shadow:0 0 9px #fff}.ball:after{content:"";position:absolute;inset:-8px;border-radius:50%;border:1px solid rgba(255,157,76,.35);box-shadow:0 0 17px rgba(255,98,38,.5),0 0 30px rgba(255,35,113,.25)}.ball.active{opacity:1}.ball.impact{animation:ballImpact .24s ease-out}@keyframes ballImpact{0%{filter:brightness(1);transform:translate(-50%,-50%) scale(1)}35%{filter:brightness(1.85);transform:translate(-50%,-50%) scale(1.28,.8)}100%{filter:brightness(1);transform:translate(-50%,-50%) scale(1)}}
.path-dot{position:absolute;width:6px;height:6px;border-radius:50%;background:#ffce73;box-shadow:0 0 12px #ff7437;z-index:3;animation:pathfade .7s ease-out forwards;pointer-events:none}.path-dot.trail{width:5px;height:5px;background:#ff9a4b;box-shadow:0 0 12px #ff4b2f;opacity:.7;animation:trailfade .5s ease-out forwards}.ember-shot{position:absolute;width:4px;height:4px;border-radius:50%;background:#ffb34f;box-shadow:0 0 8px #ff542b;pointer-events:none;z-index:4;animation:emberShot .5s ease-out forwards}@keyframes emberShot{to{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.2)}}.impact-ring{position:absolute;width:8px;height:8px;border:1px solid rgba(255,194,95,.95);border-radius:50%;transform:translate(-50%,-50%);z-index:4;pointer-events:none;animation:impactRing .5s cubic-bezier(.15,.8,.25,1) forwards}@keyframes impactRing{0%{opacity:.95;transform:translate(-50%,-50%) scale(.5);box-shadow:0 0 4px rgba(255,125,50,.8)}100%{opacity:0;transform:translate(-50%,-50%) scale(3.5);box-shadow:0 0 22px rgba(255,73,32,0)}}.slot-impact{position:absolute;width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,203,106,.95);transform:translate(-50%,-50%);z-index:3;pointer-events:none;animation:slotImpact .62s cubic-bezier(.16,.84,.26,1) forwards;box-shadow:0 0 12px rgba(255,105,39,.75),0 0 30px rgba(255,43,120,.38)}@keyframes slotImpact{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}18%{opacity:1;transform:translate(-50%,-50%) scale(.8)}100%{opacity:0;transform:translate(-50%,-50%) scale(3.8);box-shadow:0 0 42px rgba(255,99,36,0)}}@keyframes trailfade{0%{opacity:.75;transform:scale(1)}100%{opacity:0;transform:scale(.15)}}@keyframes pathfade{to{opacity:0;transform:scale(.35)}}
.ember-layer,.embers-board{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1}.embers-board{z-index:1}.ember{position:absolute;border-radius:50%;background:#ffad52;box-shadow:0 0 8px #ff512e;animation:rise linear forwards;opacity:.7}@keyframes rise{0%{transform:translate3d(0,0,0) scale(.8);opacity:0}12%{opacity:.75}100%{transform:translate3d(calc(-20px + 40px * var(--rand,1)), -120vh,0) scale(.1);opacity:0}}
.panel{margin-top:14px;padding:14px;border:1px solid rgba(255,148,83,.16);border-radius:20px;background:rgba(10,7,19,.92);box-shadow:0 18px 60px rgba(0,0,0,.3)}.bet-row{display:grid;grid-template-columns:minmax(150px,1fr) auto minmax(150px,220px);gap:8px}.bet-input{display:flex;align-items:center;gap:10px;border:1px solid rgba(255,158,92,.14);border-radius:13px;padding:0 13px;background:#07050d}.bet-input span{color:#8e7f83;font-size:10px;font-weight:900;letter-spacing:.15em}.bet-input input{width:100%;border:0;outline:0;background:transparent;color:#fff;font-size:16px;font-weight:900;padding:14px 0}.quick-list{display:flex;gap:6px}.quick-list button{min-width:48px;border:1px solid rgba(255,160,94,.14);border-radius:11px;background:#171020;color:#eadfe0;font-weight:900;cursor:pointer}.drop-btn{border:0;border-radius:13px;background:linear-gradient(135deg,#ff4c91,#ff742d 52%,#784dff);color:#fff;font-weight:950;letter-spacing:.08em;cursor:pointer;box-shadow:0 12px 35px rgba(255,69,47,.2);position:relative;overflow:hidden}.drop-btn:before{content:"";position:absolute;inset:-30%;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.24) 48%,transparent 60%);transform:translateX(-70%);animation:buttonShine 3.2s ease-in-out infinite}.drop-btn i{position:relative;display:inline-block;width:7px;height:7px;border-radius:50%;background:#fff4d0;box-shadow:0 0 8px #fff;margin-right:7px;vertical-align:1px}@keyframes buttonShine{50%,100%{transform:translateX(75%)}}.drop-btn:disabled{opacity:.45;cursor:not-allowed}.result{text-align:center;font-size:30px;font-weight:950;margin:12px 0 2px;text-shadow:0 0 18px rgba(255,100,50,.16)}.message{text-align:center;color:#9f9094;font-size:12px;min-height:18px}.history-head{display:flex;justify-content:space-between;margin-top:14px;color:#6f6166;font-size:9px;letter-spacing:.16em}.history-head #modeLabel{color:#ff9a55}.history{display:flex;gap:6px;overflow:auto;padding-top:7px;scrollbar-width:none}.history::-webkit-scrollbar{display:none}.history span{white-space:nowrap;padding:7px 10px;border-radius:9px;background:#171020;color:#c5b7bc;font-size:11px}.settings-panel{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.setting-block{padding:10px;border:1px solid rgba(255,157,91,.14);border-radius:14px;background:rgba(12,8,22,.84)}.setting-block>span{display:block;font-size:9px;font-weight:900;letter-spacing:.16em;color:#8b777d;margin-bottom:7px}.segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.segmented button{min-height:36px;border:1px solid rgba(255,155,90,.12);border-radius:9px;background:#171020;color:#a99ba0;font-weight:900}.segmented button.active{color:#fff;border-color:rgba(255,102,74,.75);background:linear-gradient(135deg,#ff3e91,#ff6b2e);box-shadow:0 0 22px rgba(255,62,63,.16)}.fairness{margin-top:12px;color:#9d8e93;font-size:12px}.fairness details{border:1px solid rgba(255,155,90,.13);border-radius:16px;background:rgba(10,7,18,.72);padding:12px 14px}.fairness summary{cursor:pointer;color:#d8cbd0;font-weight:800}.info-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}.info-grid div{padding:10px;border-radius:11px;background:#171020}.info-grid span{display:block;font-size:8px;color:#78696e}.info-grid b{display:block;margin-top:4px;color:#fff}
.settings-modal[hidden]{display:none}.settings-modal{position:fixed;inset:0;z-index:100}.settings-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.65);backdrop-filter:blur(7px)}.settings-dialog{position:absolute;right:14px;top:74px;width:min(360px,calc(100% - 28px));padding:14px;border:1px solid rgba(255,150,90,.22);border-radius:18px;background:linear-gradient(180deg,#1a0e1c,#0b0710);box-shadow:0 30px 100px rgba(0,0,0,.6)}.dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;color:#ffd4b6;letter-spacing:.08em}.close-btn{border:0;background:transparent;color:#fff;font-size:25px;cursor:pointer}.setting-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 8px;border:0;border-top:1px solid rgba(255,150,90,.1);background:transparent;color:#fff;text-align:left;cursor:pointer}.setting-toggle span{display:grid;gap:3px}.setting-toggle b{font-size:13px}.setting-toggle small{color:#89797e;font-size:10px}.setting-toggle i{width:38px;height:22px;border-radius:20px;background:#251b2b;position:relative;font-style:normal;text-align:center;padding-top:3px;color:#999}.setting-toggle i:after{content:"";position:absolute;width:16px;height:16px;left:3px;top:3px;border-radius:50%;background:#76666c;transition:.2s}.setting-toggle.on i{background:#ff4d62}.setting-toggle.on i:after{left:19px;background:#fff}.settings-tip{padding:10px 8px;color:#75666b;font-size:10px}
.modal-open{overflow:hidden}.sound-off .ambient-bg{animation:none}.fx-off .ember-layer,.fx-off .embers-board{display:none}.fx-off .ball:after{display:none}.fx-off .drop-btn:before{display:none}
@media(max-width:700px){.topbar{height:60px}.top-actions{gap:4px}.icon-btn{width:39px;height:39px}.icon-btn.small{width:34px;height:34px}.shell{width:calc(100% - 10px);padding-top:12px}.intro h1{font-size:30px}.intro p{font-size:12px}.game-card{padding:5px;border-radius:20px}.board{--play-left:2%;--play-right:2%;--bin-gap:2px;height:70vh;min-height:520px;border-radius:16px}.pegs{top:60px;left:var(--play-left);right:var(--play-right);bottom:145px}.bins{left:var(--play-left);right:var(--play-right);height:66px;gap:var(--bin-gap)}.bin{border-radius:7px;font-size:clamp(6.5px,2.05vw,11px);padding:0;letter-spacing:-.28px}.bin span{transform:scaleX(.82)}.bet-row{grid-template-columns:1fr 1fr}.bet-input{grid-column:1/-1}.quick-list{justify-content:space-between}.quick-list button{flex:1}.drop-btn{min-height:48px}.info-grid{grid-template-columns:repeat(2,1fr)}.settings-panel{grid-template-columns:1fr 1fr;gap:7px}.setting-block{padding:8px}.segmented{gap:4px}.segmented button{min-height:34px;font-size:10px}.settings-dialog{top:auto;bottom:12px;right:8px;width:calc(100% - 16px)}}
@media(max-width:380px){.bin{font-size:6.2px;letter-spacing:-.35px}.bin span{transform:scaleX(.78)}.bins{gap:1px}.balance{padding:8px 10px;font-size:12px}.brand strong{font-size:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}.phoenix-aura{animation:none}.drop-btn:before{display:none}}

/* RC11 — multi-ball Phoenix launcher */
.drop-funnel{position:absolute;z-index:4;left:50%;top:4px;width:94px;height:76px;transform:translateX(-50%);pointer-events:none;filter:drop-shadow(0 0 16px rgba(255,80,30,.28))}.funnel-flame{position:absolute;left:50%;top:0;width:30px;height:30px;transform:translateX(-50%);border-radius:50% 50% 55% 55%;background:radial-gradient(circle at 50% 62%,#fff9cf 0 12%,#ffd04d 24%,#ff6a24 48%,#e52235 72%,transparent 74%);box-shadow:0 0 16px #ff6b2a,0 0 34px rgba(255,49,43,.6);animation:funnelPulse .75s ease-in-out infinite alternate}.funnel-neck{position:absolute;left:50%;top:23px;width:34px;height:50px;transform:translateX(-50%);background:linear-gradient(90deg,#3c1119,#ff6329 38%,#ffcf68 50%,#ff3c2d 64%,#35101a);clip-path:polygon(20% 0,80% 0,100% 100%,0 100%);border-radius:5px 5px 18px 18px;box-shadow:0 0 18px rgba(255,76,37,.55),inset 0 0 12px rgba(255,244,179,.35)}.funnel-ring{position:absolute;left:50%;border:2px solid rgba(255,170,75,.55);border-radius:50%;transform:translateX(-50%);animation:ringPulse 1.7s ease-out infinite}.funnel-ring.r1{top:16px;width:54px;height:18px}.funnel-ring.r2{top:26px;width:70px;height:24px;animation-delay:.65s}.ball{width:25px;height:25px;margin-left:-12.5px;background:radial-gradient(circle at 27% 22%,var(--core) 0 7%,#fff6d0 12%,var(--mid) 33%,var(--edge) 69%,#16030b 100%);box-shadow:0 0 9px var(--core),0 0 20px var(--glow),0 0 44px var(--glow),0 0 76px color-mix(in srgb,var(--glow),transparent 45%),inset -4px -5px 9px rgba(20,0,20,.45)}.ball:after{border-color:color-mix(in srgb,var(--glow),transparent 45%);box-shadow:0 0 17px var(--glow),0 0 32px color-mix(in srgb,var(--glow),transparent 55%)}.ball:before{box-shadow:0 0 11px var(--core)}.ball.impact{animation:ballImpact .24s ease-out, fireFlicker .11s linear 2}@keyframes funnelPulse{from{transform:translateX(-50%) scale(.88);filter:brightness(.9)}to{transform:translateX(-50%) scale(1.08);filter:brightness(1.3)}}@keyframes ringPulse{0%{opacity:0;transform:translateX(-50%) scale(.75)}30%{opacity:.9}100%{opacity:0;transform:translateX(-50%) scale(1.15)}}@keyframes fireFlicker{50%{filter:brightness(1.9)}}.drop-btn.launching{box-shadow:0 0 30px rgba(255,73,43,.38),0 0 70px rgba(255,45,45,.16)}.drop-btn.launching i{animation:launchDot .45s ease-in-out infinite alternate}@keyframes launchDot{to{transform:scale(1.8);box-shadow:0 0 16px #fff,0 0 25px #ff6d2c}}
.path-dot.trail{background:var(--trail-color,#ff7a2d);box-shadow:0 0 8px var(--trail-color,#ff7a2d),0 0 15px var(--trail-color,#ff7a2d)}
@media(max-width:700px){.drop-funnel{top:3px;transform:translateX(-50%) scale(.82);transform-origin:top center}.pegs{top:76px}.board{min-height:520px}.ball{width:23px;height:23px;margin-left:-11.5px}}
@media(max-width:380px){.drop-funnel{transform:translateX(-50%) scale(.72)}.pegs{top:72px}}

/* RC12 visual redesign: integrated Phoenix launcher + play-first layout */
.ambient-bg{background:
 radial-gradient(ellipse at 50% -5%,rgba(255,111,37,.24),transparent 30%),
 radial-gradient(circle at 8% 34%,rgba(255,42,93,.12),transparent 24%),
 radial-gradient(circle at 92% 46%,rgba(106,48,255,.14),transparent 26%),
 radial-gradient(circle at 50% 80%,rgba(255,74,24,.08),transparent 34%),
 linear-gradient(180deg,#13040b 0%,#08030b 42%,#030207 100%)}
.ambient-bg:before{content:"";position:absolute;inset:0;opacity:.22;background-image:radial-gradient(circle at 15% 20%,#ff8b43 0 1px,transparent 1.5px),radial-gradient(circle at 72% 16%,#ffcf75 0 1px,transparent 1.5px),radial-gradient(circle at 84% 74%,#b98cff 0 1px,transparent 1.5px);background-size:170px 210px,230px 270px,310px 330px;animation:starDrift 18s linear infinite}
@keyframes starDrift{to{background-position:60px -160px,-80px 120px,100px -120px}}
.game-card{border-color:rgba(255,157,73,.28);background:linear-gradient(145deg,rgba(255,88,32,.12),rgba(82,41,170,.08) 55%,rgba(255,255,255,.02));box-shadow:0 34px 110px rgba(0,0,0,.66),0 0 70px rgba(255,64,24,.08)}
.board{background:radial-gradient(ellipse at 50% 8%,rgba(255,177,72,.16),transparent 22%),radial-gradient(ellipse at 50% 55%,rgba(255,49,67,.06),transparent 42%),radial-gradient(circle at 10% 80%,rgba(118,50,255,.1),transparent 30%),radial-gradient(circle at 90% 70%,rgba(255,66,29,.08),transparent 30%),linear-gradient(180deg,#190712,#0b0611 58%,#05030a);box-shadow:inset 0 0 120px rgba(255,67,28,.09),inset 0 -80px 110px rgba(80,30,160,.08)}
.board:after{content:"";position:absolute;left:5%;right:5%;bottom:0;height:38%;background:linear-gradient(transparent,rgba(255,80,29,.025));pointer-events:none}
/* Integrated launcher: one solid visual object, not loose decorative shapes */
.phoenix-launcher{position:absolute;z-index:7;left:50%;top:7px;width:142px;height:105px;transform:translateX(-50%);pointer-events:none;filter:drop-shadow(0 10px 24px rgba(0,0,0,.6));}
.launcher-core{position:absolute;left:50%;top:2px;width:54px;height:54px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff8d1 0 7%,#ffd75d 18%,#ff742a 39%,#e52c37 64%,#551027 100%);border:2px solid rgba(255,208,111,.7);box-shadow:0 0 16px #ff6b2c,0 0 38px rgba(255,65,32,.6),inset -8px -8px 15px rgba(60,0,30,.55);animation:launcherPulse 1.3s ease-in-out infinite}
.launcher-core span{position:absolute;left:12px;top:9px;width:13px;height:9px;border-radius:50%;background:#fff;filter:blur(.5px);box-shadow:0 0 10px #fff}
.launcher-mouth{position:absolute;left:50%;top:42px;width:30px;height:48px;transform:translateX(-50%);border-radius:5px 5px 18px 18px;background:linear-gradient(90deg,#2a0a13,#ff5d2c 24%,#ffd36b 50%,#ff4a28 76%,#2a0a13);border:1px solid rgba(255,192,91,.48);box-shadow:inset 0 0 14px rgba(255,245,193,.28),0 0 24px rgba(255,70,30,.45);clip-path:polygon(17% 0,83% 0,100% 100%,0 100%)}
.launcher-wing{position:absolute;top:30px;width:54px;height:48px;background:linear-gradient(145deg,rgba(255,186,80,.95),rgba(213,48,46,.85) 45%,rgba(66,11,35,.95));border:1px solid rgba(255,187,85,.38);box-shadow:0 0 18px rgba(255,73,28,.28);clip-path:polygon(100% 0,70% 28%,52% 42%,35% 100%,0 82%,24% 43%,0 24%,58% 18%)}
.launcher-wing.left{left:0;transform:scaleX(-1) rotate(-5deg)}.launcher-wing.right{right:0;transform:rotate(-5deg)}
.launcher-glow{position:absolute;left:50%;top:54px;width:70px;height:48px;transform:translateX(-50%);background:radial-gradient(ellipse,rgba(255,104,37,.35),transparent 70%);filter:blur(8px)}
@keyframes launcherPulse{50%{transform:translateX(-50%) scale(1.05);filter:brightness(1.18)}}
.pegs{top:105px}.ball{top:84px}
.play-panel{margin-top:10px;padding:10px 12px 12px;border-color:rgba(255,170,85,.28);background:linear-gradient(180deg,rgba(22,9,22,.97),rgba(8,5,13,.97));box-shadow:0 20px 60px rgba(0,0,0,.5),0 0 30px rgba(255,71,29,.05)}
.play-panel .drop-btn{min-height:54px;font-size:14px;letter-spacing:.12em;background:linear-gradient(135deg,#ff3158 0%,#ff6a25 45%,#ffb52e 100%);box-shadow:0 12px 35px rgba(255,67,38,.28),inset 0 1px rgba(255,255,255,.28)}
.play-panel .drop-btn span{position:relative;z-index:2}.play-panel .drop-btn i{z-index:1}
.secondary-panel{margin-top:10px}.settings-panel{margin-top:10px}
.history{min-height:0}
@media(max-width:700px){.phoenix-launcher{top:5px;transform:translateX(-50%) scale(.82);transform-origin:top center}.pegs{top:82px}.ball{top:64px}.game-card{padding:4px}.play-panel{margin-top:8px;padding:9px}.play-panel .drop-btn{grid-column:1/-1;min-height:54px}.bet-row{grid-template-columns:1fr 1fr}.quick-list{grid-column:1/-1;grid-row:2}.bet-input{grid-column:1/-1}.secondary-panel{padding:12px}.intro{margin-bottom:10px}}
@media(max-width:380px){.phoenix-launcher{transform:translateX(-50%) scale(.72)}.pegs{top:78px}.ball{top:60px}}

/* RC13 — darker realistic launcher, richer fire chamber, particle-first ball FX */
.ambient-bg{
  background:
    radial-gradient(ellipse at 50% 0%,rgba(255,87,28,.18),transparent 24%),
    radial-gradient(ellipse at 7% 38%,rgba(151,24,49,.13),transparent 27%),
    radial-gradient(ellipse at 94% 54%,rgba(70,32,126,.14),transparent 28%),
    radial-gradient(ellipse at 50% 100%,rgba(255,62,18,.09),transparent 35%),
    repeating-linear-gradient(115deg,rgba(255,255,255,.012) 0 1px,transparent 1px 70px),
    linear-gradient(180deg,#10050c 0%,#07040b 45%,#020205 100%);
}
.ambient-bg:before{
  opacity:.30;
  background-image:
    radial-gradient(circle at 15% 20%,rgba(255,157,72,.75) 0 1px,transparent 1.6px),
    radial-gradient(circle at 72% 16%,rgba(255,218,139,.65) 0 1px,transparent 1.7px),
    radial-gradient(circle at 84% 74%,rgba(174,129,255,.55) 0 1px,transparent 1.7px),
    radial-gradient(ellipse at 50% 44%,rgba(255,72,28,.07),transparent 42%);
  background-size:170px 210px,230px 270px,310px 330px,100% 100%;
}
.ambient-bg:after{
  background:
    linear-gradient(90deg,rgba(0,0,0,.42),transparent 20%,transparent 80%,rgba(0,0,0,.48)),
    linear-gradient(180deg,transparent 0 70%,rgba(255,72,25,.035) 100%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0 1px,transparent 1px 5px);
  mix-blend-mode:screen;
}
.game-card{
  border-color:rgba(255,144,65,.34);
  background:linear-gradient(145deg,rgba(255,71,26,.10),rgba(34,13,42,.10) 48%,rgba(63,35,116,.08));
  box-shadow:0 34px 110px rgba(0,0,0,.72),0 0 85px rgba(255,57,21,.065),inset 0 1px rgba(255,189,104,.08);
}
.board{
  background:
    radial-gradient(ellipse at 50% 3%,rgba(255,188,93,.11),transparent 17%),
    radial-gradient(ellipse at 50% 17%,rgba(255,73,28,.08),transparent 31%),
    radial-gradient(ellipse at 15% 55%,rgba(117,24,44,.14),transparent 34%),
    radial-gradient(ellipse at 86% 58%,rgba(63,29,110,.13),transparent 35%),
    radial-gradient(ellipse at 50% 88%,rgba(255,53,19,.055),transparent 28%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.008) 0 1px,transparent 1px 42px),
    linear-gradient(180deg,#180710 0%,#100711 48%,#07040b 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,191,106,.035),
    inset 0 0 120px rgba(0,0,0,.72),
    inset 0 40px 80px rgba(255,62,23,.035),
    inset 0 -90px 100px rgba(43,18,84,.09);
}
.board:before{
  inset:0;
  left:0;
  top:0;
  width:auto;
  height:auto;
  transform:none;
  filter:none;
  background:
    radial-gradient(ellipse at 50% 8%,rgba(255,133,55,.10),transparent 19%),
    radial-gradient(ellipse at 8% 54%,rgba(255,58,29,.055),transparent 24%),
    radial-gradient(ellipse at 92% 58%,rgba(111,66,206,.06),transparent 25%),
    linear-gradient(90deg,rgba(0,0,0,.30),transparent 18%,transparent 82%,rgba(0,0,0,.34));
  pointer-events:none;
  z-index:0;
}
.board:after{
  left:0;
  right:0;
  bottom:0;
  height:100%;
  background:
    linear-gradient(180deg,transparent 0 68%,rgba(0,0,0,.12) 78%,rgba(0,0,0,.44) 100%),
    repeating-linear-gradient(112deg,transparent 0 58px,rgba(255,95,36,.018) 59px 60px,transparent 61px 120px);
  opacity:.85;
  z-index:0;
}
.board-sun{width:220px;height:150px;top:0;background:radial-gradient(ellipse,rgba(255,155,72,.09),rgba(255,68,28,.035) 36%,transparent 72%);filter:blur(12px);opacity:.75;z-index:0}
.glow{width:70%;height:60%;left:15%;top:4%;background:radial-gradient(ellipse at 50% 18%,rgba(255,93,35,.07),transparent 35%),radial-gradient(ellipse at 50% 60%,rgba(119,39,157,.045),transparent 65%);filter:blur(18px);z-index:0}

/* Premium drop funnel — glass, brushed metal and a warm core. */
.drop-funnel{
  position:absolute; z-index:4; left:50%; top:5px;
  width:150px; height:112px; transform:translateX(-50%);
  pointer-events:none; filter:drop-shadow(0 16px 24px rgba(0,0,0,.72));
}
.funnel-aura{
  position:absolute; left:50%; top:-14px; width:92px; height:74px;
  transform:translateX(-50%); border-radius:50%;
  background:radial-gradient(ellipse,rgba(255,177,82,.24),rgba(255,73,30,.08) 42%,transparent 72%);
  filter:blur(13px); animation:funnelAura 1.7s ease-in-out infinite alternate;
}
.funnel-lip{
  position:absolute; left:50%; top:0; width:94px; height:25px;
  transform:translateX(-50%); border-radius:50%;
  background:linear-gradient(180deg,#f8e2c3,#8b766d 23%,#2a2027 47%,#0b090e 72%,#5c4038);
  border:1px solid rgba(255,225,186,.46);
  box-shadow:inset 0 2px 2px rgba(255,255,255,.5),0 5px 12px rgba(0,0,0,.6);
}
.funnel-lip:before{
  content:""; position:absolute; left:50%; top:5px; width:68px; height:14px;
  transform:translateX(-50%); border-radius:50%;
  background:radial-gradient(ellipse at 50% 50%,#020205 0 43%,#21151a 55%,#8a3d2d 70%,#170a0d 78%);
  box-shadow:inset 0 1px 5px rgba(0,0,0,.95),0 0 12px rgba(255,75,28,.2);
}
.funnel-lip span{
  position:absolute; left:20px; top:6px; width:25px; height:3px; border-radius:50%;
  background:rgba(255,255,255,.55); filter:blur(1px); transform:rotate(-8deg);
}
.funnel-bowl{
  position:absolute; left:50%; top:13px; width:108px; height:66px;
  transform:translateX(-50%);
  clip-path:polygon(7% 0,93% 0,74% 74%,62% 100%,38% 100%,26% 74%);
  background:
    linear-gradient(105deg,rgba(255,255,255,.28) 0 4%,transparent 12% 82%,rgba(255,180,100,.16) 90%),
    linear-gradient(180deg,rgba(74,35,43,.96),rgba(21,15,23,.98) 55%,rgba(78,30,25,.98));
  border:1px solid rgba(255,187,120,.28);
  box-shadow:inset 0 0 20px rgba(255,111,50,.16),inset 0 -16px 22px rgba(0,0,0,.55);
}
.funnel-bowl:before{
  content:""; position:absolute; inset:2px;
  clip-path:inherit;
  background:linear-gradient(110deg,rgba(255,255,255,.12),transparent 22%,transparent 72%,rgba(255,125,55,.10));
}
.funnel-highlight{
  position:absolute; left:17px; top:8px; width:8px; height:42px;
  border-radius:50%; background:linear-gradient(180deg,rgba(255,255,255,.48),transparent);
  filter:blur(1px); transform:rotate(14deg);
}
.funnel-inner{
  position:absolute; left:50%; bottom:2px; width:38px; height:28px;
  transform:translateX(-50%); border-radius:50%;
  background:radial-gradient(ellipse,#030206 0 36%,#37151a 54%,#ff5a28 67%,transparent 72%);
  box-shadow:0 0 17px rgba(255,65,28,.32);
}
.funnel-throat{
  position:absolute; left:50%; top:62px; width:31px; height:51px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,#160b10,#8b3427 28%,#f0a052 48%,#3e171a 66%,#10090d);
  clip-path:polygon(18% 0,82% 0,100% 100%,0 100%);
  border-left:1px solid rgba(255,199,126,.32); border-right:1px solid rgba(255,112,52,.22);
  box-shadow:inset 0 0 11px rgba(0,0,0,.72),0 8px 14px rgba(0,0,0,.5);
}
.funnel-throat span{
  position:absolute; left:50%; bottom:0; width:13px; height:12px;
  transform:translateX(-50%); border-radius:50%;
  background:radial-gradient(circle,#fff1b0 0 14%,#ff9a35 36%,#ff342c 64%,transparent 72%);
  box-shadow:0 0 13px #ff6b2a,0 0 28px rgba(255,57,35,.6);
  animation:throatPulse .72s ease-in-out infinite alternate;
}
.funnel-ring{
  position:absolute; left:50%; border-radius:50%;
  border:1px solid rgba(255,187,104,.34); transform:translateX(-50%);
  animation:funnelRing 2.1s ease-out infinite;
}
.funnel-ring.ring-a{top:19px;width:116px;height:31px}
.funnel-ring.ring-b{top:30px;width:138px;height:38px;animation-delay:1.05s}
@keyframes funnelAura{to{transform:translateX(-50%) scale(1.13);opacity:.68}}
@keyframes throatPulse{to{transform:translateX(-50%) scale(1.24);filter:brightness(1.35)}}
@keyframes funnelRing{0%{opacity:0;transform:translateX(-50%) scale(.82)}18%{opacity:.7}100%{opacity:0;transform:translateX(-50%) scale(1.12)}}

/* Premium fire-gem balls: layered glass, specular highlight and animated tail. */
.ball{
  width:24px;height:24px;margin-left:-12px;
  background:
    radial-gradient(circle at 29% 20%,#fff 0 5%,var(--core) 9%,transparent 16%),
    radial-gradient(circle at 35% 30%,#fff6cf 0 9%,var(--mid) 28%,var(--edge) 64%,#15050d 100%);
  border:1px solid rgba(255,255,255,.24);
  box-shadow:
    inset 2px 2px 3px rgba(255,255,255,.55),
    inset -5px -6px 9px rgba(10,0,20,.48),
    0 2px 5px rgba(0,0,0,.65),
    0 0 12px var(--glow),
    0 0 28px color-mix(in srgb,var(--glow),transparent 28%);
}
.ball:before{
  width:7px;height:4px;left:4px;top:3px;border-radius:50%;
  background:rgba(255,255,255,.96);box-shadow:0 0 7px var(--core);
  transform:rotate(-20deg);
}
.ball:after{
  content:""; position:absolute; left:50%; top:calc(100% - 1px);
  width:10px;height:22px; transform:translateX(-50%);
  border:0; border-radius:50%;
  background:linear-gradient(180deg,color-mix(in srgb,var(--mid),transparent 8%),color-mix(in srgb,var(--edge),transparent 48%),transparent);
  clip-path:polygon(50% 0,92% 27%,69% 54%,82% 100%,50% 74%,18% 100%,31% 54%,8% 27%);
  box-shadow:none; opacity:.62; animation:ballTail .2s ease-in-out infinite alternate;
}
@keyframes ballTail{to{transform:translateX(-50%) scaleY(1.4) scaleX(.78);opacity:.32}}
.ball.impact{animation:ballImpact .24s ease-out,fireFlicker .11s linear 2}
@keyframes ballImpact{0%{filter:brightness(1);transform:translate(-50%,-50%) scale(1)}
35%{filter:brightness(1.8);transform:translate(-50%,-50%) scale(1.28,.78)}
100%{filter:brightness(1);transform:translate(-50%,-50%) scale(1)}}
@keyframes fireFlicker{50%{filter:brightness(2.1) saturate(1.25)}}

/* Falling ash / sparks replace the heavy glow trail. */
.path-dot.trail{width:3px;height:3px;border-radius:1px;background:var(--trail-color,#ff8a32);box-shadow:none;opacity:.82;animation:trailfade .42s ease-out forwards}
.ash-particle,.spark-particle{
  position:absolute;left:0;top:0;width:3px;height:5px;pointer-events:none;z-index:4;opacity:.9;
  background:var(--particle,#ff9a38);border-radius:1px;box-shadow:0 1px 2px rgba(0,0,0,.5);
  animation:ashFall var(--particle-time,.65s) cubic-bezier(.18,.72,.34,1) forwards;
}
.spark-particle{width:2px;height:6px;border-radius:50%;animation:sparkFly var(--particle-time,.48s) ease-out forwards;transform:rotate(var(--particle-rot,0deg))}
@keyframes ashFall{0%{opacity:0;transform:translate(0,0) rotate(0) scale(.7)}15%{opacity:.9}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--particle-rot,70deg)) scale(.25)}}
@keyframes sparkFly{0%{opacity:0;transform:translate(0,0) rotate(var(--particle-rot,0deg)) scale(.6)}18%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(calc(var(--particle-rot,0deg) + 140deg)) scale(.15)}}
.impact-ring{width:5px;height:5px;border-color:rgba(255,181,88,.55);animation:impactRing .34s ease-out forwards}
@keyframes impactRing{0%{opacity:.7;transform:translate(-50%,-50%) scale(.7)}100%{opacity:0;transform:translate(-50%,-50%) scale(2.1)}}
.slot-impact{width:10px;height:10px;border:1px solid rgba(255,194,88,.72);box-shadow:none;animation:slotImpact .48s ease-out forwards}
@keyframes slotImpact{0%{opacity:0;transform:translate(-50%,-50%) scale(.45)}18%{opacity:.8;transform:translate(-50%,-50%) scale(.85)}100%{opacity:0;transform:translate(-50%,-50%) scale(2.5)}}

/* More dimensional pegs and multiplier tray. */
.peg{width:8px;height:8px;background:radial-gradient(circle at 30% 25%,#fff 0 9%,#e9d8bf 18%,#9a8072 42%,#3a2b31 70%,#0d0a10 100%);box-shadow:inset -1px -1px 2px rgba(0,0,0,.7),0 2px 4px rgba(0,0,0,.55)}
.bin{background:linear-gradient(180deg,#19101d,#0b080e);border-color:rgba(151,105,74,.35);box-shadow:inset 0 8px 14px rgba(0,0,0,.42),inset 0 -1px rgba(255,185,88,.05)}
.bin.hot{border-color:rgba(206,151,76,.62);box-shadow:inset 0 0 20px rgba(159,53,25,.12),0 0 8px rgba(255,112,37,.05)}


@media(max-width:700px){
  .drop-funnel{top:4px;transform:translateX(-50%) scale(.82);transform-origin:top center}
  .pegs{top:82px}.ball{top:64px;width:22px;height:22px;margin-left:-11px}
}
@media(max-width:380px){
  .drop-funnel{transform:translateX(-50%) scale(.72)}
  .pegs{top:78px}.ball{top:60px;width:21px;height:21px;margin-left:-10.5px}
}

/* FINAL: one simple dark round hopper, flush against the back wall. */
.phoenix-launcher{display:none!important}
.drop-funnel{position:absolute;z-index:6;left:50%;top:7px;width:82px;height:82px;transform:translateX(-50%);pointer-events:none;filter:drop-shadow(0 7px 11px rgba(0,0,0,.72))}
.funnel-outer{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 38% 30%,#2b2e35 0,#17191f 35%,#0b0c11 67%,#030408 100%);border:1px solid #30333b;box-shadow:inset 0 2px 3px rgba(255,255,255,.10),inset 0 -9px 14px rgba(0,0,0,.9),0 4px 8px rgba(0,0,0,.6)}
.funnel-outer:after{content:"";position:absolute;inset:7px;border-radius:50%;border:1px solid rgba(255,255,255,.035);box-shadow:inset 0 0 10px rgba(0,0,0,.9)}
.funnel-bowl{position:absolute;left:50%;top:16px;width:50px;height:50px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle at 45% 36%,#111318 0,#08090d 55%,#020306 100%);box-shadow:inset 0 5px 10px rgba(0,0,0,.85),0 1px 2px rgba(255,255,255,.04)}
.funnel-hole{position:absolute;z-index:2;left:50%;top:30px;width:20px;height:20px;transform:translateX(-50%);border-radius:50%;background:#000;box-shadow:inset 0 0 7px #000,0 0 0 1px rgba(255,255,255,.025)}
.funnel-neck{position:absolute;left:50%;top:47px;width:14px;height:27px;transform:translateX(-50%);border-radius:0 0 7px 7px;background:linear-gradient(90deg,#030408,#15171d 42%,#030408);box-shadow:inset 0 0 5px #000}
.funnel-neck:after{content:"";position:absolute;left:50%;bottom:0;width:10px;height:5px;transform:translateX(-50%);border-radius:50%;background:#000}
.pegs{top:76px}
.ball{top:4px;width:19px;height:19px;margin-left:-9.5px;border-radius:50%;z-index:8;transition:none}
.ball:after{inset:-3px;border:0;background:radial-gradient(circle,transparent 47%,color-mix(in srgb,var(--glow),transparent 76%) 70%,transparent 77%);box-shadow:none;animation:ballAura .8s ease-in-out infinite alternate}
.ball:before{width:5px;height:3px;left:4px;top:3px;box-shadow:0 0 6px #fff}
@keyframes ballAura{to{opacity:.42;transform:scale(1.1)}}
.ball.impact{animation:ballImpactFinal .2s cubic-bezier(.2,.8,.25,1)}
@keyframes ballImpactFinal{0%{transform:translate(-50%,-50%) scale(1)}30%{transform:translate(-50%,-50%) scale(1.13,.87);filter:brightness(1.28)}62%{transform:translate(-50%,-50%) scale(.95,1.05)}100%{transform:translate(-50%,-50%) scale(1)}}
@media(max-width:700px){.drop-funnel{top:5px;transform:translateX(-50%) scale(.9);transform-origin:top center}.pegs{top:76px}.ball{top:4px;width:18px;height:18px;margin-left:-9px}}
@media(max-width:380px){.drop-funnel{transform:translateX(-50%) scale(.82)}.pegs{top:72px}}

/* FINAL FUNNEL — one small dark circular cell, integrated with the board. */
.drop-funnel{
  position:absolute;
  z-index:4;
  left:50%;
  top:10px;
  width:42px;
  height:42px;
  transform:translateX(-50%);
  pointer-events:none;
  filter:none;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 48%, #020205 0 31%, #08080d 32% 53%, #15151c 54% 73%, #08080d 74% 100%);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:
    inset 0 2px 3px rgba(255,255,255,.10),
    inset 0 -4px 8px rgba(0,0,0,.72),
    0 2px 5px rgba(0,0,0,.45);
  overflow:hidden;
}
.drop-funnel::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:28px;
  height:28px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:#020205;
  box-shadow:
    inset 0 2px 4px rgba(0,0,0,.95),
    0 0 0 1px rgba(255,255,255,.035);
}
.drop-funnel::after{
  content:"";
  position:absolute;
  left:50%;
  top:7px;
  width:18px;
  height:5px;
  transform:translateX(-50%);
  border-radius:50%;
  background:rgba(255,255,255,.075);
  filter:blur(1px);
}
.drop-funnel .funnel-cell{display:none}

/* Keep the existing fireball animation untouched; only tune its launch position. */
.ball{
  top:28px;
}
@media(max-width:700px){
  .drop-funnel{top:9px;width:40px;height:40px}
  .ball{top:27px}
}
@media(max-width:380px){
  .drop-funnel{top:8px;width:38px;height:38px}
  .ball{top:26px}
}