*{box-sizing:border-box}body{margin:0;background:#0b1723;color:#edf0f3;font:14px/1.4 "Segoe UI",Arial,sans-serif}main{max-width:980px;margin:auto;padding:10px 14px}header,.title,.toolbar,.score,.console,.actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}header{justify-content:space-between}header img{width:180px;height:auto;display:block}a{color:#f0cd84}h1{font-size:20px;font-weight:600;margin:8px 0}.title{justify-content:space-between}.title span{font-size:12px;color:#bbc8d6}button,select{font:600 14px "Segoe UI",Arial,sans-serif;color:#edf0f3;background:#203448;border:1px solid #637385;border-radius:7px;min-height:42px;padding:8px 12px;cursor:pointer}button:disabled{opacity:.45;cursor:default}button.gold{background:#e8bc69;color:#241a0b}button:focus-visible,a:focus-visible,select:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #61e4ea;outline-offset:2px}.toolbar{margin:6px 0}.toolbar label{display:flex;align-items:center;gap:6px}.score{justify-content:space-between;padding:8px 0;font-size:13px}#status{min-height:20px;margin:5px 0 9px;color:#f4dca6}#board{display:grid;grid-template-columns:repeat(6,minmax(0,1fr)) 24px repeat(6,minmax(0,1fr));grid-template-rows:1fr 1fr;height:clamp(280px,49vw,470px);border:9px solid #7a4a2b;border-radius:12px;background:#2b1614;box-shadow:inset 0 0 0 2px #b17a4b;gap:2px 1px;padding:4px;position:relative}.point{position:relative;min-height:0;min-width:0;padding:16px 0 2px;border:0;border-radius:0;background:none;display:flex;align-items:center;flex-direction:column;gap:0;color:#fff;opacity:1!important}.point:before{content:"";position:absolute;inset:15px 1px 0;background:#b5793b;clip-path:polygon(0 0,100% 0,50% 100%)}.point:nth-child(even):before{background:#7b2527}.point.bottom{flex-direction:column-reverse;padding:2px 0 16px}.point.bottom:before{inset:0 1px 15px;clip-path:polygon(50% 0,0 100%,100% 100%)}.number{position:absolute;top:0;font-size:10px;color:#e4cfa8;font-weight:400}.bottom .number{top:auto;bottom:0}.checker{position:relative;z-index:1;width:min(88%,34px);aspect-ratio:1;flex-shrink:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff5de,#e2c89a 55%,#a97b46);border:1px solid #9d753e;box-shadow:0 2px 2px #0007;font-size:11px;color:#2e1c0e;display:grid;place-items:center;line-height:1}.checker.dark{background:radial-gradient(circle at 35% 30%,#55677b,#142334 60%,#060d15);border-color:#8392a0;color:#fff}.movable .checker{outline:2px solid #d9b865}.point.selected{box-shadow:inset 0 0 0 2px #ffd36a;background:#ffffff0c}.point.destination{box-shadow:inset 0 0 0 2px #4de0e8;background:#4de0e81a}.point.last{background:#efc66c33}.bar{grid-column:7;grid-row:1/3;padding:2px;min-width:0;background:#4b2c21;border:1px solid #8c5b3a;border-radius:3px;font-size:10px;display:flex;flex-direction:column;justify-content:center;gap:10px;align-items:center}.bar.active{outline:2px solid #ffd36a}.bar span{overflow-wrap:anywhere}.console{padding:9px 0;justify-content:space-between}#dice{display:flex;gap:5px;min-height:34px;align-items:center}.die{display:grid;place-items:center;background:#f6e4be;color:#2b1912;border:1px solid #ab8142;border-radius:6px;width:32px;height:32px;font-size:20px;font-weight:600}.actions{margin:6px 0}.actions button{flex:1}#choices{display:flex;flex-wrap:wrap;gap:6px}#choices:empty{display:none}#choices button{min-height:44px;border-color:#4de0e8}.auto{display:flex;gap:8px;align-items:center;margin:10px 0}.auto input{width:20px;height:20px}details{color:#bcc9d6;font-size:13px;margin-top:8px}summary{cursor:pointer;padding:7px 0}dialog{background:#172b40;color:#fff;border:1px solid #d4b274;border-radius:12px;max-width:calc(100% - 28px)}dialog::backdrop{background:#000a}[hidden]{display:none!important}@media(max-width:480px){main{padding:8px}header img{width:145px}.toolbar{gap:5px}.toolbar button{padding:7px 9px;font-size:12px}.toolbar select{padding:6px}.score{font-size:12px}#board{border-width:5px;grid-template-columns:repeat(6,minmax(0,1fr)) 20px repeat(6,minmax(0,1fr));padding:2px;height:290px}.checker{width:94%;max-width:24px}.console{gap:5px}#bar-info{font-size:12px}.actions button{padding:7px 5px;font-size:13px}.die{width:27px;height:29px}.title span{font-size:11px}}@media(prefers-reduced-motion:no-preference){.point.last{transition:background .25s}.checker{animation:appear .15s ease-out}@keyframes appear{from{opacity:.65}to{opacity:1}}}


/* V11: viewport shell. Board middle row reserves space for dice/actions. */
body{background:radial-gradient(ellipse at 40% 0,#203448,#0a1522 70%);height:100dvh;overflow:hidden}
.shell{max-width:1560px;height:100dvh;padding:8px 18px;display:flex;flex-direction:column;gap:8px}
header{flex:none;height:46px;flex-wrap:nowrap;border-bottom:1px solid #b48a4c45;padding-bottom:6px}
header img{width:142px;height:42px;object-fit:contain}
header>a:nth-of-type(2){margin-left:auto;font-size:13px}
.practice{font-size:12px;color:#bac4d0}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:16px;min-height:0;flex:1}
.game-area{display:flex;flex-direction:column;min-height:0;min-width:0;gap:5px}
.players{display:flex;justify-content:space-between;align-items:center;min-height:44px;padding:5px 12px;background:#17283c;border:1px solid #ac844a66;border-radius:8px}
.players>div{min-width:0;max-width:34%}.players strong{font-size:14px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.players small{display:block;color:#b8c3d0;font-size:11px}.match{text-align:center}.opponent{text-align:right}#score{font-size:15px;color:#f2d299;white-space:nowrap}
.game-settings{display:flex;gap:7px;align-items:center;height:30px;flex:none}.game-settings label{font-size:12px}.game-settings .practice{margin-left:auto}
button,select{min-height:30px;padding:4px 10px;font-size:12px;font-weight:600;border-color:#92764c;background:linear-gradient(#253a4d,#17283b)}
select{background:#17283b}.gold{background:linear-gradient(#f4d793,#c3984c)!important}
#status{margin:0;min-height:18px;font-size:12px;line-height:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.table{position:relative;flex:1;min-height:0;container-type:size}
#board{width:100%;height:100%;min-height:0;border:12px solid #805334;border-radius:9px;padding:4px;grid-template-columns:repeat(6,minmax(0,1fr)) 30px repeat(6,minmax(0,1fr));grid-template-rows:minmax(0,1fr) 56px minmax(0,1fr);background:radial-gradient(ellipse,#4b2523,#2b1416);box-shadow:inset 0 0 0 2px #ce9a58,0 3px 12px #0006}
.point:before{background:linear-gradient(#d1a460,#9c6c32)}.point:nth-child(even):before{background:linear-gradient(#9e3c39,#631b26)}
.bar{grid-row:1/4;justify-content:flex-start;padding-top:10px;writing-mode:vertical-rl;background:linear-gradient(90deg,#513222,#946744,#4d2c20)}
.checker{width:min(88%,36px,calc((100cqh - 144px)/10));max-width:none}
.center-controls{position:absolute;left:18px;right:18px;top:50%;transform:translateY(-50%);height:50px;display:flex;align-items:center;justify-content:center;gap:9px;pointer-events:none}
.center-controls>*{pointer-events:auto}.center-controls button{height:35px;min-width:88px;background-color:#142438}
#dice{min-height:30px;gap:4px}.die{width:29px;height:30px;font-size:21px;box-shadow:0 2px 5px #0007}
.move-controls{display:flex;gap:7px;align-items:center;height:38px;flex:none;min-width:0}
#bar-info{font-size:11px;color:#aebbc8;white-space:nowrap}#choices{flex:1;flex-wrap:nowrap;overflow:auto;min-width:0}
#choices button{white-space:nowrap;min-height:30px;font-size:12px;padding:4px 7px}
#off{margin-left:auto;white-space:nowrap}
.bottom-controls{display:flex;align-items:center;justify-content:center;gap:16px;min-height:37px;flex:none;border-top:1px solid #ac844a55;padding-top:4px}
.bottom-controls label{display:flex;align-items:center;gap:5px;font-size:12px;white-space:nowrap}.bottom-controls input{width:16px;height:16px;accent-color:#dbb369;margin:0}.bottom-controls a{font-size:12px}
.ad{display:flex;align-items:center;justify-content:center;flex-direction:column;border:1px solid #ae864966;border-radius:7px;background:#152438;color:#c1aa7d;font-size:13px;letter-spacing:.5px}.ad small{font-size:10px;color:#93a0ae;letter-spacing:0}
.horizontal{height:58px;flex:none;margin-top:3px}.sidebar{display:flex;flex-direction:column;min-height:0;gap:10px}.chat{display:flex;flex-direction:column;flex:1;min-height:0;background:#142337;border:1px solid #b59155;border-radius:9px}
.chat-heading{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid #ad8a4d55}.chat h1{font-size:16px;margin:0;color:#e5c98c}
.empty-chat{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#c3cbd6;font-size:13px;text-align:center}.empty-chat span{font-size:35px;color:#ae8c54}.empty-chat p{margin:10px 0 3px}.empty-chat small{font-size:12px;color:#98a6b8}
.chat-footer{font-size:11px;color:#9aa9ba;padding:12px;border-top:1px solid #ad8a4d33}.side-ad{height:126px;flex:none}
#chat-toggle,#chat-close{display:none}.pro [data-shell-ad]{display:none}
@media(max-width:1050px){.layout{grid-template-columns:minmax(0,1fr) 210px;gap:10px}.shell{padding:6px 10px}.bottom-controls{gap:10px}}
@media(max-width:760px){.shell{padding:5px 7px;gap:5px}.layout{display:flex}.game-area{width:100%}header{height:42px;gap:8px}header img{width:116px;height:36px}header .practice{display:none}header>a:nth-of-type(2){font-size:12px}#chat-toggle,#chat-close{display:block}.sidebar{display:contents}.side-ad{display:none}.chat{display:none;position:fixed;z-index:10;right:8px;top:54px;bottom:65px;width:min(310px,calc(100vw - 16px));box-shadow:0 0 0 100vmax #0009}.chat.open{display:flex}.players{padding:4px 8px;min-height:43px}.players strong{font-size:12px}#score{font-size:13px}.game-settings .practice{font-size:10px}.game-settings{gap:5px}#board{border-width:6px;padding:2px;grid-template-columns:repeat(6,minmax(0,1fr)) 22px repeat(6,minmax(0,1fr));grid-template-rows:minmax(0,1fr) 54px minmax(0,1fr)}.checker{width:min(94%,36px,calc((100cqh - 96px)/10))}.center-controls{left:9px;right:9px;gap:5px}.center-controls button{min-width:0;padding:5px 7px;font-size:12px}.die{width:23px;height:27px;font-size:18px}#dice{gap:2px}#bar-info{display:none}.bottom-controls{gap:8px;justify-content:space-between}.bottom-controls button{padding:4px 6px;font-size:11px}.bottom-controls label{font-size:11px;gap:3px}.horizontal{height:40px}.move-controls{height:34px}#status{font-size:11px}}
@media(max-height:560px){.shell{gap:3px;padding-top:3px;padding-bottom:3px}header{height:30px}header img{height:28px;width:105px}.players{min-height:32px;padding:2px 8px}.players small{font-size:10px}.game-settings{height:25px}.game-settings button,.game-settings select{min-height:24px;padding:2px 6px}.game-area{gap:2px}.horizontal{height:27px;margin:0}.ad small{display:none}.bottom-controls{min-height:29px;padding-top:1px}.move-controls{height:28px}.move-controls button{min-height:26px}.center-controls{height:36px}.center-controls button{height:29px;min-height:29px}#board{grid-template-rows:minmax(0,1fr) 38px minmax(0,1fr);border-width:5px}.checker{width:min(90%,30px,calc((100cqh - 78px)/6));margin-top:-2px}.point{padding-top:11px}.point.bottom{padding-bottom:11px}.number{font-size:8px}.point:before{inset:10px 1px 0}.point.bottom:before{inset:0 1px 10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}@media(max-height:560px){
.layout{display:flex}.game-area{width:100%}.sidebar{display:contents}.side-ad{display:none}
#chat-toggle,#chat-close{display:block}.chat{display:none;position:fixed;z-index:10;right:8px;top:38px;bottom:12px;width:min(310px,calc(100vw - 16px));box-shadow:0 0 0 100vmax #0009}.chat.open{display:flex}
.players{min-height:30px}.players strong{font-size:12px}.players small{font-size:10px}.game-settings{height:24px}
#board .checker{width:min(88%,26px);margin-top:clamp(-24px,calc((100cqh - 140px)/8 - 32.5px),0px)}
#board .checker:nth-child(2){margin-top:0}
#board .bottom .checker{margin-top:0;margin-bottom:clamp(-24px,calc((100cqh - 140px)/8 - 32.5px),0px)}
#board .bottom .checker:nth-child(2){margin-bottom:0}
}
@media(max-height:360px){
header{height:24px}header img{height:23px}.players{min-height:25px;height:25px}.players small{display:none}.players strong,#score{font-size:12px;line-height:1.1}.game-settings{height:23px}
.horizontal{height:20px}.ad{font-size:10px}.bottom-controls{min-height:27px}
#board .checker{width:18px;margin-top:clamp(-16px,calc((100cqh - 116px)/8 - 22.5px),0px)}
#board .bottom .checker{margin-top:0;margin-bottom:clamp(-16px,calc((100cqh - 116px)/8 - 22.5px),0px)}
#board .checker:nth-child(2){margin-top:0}#board .bottom .checker:nth-child(2){margin-bottom:0}
}
.bar{display:block;writing-mode:vertical-rl;text-align:start;padding-top:8px}
body{background:radial-gradient(ellipse at 45% 0,#092440,#020f1c 85%)}
.players{background:linear-gradient(110deg,#0e253b,#041526 50%,#0e253b);box-shadow:inset 0 1px #e6c58b22,0 3px 8px #0003;min-height:58px}
.players>.player{display:flex;align-items:center;gap:10px;max-width:36%;width:36%}.player>div{min-width:0}.opponent{justify-content:flex-end}
.avatar{width:42px;height:42px;flex:none;display:grid;place-items:center;background:radial-gradient(circle at 30% 20%,#506376,#142336);border:2px solid #bd9657;border-radius:50%;box-shadow:0 0 0 3px #0003}
.avatar svg{width:28px;height:28px;fill:#d6c39f}
#score{font-size:25px;font-weight:600;letter-spacing:4px;color:#f4daa4;text-shadow:0 2px 3px #000}
#status{height:16px;min-height:16px;color:#c5b391}#bar-info{display:none}
.table{background:repeating-linear-gradient(3deg,#ad713b22 0 1px,#49210c22 2px 3px),linear-gradient(100deg,#60351c,#bd8247 20%,#704226 50%,#aa703b 80%,#55321f);padding:5px;border-radius:10px;box-shadow:inset 0 1px 3px #e8af6d,0 6px 15px #0008}
#board{border-color:#80502b;grid-template-columns:repeat(6,minmax(0,1fr)) 140px repeat(6,minmax(0,1fr));background:repeating-linear-gradient(89deg,#0001 0 1px,#bc71340b 2px 4px),radial-gradient(ellipse,#59301d,#23100d);box-shadow:inset 0 0 0 2px #d9a461,0 0 0 1px #d7a66b55}
.point:before{background:repeating-linear-gradient(89deg,#c78a4611 0 1px,#ffda8a11 2px 3px),linear-gradient(#e0a54d,#a66c27)}
.point:nth-child(even):before{background:repeating-linear-gradient(89deg,#0001 0 1px,#db634311 2px 4px),linear-gradient(#a82e2b,#67171e)}
.bar{background:repeating-linear-gradient(89deg,#b67b3822 0 1px,#27120b11 2px 5px),linear-gradient(90deg,#422210,#754623,#422210);border:1px solid #b17a3f;writing-mode:horizontal-tb;text-align:center;padding-top:9px}
.center-controls{left:50%;right:auto;top:50%;transform:translate(-50%,-50%);width:130px;height:auto;flex-direction:column;gap:7px}
.center-controls button{height:36px;width:125px;padding:6px 10px;font-size:13px;border-radius:7px;box-shadow:0 3px 5px #0007,inset 0 1px #fff2}
#roll{border:1px solid #ffe1a0;background:linear-gradient(#ffe7ad,#efbf58 55%,#ba852c)!important;color:#35230e;font-size:16px;text-shadow:0 1px #ffe4ad}
.die{display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);padding:5px;width:35px;height:35px;background:linear-gradient(135deg,#fff6dc,#eacb8a);border:1px solid #c79d59;border-radius:7px;gap:2px}
.die i{width:5px;height:5px;border-radius:50%;background:#382311;align-self:center;justify-self:center;box-shadow:inset 0 1px #0008}
#dice{flex-wrap:wrap;max-width:90px;justify-content:center}
.bottom-controls{gap:8px;justify-content:space-evenly;background:linear-gradient(#102a42,#061626);padding:5px 8px;border:1px solid #a8874a55;border-radius:8px;min-height:44px}
.bottom-controls button,.bottom-controls a,.bottom-controls label{padding:4px 10px;min-height:30px;display:flex;align-items:center;justify-content:center;gap:7px;font-size:12px}
.bottom-controls a{text-decoration:none;border:1px solid #a54d4a;border-radius:7px;background:#231a28;color:#ff8580}
.bottom-controls button:before{font-size:18px}#sound:before{content:"♫";color:#e5c68e}
.bottom-controls label:before{content:"⚄";font-size:20px;color:#d6e1ee}.bottom-controls label:last-of-type:before{content:"▤"}
.bottom-controls input{appearance:none;width:32px;height:18px;background:#101f30;border:1px solid #647486;border-radius:15px;position:relative;flex:none;cursor:pointer}
.bottom-controls input:before{content:"";position:absolute;width:12px;height:12px;top:2px;left:2px;border-radius:50%;background:linear-gradient(#d2deea,#8495a8);transition:transform .15s}
.bottom-controls input:checked{background:#806333;border-color:#ddbd7d}.bottom-controls input:checked:before{transform:translateX(14px);background:#ffe3a0}
.move-controls{height:30px}#choices button{border-color:#aa8c59;background:#182b3d;font-size:11px;min-height:26px;padding:3px 8px}
.empty-chat{padding:20px;color:#aebdcc}.empty-chat p{max-width:180px;line-height:1.6}.chat{background:linear-gradient(125deg,#0d243a,#031323 60%,#092036)}
.ad{background:radial-gradient(circle,#b6a16a10 1px,transparent 1.5px) 0 0/7px 7px,linear-gradient(125deg,#142237,#1b3046,#132238);border-color:#b9945288;color:#b1b9c4}
@media(max-width:760px){
.players{min-height:53px}.avatar{width:30px;height:30px}.avatar svg{width:21px;height:21px}.players>.player{gap:5px}#score{font-size:20px;letter-spacing:1px}.players strong{font-size:11px}.players small{font-size:10px}
.bottom-controls{gap:1px;padding:4px 2px}.bottom-controls button,.bottom-controls a,.bottom-controls label{font-size:10px;padding:3px 4px;gap:3px}.bottom-controls label:before{display:none}.bottom-controls input{width:27px;height:16px}.bottom-controls input:before{width:10px;height:10px}.bottom-controls input:checked:before{transform:translateX(11px)}
.center-controls{left:9px;right:9px;top:50%;width:auto;height:40px;transform:translateY(-50%);flex-direction:row;gap:5px}.center-controls button{height:34px;width:auto;padding:4px 8px;font-size:12px}#roll{font-size:13px;min-width:66px}
#board{grid-template-columns:repeat(6,minmax(0,1fr)) 22px repeat(6,minmax(0,1fr))}.bar{writing-mode:vertical-rl;text-align:start}
.die{width:28px;height:28px;padding:4px;gap:1px}.die i{width:4px;height:4px}#dice{flex-wrap:nowrap;max-width:none}
.table{flex:0 1 auto;aspect-ratio:1.05;max-height:calc(100dvh - 294px);min-height:200px;width:100%;padding:2px;margin:auto 0}
.checker{width:min(94%,28px,calc((100cqh - 130px)/10))}
.horizontal{margin-top:auto}.move-controls{height:30px}
}
@media(max-height:560px){
.table{flex:1;aspect-ratio:auto;max-height:none;min-height:0;margin:0}.players{min-height:34px}.avatar{width:25px;height:25px}.avatar svg{width:18px;height:18px}#score{font-size:17px}.bottom-controls{min-height:30px;padding:1px 3px}.bottom-controls button,.bottom-controls a,.bottom-controls label{min-height:25px;padding:2px 6px}.center-controls{left:9px;right:9px;width:auto;height:36px;transform:translateY(-50%);flex-direction:row}.center-controls button{height:29px;min-height:29px;width:auto}.die{width:27px;height:27px;padding:4px}.die i{width:4px;height:4px}#dice{flex-wrap:nowrap;max-width:none}
#board{grid-template-columns:repeat(6,minmax(0,1fr)) 25px repeat(6,minmax(0,1fr))}.bar{writing-mode:vertical-rl;text-align:start}
}
@media(max-height:360px){.players{height:27px;min-height:27px}.avatar{width:22px;height:22px}.avatar svg{width:16px;height:16px}.bottom-controls{min-height:27px}.move-controls{height:26px}}
@media(max-width:760px) and (min-height:561px){.table{aspect-ratio:.88}}
@media(max-height:360px){
#board .checker{width:14px;margin-top:clamp(-13px,calc((100cqh - 124px)/8 - 17.5px),0px)}
#board .bottom .checker{margin-top:0;margin-bottom:clamp(-13px,calc((100cqh - 124px)/8 - 17.5px),0px)}
#board .checker:nth-child(2){margin-top:0}#board .bottom .checker:nth-child(2){margin-bottom:0}
}

.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.arena{display:flex;align-items:center;justify-content:center;gap:9px;flex:1;min-height:0;container-type:size}
.arena .table{flex:none;width:min(calc(100% - 242px),calc(100cqh * 1.3));height:auto;aspect-ratio:1.3;min-height:0;max-height:100%;margin:0}
.profile-card{height:min(100%,calc((100cqw - 242px)/1.3));width:112px;flex:none;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;padding:12px 8px;border:1px solid #b98b44;border-radius:10px;background:linear-gradient(110deg,#0c253e,#031321);font-size:12px;text-align:center;min-width:0}
.profile-card .avatar{width:64px;height:64px}.profile-card .avatar svg{width:40px;height:40px}.profile-card strong{font-size:14px;max-width:100%;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.profile-card .balance{padding:4px 5px;color:#f5d684;border:1px solid #7c633d;border-radius:7px;max-width:100%;overflow-wrap:anywhere}
.player-score{font-size:32px;color:#e8bc62;border-top:1px solid #b98b4488;margin-top:8px;padding-top:10px;width:80%}
.match-info{display:flex;flex-direction:column;align-items:center;gap:0;margin-left:auto}.match-info #score{font-size:14px;letter-spacing:1px}.match-info small{font-size:10px}
.move-controls{height:39px}.move-controls>label{font-size:12px;white-space:nowrap}#choices{flex:0 1 auto;margin-left:8px}.game-settings{height:28px}.game-settings .practice{margin-left:auto}
@media(max-width:1050px){.profile-card{width:90px;font-size:11px;padding:6px;gap:7px}.profile-card .avatar{width:48px;height:48px}.arena .table{width:min(calc(100% - 198px),calc(100cqh * 1.3))}.profile-card{height:min(100%,calc((100cqw - 198px)/1.3))}}
@media(max-width:760px){
.arena{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:70px auto;gap:7px;align-content:center;container-type:size}
.profile-card{width:100%;height:70px;max-height:none;display:grid;grid-template-columns:34px minmax(0,1fr) 24px;grid-template-rows:repeat(3,1fr);gap:1px 4px;padding:4px;font-size:9px;text-align:left;align-items:center}
.profile-card .avatar{width:30px;height:30px;grid-row:1/4;grid-column:1}.profile-card .avatar svg{width:22px;height:22px}.profile-card strong{font-size:11px;grid-column:2;grid-row:1;white-space:nowrap;text-overflow:ellipsis;display:block}
.profile-card>span:not(.avatar){font-size:9px}.profile-card>span:nth-of-type(2){grid-column:2;grid-row:2}.profile-card>span:nth-of-type(3){grid-column:2;grid-row:3}.profile-card .balance,.profile-card>span:nth-of-type(5),.profile-card>span:nth-of-type(6),#bot-off{display:none}
.player-score{grid-column:3;grid-row:1/4;font-size:20px;width:auto;padding:0;margin:0;border:0}
.human-card{grid-row:1;grid-column:1}.bot-card{grid-row:1;grid-column:2}
.arena .table{grid-row:2;grid-column:1/3;width:min(100%,calc((100cqh - 77px)*1.3));aspect-ratio:1.3;height:auto;max-height:none;justify-self:center;min-height:0}
.move-controls{height:36px}.match-info{margin-left:auto}.match-info #score{font-size:12px}.move-controls select{padding:3px}
#board .checker{width:min(94%,26px,calc((100cqh - 126px)/10))}
}
@media(max-height:560px){
.arena{display:flex;gap:6px}.profile-card{display:flex;width:75px;height:min(100%,calc((100cqw - 162px)/1.3));gap:3px;font-size:9px}.profile-card .avatar{width:26px;height:26px}.profile-card .avatar svg{width:19px;height:19px}.profile-card strong{font-size:10px}.profile-card .balance,.profile-card>span:nth-of-type(5),.profile-card>span:nth-of-type(6),#bot-off{display:none}.player-score{font-size:18px;padding:0;margin:0;border:0}.arena .table{width:min(calc(100% - 162px),calc(100cqh * 1.3));aspect-ratio:1.3;height:auto;min-height:0;max-height:100%}.move-controls{height:29px}.game-settings{height:24px}#board .checker{width:min(90%,18px);margin-top:clamp(-16px,calc((100cqh - 112px)/8 - 22.5px),0px)}#board .bottom .checker{margin-top:0;margin-bottom:clamp(-16px,calc((100cqh - 112px)/8 - 22.5px),0px)}#board .checker:nth-child(2){margin-top:0}#board .bottom .checker:nth-child(2){margin-bottom:0}
}
@media(max-width:760px) and (min-height:561px){.arena{flex:0 0 auto;container-type:inline-size;margin-top:auto;grid-template-rows:70px auto}.arena .table{width:100%;max-height:none}.horizontal{margin-top:auto}}
@media(max-height:560px){.arena .table{width:min(calc(100% - 162px),calc(100cqh * 2.2));aspect-ratio:2.2}.profile-card{height:min(100%,calc((100cqw - 162px)/2.2))}}
@media(max-height:360px){#board .checker{width:12px;margin-top:clamp(-11px,calc((100cqh - 124px)/8 - 15px),0px)}#board .bottom .checker{margin-top:0;margin-bottom:clamp(-11px,calc((100cqh - 124px)/8 - 15px),0px)}#board .checker:nth-child(2){margin-top:0}#board .bottom .checker:nth-child(2){margin-bottom:0}}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
header nav{display:flex;gap:28px}header nav a{display:flex;gap:12px;align-items:center;text-decoration:none;color:#e3ebf6}
header svg{width:28px;height:28px}.settings{margin:0;position:relative}.settings summary{list-style:none;padding:8px;color:#d9b773}.settings .game-settings{position:absolute;right:0;top:100%;z-index:15;background:#10243a;border:1px solid #b38c4c;border-radius:8px;padding:12px;width:250px;height:auto;flex-wrap:wrap;box-shadow:0 5px 20px #0009}
.chat-compose{display:flex;margin:12px;gap:8px;border:1px solid #476078;padding:8px;border-radius:10px;background:linear-gradient(#10283e,#051424)}.chat-compose input{min-width:0;width:100%;background:none;border:0;font:inherit;color:#a6b6c8}.chat-compose button{width:50px;height:50px;background:linear-gradient(#ffe39c,#c88c2e);color:#16283a;opacity:.65}.chat-compose svg{width:30px;height:30px}
.player-score{background:url(laurel-v13.svg) center/contain no-repeat;border:0;padding:22px 0 0;min-height:90px}
.profile-card .avatar{background:radial-gradient(circle at 40% 20%,#8091a1,#273d53 45%,#081628 75%);border:3px solid #e5ad49;box-shadow:inset 0 0 0 3px #5e3c1d,0 0 0 2px #754822,0 4px 12px #000b}
@media(min-width:1000px){
body{display:flex;align-items:center;justify-content:center;overflow:hidden;background:#03162b}
.shell{width:1672px;min-width:1672px;height:941px;max-width:none;max-height:none;flex:none;padding:0;gap:0;transform:scale(var(--reference-scale,1));transform-origin:center;position:relative;background:radial-gradient(ellipse at 40% -10%,#0a2c4e,#021426 68%)}
header{height:90px;padding:0 44px;border-bottom:2px solid #8c622c;gap:40px;flex:none}
header img{width:300px;height:86px;object-fit:contain}header nav{gap:42px}header nav a{font-size:22px;gap:16px}header nav svg{width:31px;height:31px}
header>a:nth-of-type(2){font-size:19px;margin-left:0}.settings{margin-left:auto}
.layout{position:absolute;left:28px;top:106px;right:30px;bottom:31px;display:grid;grid-template-columns:1226px 374px;gap:14px;flex:none}
.game-area{display:grid;grid-template-rows:570px 63px 70px 76px;gap:9px;min-height:0}
#status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);margin:0}
.arena{display:grid;grid-template-columns:144px minmax(0,1fr) 132px;gap:10px;container-type:normal;align-items:stretch;flex:none}
.arena .table{width:100%;height:570px;aspect-ratio:auto;max-height:none;min-height:0;grid-column:2;grid-row:1;margin:0;padding:5px;background:url(wood-v13.svg),#a66330;border-radius:15px;box-shadow:inset 0 0 0 2px #dc9b5b,inset 0 0 14px #3e180b,0 4px 10px #0009}
.profile-card{width:100%;height:570px;max-height:none;padding:40px 8px 20px;gap:13px;font-size:18px;justify-content:flex-start;border-radius:12px;border-color:#d6a454;background:linear-gradient(110deg,#0b233c,#011426);text-align:center}
.human-card{grid-column:1;grid-row:1}.bot-card{grid-column:3;grid-row:1}
.profile-card .avatar{width:108px;height:108px;flex:none;margin:7px 0 12px}.profile-card .avatar svg{width:72px;height:72px;fill:#dec188;filter:drop-shadow(0 2px 3px #000)}
.profile-card strong{font-size:22px;line-height:1.15;max-width:100%}.profile-card .balance{font-size:19px;padding:5px 8px;background:#001629;border:1px solid #27415b;color:#ffdc7a;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.profile-card .player-score{margin-top:auto;font-size:46px;width:116px;height:108px;min-height:108px;padding-top:30px;line-height:1}
.profile-card>small{font-size:12px;margin-top:-7px}
#board{height:100%;width:100%;border:13px solid #8a4d23;border-radius:10px;padding:6px;grid-template-columns:repeat(6,minmax(0,1fr)) 70px repeat(6,minmax(0,1fr));grid-template-rows:minmax(0,1fr) 40px minmax(0,1fr);background:linear-gradient(#431d0c77,#431d0c77),url(wood-v13.svg);box-shadow:inset 0 0 0 2px #d79751,inset 0 0 14px #130701,0 0 0 1px #efb56c}
.point:before{background:linear-gradient(#f5bc5855,#f5bc5888),url(wood-v13.svg);inset:21px 0 0}.point:nth-child(even):before{background:linear-gradient(#961b22e6,#6c1018e6),url(wood-v13.svg)}
.point.bottom:before{inset:0 0 21px}.point{padding:22px 0 0}.point.bottom{padding:0 0 22px}.number{font-size:14px;line-height:20px;color:#f1dfc1}
.checker{width:44px;height:44px;max-width:90%;flex:none;border:1px solid #986931;background:radial-gradient(circle at 32% 25%,#fffde9 4%,#fff0bb 36%,#d6ac62 78%,#97682e);box-shadow:inset 0 1px 2px #fff,0 3px 5px #160a03bb}
.checker.dark{background:radial-gradient(circle at 34% 24%,#94aabd 0%,#233e59 28%,#07182a 65%,#010a11);border:1px solid #aebbc8;box-shadow:inset 0 1px 2px #eff8ff99,0 3px 5px #000c}
.bar{background:linear-gradient(90deg,#3b180d55,#68341322,#1c0b0755),url(wood-v13.svg);border:1px solid #ad6e37;writing-mode:horizontal-tb;font-size:11px;color:#cd9c63;padding-top:5px}
.center-controls{width:172px;gap:9px}.center-controls button{width:164px;height:49px;font-size:20px;font-weight:600;border-radius:9px;box-shadow:0 4px 5px #0009,inset 0 1px 2px #fff5}
#roll{font-size:25px;height:51px;color:#201400;border:2px solid #ffe5a4;background:linear-gradient(#ffe096,#eeb74b 53%,#c08122)!important}
#end{background:linear-gradient(#293e58,#0c2036);color:#dbe5f1;border:1px solid #7791ac}
button:disabled{opacity:.65}.center-controls button:disabled{opacity:.72}
.die{width:54px;height:54px;padding:8px;gap:3px;border-radius:10px;box-shadow:inset 0 2px 3px #fff,0 4px 5px #0009}.die i{width:9px;height:9px;background:#09111b}.center-controls #dice{max-width:120px;gap:12px;min-height:54px}
.move-controls{height:63px;border:1px solid #6d8ca6;border-radius:12px;background:linear-gradient(#0c253d,#031526);padding:4px 65px;gap:20px;justify-content:space-between}
.move-controls>label{font-size:21px;border:1px solid #d9a141;border-radius:10px;padding:8px 24px;background:#031628;min-width:210px;text-align:center}
.move-controls select{font-size:21px;color:#ffd26a;border:0;padding:0 8px;background:#031628;min-height:30px}
#off{min-width:280px;height:51px;font-size:22px;color:#e5efff;border:1px solid #d5a44d;border-radius:11px;background:linear-gradient(#102c47,#03172a)}
.match-info{margin:0}.match-info #score{font-size:19px}.match-info small{font-size:12px}#choices{position:absolute;left:165px;bottom:234px;z-index:3;max-width:650px;margin:0}
#choices button{font-size:13px;background:#072038ee}
.bottom-controls{height:70px;min-height:70px;gap:23px;padding:7px 12px;border:1px solid #2b4b68;background:linear-gradient(#0b2540,#021327)}
.bottom-controls button,.bottom-controls a,.bottom-controls label{height:53px;min-height:53px;font-size:17px;padding:8px 22px;border:1px solid #3e5c78;border-radius:10px;background:linear-gradient(#102d49,#03182b);gap:15px;flex:1;white-space:nowrap}
.bottom-controls label{flex:1.3}.bottom-controls a{color:#ff7370;border-color:#9b3039;background:linear-gradient(#241a2b,#10172b)}.bottom-controls label:before{font-size:29px}#sound:before{font-size:27px}.bottom-controls input{width:50px;height:28px}.bottom-controls input:before{width:20px;height:20px;top:3px;left:3px}.bottom-controls input:checked:before{transform:translateX(22px)}
.horizontal{height:76px;margin:0;font-size:20px;border-radius:12px;border:1px solid #c38d3f}.sidebar{gap:16px}.chat{border-color:#d4a457;border-radius:12px}.chat-heading{padding:16px 20px;height:55px;flex:none}.chat h1{font-size:25px;color:#e9f0fa;font-weight:600}.empty-chat{font-size:17px}.empty-chat p{max-width:250px}
.chat-compose{height:79px;margin:12px;padding:9px;flex:none}.chat-compose input{font-size:17px}.chat-compose button{width:58px;height:57px;flex:none}
.side-ad{height:116px;font-size:19px;border:1px solid #c38d3f;border-radius:12px}
}
@media(max-width:999px){header nav{display:none}.settings{margin-left:auto}header>a:nth-of-type(2){margin-left:0}.profile-card .player-score{background:none;min-height:0}.chat-compose{margin:7px;padding:5px}.chat-compose button{width:35px;height:35px}.chat-compose input{font-size:12px}}
@media(min-width:1000px){
.shell{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--reference-scale,1));transform-origin:center}
#board{grid-template-columns:repeat(6,minmax(0,1fr)) 100px repeat(6,minmax(0,1fr))}
.checker{width:40px;height:40px}
.center-controls{width:134px}.center-controls button{width:130px;font-size:18px}#roll{font-size:23px}
}
#undo span,#exit span{display:none}
.bottom-controls #undo:before,.bottom-controls #exit:before,.bottom-controls label:before,.bottom-controls #sound:before{content:"";display:block;flex:none;width:26px;height:26px;background:center/contain no-repeat}
.bottom-controls #undo:before{background-image:url(undo-v13.svg)}
.bottom-controls label:before{background-image:url(dice-v13.svg)}
.bottom-controls label:last-of-type:before{background-image:url(stack-v13.svg)}
.bottom-controls #sound:before{background-image:url(sound-v13.svg)}
.bottom-controls #exit:before{background-image:url(exit-v13.svg)}
@media(max-width:999px){.bottom-controls label:before{display:none}.bottom-controls #undo:before,.bottom-controls #exit:before,.bottom-controls #sound:before{width:15px;height:15px}}
/* Board materials only: preserve every dimension and hit target. */
.arena .table{background-image:linear-gradient(90deg,#54220c55,#b8793540 20%,#4a1b0755 50%,#b5783340 80%,#431b0c66),url(wood-v13.svg);background-color:#713b1b;box-shadow:inset 0 1px 2px #e6b575,inset 0 -3px 5px #321207,inset 3px 0 4px #c48a4a,inset -3px 0 5px #3c180b,0 5px 9px #0009}
#board{border-color:#703615;background-image:linear-gradient(90deg,#291006b3,#431c0bd4 50%,#2e1108b8),url(wood-v13.svg);background-color:#38180d;box-shadow:inset 0 0 0 2px #b7783b,inset 0 3px 8px #170803,inset 0 -2px 4px #e4ab6066,0 0 0 1px #e2a35c}
.point:before{background-image:linear-gradient(100deg,#e8a348b0,#efb652c9 55%,#b7752dcc),url(wood-v13.svg)}
.point:nth-child(even):before{background-image:linear-gradient(100deg,#54111adf,#8c1823ee 55%,#5c1019e6),url(wood-v13.svg)}
.bar{background-image:linear-gradient(90deg,#2c1108c4,#47200dc9 45%,#271007c9),url(wood-v13.svg);border-color:#93562d;box-shadow:inset 1px 0 3px #cd8e4c55,inset -2px 0 4px #16070299}
.checker{background:radial-gradient(ellipse at 34% 22%,#fffef0 0%,#fff7d8 26%,#f5df9e 58%,#d2ab60 80%,#92602b 100%);border-color:#ad7835;box-shadow:inset 0 2px 3px #fffef7,inset 0 -2px 3px #ab783255,0 3px 4px #140800c9}
.checker.dark{background:radial-gradient(ellipse at 32% 20%,#b5cad9 0%,#53728d 15%,#18334d 36%,#061629 66%,#01070e 100%);border-color:#9baebf;box-shadow:inset 0 1px 3px #e4f4ff99,inset 0 -2px 3px #000a,0 3px 5px #000c}
.die{background:linear-gradient(135deg,#fffdf0 0%,#fff1c8 42%,#e7c88b 90%);border-color:#be9653;box-shadow:inset 0 2px 3px #fffef5,inset 0 -2px 2px #bc8a4255,0 4px 6px #140803c9}
.die i{background:radial-gradient(circle at 45% 65%,#18232c,#02060b);box-shadow:inset 0 1px 2px #000,0 1px #fff9}
#roll{background:linear-gradient(#ffe69d 0%,#f6c562 16%,#edb74c 55%,#c88a28 100%)!important;color:#130d05;border-color:#ffe8ac;box-shadow:inset 0 2px 2px #fff2be,inset 0 -2px 2px #a36b1e,0 3px 0 #734819,0 5px 7px #0009;text-shadow:0 1px #ffde8c}
#end{background:linear-gradient(#30445f 0%,#182d48 42%,#091c32 100%);border-color:#647d98;color:#e5edf7;box-shadow:inset 0 1px 2px #b4c6de66,inset 0 -2px 2px #031020,0 3px 5px #0009}
.center-controls button:disabled{opacity:1;filter:saturate(.72) brightness(.86);cursor:not-allowed}
/* Natural walnut: material replacement, no geometry changes. */
.arena .table{background-image:linear-gradient(90deg,#4e210e44,#d5903b33 20%,#30110755 50%,#b7773233 80%,#36150955),url(wood-natural-v13.png);background-size:cover;background-position:center}
#board{background-image:linear-gradient(90deg,#1b0a0440,#39170722 50%,#200c044d),url(wood-natural-v13.png);background-size:cover;background-position:center}
.point:before{background-image:linear-gradient(100deg,#eeb25ce0,#f0ba60e6 55%,#c58b3edb),url(wood-natural-v13.png);background-size:auto,500px 700px}
.point:nth-child(even):before{background-image:linear-gradient(100deg,#64121bda,#8b1a25e8 55%,#590d17df),url(wood-natural-v13.png)}
.bar{background-image:linear-gradient(90deg,#220c0655,#4b220d22 45%,#1f0b0655),url(wood-natural-v13.png);background-size:auto,400px 650px;background-position:center}
#board .number{color:#fff;left:0;right:0;text-align:center;background:linear-gradient(#2c1108bb,#3d1b0bbb),url(wood-natural-v13.png) center/300px 220px;z-index:2}
#dice.thrown-dice{position:absolute;left:25%;top:50%;transform:translate(-50%,-50%);z-index:4;display:flex;flex-wrap:nowrap;gap:9px;max-width:none;pointer-events:none;min-height:0}
#dice.thrown-dice .die{width:42px;height:42px;padding:6px}
#dice.thrown-dice .die i{width:7px;height:7px}
.dice-remaining{position:absolute;top:100%;left:50%;transform:translateX(-50%);font-size:10px;white-space:nowrap;color:#f8e6bd;text-shadow:0 1px 3px #000;background:#261208b3;border-radius:3px;padding:1px 4px}
#dice.rolling .die{animation:dice-toss .42s cubic-bezier(.18,.72,.32,1) both}
#dice.rolling .die:nth-child(2){animation-name:dice-toss-second}
@keyframes dice-toss{0%{transform:translate(-70px,20px) rotate(-210deg) scale(.65);opacity:.2}45%{transform:translate(-20px,-14px) rotate(-65deg) scale(1.1);opacity:1}76%{transform:translate(3px,2px) rotate(12deg) scale(.96)}100%{transform:none}}
@keyframes dice-toss-second{0%{transform:translate(-90px,15px) rotate(245deg) scale(.7);opacity:.2}50%{transform:translate(-10px,-8px) rotate(55deg) scale(1.08);opacity:1}78%{transform:translate(2px,3px) rotate(-9deg)}100%{transform:none}}
.center-controls{flex-direction:column!important;left:50%!important;right:auto!important;transform:translate(-50%,-50%)!important;height:auto!important}
@media(max-width:999px){.center-controls{width:76px;gap:4px}.center-controls button,#roll{width:76px;min-width:0;font-size:10px;height:27px;min-height:27px;padding:3px}.thrown-dice .dice-remaining{font-size:8px}#dice.thrown-dice{gap:5px;left:24%}#dice.thrown-dice .die{width:25px;height:25px;padding:4px}#dice.thrown-dice .die i{width:4px;height:4px}}
@media(prefers-reduced-motion:reduce){#dice.rolling .die{animation:none!important}}
.point.selected,.point.destination,.point.last{box-shadow:none!important;background:none!important}
.point.selected:before,.point.destination:before,.point.bot-source:before,.point.bot-target:before{filter:drop-shadow(0 0 4px var(--point-glow));}
.point.selected,.point.bot-source{--point-glow:#ffd36a}
.point.destination,.point.bot-target{--point-glow:#75eaff}
.point.selected:after,.point.destination:after,.point.bot-source:after,.point.bot-target:after{content:"";position:absolute;inset:15px 1px 0;pointer-events:none;z-index:0;background:linear-gradient(90deg,transparent,var(--point-glow),transparent);opacity:.7;clip-path:polygon(0 0,100% 0,50% 100%,0 0,4% 2%,50% 93%,96% 2%,4% 2%);}
.point.bottom.selected:after,.point.bottom.destination:after,.point.bottom.bot-source:after,.point.bottom.bot-target:after{inset:0 1px 15px;transform:rotate(180deg)}
@media(min-width:1000px){.point.selected:after,.point.destination:after,.point.bot-source:after,.point.bot-target:after{inset:21px 0 0}.point.bottom.selected:after,.point.bottom.destination:after,.point.bottom.bot-source:after,.point.bottom.bot-target:after{inset:0 0 21px}}
.motion-checker{position:fixed!important;z-index:1000!important;pointer-events:none!important;margin:0!important;max-width:none!important;animation:none!important;flex:none!important}
#dice.thrown-dice[data-side="left"]{left:25%}
#dice.thrown-dice[data-side="right"]{left:75%}
@media(max-width:999px){#dice.thrown-dice[data-side="left"]{left:24%}#dice.thrown-dice[data-side="right"]{left:76%}}
@media(prefers-reduced-motion:reduce){.point.bot-source:before,.point.bot-target:before{filter:brightness(1.25)}}
.point.destination,.point.bot-target{--point-glow:#ffe56a}
.point.selected,.point.bot-source{--point-glow:#ffc943}
.point.destination:after,.point.selected:after{opacity:.95}
.point.destination:before,.point.selected:before{filter:drop-shadow(0 0 3px #ffd54d) brightness(1.12)}
#bar{position:relative;overflow:visible}
.bar-pockets{position:absolute;top:calc(50% + 65px);bottom:8px;left:0;right:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:13px;pointer-events:none;writing-mode:horizontal-tb}
.bar-pocket{width:44px;height:44px;display:grid;place-items:center;flex:none;position:relative;visibility:hidden}
.bar-pocket.occupied{visibility:visible}
#bar .bar-pocket .checker{width:37px;height:37px;max-width:none;margin:0;position:relative;display:grid;place-items:center;box-shadow:inset 0 1px 3px #fff8,0 3px 4px #000a}
.bar-count{font:700 16px "Segoe UI",Arial,sans-serif;color:#21130a;text-shadow:0 1px #fff7}
.dark .bar-count{color:#fff;text-shadow:0 1px #000}
#bar.active .bar-pocket[data-bar-owner="0"] .checker{outline:2px solid #ffe56a;outline-offset:2px}
@media(max-width:999px){.bar-pockets{top:calc(50% + 36px);bottom:3px;gap:7px}.bar-pocket{width:21px;height:21px}#bar .bar-pocket .checker{width:18px;height:18px}.bar-count{font-size:10px}}
@media(max-height:560px){.bar-pockets{top:calc(50% + 34px);bottom:1px;gap:2px}.bar-pocket{width:18px;height:16px}#bar .bar-pocket .checker{width:15px;height:15px}.bar-count{font-size:9px}}
@media(max-height:560px){.bar-pockets{top:auto;bottom:5px;left:50%;right:auto;transform:translateX(-50%);flex-direction:row;gap:2px;width:30px;justify-content:center}.bar-pocket{width:14px;height:14px}#bar .bar-pocket .checker{width:13px;height:13px}.bar-count{font-size:8px}}

/* V17 contrast only: no hit-area, layout or game changes. */
.point.destination,.point.bot-target{--point-glow:#39f5ff}
.point.destination:before,.point.bot-target:before{background-image:linear-gradient(#00eaf280,#00dfea99),url(wood-natural-v13.png);filter:brightness(1.18) drop-shadow(0 0 3px #3bf4ff)}
.point.destination:after,.point.bot-target:after{background:#8cffff;opacity:1;clip-path:polygon(0 0,100% 0,50% 100%,0 0,9% 4%,50% 82%,91% 4%,9% 4%);filter:drop-shadow(0 0 3px #00efff);pointer-events:none}
.point.selected:before,.point.bot-source:before{filter:brightness(1.08)}
.point.selected:after,.point.bot-source:after{background:#ffd05a;opacity:1}
.center-controls #roll:enabled{opacity:1;filter:none;border-color:#fff0bb;box-shadow:inset 0 2px 2px #fff2be,inset 0 -2px 2px #a36b1e,0 0 8px #f9cb6577,0 3px 0 #734819}
.center-controls #end:enabled{opacity:1;filter:none;background:linear-gradient(#3d6385,#163652);border-color:#a9dfff;color:#fff;box-shadow:inset 0 1px 2px #c9e7ff88,0 0 7px #88cfff55,0 3px 4px #0008}
.center-controls #roll:disabled,.center-controls #end:disabled{opacity:.38;filter:grayscale(1) brightness(.7);box-shadow:none;text-shadow:none;border-color:#69717a;cursor:not-allowed}
/* V18 calmer targets; button contrast unchanged. */
.point.destination:before,.point.bot-target:before{background-image:linear-gradient(#36c4c52e,#36c4c540),url(wood-natural-v13.png);filter:brightness(1.02)}
.point.destination:after,.point.bot-target:after{background:#75c9c9;opacity:.78;clip-path:polygon(0 0,100% 0,50% 100%,0 0,4% 2%,50% 92%,96% 2%,4% 2%);filter:drop-shadow(0 0 1px #4dbaba66)}
/* V19: neutral translucent shadow, muted blue edge, no glow. */
.point.destination:before,.point.bot-target:before{background-image:linear-gradient(rgba(100,108,118,.20),rgba(100,108,118,.20)),url(wood-natural-v13.png);filter:none}
.point.destination:after,.point.bot-target:after{background:rgba(60,60,60,.75);opacity:1;filter:none}
/* V21: gentle base-to-tip white light over unchanged neutral shadow. */
.point.destination:before,.point.bot-target:before{background-image:linear-gradient(to bottom,rgba(255,255,255,.24),rgba(255,255,255,.09) 28%,rgba(255,255,255,0) 70%),linear-gradient(rgba(100,108,118,.20),rgba(100,108,118,.20)),url(wood-natural-v13.png);background-size:auto,auto,500px 700px;filter:none}
.point.bottom.destination:before,.point.bottom.bot-target:before{background-image:linear-gradient(to top,rgba(255,255,255,.24),rgba(255,255,255,.09) 28%,rgba(255,255,255,0) 70%),linear-gradient(rgba(100,108,118,.20),rgba(100,108,118,.20)),url(wood-natural-v13.png)}

/* V24: sound button only. */
.bottom-controls #sound[aria-pressed="true"]{color:#d8ffe7;border-color:#51ed8b;background:linear-gradient(#194c36,#0a2d22);box-shadow:inset 0 0 5px #54ff8c55,0 0 9px #39ed7866;text-shadow:0 0 4px #60ffa666}

#off:enabled{background:linear-gradient(#a57a36,#62431b);color:#fff0c6;border-color:#dfbe71;box-shadow:inset 0 1px #fff3,0 0 5px #e6bd5844}
.bearable{touch-action:none}.bear-drag{position:fixed!important;width:28px!important;height:28px!important;z-index:2000;pointer-events:none}
/* V27 ownership presentation: solo local side 0 below, opponent 1 above. */
#bar:disabled{opacity:1}
#bar .bar-pockets{inset:0;transform:none;width:100%;height:100%;display:block;writing-mode:horizontal-tb}
#bar .bar-pocket{position:absolute;left:50%;transform:translateX(-50%);width:44px;height:44px}
#bar .bar-pocket[data-view-side="top"]{top:8px;bottom:auto}
#bar .bar-pocket[data-view-side="bottom"]{bottom:8px;top:auto}
#bar .collection-area{position:absolute;left:50%;transform:translateX(-50%);width:80px;padding:3px;display:flex;align-items:center;justify-content:center;gap:5px;border:1px solid #a68c5f66;border-radius:5px;background:#b59a6515;color:#ddcfb7;pointer-events:none;writing-mode:horizontal-tb}
#bar .collection-area[data-view-side="top"]{top:62px;bottom:auto}
#bar .collection-area[data-view-side="bottom"]{bottom:62px;top:auto}
.collection-area small{font:10px "Segoe UI",Arial;white-space:normal;line-height:11px}
#bar .collection-area .checker{width:22px;height:22px;max-width:none;margin:0;font-size:10px;flex:none}
@media(max-width:999px){#bar .bar-pocket{width:20px;height:20px}#bar .bar-pocket .checker{width:17px;height:17px}#bar .bar-pocket[data-view-side="top"]{top:3px}#bar .bar-pocket[data-view-side="bottom"]{bottom:3px}#bar .collection-area{width:23px;padding:1px;flex-direction:column;gap:1px}.collection-area small{font-size:5.8px;line-height:6px}#bar .collection-area .checker{width:13px;height:13px;font-size:8px}#bar .collection-area[data-view-side="top"]{top:28px}#bar .collection-area[data-view-side="bottom"]{bottom:28px}}
@media(max-height:560px){#bar .bar-pocket{width:16px;height:14px}#bar .bar-pocket .checker{width:13px;height:13px}#bar .collection-area[data-view-side="top"]{top:20px}#bar .collection-area[data-view-side="bottom"]{bottom:20px}#bar .collection-area{padding:0;gap:0}.collection-area small{font-size:5px;line-height:5px}#bar .collection-area .checker{width:10px;height:10px;font-size:7px}}

#bar .collection-area{left:0;transform:none;width:100%;height:32.4%;padding:3px;box-sizing:border-box;display:block;border-color:#a68c5f50;background:#b59a650b;pointer-events:none;overflow:hidden}
#bar .collection-area[data-view-side="top"]{top:4.3%;bottom:auto}
#bar .collection-area[data-view-side="bottom"]{bottom:4.3%;top:auto}
.collection-area small{position:absolute;right:2px;top:3px;width:60%;font-size:8px;line-height:9px;text-align:right}
.off-count{position:absolute;right:4px;bottom:4px;font:600 10px "Segoe UI",Arial}
.off-stack{position:absolute;left:3px;top:4px;bottom:4px;width:29%;display:flex;flex-direction:column;justify-content:flex-end;gap:1px}
.off-edge{display:block;width:100%;height:5px;min-height:1px;flex:0 1 5px;border-radius:40%;background:linear-gradient(#fff5db,#c4aa78);border:1px solid #8a7047;box-shadow:0 1px 1px #0007;box-sizing:border-box}
.off-edge.dark{background:linear-gradient(#446078,#101c2c);border-color:#050b15}
.board-watermark{position:absolute;top:46.7%;width:14.7%;height:13.5%;object-fit:contain;transform:translate(-50%,-50%);opacity:.17;pointer-events:none;z-index:1}
.board-watermark.left{left:22.4%}.board-watermark.right{left:75.4%}
@media(max-width:999px){.collection-area small{font-size:5px;line-height:5px}.off-count{font-size:7px;right:1px;bottom:2px}.off-stack{left:1px;top:3px;bottom:3px;gap:0}.off-edge{border-width:.5px}}
#bar .collection-area{height:min(32.4%,calc(45.7% - 50px))}.collection-area small{top:40%}.off-stack{width:22%;left:1px}
@media(max-height:560px){.off-stack{top:0;bottom:0}.off-edge{min-height:0;border:0}}
