/* Ігри поза Плінко. Кольори й базові блоки — з index.html. */
.game[data-go]{cursor:pointer;border:0;color:var(--tx);text-align:left;font:inherit}
.game .go{color:var(--ink);font-size:12px;font-weight:700;margin-top:3px;display:inline-block;background:var(--gold);padding:3px 10px;border-radius:999px}
.gbox{flex:none;margin:0 12px;background:#140F36;border:1px solid #2E2468;border-radius:22px;padding:14px;position:relative;overflow:hidden}
.hint{margin:0 12px 8px;padding:10px 12px;border-radius:14px;background:var(--s1);border:1px dashed var(--cyan);color:#CDEFF7;font-size:13px;line-height:1.45;display:flex;gap:10px;align-items:center}
.hint[hidden]{display:none}
.hint button{flex:none;height:32px;padding:0 12px;border-radius:10px;border:0;background:var(--cyan);color:#062A33;font-weight:700;font-size:13px}
.seg.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.seg.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.seg button[aria-pressed=true]{background:var(--gold);color:var(--ink)}
.seg button:disabled{opacity:.45}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.stats div{background:var(--s1);border:1px solid var(--line);border-radius:14px;padding:8px 10px}
.stats small{display:block;color:var(--mut);font-size:11px;margin-bottom:2px}
.stats b{font-variant-numeric:tabular-nums;font-size:15px}
.play{flex:1;height:60px;border:0;border-radius:18px;background:var(--gold);color:var(--gold-ink);font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:19px;box-shadow:inset 0 -4px 0 rgba(0,0,0,.18);animation:pulse 1.8s infinite}
.play.take{background:var(--lime);color:var(--lime-ink);animation:pulseg 1.6s infinite}
.play:disabled{animation:none;opacity:.5}
.fairlink{display:block;text-align:center;font-size:13px;color:var(--mut);padding:4px 16px 0}
.blist .empty{display:block;color:var(--mut)}
.bignum{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:56px;text-align:center;font-variant-numeric:tabular-nums;line-height:1.1;transition:color .15s}
.bignum.win{color:var(--lime);text-shadow:0 0 24px rgba(140,255,90,.5)}
.bignum.lose{color:var(--mag)}
.pop{animation:chip .35s ease-out}
/* Кості */
.dtrack{height:18px;border-radius:999px;background:#3A1F4F;position:relative;margin:18px 4px 6px}
.dwin{position:absolute;top:0;bottom:0;border-radius:999px;background:linear-gradient(90deg,var(--lime),var(--cyan));transition:left .2s,width .2s}
.dmark{position:absolute;top:-9px;width:8px;height:36px;margin-left:-4px;border-radius:4px;background:#fff;box-shadow:0 0 12px #fff;transition:left .45s cubic-bezier(.2,.9,.3,1.2);left:50%}
.dscale{display:flex;justify-content:space-between;color:var(--mut);font-size:11px;padding:0 2px}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:44px;background:transparent;margin:0}
input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:999px;background:var(--s2)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;margin-top:-11px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(255,201,60,.25)}
input[type=range]::-moz-range-track{height:8px;border-radius:999px;background:var(--s2)}
input[type=range]::-moz-range-thumb{width:30px;height:30px;border:0;border-radius:50%;background:var(--gold)}
/* Міни й Вежа */
.cells{display:grid;gap:7px}
.gbox>.cells{max-width:300px;margin:0 auto}
.cell{aspect-ratio:1;border-radius:14px;border:1px solid var(--line);background:linear-gradient(160deg,var(--s2),var(--s1));display:flex;align-items:center;justify-content:center;padding:0;transition:transform .12s,background .2s,opacity .2s}
.cell:not(:disabled):active{transform:scale(.92)}
.cell::after{content:"";width:46%;aspect-ratio:1;display:none}
.cell.safe{background:#1E3A2A;border-color:var(--lime)}
.cell.safe::after{display:block;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,var(--gold) 55%,#FF8A1F);box-shadow:0 0 14px var(--gold);animation:chip .3s ease-out}
.cell.mine{background:#4A1238;border-color:var(--mag)}
.cell.mine::after{display:block;background:var(--mag);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);box-shadow:0 0 14px var(--mag);animation:chip .3s ease-out}
.cell.dim{opacity:.45}
.cell.hit{animation:shake .4s}
.trow{display:grid;grid-template-columns:54px 1fr;gap:8px;align-items:center;margin-bottom:6px}
.trow small{color:var(--mut);font-size:12px;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.trow.now small{color:var(--gold)}
.trow .cells .cell{aspect-ratio:auto;height:34px;border-radius:10px}
.trow .cells .cell::after{width:auto;height:56%}
.trow:not(.now) .cell:not(.safe):not(.mine){opacity:.5}
.trow.now .cell{border-color:var(--gold)}
/* Хай-Ло */
.cardwrap{display:flex;align-items:center;justify-content:center;gap:14px;min-height:170px}
.pcard{width:112px;height:156px;border-radius:16px;background:#F4F1FF;color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-weight:700;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.pcard b{font-size:54px;line-height:1}
.pcard i{font-style:normal;font-size:34px;line-height:1.1}
.pcard.red{color:#D4226F}
.pcard.flip{animation:flip .35s ease-out}
.pcard.back{background:repeating-linear-gradient(45deg,#3A2E7A,#3A2E7A 8px,#251C55 8px,#251C55 16px);border:2px solid var(--line)}
.trail{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;min-height:28px;margin-top:10px}
.trail span{font-size:12px;font-weight:700;padding:4px 8px;border-radius:8px;background:var(--s1);color:var(--soft)}
.hl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.hl button{height:64px;border-radius:16px;border:1px solid var(--line);background:var(--s1);color:var(--tx);font-weight:700;font-size:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.hl button small{font-size:12px;color:var(--mut);font-weight:600}
.hl button:disabled{opacity:.4}
.hl .hi{border-color:var(--lime)}
.hl .lo{border-color:var(--mag)}
/* Ракета */
.cstage{position:relative}
.cstage .bignum{position:absolute;left:0;right:0;top:34%;pointer-events:none;font-size:52px}
.cstage .sub{position:absolute;left:0;right:0;top:calc(34% + 62px);text-align:center;color:var(--soft);font-size:14px;pointer-events:none}
.cbar{height:5px;border-radius:999px;background:var(--s2);overflow:hidden;margin-top:8px}
.cbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--cyan),var(--gold))}
.blist{border-radius:16px;background:var(--s1);border:1px solid var(--line);overflow:hidden;margin:0 12px}
.blist .r{display:grid;grid-template-columns:1fr auto auto;gap:10px;padding:9px 14px;border-bottom:1px solid var(--s2);font-size:14px;font-variant-numeric:tabular-nums}
.blist .r:last-child{border-bottom:0}
.blist .r small{color:var(--mut)}
.blist .r b{color:var(--lime);min-width:64px;text-align:right}
.blist .r.wait b{color:var(--mut);font-weight:400}
.autorow{display:flex;align-items:center;gap:10px}
.autorow .auto{width:96px;height:46px;border-radius:14px;flex:none}
.autorow .step{flex:1}
@keyframes shake{0%,100%{transform:none}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@keyframes flip{0%{transform:rotateY(90deg) scale(.9)}100%{transform:none}}