.roulette-game { text-align:center; padding:18px 14px 30px; border-radius:0 0 13px 13px; background-color:#c79ac8; background-image:radial-gradient(circle at 20% 30%,rgba(255,255,255,.22) 0 1px,transparent 2px),radial-gradient(circle at 70% 60%,rgba(86,34,88,.16) 0 1px,transparent 2px),linear-gradient(135deg,rgba(255,255,255,.14),rgba(87,38,91,.1)); background-size:17px 17px,21px 21px,100% 100%; }
.roulette-intro { max-width:620px; margin:0 auto 18px; }
.roulette-player-row { margin:16px auto; }
.roulette-player-row label { display:block; color:#000; font-weight:bold; margin-bottom:6px; text-shadow:0 1px 0 rgba(255,255,255,.45); }
.roulette-player-row input { width:250px; padding:9px 12px; border:2px solid #52ceff; border-radius:8px; background:#0f1f35; color:#fff; text-align:center; }
.roulette-machine { display:flex; align-items:center; justify-content:center; gap:24px; max-width:680px; margin:18px auto 24px; }
.roulette-control-panel { position:relative; box-sizing:border-box; width:210px; min-width:210px; padding:48px 16px 18px; border:4px solid #9d6d04; border-radius:25px 25px 14px 14px; background:linear-gradient(145deg,#ffd91f,#c99500 65%,#eebd08); box-shadow:inset 0 0 0 3px #fff06b,0 8px 15px rgba(61,25,66,.45); }
.roulette-control-panel::before { content:'★'; position:absolute; top:-27px; left:50%; width:48px; height:48px; margin-left:-24px; border:4px solid #9d6d04; border-radius:50%; color:#8d6200; background:linear-gradient(#fff479,#e5aa00); font:bold 31px/48px Arial; text-shadow:0 1px #fff; }
.roulette-panel-title { margin:0 0 12px; color:#fff9bd; font:bold 20px Arial; text-transform:uppercase; text-shadow:0 2px 1px #8b6200; }
.roulette-prize-window { display:flex; align-items:center; justify-content:center; box-sizing:border-box; min-height:128px; padding:12px; border:4px solid #a77708; border-radius:12px; background:repeating-conic-gradient(from 0deg at 50% 50%,#4e2347 0 10deg,#612b58 10deg 20deg); box-shadow:inset 0 0 16px rgba(0,0,0,.6); }
.roulette-panel-prize { color:#fff; font:bold 19px/1.22 Arial; text-shadow:2px 2px 0 #c528a3,-1px -1px 0 #c528a3; }
.roulette-stage { position:relative; width:430px; height:430px; margin:0; border-radius:50%; background:radial-gradient(circle,#ffe45c 0 55%,#b47200 58% 100%); box-shadow:0 12px 28px rgba(66,25,64,.55); }
.roulette-pointer { position:absolute; z-index:8; top:190px; left:-17px; width:0; height:0; border-top:25px solid transparent; border-bottom:25px solid transparent; border-left:47px solid #fff7bd; filter:drop-shadow(2px 3px 2px rgba(0,0,0,.65)); }
.roulette-pointer::after { content:''; position:absolute; top:-18px; left:-42px; width:0; height:0; border-top:18px solid transparent; border-bottom:18px solid transparent; border-left:35px solid #ef2634; }
.roulette-wheel { position:absolute; inset:15px; border-radius:50%; border:13px solid #e9b51d; box-shadow:0 0 0 5px #8d5c00,inset 0 0 32px rgba(0,0,0,.42),0 0 0 9px #f4d239; transition:transform 5s cubic-bezier(.12,.68,.08,1); overflow:hidden; }
.roulette-wheel::before { content:''; position:absolute; inset:5px; z-index:1; border:1px solid rgba(255,255,255,.35); border-radius:50%; pointer-events:none; }
.roulette-wheel::after { content:'★'; position:absolute; z-index:4; left:50%; top:50%; width:82px; height:82px; margin:-47px; border-radius:50%; background:radial-gradient(circle at 35% 30%,#fff36b,#d49b00 68%); border:6px solid #fff1a0; color:#8d6100; font:bold 52px/82px Arial; text-shadow:0 2px #fff; box-shadow:0 3px 12px #5b3300; }
.roulette-label { position:absolute; z-index:3; left:50%; top:50%; display:flex; flex-direction:row; align-items:center; justify-content:flex-start; gap:4px; box-sizing:border-box; width:104px; min-height:30px; margin-left:-52px; margin-top:-15px; padding:2px; color:#fff; text-align:left; text-shadow:1px 1px 0 #2b001f,-1px -1px 0 #2b001f,1px -1px 0 #2b001f,-1px 1px 0 #2b001f; transform-origin:52px 15px; }
.roulette-segment-icon { display:block; flex:0 0 25px; width:25px; height:25px; margin:0; object-fit:contain; filter:drop-shadow(0 1px 1px rgba(0,0,0,.8)); }
.roulette-segment-none { box-sizing:border-box; border:2px solid #fff; border-radius:50%; color:#fff; background:rgba(93,101,112,.55); font:bold 21px/21px Arial; }
.roulette-segment-text { display:block; flex:1 1 auto; width:auto; font:bold 10px/11px Arial; letter-spacing:.15px; white-space:nowrap; }
.roulette-spin { width:100%; min-width:0; margin-top:14px; padding:12px 10px; border:2px solid #e4ff9d; border-radius:10px; color:#3f8b00; background:linear-gradient(#caff45,#85e911); font:bold 22px Arial; cursor:pointer; text-shadow:0 1px #fff; box-shadow:0 4px 0 #4f9d07,0 5px 9px rgba(0,0,0,.35); }
.roulette-spin:hover { background:linear-gradient(#ddff70,#99f226); }
.roulette-spin:disabled { cursor:not-allowed; opacity:.55; filter:grayscale(.4); }
.roulette-status { color:#ffd34d; font-weight:bold; margin:13px 0; }
.roulette-status-error { color:#ff8d8d; }
.roulette-result { max-width:500px; margin:20px auto 0; padding:18px; border:2px solid #ffd34d; border-radius:12px; background:rgba(15,31,53,.92); color:#fff; }
.roulette-result h3 { color:#ffd34d !important; margin-top:0 !important; }
.roulette-prize { display:block; margin:8px 0 14px; color:#52ceff; font-size:25px; font-weight:bold; }
.roulette-prize-none { color:#c6ccd3; }
.roulette-code { display:inline-block; padding:8px 10px; margin:5px; border:1px dashed #fff; background:#091525; font-family:monospace; user-select:all; }
.roulette-copy { padding:7px 10px; border:0; border-radius:5px; cursor:pointer; }
.roulette-note { margin-top:12px; color:#ccd7e5; font-size:12px; }
#roulette-claim, #roulette-claim p, #roulette-claim .roulette-code, #roulette-claim .roulette-note { color:#fff !important; }
#roulette-claim .roulette-contact-link { color:#ffd34d !important; font-weight:bold; text-decoration:underline; }
#roulette-claim .roulette-contact-link:hover { color:#fff2a5 !important; }
#roulette-claim .roulette-copy { color:#fff; background:#b31420; border:1px solid #ffd34d; }
@media (max-width:760px) { .roulette-machine { flex-direction:column-reverse; gap:16px; } .roulette-stage { transform:scale(.78); margin:-45px auto; } .roulette-control-panel { width:270px; } .roulette-player-row input { width:210px; } }
