/* WIND GAME group 3 (2026-10-20): Колесо (pick), Рулетка, Лесенка.
   Layered on coinflip-w.css (shell, header, panel, stakes, play button).
   Pages carry html.gl-native: game-light.css skips its inversion and the light
   theme comes from the html[data-theme=light] rules at the end of this file. */
:root{--g3-red:#e0393e;--g3-black:var(--wg-s2);--g3-green:var(--wg-accent-lo);--g3-panel:var(--wg-s3);--g3-cell:var(--wg-accent-deep);--g3-cell-line:var(--wg-accent);--g3-chip:#f4ce73}
.g3-game .stage{min-height:560px;isolation:isolate}
/* Stage background: spotlight + slow light rays behind the wheel / ladder. */
.g3-backdrop{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  background:radial-gradient(circle at 50% 42%,var(--wg-accent-lo) 0,var(--wg-s4) 30%,var(--wg-s3) 58%,var(--wg-s1) 100%)}
.g3-backdrop::before{content:"";position:absolute;left:50%;top:42%;width:170%;aspect-ratio:1;transform:translate(-50%,-50%);
  background:repeating-conic-gradient(from 0deg,#ffffff12 0 6deg,#ffffff00 6deg 18deg);
  -webkit-mask:radial-gradient(closest-side,#000 18%,#0000 70%);mask:radial-gradient(closest-side,#000 18%,#0000 70%);
  animation:g3-rays 60s linear infinite}
.g3-backdrop::after{content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 18% 88%,#f4ce7330 0,#0000 26%),radial-gradient(circle at 84% 14%,color-mix(in srgb,var(--wg-accent) 18.8%,transparent) 0,#0000 30%),
    radial-gradient(1.5px 1.5px at 12% 22%,#fff9 50%,#0000 51%),radial-gradient(1.5px 1.5px at 77% 70%,#fff8 50%,#0000 51%),
    radial-gradient(1.2px 1.2px at 64% 18%,#fff7 50%,#0000 51%),radial-gradient(1.2px 1.2px at 30% 76%,#fff6 50%,#0000 51%),
    radial-gradient(1px 1px at 90% 44%,#fff7 50%,#0000 51%),radial-gradient(1px 1px at 8% 56%,#fff6 50%,#0000 51%)}
@keyframes g3-rays{to{transform:translate(-50%,-50%) rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.g3-backdrop::before{animation:none}}
.g3-stage-inner{position:relative;z-index:1;width:100%;display:grid;place-items:center;padding:18px 0 96px}
/* Art wheel (visual of the 2026-10-15 wheel: raster rim, hub and pointer). */
.g3-wheel{position:relative;width:min(88%,500px);aspect-ratio:1230/1278;isolation:isolate}
.g3-wheel::before{content:"";position:absolute;inset:auto 6% -1.5% 6%;height:7%;border-radius:50%;background:radial-gradient(closest-side,#000b,#0000);filter:blur(3px);z-index:0}
.g3-wheel::after{content:"";position:absolute;left:4%;right:4%;top:0;bottom:12%;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--wg-accent) 33.3%,transparent),color-mix(in srgb,var(--wg-accent) 0%,transparent));z-index:0;pointer-events:none}
.g3-wheel svg.g3-face{position:absolute;z-index:1;left:10.6557%;top:4.3478%;width:86.8187%;height:83.5579%;overflow:hidden;border-radius:50%;
  transform:matrix(.907612,.048002,.048002,.97506,0,0);transform-origin:50% 50%}
.g3-rotor{transform-origin:300px 300px;transform-box:view-box;will-change:transform}
.g3-wheel text{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:900;letter-spacing:-.02em}
.wg-wheel-rim,.wg-wheel-hub,.wg-wheel-pointer{position:absolute;background:center/100% 100% no-repeat;pointer-events:none}
.wg-wheel-rim{z-index:2;inset:0;background-image:url("/assets/art-wheel/wheel-rim.webp");filter:drop-shadow(0 18px 22px #0008)}
.wg-wheel-hub{z-index:3;left:45.6098%;top:37.011%;width:16.9106%;height:18.1534%;background-image:url("/assets/art-wheel/wheel-hub.webp");filter:drop-shadow(0 4px 6px #0009)}
.wg-wheel-pointer{z-index:4;left:44.878%;top:.626%;width:15.6098%;height:16.5884%;background-image:url("/assets/art-wheel/wheel-pointer.webp");filter:drop-shadow(0 5px 6px #000a) drop-shadow(0 0 10px color-mix(in srgb,var(--wg-accent-hi) 33.3%,transparent))}
.g3-wheel.win .wg-wheel-pointer{animation:g3-pulse .9s ease-in-out 3}
@keyframes g3-pulse{50%{filter:drop-shadow(0 5px 6px #000a) drop-shadow(0 0 22px #ffe08a)}}
.stage-caption{z-index:2}
.stage-caption strong{font-size:clamp(22px,3vw,30px)}
/* Bet board */
.g3-board{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0 6px}
.g3-board.three{grid-template-columns:1fr 1fr 1fr}
.g3-bet{position:relative;display:grid;gap:2px;justify-items:start;text-align:left;min-height:74px;padding:10px 12px;border-radius:16px;
  border:1px solid var(--g3-cell-line);background:linear-gradient(160deg,var(--wg-s4),var(--wg-s3));color:var(--wg-text-tint);transition:transform .12s,box-shadow .2s,border-color .2s}
.g3-bet:hover:not(:disabled){transform:translateY(-1px);border-color:var(--wg-accent-hi)}
.g3-bet b{font-size:22px;letter-spacing:-.03em;line-height:1}
.g3-bet small{color:var(--wg-text-tint);font-size:12px;font-weight:650}
.g3-bet .g3-amt{position:absolute;right:8px;top:8px;min-width:30px;padding:3px 8px;border-radius:999px;background:var(--g3-chip);color:#2a1a02;font-size:12px;font-weight:900;text-align:center;box-shadow:0 2px 0 #9c7426,0 4px 10px #0007}
.g3-bet .g3-amt:empty{display:none}
.g3-bet.has-bet{border-color:var(--g3-chip);box-shadow:0 0 0 2px #f4ce7355 inset,0 8px 22px #0006}
.g3-bet.won{border-color:#9ff27a;box-shadow:0 0 0 2px #9ff27a inset,0 0 26px #9ff27a55}
.g3-bet.lost{opacity:.62}
.g3-bet[data-tone="empty"]{background:linear-gradient(160deg,var(--wg-s4),var(--wg-s2))}
.g3-bet[data-tone="x2"]{background:linear-gradient(160deg,var(--wg-accent-lo),var(--wg-s5))}
.g3-bet[data-tone="x3"]{background:linear-gradient(160deg,var(--wg-accent-deep),var(--wg-s4))}
.g3-bet[data-tone="x5"]{background:linear-gradient(160deg,var(--wg-accent),var(--wg-accent-deep))}
.g3-bet[data-tone="x10"]{background:linear-gradient(160deg,#d9a531,#7b5410)}
.g3-bet[data-tone="x50"]{background:linear-gradient(160deg,#e2463c,#7a1714)}
.g3-bet[data-tone="red"]{background:linear-gradient(160deg,#e0393e,#7f1418)}
.g3-bet[data-tone="black"]{background:linear-gradient(160deg,var(--wg-s4),var(--wg-s1))}
.g3-bet[data-tone="zero"]{background:linear-gradient(160deg,#22a55c,#0b5a2d)}
.g3-row{display:flex;gap:8px;align-items:center;justify-content:space-between;margin:6px 0}
.g3-row .ghost{border:1px solid var(--wg-accent);background:var(--wg-s3);color:var(--wg-text-tint);border-radius:12px;padding:8px 12px;font-size:13px;font-weight:750}
.g3-total{font-variant-numeric:tabular-nums;color:var(--wg-text-tint);font-size:14px}
.g3-total b{color:#fff}
/* History strip */
.g3-history{display:flex;gap:6px;flex-wrap:wrap;align-items:center;min-height:30px;margin:4px 0 0}
.g3-history span{min-width:30px;height:28px;padding:0 8px;border-radius:9px;display:inline-grid;place-items:center;font-size:12px;font-weight:900;color:#fff;border:1px solid #ffffff22}
.g3-history em{font-style:normal;color:var(--wg-text-tint);font-size:12px;margin-right:4px}
/* Odds table */
.g3-odds{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.g3-odds th,.g3-odds td{text-align:left;padding:7px 9px;border-bottom:1px solid var(--wg-accent-lo);font-size:14px}
.g3-odds th{color:var(--wg-text-tint);font-size:12px}
.g3-odds td:first-child{font-weight:850;color:#f4ce73}
.g3-math{color:var(--wg-text-tint);font-size:14px;line-height:1.55}
.g3-math code{font-size:13px;background:#ffffff14;padding:1px 5px;border-radius:6px}
.swatch{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:-1px;border:1px solid #fff4}
/* Roulette wheel */
.g3-roulette{position:relative;width:min(84%,470px);aspect-ratio:1}
.g3-roulette svg{width:100%;height:100%;display:block;filter:drop-shadow(0 24px 34px #000b)}
.g3-ball{transform-origin:300px 300px;transform-box:view-box;will-change:transform}
.g3-roulette .g3-marker{position:absolute;left:50%;top:-6px;transform:translateX(-50%);width:0;height:0;border-left:13px solid transparent;border-right:13px solid transparent;border-top:28px solid #fff3c4;filter:drop-shadow(0 4px 6px #0009);z-index:2}
/* Ladder */
.g3-ladder{position:relative;width:min(94%,560px);display:grid;gap:7px;padding:16px 14px;border-radius:24px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--wg-s3) 66.7%,transparent),color-mix(in srgb,var(--wg-s2) 80%,transparent));border:1px solid color-mix(in srgb,var(--wg-accent) 40%,transparent);box-shadow:0 24px 50px #0009,inset 0 0 40px color-mix(in srgb,var(--wg-accent-hi) 10.2%,transparent)}
.g3-step{display:grid;grid-template-columns:64px repeat(8,minmax(0,1fr));gap:6px;align-items:center}
.g3-step .g3-mult{font-size:13px;font-weight:900;color:var(--wg-text-tint);text-align:right;padding-right:6px;font-variant-numeric:tabular-nums}
.g3-step.current .g3-mult{color:#ffe08a}
.g3-step.passed .g3-mult{color:var(--wg-text-tint)}
.g3-step.locked{opacity:.32}
.g3-cell{aspect-ratio:1.25;border-radius:11px;border:1px solid var(--wg-accent);background:linear-gradient(160deg,var(--wg-s5),var(--wg-s3));display:grid;place-items:center;font-size:18px;color:#fff;padding:0;transition:transform .12s,background .2s,box-shadow .2s}
.g3-step.current .g3-cell:not(:disabled){border-color:#ffe08a;box-shadow:0 0 0 1px #ffe08a55 inset,0 0 16px #ffe08a33;cursor:pointer}
.g3-step.current .g3-cell:not(:disabled):hover{transform:translateY(-2px);background:linear-gradient(160deg,var(--wg-accent-deep),var(--wg-s4))}
.g3-cell:disabled{opacity:1;cursor:default}
.g3-cell.safe{background:linear-gradient(160deg,var(--wg-accent-deep),var(--wg-s4));border-color:var(--wg-accent-hi)}
.g3-cell.pick{box-shadow:0 0 0 2px #ffe08a inset}
.g3-cell.stone{background:radial-gradient(circle at 40% 35%,#8a8f98,#3d434c 60%,var(--wg-s3));border-color:#6b7280}
.g3-cell.hit{background:radial-gradient(circle at 40% 35%,#ff8a7a,#b3241c 60%,#5c0f0a);border-color:#ff6b5b;box-shadow:0 0 18px #ff5a4a88}
.g3-cell.hit::after{content:"💥";font-size:16px}
.g3-cell.stone:not(.hit)::after{content:"🪨";font-size:15px}
.g3-climber{font-size:18px}
.g3-traps{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin:8px 0}
.g3-traps button{border:1px solid var(--wg-accent);background:var(--wg-s3);color:var(--wg-text-tint);border-radius:11px;padding:9px 0;font-weight:900}
.g3-traps button.selected{background:#f4ce73;color:#2a1a02;border-color:#f4ce73}
.g3-cashout{background:linear-gradient(135deg,#9ff27a,#3fbf62)!important;color:#08210f!important}
@media (max-width:860px){
  .g3-game .stage{min-height:0}
  .g3-stage-inner{padding:10px 0 88px}
  .g3-wheel{width:min(94%,380px)}
  .g3-roulette{width:min(90%,360px)}
  .g3-step{grid-template-columns:48px repeat(8,minmax(0,1fr));gap:4px}
  .g3-step .g3-mult{font-size:11px;padding-right:2px}
  .g3-cell{border-radius:8px;font-size:14px}
  .g3-ladder{padding:10px 8px;gap:5px}
  .g3-bet{min-height:64px;padding:8px 10px}
  .g3-bet b{font-size:19px}
}
/* ---- light theme (html.gl-native: no inversion; native colours) */
html[data-theme="light"] .g3-game .stage,html[data-theme="light"] .g3-game .panel,html[data-theme="light"] .odds-box,
html[data-theme="light"] details.proof,html[data-theme="light"] .details>div{background:#ffffff!important;border-color:var(--wg-pale-2)!important;color:var(--wg-s2)!important;box-shadow:0 14px 34px color-mix(in srgb,var(--wg-s4) 12.2%,transparent)!important}
html[data-theme="light"] .g3-backdrop{background:radial-gradient(circle at 50% 42%,#ffffff 0,var(--wg-pale) 34%,var(--wg-accent-pale) 62%,var(--wg-accent-pale) 100%)}
html[data-theme="light"] .g3-backdrop::before{background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--wg-accent-deep) 9.4%,transparent) 0 6deg,color-mix(in srgb,var(--wg-accent-deep) 0%,transparent) 6deg 18deg)}
html[data-theme="light"] .g3-backdrop::after{background:radial-gradient(circle at 18% 88%,#f4ce7355 0,#0000 26%),radial-gradient(circle at 84% 14%,color-mix(in srgb,var(--wg-accent) 33.3%,transparent) 0,#0000 30%)}
html[data-theme="light"] .stage-caption span{color:#a66f00}
html[data-theme="light"] .stage-caption strong{color:var(--wg-s2)}
html[data-theme="light"] .g3-game .panel :is(h2,label,.mode strong){color:var(--wg-s2)!important}
html[data-theme="light"] .g3-game .panel :is(.message,.fine,.stake-hint,.g3-total){color:var(--wg-accent-lo)}
html[data-theme="light"] .g3-total b{color:var(--wg-s2)}
html[data-theme="light"] .g3-game .panel .message.error{color:#b3261e}
html[data-theme="light"] .g3-game .panel .mode{background:var(--wg-pale);border-color:var(--wg-pale-2);color:var(--wg-s2)}
html[data-theme="light"] .g3-game .panel .stakes button,html[data-theme="light"] .g3-row .ghost,html[data-theme="light"] .g3-traps button{background:var(--wg-pale);border-color:var(--wg-accent-hi);color:var(--wg-s2)}
html[data-theme="light"] .g3-game .panel .stakes button.selected,html[data-theme="light"] .g3-traps button.selected{background:var(--wg-accent-deep);border-color:var(--wg-accent-lo);color:#fff}
html[data-theme="light"] .g3-game .panel .stake-custom-shell{background:#fff;border-color:var(--wg-accent-hi);color:var(--wg-s2)}
html[data-theme="light"] .g3-game .panel .stake-custom-shell input{color:var(--wg-s2)}
html[data-theme="light"] .g3-game .panel .payout{background:#f3f7f0;border-color:#c9d8c4;color:#172a1f}
html[data-theme="light"] .g3-game .panel .payout strong{color:var(--wg-accent-lo)}
html[data-theme="light"] .g3-odds th{color:var(--wg-accent-lo)}
html[data-theme="light"] .g3-odds th,html[data-theme="light"] .g3-odds td{border-color:var(--wg-pale-2)}
html[data-theme="light"] .g3-odds td:first-child{color:#a66f00}
html[data-theme="light"] .g3-math,html[data-theme="light"] .odds-box p,html[data-theme="light"] .details p{color:var(--wg-accent-lo)}
html[data-theme="light"] .g3-math code{background:var(--wg-pale)}
html[data-theme="light"] .odds-box h2,html[data-theme="light"] .details b,html[data-theme="light"] details.proof summary{color:var(--wg-s2)}
html[data-theme="light"] details.proof dd{color:var(--wg-accent-lo)}
html[data-theme="light"] .g3-history em{color:var(--wg-accent-lo)}
html[data-theme="light"] .g3-ladder{background:linear-gradient(180deg,var(--wg-pale),var(--wg-pale));border-color:var(--wg-pale-2);box-shadow:0 16px 34px color-mix(in srgb,var(--wg-s4) 13.3%,transparent)}
html[data-theme="light"] .g3-step .g3-mult{color:var(--wg-accent-lo)}
html[data-theme="light"] .g3-step.current .g3-mult{color:#a66f00}
html[data-theme="light"] .g3-step.passed .g3-mult{color:var(--wg-accent-lo)}
html[data-theme="light"] .g3-cell{background:linear-gradient(160deg,#ffffff,var(--wg-pale));border-color:var(--wg-accent-hi);color:var(--wg-s2)}
html[data-theme="light"] .g3-cell.safe{background:linear-gradient(160deg,var(--wg-accent),var(--wg-accent-deep));color:#fff}
html[data-theme="light"] .g3-step.current .g3-cell:not(:disabled){border-color:#d39b00;box-shadow:0 0 0 1px #d39b0055 inset,0 0 14px #d39b0033}
html[data-theme="light"] .g3-game .stage .stage-caption strong{color:var(--wg-s2)!important;-webkit-text-fill-color:currentColor!important;text-shadow:0 1px 0 #fff8!important}
html[data-theme="light"] .g3-game .stage .stage-caption span{color:#a66f00!important}
html[data-theme="light"] details.proof summary,html[data-theme="light"] details.proof summary *{color:var(--wg-s2)!important;opacity:1!important}
.odds-box{overflow-x:auto}
@media (max-width:560px){.g3-odds th,.g3-odds td{padding:6px 5px;font-size:12px}.g3-odds th:nth-child(2),.g3-odds td:nth-child(2){display:none}.g3p-roulette .g3-odds th:nth-child(2),.g3p-roulette .g3-odds td:nth-child(2){display:table-cell}}
/* fixes after the first screenshots */
.g3-board.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.g3-board.three .g3-bet b{font-size:17px}
.g3-bet{min-width:0;overflow:visible}
.g3-bet b{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.g3-bet .g3-amt{top:-9px;right:-6px}
.g3-game .panel .payout strong{font-size:clamp(16px,1.6vw,20px);line-height:1.2;text-align:right}
.g3p-ladder .g3-stage-inner{padding-bottom:12px}
.g3p-ladder .stage{display:flex;flex-direction:column;align-items:center}
.g3p-ladder .stage-caption{position:relative;bottom:auto;margin:4px 12px 22px}
html.gl[data-theme="light"] body .g3-game section.stage .stage-caption strong{color:var(--wg-s2)!important;-webkit-text-fill-color:var(--wg-s2)!important;text-shadow:none!important}
html.gl[data-theme="light"] body .g3-game section.stage .stage-caption span{color:#a66f00!important;-webkit-text-fill-color:#a66f00!important}

/* Ladder v2: readable route and consistent icons, restricted to this game. */
.g3p-ladder .g3-ladder{border-radius:22px;background:linear-gradient(165deg,#221821,#100e14);padding:18px;box-shadow:0 20px 60px #0005}
.g3p-ladder .g3-step{gap:6px}
.g3p-ladder .g3-cell{border-radius:9px;background:linear-gradient(150deg,#352931,#221a23);border-color:#73535f;box-shadow:inset 0 1px #ffffff0d;color:transparent;position:relative}
.g3p-ladder .g3-cell.stone{background:linear-gradient(145deg,#312d36,#211d27);border-color:#59505f}
.g3p-ladder .g3-cell.stone::after{content:"";width:65%;height:65%;background:url('/assets/ladder-rock.svg') center/contain no-repeat}
.g3p-ladder .g3-cell.safe{background:linear-gradient(145deg,#215c57,#163631);border-color:#64d3ac;color:transparent}
.g3p-ladder .g3-cell.safe::after{content:"";width:58%;height:58%;background:url('/assets/ladder-step.svg') center/contain no-repeat}
.g3p-ladder .g3-cell.hit{border-color:#ff5c6f;background:linear-gradient(140deg,#8c2439,#411422);box-shadow:0 0 0 2px #ff728833 inset,0 0 16px #ef244a26}
.g3p-ladder .g3-cell.hit::after{filter:sepia(1) saturate(3) hue-rotate(305deg);width:73%;height:73%}
.g3p-ladder .g3-cell.pick{box-shadow:0 0 0 2px #f5d68e inset}
.g3p-ladder .g3-step.current .g3-cell:not(:disabled){border-color:#e1bd78;background:linear-gradient(145deg,#47332d,#251c24);box-shadow:0 0 0 1px #e1bd7822 inset}
.g3p-ladder .g3-step.current .g3-cell:not(:disabled):hover{border-color:#ffdf96;transform:translateY(-2px);background:#594034}
.g3p-ladder .g3-stage-inner{row-gap:12px;align-content:start;padding-bottom:24px}
.ladder-legend{width:min(94%,560px);margin:12px auto 0;color:#c5b8c2;text-align:center;font:12px/1.6 Arimo,Arial,sans-serif;white-space:pre-wrap}
@media(max-width:600px){.g3p-ladder .g3-ladder{width:100%;padding:12px 6px;gap:6px}.g3p-ladder .g3-step{grid-template-columns:43px repeat(8,minmax(0,1fr));gap:3px}.g3p-ladder .g3-step .g3-mult{font-size:10px}.g3p-ladder .g3-cell{aspect-ratio:1;min-height:27px;border-radius:7px}.ladder-legend{font-size:11px}}