:root{--ink:#2e2a22;--soft-ink:#5d5648;--cream:#f6ead3;--paper:#fff7e8;--olive:#68734b;--olive-dark:#3f4a31;--mustard:#d5a947;--wood:#ad7245;--wood-dark:#6e432c;--felt:#2f493c;--felt-dark:#20342b;--tile:#f3ecdd;--tile-line:#3b342c;--shadow:rgba(65,47,31,.22)}*{box-sizing:border-box}[hidden]{display:none!important}html,body{height:100%}body{margin:0;color:var(--ink);font-family:"Trebuchet MS","Segoe UI",sans-serif;background:radial-gradient(circle at 18% 14%,rgba(255,255,255,.65),transparent 28%),repeating-linear-gradient(8deg,rgba(96,68,42,.026) 0 1px,transparent 1px 7px),#ead8b8;overflow:hidden}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}.game-shell{width:min(1600px,100vw);height:100vh;min-height:650px;margin:0 auto;padding:18px;display:grid;grid-template-columns:minmax(260px,28%) 1fr;gap:16px}.sage-panel,.table-panel{position:relative;overflow:hidden;border:3px solid var(--ink);border-radius:26px 22px 28px 20px;box-shadow:0 8px 0 rgba(59,45,31,.08),0 18px 34px var(--shadow)}.sage-panel{background:repeating-linear-gradient(-8deg,rgba(89,70,44,.03) 0 1px,transparent 1px 8px),var(--paper);padding:14px;display:grid;grid-template-rows:minmax(0,1fr) auto auto;gap:12px}.portrait-frame{min-height:0;overflow:hidden;border:3px solid var(--ink);border-radius:19px 25px 18px 23px;background:#e9d5af;transform:rotate(-.2deg);box-shadow:inset 0 0 0 5px rgba(255,255,255,.16)}.portrait-frame img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block;filter:saturate(.92) contrast(.98)}.eyebrow{font-size:12px;letter-spacing:.18em;font-weight:900;color:var(--olive-dark)}h1{margin:2px 0 4px;font-size:clamp(25px,2.6vw,42px);line-height:.98}.sage-line{min-height:2.8em;margin:0;color:var(--soft-ink);font-size:clamp(13px,1.15vw,17px);font-weight:650}.score-card{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:7px;border:2px solid var(--ink);border-radius:17px 15px 19px 14px;padding:8px;background:#f4e2bf}.score-card>div:not(.score-goal){display:flex;align-items:center;justify-content:center;gap:8px}.score-card span{font-size:12px;font-weight:800;text-transform:uppercase}.score-card strong{font-size:25px}.score-goal{font-size:9px;text-transform:uppercase;letter-spacing:.11em;color:var(--soft-ink);text-align:center}.table-panel{min-width:0;background:#dac29b;display:grid;grid-template-rows:auto minmax(0,1fr) auto}.topbar,.actionbar{background:rgba(250,238,215,.96);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;z-index:5}.topbar{border-bottom:2px solid var(--ink)}.actionbar{border-top:2px solid var(--ink);min-height:62px}.turn-indicator{font-weight:900;font-size:14px;letter-spacing:.03em}.audio-controls{display:flex;align-items:center;gap:7px}.icon-button{min-width:48px;height:32px;padding:0 9px;border:2px solid var(--ink);border-radius:10px 8px 11px 9px;background:#f7e7c8;color:var(--ink);cursor:pointer;font-weight:900}.icon-button[aria-pressed="false"]{opacity:.42;text-decoration:line-through}.volume-wrap{display:flex;align-items:center;gap:6px;font-size:9px;font-weight:900}.volume-wrap input{width:92px;accent-color:var(--olive-dark)}.table-surface{position:relative;min-height:0;overflow:hidden;padding:12px 16px;display:grid;grid-template-rows:96px minmax(0,1fr) 154px;gap:8px;background:radial-gradient(ellipse at center,rgba(255,255,255,.055),transparent 58%),repeating-linear-gradient(92deg,rgba(255,255,255,.022) 0 1px,transparent 1px 4px),repeating-linear-gradient(2deg,rgba(11,22,17,.045) 0 1px,transparent 1px 5px),var(--felt)}.table-surface::before,.table-surface::after{content:"";position:absolute;pointer-events:none}.table-surface::before{inset:8px;border:3px solid rgba(48,44,33,.72);border-radius:44% 51% 47% 53% / 10% 12% 9% 11%;box-shadow:inset 0 0 0 6px rgba(224,196,146,.10),inset 0 0 52px rgba(8,18,13,.28)}.table-surface::after{inset:0;border-left:12px solid var(--wood-dark);border-right:12px solid var(--wood-dark);opacity:.75}.grain{position:absolute;pointer-events:none;border-radius:50%;opacity:.07;border:2px solid #efe6cf}.grain-a{width:380px;height:100px;left:11%;top:37%;transform:rotate(-4deg)}.grain-b{width:300px;height:85px;right:10%;top:45%;transform:rotate(3deg)}.opponent-area,.player-area,.board-area{position:relative;z-index:2;min-width:0}.opponent-area,.player-area{display:grid;align-content:center}.rack-title{display:flex;justify-content:center;align-items:baseline;gap:8px;margin-bottom:5px;color:#fff9ec;text-shadow:0 1px 0 rgba(0,0,0,.25)}.rack-title span{font-weight:900;font-size:13px}.rack-title small{font-size:10px;opacity:.85}.sage-hand,.player-hand{display:flex;justify-content:center;align-items:flex-end;gap:6px;min-width:0}.sage-hand{height:70px}.player-hand{height:120px;overflow-x:auto;padding:5px 8px 9px;scrollbar-width:thin}.domino{--rot:0deg;position:relative;flex:0 0 auto;border:2px solid var(--tile-line);background:linear-gradient(145deg,rgba(255,255,255,.56),transparent 34%),linear-gradient(325deg,rgba(108,92,71,.10),transparent 40%),var(--tile);box-shadow:inset 1px 1px 0 rgba(255,255,255,.70),inset -2px -2px 4px rgba(72,58,44,.10),0 3px 0 rgba(58,46,35,.28),2px 5px 8px rgba(22,31,25,.20);user-select:none;transform:rotate(var(--rot))}.domino.hand-tile{width:58px;height:104px;border-radius:11px 9px 12px 10px;display:grid;grid-template-rows:1fr 2px 1fr;cursor:pointer;transition:transform .12s ease,translate .12s ease,filter .12s ease}.domino.hand-tile:hover{translate:0 -6px}.domino.hand-tile.playable{box-shadow:0 0 0 3px rgba(243,204,104,.75),2px 4px 0 rgba(49,38,29,.22)}.domino.hand-tile.selected{translate:0 -10px;box-shadow:0 0 0 4px #f2c45f,2px 4px 0 rgba(49,38,29,.22)}.domino.hand-tile.disabled{opacity:.7;cursor:default}.divider{background:linear-gradient(90deg,rgba(42,35,28,.88),rgba(79,67,55,.68));opacity:.88;margin:0 5px;border-radius:10px;box-shadow:0 1px 0 rgba(255,255,255,.35)}.pip-half{position:relative}.pip{position:absolute;width:8px;height:8px;border-radius:50%;background:#292720;transform:translate(-50%,-50%);box-shadow:inset 1px 1px 1px rgba(0,0,0,.42),0 1px 0 rgba(255,255,255,.42)}.pip.p1{left:23%;top:23%}.pip.p2{left:50%;top:23%}.pip.p3{left:77%;top:23%}.pip.p4{left:23%;top:50%}.pip.p5{left:50%;top:50%}.pip.p6{left:77%;top:50%}.pip.p7{left:23%;top:77%}.pip.p8{left:50%;top:77%}.pip.p9{left:77%;top:77%}.domino.back{width:38px;height:64px;border-radius:9px 8px 10px 8px;background:radial-gradient(circle,rgba(236,218,167,.82) 0 2px,transparent 2.5px) 5px 5px/11px 11px,linear-gradient(145deg,rgba(255,255,255,.08),transparent 35%),#3d5446;border-color:#23352c;box-shadow:inset 1px 1px 0 rgba(255,255,255,.18),0 3px 0 rgba(24,37,30,.34),2px 5px 7px rgba(17,27,22,.18)}.domino.back:nth-child(odd){--rot:-2deg}.domino.back:nth-child(even){--rot:2deg}.board-area{display:grid;grid-template-rows:28px minmax(0,1fr);align-items:center;padding:0 20px}.board-meta{display:flex;justify-content:space-between;align-items:center;color:#f9f0db;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.end-badge{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#f3e5c8;color:var(--ink);border:2px solid var(--ink);font-size:14px}.boneyard{background:rgba(47,53,36,.34);padding:4px 9px;border-radius:20px;border:1px solid rgba(255,255,255,.15)}.chain{position:relative;width:100%;height:100%;min-height:220px}.chain-tile{position:absolute;width:var(--chain-w,88px);height:var(--chain-h,46px);display:grid;grid-template-columns:1fr 2px 1fr;border-radius:9px 7px 10px 8px;transition:left .22s ease,top .22s ease,transform .22s ease}.chain-tile .divider{margin:5px 0}.chain-tile .pip{width:7px;height:7px}.chain-tile.turn{width:var(--chain-h,46px);height:var(--chain-w,88px);grid-template-columns:1fr;grid-template-rows:1fr 2px 1fr}.chain-tile.turn .divider{margin:0 5px}.empty-board{position:absolute;inset:38px 20px 10px;display:grid;place-items:center;color:rgba(255,249,233,.52);font-size:13px;font-weight:800;pointer-events:none}.status{min-width:0;color:var(--soft-ink);font-size:12px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.actions{display:flex;gap:7px;flex:0 0 auto}.actions button{border:2px solid var(--ink);border-radius:12px 9px 13px 10px;padding:8px 12px;cursor:pointer;font-weight:900;box-shadow:0 2px 0 rgba(54,41,28,.18)}.actions button:active{translate:0 1px;box-shadow:none}.primary{background:var(--mustard);color:var(--ink)}.secondary{background:#f6ead1;color:var(--ink)}.actions button:disabled{opacity:.45;cursor:not-allowed}.toast{position:fixed;left:50%;top:-90px;translate:-50% 0;z-index:20;max-width:min(520px,90vw);padding:10px 16px;background:#fff0cf;border:2px solid var(--ink);border-radius:14px 12px 16px 11px;box-shadow:0 7px 18px rgba(45,34,25,.2);font-size:13px;font-weight:900;transition:top .22s ease}.toast.show{top:18px}.shake{animation:shake .23s linear}@keyframes shake{25%{translate:-4px 0}50%{translate:4px 0}75%{translate:-2px 0}}.home-btn{position:fixed;right:16px;bottom:16px;z-index:15;display:flex;align-items:center;gap:6px;padding:10px 16px;border-radius:999px;background:rgba(46,42,34,.85);border:2px solid var(--ink);color:var(--cream);text-decoration:none;font-size:13px;font-weight:900;box-shadow:0 4px 14px rgba(0,0,0,.3)}.home-btn:hover{background:var(--olive-dark)}@media (max-width:600px){.home-btn{padding:8px 12px;font-size:12px;right:10px;bottom:10px}}@media (hover:hover){.domino.hand-tile:hover{translate:0 -6px}}.domino.hand-tile,.actions button,.icon-button{touch-action:manipulation}.domino{-webkit-touch-callout:none}@media (max-width:920px){body{overflow:auto}.game-shell{min-height:100vh;height:auto;grid-template-columns:1fr;grid-template-rows:300px minmax(650px,1fr);padding:10px}.sage-panel{grid-template-columns:42% 1fr;grid-template-rows:1fr auto}.portrait-frame{grid-row:1 / span 2}.score-card{align-self:end}.sage-line{min-height:auto}}@media (max-width:600px){.game-shell{grid-template-rows:220px minmax(560px,1fr);padding:8px;gap:10px}.sage-panel{padding:10px;gap:8px}h1{font-size:22px}.eyebrow{font-size:10px}.score-card strong{font-size:20px}.topbar,.actionbar{padding:8px 10px;flex-wrap:wrap}.turn-indicator{font-size:12px}.audio-controls{gap:5px}.icon-button{min-width:40px;height:28px;font-size:11px;padding:0 6px}.volume-wrap{font-size:8px}.volume-wrap input{width:64px}.table-surface{grid-template-rows:82px minmax(0,1fr) 130px;padding:8px 10px}.domino.hand-tile{width:46px;height:82px}.player-hand{height:96px}.sage-hand{height:52px}.domino.back{width:30px;height:48px}.chain{min-height:170px}.actions button{padding:7px 10px;font-size:13px}.status{font-size:11px}}@media (max-height:760px){.game-shell{padding:10px;gap:10px}}@media (max-height:760px) and (min-width:921px){.game-shell{min-height:600px}.table-surface{grid-template-rows:78px minmax(0,1fr) 126px}.domino.hand-tile{width:48px;height:86px}.player-hand{height:98px}.sage-hand{height:52px}.domino.back{width:31px;height:50px}.sage-line{min-height:2.3em}}@media (max-height:700px) and (max-width:920px){.game-shell{grid-template-rows:180px minmax(500px,1fr)}.table-surface{grid-template-rows:70px minmax(0,1fr) 112px}.domino.hand-tile{width:42px;height:76px}.player-hand{height:88px}.sage-hand{height:46px}.domino.back{width:27px;height:44px}.chain{min-height:140px}}.home-btn{position:fixed;right:16px;bottom:16px;z-index:20;display:flex;align-items:center;gap:6px;padding:10px 16px;border-radius:999px;background:rgba(10,8,5,.68);border:1px solid var(--mustard);color:var(--mustard);text-decoration:none;font-size:13px;font-weight:700;box-shadow:0 4px 14px rgba(0,0,0,.35)}.home-btn:hover{opacity:.82}@media(max-width:760px){.home-btn{top:12px;right:12px;bottom:auto;padding:7px 12px;font-size:12px}}