/* The casino tab and its house games, in the poker table's colours: navy glass, ivory, a little gold. */
.nav-chip{display:block;}
#view-casino.active{position:fixed;inset:56px 0 60px;overflow:auto;padding:0;}
.casino{max-width:460px;margin:0 auto;padding:20px 16px 28px;box-sizing:border-box;}
.casino-head{display:flex;align-items:center;gap:14px;margin-bottom:18px;padding:16px 18px;border:1px solid rgba(213,201,172,.28);border-radius:18px;background:linear-gradient(150deg,rgba(27,35,49,.85),rgba(15,22,36,.92));}
.casino-chip{flex-shrink:0;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#3b2f1e,#1d1710);color:#e2cf9b;box-shadow:inset 0 0 0 2px rgba(226,207,155,.35);}
.casino-chip .cs-chip-svg{width:30px;height:30px;}
.casino-head small{display:block;color:#a8a293;font-size:11px;letter-spacing:.06em;}
.casino-head strong{display:block;margin-top:2px;color:#f3e9cf;font:700 24px/1.2 system-ui,sans-serif;font-variant-numeric:tabular-nums;}
.casino-jackpots{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:-6px 0 18px;}
.casino-jackpots p{margin:0;padding:10px 12px;border:1px solid rgba(201,164,92,.45);border-radius:12px;background:rgba(12,16,14,.72);text-align:center;}
.casino-jackpots small{display:block;color:#b59a63;font:600 9px/1.2 system-ui,sans-serif;letter-spacing:.22em;}
.casino-jackpots b{display:block;margin-top:4px;color:#efe4c8;font:600 18px/1.2 Georgia,"Yu Mincho",serif;font-variant-numeric:tabular-nums;}
.casino-jackpots .is-sjp{border-color:rgba(201,164,92,.8);}
.casino-games{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.casino-game{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-height:150px;padding:14px;border:1px solid rgba(213,201,172,.22);border-radius:16px;background:linear-gradient(160deg,rgba(24,33,48,.88),rgba(13,19,32,.94));color:#f0ece3;text-align:left;cursor:pointer;transition:transform .15s,border-color .15s;}
.casino-game:active{transform:scale(.97);border-color:#c6b790;}.casino-game:focus-visible{outline:3px solid #e1c994;outline-offset:2px;}
.casino-game b{font:700 15px/1.35 Georgia,"Yu Mincho",serif;}.casino-game small{color:#a8a293;font-size:11px;line-height:1.5;}
.casino-pic{display:block;width:100%;margin-bottom:6px;}.casino-pic svg{display:block;width:72px;height:54px;}
.casino-pic .is-card{fill:#f6f0e1;stroke:#cdbf99;stroke-width:1;}.casino-pic .is-ink{fill:#1c1f26;font:700 11px Georgia,serif;}.casino-pic .is-red{fill:#b4232a;font:700 11px Georgia,serif;}
.casino-pic .is-rim{fill:#2a2117;stroke:#c6b790;stroke-width:1.5;}.casino-pic .is-pockets{stroke:#b4232a;stroke-width:6;}.casino-pic .is-hub{fill:#c6b790;}.casino-pic .is-ball{fill:#fffdf7;}
.casino-pic .is-die{fill:#f6f0e1;stroke:#cdbf99;}.casino-pic .is-pip{fill:#1c1f26;}
.casino-note{margin:16px 4px 0;color:#8f8a7e;font-size:11px;line-height:1.7;}

/* Game screen */
html body dialog.casino-screen{position:fixed;inset:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:calc(12px + env(safe-area-inset-top)) 16px calc(18px + env(safe-area-inset-bottom));box-sizing:border-box;border:0;background:radial-gradient(ellipse at 50% 30%,#18233a 0%,#0b111d 70%);color:#eee8da;overflow:auto;font-family:system-ui,-apple-system,"Hiragino Sans",sans-serif;}
.casino-screen::backdrop{background:#05080f;}
.casino-open{overflow:hidden;}
.cs-close{position:absolute;top:calc(10px + env(safe-area-inset-top));right:12px;z-index:5;width:36px;height:36px;border:1px solid rgba(213,201,172,.3);border-radius:50%;background:rgba(15,22,36,.7);color:#eee8da;font-size:18px;cursor:pointer;}
.cs-bar{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;max-width:480px;margin:0 auto 14px;padding:6px 48px 0 0;}
.cs-kicker{margin:0 0 2px;color:#999386;font:600 9px/1.2 system-ui,sans-serif;letter-spacing:.24em;}
.cs-bar h2{margin:0;color:#f0ece3;font:700 22px/1.25 Georgia,"Yu Mincho",serif;}
.cs-balance{display:flex;align-items:center;gap:6px;margin:0;color:#e2cf9b;font:700 14px system-ui,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap;}
.cs-coin .cs-chip-svg{display:block;width:18px;height:18px;}
.cs-body{display:flex;flex-direction:column;gap:12px;max-width:480px;margin:0 auto;}
.cs-felt{display:flex;flex-direction:column;gap:18px;padding:18px 14px;border:5px solid #2a2117;border-radius:22px;background:radial-gradient(ellipse at 50% 40%,#1f5a4b 0%,#143f37 60%,#0e2b28 100%);box-shadow:inset 0 0 0 2px rgba(198,183,144,.3),0 10px 26px rgba(0,0,0,.35);}
.cs-hand-label{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin:0 0 8px;color:#cfe6dc;font-size:12px;}
.cs-hand-label b{color:#f3e9cf;font-size:13px;text-align:right;}
.cs-cards{display:flex;flex-wrap:wrap;gap:6px;min-height:82px;}
.cs-cards .pk-card{width:56px;height:80px;border-radius:8px;}.cs-cards .pk-card b{font-size:24px;}.cs-cards .pk-card i{font-size:20px;}
.cs-actions{display:flex;flex-wrap:wrap;gap:8px;}
.cs-actions button,.cs-betbar button,.cs-chip-pick button{min-height:44px;padding:0 14px;border:1px solid rgba(213,201,172,.35);border-radius:12px;background:rgba(15,23,42,.55);color:#eee8da;font:700 13px system-ui,sans-serif;cursor:pointer;}
.cs-actions button{flex:1 1 30%;}
.cs-body button:disabled{opacity:.4;cursor:default;}
.cs-body .cs-primary{background:#c6b790;border-color:transparent;color:#18202d;}
.cs-hint{margin:0;color:#a8a293;font-size:12px;text-align:center;}
.cs-betbar{display:grid;gap:10px;padding:14px;border:1px solid rgba(213,201,172,.22);border-radius:16px;background:linear-gradient(150deg,rgba(27,35,49,.85),rgba(15,22,36,.9));}
.cs-bet-row{display:flex;align-items:center;gap:10px;color:#cfc8b8;font-size:13px;}
.cs-bet{flex:1;color:#f3e9cf;font:700 22px system-ui,sans-serif;font-variant-numeric:tabular-nums;text-align:right;}
.cs-betbar .cs-clear{min-height:34px;padding:0 10px;font-size:11px;}
.cs-chips{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;}
.cs-chips .cs-chip-btn{min-height:44px;padding:0;border-radius:50%;aspect-ratio:1;max-width:58px;justify-self:center;width:100%;border:2px dashed rgba(226,207,155,.55);background:radial-gradient(circle,#2b2418 55%,#1b160f 56%);color:#f3e9cf;font-size:12px;}
.cs-chip-pick .cs-chip-btn[aria-pressed=true]{border-style:solid;border-color:#e2cf9b;background:radial-gradient(circle,#4a3b20 55%,#2b2418 56%);box-shadow:0 0 0 3px rgba(226,207,155,.25);}
.cs-betbar .cs-reset{background:transparent;border-style:dashed;font-weight:600;}
.cs-result{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0;padding:12px 16px;border-radius:14px;border:1px solid rgba(213,201,172,.3);background:rgba(10,16,28,.8);font-size:14px;}
.cs-result b{font:800 18px system-ui,sans-serif;font-variant-numeric:tabular-nums;}
.cs-result.is-win{border-color:#e2cf9b;}.cs-result.is-win b{color:#f3e2a6;}.cs-result.is-lose b{color:#e7a3a3;}.cs-result.is-push b{color:#cfc8b8;}
.cs-result-slot{margin:0;min-height:0;}
.cs-rules{padding:4px 2px;color:#a8a293;font-size:12px;}.cs-rules summary{cursor:pointer;color:#cfc8b8;padding:6px 0;}
.cs-rules ul{margin:4px 0 0;padding-left:18px;line-height:1.75;}

/* Roulette */
.cs-wheel{position:relative;width:min(58vw,220px);aspect-ratio:1;margin:0 auto;}
.cs-wheel svg{display:block;width:100%;height:100%;}
.cs-wheel .is-rim{fill:#2a2117;stroke:#c6b790;stroke-width:2;}
.cs-wheel .is-red{fill:#9b2228;}.cs-wheel .is-black{fill:#151a24;}.cs-wheel .is-green{fill:#1d6b4f;}
.cs-wheel path{stroke:#c6b79055;stroke-width:.5;}
.cs-wheel text{fill:#f3eee2;font:700 7px system-ui,sans-serif;text-anchor:middle;dominant-baseline:middle;}
.cs-wheel .is-inner{fill:#1a2b26;stroke:#c6b790;stroke-width:1.2;}.cs-wheel .is-hub{fill:#c6b790;}
.cs-wheel-spin{transform-box:view-box;transform-origin:50% 50%;transition:transform 3.4s cubic-bezier(.12,.6,.12,1);}
.cs-pointer{position:absolute;left:50%;top:-4px;width:0;height:0;border-left:9px solid transparent;border-right:9px solid transparent;border-top:16px solid #f3e9cf;transform:translateX(-50%);filter:drop-shadow(0 2px 3px rgba(0,0,0,.5));}
.cs-landed{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;transform:translate(-50%,-50%);color:#fff;font:800 26px system-ui,sans-serif;}
.cs-landed:empty{display:none;}.cs-landed.is-red{background:#9b2228;}.cs-landed.is-black{background:#151a24;}.cs-landed.is-green{background:#1d6b4f;}
.cs-landed:not(:empty){box-shadow:0 0 0 3px #e2cf9b,0 6px 18px rgba(0,0,0,.5);animation:cs-pop .35s cubic-bezier(.2,1.6,.4,1);}
.cs-spot{position:relative;min-height:36px;padding:0 2px;border:1px solid rgba(243,233,207,.25);border-radius:8px;background:#143f37;color:#f3eee2;font:700 13px system-ui,sans-serif;cursor:pointer;}
.cs-spot.is-red{background:#7d1c22;}.cs-spot.is-black{background:#151a24;}.cs-spot.is-green{background:#1d6b4f;}
.cs-spot.is-hit{outline:2px solid #f3e2a6;outline-offset:-1px;box-shadow:0 0 12px rgba(243,226,166,.6);}
.cs-stake{position:absolute;right:-4px;top:-6px;z-index:1;min-width:20px;height:20px;padding:0 4px;box-sizing:border-box;border-radius:10px;background:#e2cf9b;color:#18202d;font:800 10px/20px system-ui,sans-serif;font-style:normal;box-shadow:0 1px 4px rgba(0,0,0,.5);animation:cs-pop .25s ease-out;}
.cs-chip-pick{max-width:340px;margin:0 auto;width:100%;}
.is-spinning .cs-board{opacity:.7;}

/* Dice */
.cs-dice{display:flex;gap:8px;justify-content:center;}
.cs-die-btn{display:flex;flex-direction:column;align-items:center;gap:4px;padding:0;border:0;background:none;color:#f3e2a6;font-size:10px;cursor:pointer;}
.cs-die-btn small{min-height:1.3em;font-weight:700;}
.cs-die{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:50px;height:50px;padding:7px;box-sizing:border-box;border-radius:11px;background:linear-gradient(150deg,#fffdf7,#ece3cc);box-shadow:0 3px 8px rgba(0,0,0,.35),inset 0 -2px 0 rgba(0,0,0,.08);}
.cs-die i{width:9px;height:9px;margin:auto;border-radius:50%;}.cs-die i.is-on{background:#1c1f26;}
.cs-die[data-value="1"] i.is-on{background:#b4232a;width:11px;height:11px;}
.cs-die.is-empty{background:rgba(243,233,207,.08);box-shadow:inset 0 0 0 1px rgba(243,233,207,.25);}
.cs-die-btn[aria-pressed=true] .cs-die{box-shadow:0 0 0 3px #e2cf9b,0 3px 8px rgba(0,0,0,.35);transform:translateY(-4px);}
.cs-die-btn:disabled{cursor:default;}
@media(max-width:360px){.cs-die{width:44px;height:44px;padding:6px;}.cs-die i{width:8px;height:8px;}}

/* Motion: one-shot only, nothing loops. */
@media(prefers-reduced-motion:no-preference){
.cs-deal{animation:cs-deal .38s cubic-bezier(.2,.8,.3,1) var(--d,0s) both;}
.cs-result{animation:cs-rise .3s ease-out var(--d,0s) both;}
}
@keyframes cs-deal{from{opacity:0;transform:translate(40px,-30px) rotate(12deg) scale(.8)}to{opacity:1;transform:none}}
@keyframes cs-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes cs-pop{from{transform:translate(-50%,-50%) scale(.4)}to{transform:translate(-50%,-50%) scale(1)}}
.cs-stake{animation-name:none;}
@media(prefers-reduced-motion:reduce){.cs-wheel-spin{transition:none;}.casino-game{transition:none;}}
.cs-body .cs-die-btn:disabled{opacity:1;}
.casino-today{margin:0 0 0 auto;align-self:flex-end;color:#a8a293;font:600 12px system-ui,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap;}.casino-today:empty{display:none;}

/* Help for beginners: the suggested move glows softly, with one line on why. */
.cs-advice{margin:0;padding:9px 12px;border-radius:12px;background:rgba(198,183,144,.1);color:#e7dcc0;font-size:12px;line-height:1.6;}
.cs-body .cs-actions .is-suggested:not(.cs-primary){border-color:#e2cf9b;color:#f3e9cf;}
.cs-body .cs-actions .is-suggested{box-shadow:0 0 0 3px rgba(226,207,155,.28);}
.cs-advice-btn{min-height:40px;border:1px dashed rgba(226,207,155,.6);border-radius:12px;background:transparent;color:#e7dcc0;font:700 13px system-ui,sans-serif;cursor:pointer;}
.cs-die-btn.is-suggested .cs-die{box-shadow:0 0 0 2px rgba(226,207,155,.75),0 0 14px rgba(226,207,155,.45),0 3px 8px rgba(0,0,0,.35);}
/* A win: the line pops and chips burst from the amount. */
.cs-result{position:relative;}
.cs-burst{position:absolute;right:34px;top:50%;width:0;height:0;pointer-events:none;}
.cs-burst i{position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle,#f3e2a6 40%,#b89a55 42%);opacity:0;}
.cs-balance [data-cs-balance]{display:inline-block;}
@media(prefers-reduced-motion:no-preference){
.cs-result.is-win{animation:cs-win .5s cubic-bezier(.2,1.5,.4,1) var(--d,0s) both;}
.cs-burst i{animation:cs-burst .7s cubic-bezier(.2,.7,.3,1) calc(var(--d,0s) + .15s) both;}
.cs-balance .is-up{animation:cs-flash-up .8s ease-out;}.cs-balance .is-down{animation:cs-flash-down .8s ease-out;}
.cs-body .cs-actions .is-suggested,.cs-die-btn.is-suggested .cs-die{animation:cs-hint-glow 1.6s ease-in-out 2;}
#view-casino.active .casino-game{animation:cs-rise .35s ease-out both;}
#view-casino.active .casino-game:nth-child(2){animation-delay:.05s}#view-casino.active .casino-game:nth-child(3){animation-delay:.1s}#view-casino.active .casino-game:nth-child(4){animation-delay:.15s}
}
@keyframes cs-win{0%{opacity:0;transform:scale(.85)}60%{opacity:1;transform:scale(1.04)}100%{transform:none}}
@keyframes cs-burst{0%{opacity:1;transform:rotate(var(--a)) translateX(0)}100%{opacity:0;transform:rotate(var(--a)) translateX(46px)}}
@keyframes cs-flash-up{0%{transform:scale(1.18);color:#fff3c4}100%{transform:none}}
@keyframes cs-flash-down{0%{transform:scale(.94);color:#e7a3a3}100%{transform:none}}
@keyframes cs-hint-glow{50%{box-shadow:0 0 0 5px rgba(226,207,155,.12),0 0 18px rgba(226,207,155,.5)}}
.cs-pays{display:block;margin-top:1px;color:#d9cba4;font:600 9px/1.2 system-ui,sans-serif;opacity:.85;}
.casino-game{position:relative;}
.casino-level{position:absolute;top:12px;right:12px;padding:2px 8px;border-radius:999px;border:1px solid rgba(213,201,172,.35);color:#cfc8b8;font:700 10px/1.5 system-ui,sans-serif;font-style:normal;}
.casino-level.is-easy{border-color:rgba(159,213,194,.55);color:#bfe6d6;}.casino-level.is-deep{border-color:rgba(226,207,155,.55);color:#e7dcc0;}

/* Roulette on one screen: the wheel beside the last result, then the table as printed on felt. */
.is-roulette-body{gap:10px;}
.cs-stage{display:flex;align-items:center;gap:12px;}
.cs-stage .cs-wheel{flex-shrink:0;width:min(42vw,25dvh,200px);margin:0;}
.cs-stage-side{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px;}
.cs-stage-side .cs-result{flex-direction:column;align-items:flex-start;gap:2px;padding:10px 12px;font-size:12px;}
.cs-stage-side .cs-result b{font-size:20px;}
.cs-stage-side .cs-burst{right:auto;left:40px;top:70%;}
.cs-result-slot:empty::before{content:"玉の止まる場所を予想しよう";display:block;padding:10px 12px;border:1px dashed rgba(213,201,172,.25);border-radius:14px;color:#8f8a7e;font-size:12px;line-height:1.5;}
.cs-recent{display:flex;flex-wrap:wrap;gap:4px;min-height:22px;}
.cs-recent i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;color:#fff;font:700 10px system-ui,sans-serif;font-style:normal;}
.cs-recent i:first-child{box-shadow:0 0 0 2px #e2cf9b;}
.cs-recent .is-red{background:#9b2228;}.cs-recent .is-black{background:#151a24;border:1px solid #ffffff30;}.cs-recent .is-green{background:#1d6b4f;}
.cs-board{display:grid;grid-template-columns:1.15fr repeat(12,minmax(0,1fr)) 1.35fr;grid-template-rows:repeat(3,minmax(30px,4.6dvh)) repeat(2,minmax(30px,4.4dvh));gap:0;padding:4px;border-radius:10px;background:#16573f;box-shadow:inset 0 0 0 2px #e2cf9b55;}
.cs-board .cs-spot{min-height:0;padding:0;border:1px solid rgba(255,255,255,.55);border-radius:0;background:transparent;color:#fff;font:700 11px/1.1 system-ui,sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.cs-board .cs-spot:active{background:rgba(255,255,255,.12);}
.cs-board .is-zero{font-size:15px;border-radius:40% 0 0 40%;}
.cs-pip{display:grid;place-items:center;width:86%;max-width:24px;height:84%;border-radius:50%;font:800 10.5px system-ui,sans-serif;letter-spacing:-.04em;}
.cs-pip.is-red{background:#c8202b;}.cs-pip.is-black{background:#10141c;}
.cs-board .is-outside{font-size:10.5px;}
.cs-board .is-outside.is-red{color:#ff6b6b;}.cs-board .is-outside.is-black{color:#10141c;text-shadow:0 0 1px #fff8;}
.cs-board .cs-pays{display:block;margin-top:1px;color:#f3e9cf;font:600 8.5px/1 system-ui,sans-serif;opacity:.8;}
.cs-board .cs-spot.is-hit{outline:2px solid #ffe38a;outline-offset:-2px;box-shadow:inset 0 0 12px rgba(255,227,138,.55);z-index:1;}
.cs-board .cs-stake{right:-3px;top:-5px;min-width:16px;height:16px;padding:0 3px;font:800 8.5px/16px system-ui,sans-serif;border-radius:8px;}
.is-roulette-body .cs-hint{font-size:11px;}
.is-roulette-body .cs-chips .cs-chip-btn{min-height:40px;max-width:48px;}
@media(max-height:700px){.is-roulette-body{gap:7px;}.is-roulette-body .cs-chips .cs-chip-btn{min-height:36px;max-width:42px;}}

/* Dice poker: against the dealer or a friend. */
.cs-mode{display:grid;grid-template-columns:repeat(var(--n,2),minmax(0,1fr));gap:4px;padding:4px;border:1px solid rgba(213,201,172,.22);border-radius:14px;background:rgba(10,16,28,.6);}
.cs-mode button{min-height:38px;border:0;border-radius:10px;background:transparent;color:#a8a293;font:700 13px system-ui,sans-serif;cursor:pointer;}
.cs-mode [aria-pressed=true]{background:#c6b790;color:#18202d;}
.cs-duel-title{margin:0;color:#f3e9cf;font:700 16px/1.4 Georgia,"Yu Mincho",serif;}
.cs-duel-lobby .cs-hint{text-align:left;}
.cs-duel-step{margin:6px 0 0;color:#c6b790;font-size:12px;font-weight:700;}
.cs-duel-lobby .cs-betbar{padding:0;border:0;background:none;}
.cs-duel-join{display:flex;gap:8px;}
.cs-duel-join input{flex:1;min-width:0;height:44px;padding:0 12px;border:1px solid rgba(213,201,172,.35);border-radius:12px;background:rgba(8,12,20,.6);color:#f3e9cf;font:700 18px system-ui,sans-serif;letter-spacing:.4em;text-align:center;}
.cs-duel-join button{min-width:84px;min-height:44px;border-radius:12px;border:0;font:700 14px system-ui,sans-serif;cursor:pointer;}
.cs-duel-status{min-height:1.4em;margin:0;color:#fca5a5;font-size:12px;text-align:center;}
.cs-duel-head{display:flex;align-items:center;gap:10px;color:#cfc8b8;font-size:12px;}
.cs-duel-head b{color:#e2cf9b;}
.cs-duel-leave{margin-left:auto;min-height:32px;padding:0 12px;border:1px solid rgba(213,201,172,.35);border-radius:10px;background:transparent;color:#eee8da;font:700 12px system-ui,sans-serif;cursor:pointer;}
.cs-duel-wait{margin:0;padding:18px 14px;border:1px dashed rgba(213,201,172,.3);border-radius:16px;text-align:center;color:#cfc8b8;font-size:13px;}
.cs-duel-wait p{margin:0;}
.cs-duel-code{display:block;margin:10px 0;color:#f3e9cf;font:800 44px/1 system-ui,sans-serif;letter-spacing:.18em;}
.cs-duel-thinking{color:#a8a293!important;font-weight:600;}
@media(prefers-reduced-motion:no-preference){.cs-duel-code{animation:cs-win .5s cubic-bezier(.2,1.5,.4,1) both;}.cs-duel-thinking{animation:cs-think 1.4s ease-in-out infinite;}}
@keyframes cs-think{50%{opacity:.45}}
/* Grids never grow past the screen: the number box's natural width used to push the panel wider. */
.cs-betbar{grid-template-columns:minmax(0,1fr);}
.cs-duel-join input{width:100%;}

/* Tables with friends. */
.cs-group-people{display:flex;flex-wrap:wrap;gap:6px;}
.cs-group-person{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border:1px solid rgba(213,201,172,.28);border-radius:999px;color:#cfc8b8;font-size:12px;}
.cs-group-person.is-me{border-color:#e2cf9b;color:#f3e9cf;}
.cs-group-person.is-turn{background:rgba(226,207,155,.18);}
.cs-group-person small{padding:0 5px;border-radius:6px;background:#c6b790;color:#18202d;font-size:9.5px;font-weight:800;}
.cs-group-code{margin:0;padding:8px 12px;border:1px dashed rgba(213,201,172,.35);border-radius:12px;color:#e7dcc0;font-size:13px;text-align:center;}
.cs-group-bets{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:2px;color:#cfc8b8;font-size:11px;}
.cs-group-joined{margin:0;color:#a8a293;font-size:12px;text-align:center;}
.cs-group-bj{gap:12px;}
.cs-group-seat{padding:6px 8px;border-radius:12px;}
.cs-group-seat.is-me{background:rgba(255,255,255,.05);}
.cs-group-seat.is-turn{box-shadow:0 0 0 2px rgba(226,207,155,.6);}
.cs-group-bj .cs-cards{min-height:0;}
.cs-group-bj .cs-group-seat .pk-card{width:42px;height:60px;}.cs-group-bj .cs-group-seat .pk-card b{font-size:18px;}.cs-group-bj .cs-group-seat .pk-card i{font-size:15px;}
.cs-group-dice li{font-size:12px;}
.cs-my-dice .cs-dice{justify-content:center;}

/* Blackjack: seats with one or more hands, and the four moves. */
.cs-bj .cs-seat{display:flex;flex-direction:column;gap:8px;padding:6px 8px;border-radius:12px;}
.cs-bj .cs-seat.is-me{background:rgba(255,255,255,.05);}
.cs-bj .cs-seat.is-turn{box-shadow:0 0 0 2px rgba(226,207,155,.55);}
.cs-seat-hand.is-active .cs-hand-label span{color:#f3e2a6;}
.cs-seat-hand.is-active .cs-cards{filter:drop-shadow(0 0 6px rgba(243,226,166,.45));}
.cs-hand-label.is-win b,.cs-hand-label.is-blackjack b{color:#f3e2a6;}.cs-hand-label.is-lose b,.cs-hand-label.is-bust b{color:#e7a3a3;}
.cs-seat+.cs-seat .cs-cards .pk-card,.cs-seat .cs-seat-hand+.cs-seat-hand .pk-card{width:46px;height:66px;}
.cs-bj-actions{display:flex;flex-direction:column;gap:8px;}
.cs-moves{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));grid-auto-flow:column;}
.cs-moves button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:52px;padding:4px 6px;}
.cs-moves button b{font-size:14px;}.cs-moves button small{font-size:10px;font-weight:600;opacity:.8;}

/* Chinchiro: a lacquered table, a deep bowl, dice lying where they fell and a stamp with the
   hand. The dice themselves do not move (they show their numbers at once, on request). */
.cs-felt.cs-chin{gap:14px;border-color:#3a1712;background:radial-gradient(ellipse at 50% 35%,#7a2a22 0%,#4f1813 58%,#2c0c0a 100%);box-shadow:inset 0 0 0 2px rgba(226,207,155,.35),inset 0 0 40px rgba(0,0,0,.45),0 10px 26px rgba(0,0,0,.4);}
.cs-chin .cs-hand-label b{color:#f3e2a6;}
.cs-chin-side{position:relative;border-radius:16px;}
.cs-bowl{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;height:118px;margin:0 auto;width:min(100%,270px);border-radius:50%;background:radial-gradient(ellipse at 50% 42%,#fffaf0 0%,#f1e7d2 38%,#d9c8a4 60%,#a68c5f 68%,#22324c 69.5%,#1b2a40 74%,#d5bf86 74.8%,#1b2a40 75.6%,transparent 77%);box-shadow:inset 0 -10px 18px rgba(0,0,0,.22),0 8px 18px rgba(0,0,0,.35);}
.cs-bowl .cs-die{width:42px;height:42px;padding:6px;transform:rotate(var(--tilt,0deg)) translateY(var(--lift,0px));}.cs-bowl .cs-die i{width:7px;height:7px;}
.cs-bowl .cs-die.is-empty{transform:none;background:rgba(122,100,64,.16);box-shadow:inset 0 0 0 1px rgba(122,100,64,.3);}
.cs-chin-stamp{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%) rotate(-6deg);padding:3px 14px;border:2px solid currentColor;border-radius:8px;background:rgba(20,12,10,.82);color:#f3e2a6;font:900 17px/1.2 "Hiragino Mincho ProN","Yu Mincho",serif;letter-spacing:.06em;white-space:nowrap;pointer-events:none;}
.cs-chin-stamp.is-me{color:#f3e2a6;}
.cs-chin-stamp.is-none{color:#b9b2a3;font-size:14px;}
.cs-chin-stamp.is-hifumi{color:#9fb7ff;background:rgba(14,18,40,.9);}
.cs-chin-stamp.is-shigoro{color:#fff;background:#b8322a;border-color:#ffd9a0;font-size:20px;}
.cs-chin-stamp.is-zoro,.cs-chin-stamp.is-legend{color:#2a1a05;background:linear-gradient(135deg,#fff2c0,#d9b45a 55%,#fff0b5);border-color:#fff7d6;font-size:21px;box-shadow:0 0 18px rgba(255,214,120,.7);}
.cs-chin-stamp.is-legend{font-size:24px;box-shadow:0 0 26px rgba(255,214,120,.95),0 0 60px rgba(255,170,80,.5);}
.cs-chin-before{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 12px;margin:10px 0 0;color:#e8d9c0;font-size:11px;opacity:.85;}
.cs-chin-before > span{display:inline-flex;align-items:center;gap:3px;}
.cs-die.is-mini{width:18px;height:18px;padding:2px;border-radius:4px;box-shadow:0 1px 2px rgba(0,0,0,.4);}.cs-die.is-mini i{width:3px;height:3px;}.cs-die.is-mini[data-value="1"] i.is-on{width:4px;height:4px;}
@media(prefers-reduced-motion:no-preference){
.cs-chin-stamp.is-fresh{animation:cs-stamp .3s cubic-bezier(.2,1.6,.4,1) both;}
.cs-chin-side.is-big{animation:cs-big-glow 1.1s ease-out .15s both;}
}
@keyframes cs-stamp{0%{opacity:0;transform:translateX(-50%) rotate(-6deg) scale(2.2)}100%{opacity:1;transform:translateX(-50%) rotate(-6deg) scale(1)}}
@keyframes cs-big-glow{0%{box-shadow:0 0 0 0 rgba(255,214,120,0)}30%{box-shadow:0 0 0 6px rgba(255,214,120,.45),0 0 40px rgba(255,200,100,.55)}100%{box-shadow:0 0 0 0 rgba(255,214,120,0)}}
.casino-pic .is-bowl{fill:#e4d6b8;stroke:#7a6440;stroke-width:1.2;}.casino-pic .is-bowl-in{fill:#f6efe0;}
.casino-waiting{position:absolute;top:10px;right:10px;padding:2px 8px;border-radius:999px;background:rgba(214,183,115,.18);border:1px solid rgba(214,183,115,.55);color:#e9d39c;font:600 10px/1.6 system-ui,sans-serif;font-style:normal;}