.tt-page{padding-bottom:30px}.tt-layout{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:24px;align-items:start}.tt-arena,.tt-desk{padding:22px;border-radius:26px;min-width:0}.tt-top{display:flex;justify-content:space-between;gap:12px;font-size:11px;font-weight:700;color:var(--muted);margin-bottom:18px}.tt-desk h2{font-size:22px;line-height:1.15;margin:8px 0 20px}.tt-desk h3{font-size:16px}.tt-field{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:700;margin:12px 0}.tt-field input,.tt-field select{width:100%;min-height:42px;border:1px solid var(--glass-edge);border-radius:12px;padding:9px 12px;background:var(--surface);color:var(--text);font:inherit}.tt-wide{width:100%;margin:5px 0}.tt-small{font-size:11px;line-height:1.6;color:var(--muted)}.tt-divider{height:1px;background:var(--glass-edge);margin:20px 0}.tt-seats{display:grid;grid-template-columns:repeat(auto-fit,minmax(95px,1fr));gap:8px;margin-bottom:20px}.tt-seat{border:1px solid var(--glass-edge);border-radius:14px;padding:10px 12px;background:linear-gradient(145deg,#ffffff8c,#bed5e62a);font-size:11px;box-shadow:inset 0 1px #fff8}.tt-seat.active{outline:2px solid #629bba;outline-offset:2px}.tt-seat b{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tt-seat span{color:var(--muted);display:block;margin-top:4px}.tt-message{font-size:13px;line-height:1.6;min-height:42px;margin:18px 0 12px}.tt-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.tt-actions .btn{font-size:12px;padding:10px 14px}.tt-board{min-height:300px;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center}.tt-welcome{text-align:center;padding:30px;color:var(--muted)}.tt-welcome strong{display:block;font:800 34px var(--display);color:var(--text);margin:12px 0}.tt-orbs{display:flex;gap:10px;justify-content:center;font-size:40px;color:#86a5c7;text-shadow:0 5px #8fa5c933}.tt-dialog{max-width:620px;border:1px solid var(--glass-edge);border-radius:24px;padding:28px;background:var(--surface);color:var(--text)}.tt-dialog::backdrop{background:#192e515f;backdrop-filter:blur(8px)}.tt-dialog li{font-size:14px;line-height:1.6;margin:10px 0}.tt-muted{font-size:11px;color:var(--muted)}.tt-result{padding:24px;border-radius:20px;background:linear-gradient(145deg,#e6fff2a0,#9dc8e233);border:1px solid var(--glass-edge);margin:18px 0;text-align:center;font:800 22px var(--display)}
/* Thick glass dominoes, independently drawn pips and inset center seam. */
.dm-table{width:100%;min-height:260px;padding:24px 14px;border:1px solid var(--glass-edge);border-radius:24px;background:radial-gradient(ellipse,#6aadc22a,transparent),linear-gradient(145deg,#ffffff55,#9ebbd02a);box-shadow:inset 0 2px 4px #fff8,0 10px 22px #31567a13;display:flex;flex-direction:column;justify-content:center;gap:18px}.dm-ends{display:flex;justify-content:space-between;color:var(--muted);font-size:12px}.dm-chain{display:flex;gap:5px;flex-wrap:wrap;align-items:center;justify-content:center;padding:8px 0;max-width:100%}.domino{display:inline-flex;position:relative;flex:none;width:70px;height:39px;padding:4px;border:1px solid #fff;background:linear-gradient(145deg,#ffffffda,#b1d5e580);border-radius:9px;box-shadow:inset 0 2px 2px white,inset -1px -2px 3px #557c9a25,0 4px 0 #819eb850,0 6px 9px #3c608529;color:#2b526e;vertical-align:middle;touch-action:manipulation;transition:transform .18s}.domino:before{content:'';position:absolute;left:50%;top:5px;bottom:5px;border-left:1px solid #53759244}.domino.selected{outline:3px solid #8473c4;transform:translateY(-5px)}.domino.playable{border-color:#67b79c}.domino:not(:disabled):hover{transform:translateY(-4px)}.domino:disabled{cursor:default}.dm-half{width:50%;height:100%;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:2px;padding:3px}.dm-half i{width:4px;height:4px;align-self:center;justify-self:center;border-radius:50%;background:currentColor;box-shadow:inset 0 1px #ffffff50}.dm-half .zero{grid-area:2/2;color:#8faabe;background:none;font-size:8px;border:1px solid currentColor;width:7px;height:7px}.tt-hand{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin-top:22px}.tt-hand .domino{width:82px;height:46px}.tt-hand .dm-half i{width:5px;height:5px}.dm-chain .domino{box-shadow:inset 0 2px 2px white,0 3px 0 #819eb840}.dm-chain .domino.last{outline:2px solid #6f9daf}
/* Two-tone glass backgammon board, playable points and real checker stacks. */
.bg-board{width:100%;padding:10px;border-radius:22px;border:1px solid #ffffffac;background:linear-gradient(135deg,#7999bb80,#d1dfec60);box-shadow:inset 0 2px 3px white,0 10px 20px #34557420;display:grid;grid-template-columns:repeat(6,minmax(0,1fr)) 22px repeat(6,minmax(0,1fr));gap:3px;grid-template-rows:180px 180px}.bg-point{position:relative;min-width:0;border:0;border-radius:7px;background:#dce7f220;padding:0;cursor:pointer;display:flex;align-items:center;flex-direction:column;gap:0;overflow:hidden}.bg-point:before{content:'';position:absolute;inset:0;background:linear-gradient(#79b4ac60,#79b4ac15);clip-path:polygon(0 0,100% 0,50% 94%)}.bg-point.alt:before{background:linear-gradient(#c68b9555,#c68b9510)}.bg-point.bottom{flex-direction:column-reverse}.bg-point.bottom:before{transform:rotate(180deg)}.bg-point.from{outline:2px solid #786aba;outline-offset:-2px}.bg-point.destination{background:#fff7bd55;outline:2px solid #c6a848;outline-offset:-2px}.bg-number{position:relative;z-index:1;font-size:9px;line-height:14px;color:#4d6583}.bg-checker{z-index:1;position:relative;width:88%;max-width:35px;aspect-ratio:1;border-radius:50%;border:1px solid #fff8;background:radial-gradient(circle at 32% 24%,#e1fff5,#77c5b8 55%,#398b86);box-shadow:inset 0 2px 2px #fff9,0 3px 0 #286f7266,0 4px 6px #34546e33;flex-shrink:0;margin:0 0 -10%;font-size:10px;color:#174e52;display:grid;place-items:center}.bg-checker.coral{background:radial-gradient(circle at 32% 24%,#fff1e6,#e3a391 55%,#b66c78);box-shadow:inset 0 2px 2px #fff9,0 3px 0 #87475566,0 4px 6px #34546e33;color:#6d3948}.bg-point:disabled{cursor:default}.bg-bar{grid-column:7;grid-row:1/3;border-radius:7px;background:linear-gradient(90deg,#6c8ba044,#ffffff5c,#6c8ba044);border:1px solid #ffffff55;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;font-size:10px;color:var(--text)}.bg-bar button{background:var(--surface);border:1px solid var(--glass-edge);border-radius:5px;max-width:100%;font-size:9px;color:var(--text);padding:5px 2px;cursor:pointer}.bg-trays{display:flex;align-items:center;justify-content:space-between;width:100%;gap:8px;margin:12px 0}.bg-trays span{font-size:12px;color:var(--muted)}.bg-dice{display:flex;gap:9px;justify-content:center;margin:15px}.bg-die{width:42px;height:42px;display:grid;place-items:center;border:1px solid white;border-radius:12px;background:linear-gradient(145deg,#ffffffe0,#a3bddc50);box-shadow:inset 0 2px white,0 5px 0 #88a0be50;font:800 23px var(--display);color:var(--text)}
/* Go: raised glass stones at intersections; markings never rely on color alone. */
.go-board{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));width:min(100%,510px);aspect-ratio:1;padding:18px;border:1px solid #fff9;border-radius:25px;background:linear-gradient(145deg,#e8d8b7aa,#d4c3a36b);box-shadow:inset 0 2px 4px #fff9,0 10px 20px #776c5320}.go-cell{position:relative;border:0;padding:2px;min-width:0;background:linear-gradient(90deg,transparent calc(50% - .5px),#5d6b7b66 calc(50% - .5px),#5d6b7b66 calc(50% + .5px),transparent calc(50% + .5px)),linear-gradient(transparent calc(50% - .5px),#5d6b7b66 calc(50% - .5px),#5d6b7b66 calc(50% + .5px),transparent calc(50% + .5px));display:grid;place-items:center;cursor:pointer}.go-cell:disabled{cursor:default}.go-cell:not(:disabled):hover{background-color:#fff8;border-radius:50%}.go-cell .stone{width:87%;aspect-ratio:1;border-radius:50%;border:1px solid #c0d5e088;background:radial-gradient(circle at 30% 23%,#687e9c,#273d5a 55%,#14283c);box-shadow:inset 0 2px 2px #fff5,0 4px 0 #10243966,0 7px 7px #19344d30;position:relative;z-index:1}.go-cell .stone.white{border-color:#ffffffb0;background:radial-gradient(circle at 30% 23%,white,#dbe6ee 60%,#9cb1c5);box-shadow:inset 0 2px 2px white,0 4px 0 #8c9eae66,0 7px 7px #19344d30}.go-cell.dead .stone{opacity:.45}.go-cell.dead:after{content:'×';position:absolute;z-index:2;font-size:24px;color:#c04e67}.go-cell .hoshi{width:5px;height:5px;border-radius:50%;background:#57627799}.go-cell.territory1:after,.go-cell.territory2:after{content:'';width:8px;height:8px;position:absolute;background:#31455d;border-radius:2px}.go-cell.territory2:after{background:#faffff;border:1px solid #8ba2b6}.go-summary{font-size:12px;line-height:1.6;color:var(--muted);text-align:center;margin:13px 0}.tt-score-note{font-size:12px;color:var(--muted);line-height:1.6;text-align:center;max-width:500px}.tt-ready{font-size:13px;text-align:center;line-height:1.7;color:var(--muted)}.tt-notice{padding:12px;border-radius:14px;border:1px solid var(--glass-edge);font-size:12px;color:var(--muted)}
:root[data-theme="dark"] .tt-seat,:root[data-theme="dark"] .dm-table{background:linear-gradient(145deg,#385b7655,#1b354733);box-shadow:inset 0 1px #c9e4ff22}:root[data-theme="dark"] .domino{background:linear-gradient(145deg,#7597b9bb,#2d526dbb);border-color:#c6e5ff77;color:#e0f3ff;box-shadow:inset 0 2px #c7e5ff55,0 4px 0 #091f3590,0 6px 9px #0003}:root[data-theme="dark"] .bg-board{background:linear-gradient(145deg,#4b6d8b99,#243d5a99);border-color:#c7e5ff44}:root[data-theme="dark"] .bg-number{color:#c8dfef}:root[data-theme="dark"] .bg-die{background:linear-gradient(145deg,#6b86aa80,#2a426866);border-color:#c6e5ff55}:root[data-theme="dark"] .go-board{background:linear-gradient(145deg,#a3a99366,#748a8066);border-color:#c6e5ff44}:root[data-theme="dark"] .tt-result{background:linear-gradient(145deg,#44786666,#2c526944)}
@media(max-width:940px){.tt-layout{grid-template-columns:1fr}.tt-desk{max-width:none;display:grid;grid-template-columns:1fr 1fr;gap:0 22px;align-items:start}.tt-desk>.eyebrow,.tt-desk>h2,.tt-desk>.tt-divider{grid-column:1/-1}}@media(max-width:560px){.tt-arena,.tt-desk{padding:14px;border-radius:22px}.tt-desk{display:block}.tt-top{font-size:10px}.tt-seats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.tt-seat{padding:8px}.tt-board{min-height:250px}.dm-table{padding:16px 9px;min-height:240px}.domino{width:59px;height:34px}.dm-half{gap:1px;padding:2px}.dm-half i{width:3px;height:3px}.tt-hand .domino{width:72px;height:41px}.tt-hand .dm-half i{width:4px;height:4px}.tt-hand{gap:8px}.bg-board{padding:7px;gap:2px;grid-template-columns:repeat(6,minmax(0,1fr)) 18px repeat(6,minmax(0,1fr));grid-template-rows:125px 125px;border-radius:17px}.bg-checker{width:97%;margin:0 0 -12%;font-size:8px}.bg-number{font-size:7px;line-height:12px}.bg-bar button{font-size:8px;padding:4px 0}.bg-trays span{font-size:10px}.go-board{padding:12px;border-radius:20px}.go-cell.dead:after{font-size:18px}.tt-page .game-head{gap:10px}.tt-page h1{font-size:30px}.tt-message{font-size:12px}.tt-actions .btn{font-size:11px;padding:10px}}
@media(prefers-reduced-motion:reduce){.domino{transition:none}.domino:not(:disabled):hover{transform:none}}