@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;font-family:Inter,Arial,sans-serif;color:#f1eadb;background:#030506;--gold:#c8a464;--gold-soft:#ead299;--panel:#0b0f12ed;--line:#5f4a29;--muted:#aaa79f;--danger:#c85d57}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#030506}button,input,select{font:inherit}button,select,input{border:1px solid #75603a;border-radius:10px;background:#12181a;color:#f1eadb;padding:11px 13px}button{cursor:pointer;min-height:44px;transition:border-color .18s,background .18s,transform .18s}button:hover:not(:disabled){border-color:var(--gold-soft);background:#22241e}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.38;cursor:not-allowed}.primary{background:linear-gradient(135deg,#ddc17e,#9b7437);color:#100d08;font-weight:800;border-color:#f2db9d}.danger{border-color:#7d3d39;color:#f0b6b2}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #f1d995;outline-offset:3px}.topbar{height:68px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:9px 24px;border-bottom:1px solid #2e2618;background:#050808f2;position:relative;z-index:20}.brand{font:700 22px Cinzel,serif;color:var(--gold-soft);text-decoration:none;letter-spacing:.08em}.title{text-align:center;display:grid}.title strong{font:700 17px Cinzel,serif;letter-spacing:.16em}.title span{font-size:11px;color:var(--muted);letter-spacing:.09em}.top-actions{justify-self:end;display:flex;gap:8px}.top-actions button{padding:8px 11px;min-height:38px}main{position:relative;height:calc(100dvh - 68px);min-height:560px;overflow:hidden}#board-area{position:absolute;inset:0 0 150px 310px}#domino-scene{position:absolute;inset:0}#domino-scene canvas{display:block;width:100%;height:100%}#turn-banner{position:absolute;top:16px;left:50%;transform:translateX(-50%);max-width:min(560px,88%);padding:9px 17px;border:1px solid #7b6338;border-radius:999px;background:#080c0edb;color:var(--gold-soft);text-align:center;font-weight:700;box-shadow:0 8px 25px #0008;backdrop-filter:blur(9px)}#ends{position:absolute;top:68px;left:50%;transform:translateX(-50%);display:flex;gap:8px}#ends span{background:#080c0edb;border:1px solid #574725;border-radius:9px;padding:6px 10px;font-size:12px}#players-bar{position:absolute;left:12px;right:12px;bottom:12px;display:flex;justify-content:center;gap:8px;overflow:auto;padding:4px}.player-card{min-width:126px;padding:8px 10px;border:1px solid #4d432e;border-radius:12px;background:#080c0ee8;box-shadow:0 7px 22px #0007}.player-card.current{border-color:#e4c77e;box-shadow:0 0 0 1px #d7b86a,0 0 18px #b68a4255}.player-card.me strong::after{content:' · você';color:#d7c393;font-weight:500}.player-card span{display:block;color:var(--muted);font-size:12px;margin-top:3px}#reconnect{position:absolute;right:16px;top:16px}.panel{position:absolute;left:20px;top:20px;width:275px;max-height:calc(100% - 40px);overflow:auto;padding:20px;border:1px solid #856a38;border-radius:21px;background:linear-gradient(150deg,#151a1bed,#070a0bf5);box-shadow:inset 0 0 0 4px #ffffff05,0 16px 55px #0009;z-index:10}.panel h1{font:700 55px Cinzel,serif;color:#e3c98b;margin:9px 0}.panel h2,dialog h2{font-family:Cinzel,serif;color:#e3c98b}.panel p{color:#bbb7ac;line-height:1.5}.eyebrow{font-size:9px;letter-spacing:.16em}.panel label{display:grid;gap:7px;margin:14px 0;font-size:13px}.panel>button{width:100%;margin-top:9px}.game-panel{width:285px}.round-line{display:flex;flex-wrap:wrap;gap:5px}.round-line span{font-size:10px;padding:4px 7px;border:1px solid #514323;border-radius:999px;color:#d2c6a8}.game-panel h2{margin-bottom:5px}.game-panel #game-message{font-size:13px;min-height:40px}.game-panel #turn-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.game-panel #next-round{grid-column:1/-1}#rooms-list{display:grid;gap:7px;margin:12px 0;max-height:35vh;overflow:auto}#rooms-list button{text-align:left;font-size:12px}#hand-area{position:absolute;left:310px;right:0;bottom:0;height:150px;border-top:1px solid #382f20;background:linear-gradient(to top,#050808 70%,#050808dd);padding:10px 16px;z-index:9}.hand-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.hand-heading h2{font:600 14px Cinzel,serif;color:#dec487;margin:0}.hand-heading span{font-size:12px;color:var(--muted)}#player-hand{height:112px;display:flex;justify-content:center;align-items:flex-end;gap:8px;overflow-x:auto;padding:8px 8px 12px}.hand-tile{flex:0 0 52px;width:52px;height:96px;padding:4px;background:linear-gradient(145deg,#fffdf5,#d8cdb5);border:2px solid #a88a53;border-radius:8px;color:#17130d;display:grid;grid-template-rows:1fr 3px 1fr;box-shadow:0 7px 12px #0008}.hand-tile:hover:not(:disabled),.hand-tile.selected{transform:translateY(-8px);border-color:#ffe29a;box-shadow:0 11px 22px #000b,0 0 16px #d5aa5a66}.hand-tile.invalid{opacity:.48}.tile-divider{background:#97763e;border-radius:2px}.tile-half{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);place-items:center}.pip{width:7px;height:7px;border-radius:50%;background:#17130d;box-shadow:inset 1px 1px #ffffff33}.pip.blank{visibility:hidden}#notice{position:fixed;left:50%;bottom:12px;transform:translateX(-50%);max-width:min(560px,90vw);padding:10px 16px;border:1px solid #725d33;border-radius:9px;background:#101617f2;z-index:80;text-align:center}#notice:empty{display:none}dialog{width:min(560px,92vw);max-height:86dvh;overflow:auto;border:1px solid #a4874e;border-radius:18px;background:#0e1415;color:#eee7d8;padding:25px;box-shadow:0 20px 70px #000}dialog::backdrop{background:#010303d9;backdrop-filter:blur(7px)}dialog label{display:grid;gap:7px;margin:14px 0}dialog li{line-height:1.55;margin:7px 0}.dialog-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:16px}.inline{display:flex;grid-template-columns:auto 1fr;align-items:center}.privacy{text-align:center}.privacy::backdrop{background:#020405f4}#history-list{display:grid;gap:8px;padding-left:25px;max-height:55dvh;overflow:auto}#history-list li{padding:7px 9px;border-radius:8px;background:#ffffff08;color:#d1ccc0}[hidden]{display:none!important}@media(max-width:800px){.topbar{height:58px;padding:7px 11px;grid-template-columns:1fr auto}.title{display:none}.brand{font-size:18px}.top-actions button{font-size:12px;padding:6px 8px}main{height:calc(100dvh - 58px);min-height:600px;overflow:auto}.panel{position:relative;left:auto;top:auto;width:calc(100% - 20px);max-width:520px;max-height:none;margin:10px auto;padding:14px;border-radius:15px}.panel h1{font-size:39px;margin:2px 0}.panel .intro{margin:6px 0}.panel label{margin:9px 0}.panel>button{margin-top:6px}.game-panel{min-height:180px}#board-area{position:relative;inset:auto;height:43dvh;min-height:300px;margin-top:6px}#turn-banner{top:8px;font-size:12px;padding:7px 12px}#ends{top:50px}#players-bar{bottom:5px;justify-content:flex-start}.player-card{min-width:112px;padding:6px 8px;font-size:12px}.player-card span{font-size:10px}#hand-area{position:relative;left:auto;right:auto;bottom:auto;height:142px;padding:8px}#player-hand{justify-content:flex-start;height:108px}.hand-heading span{font-size:10px}.hand-tile{flex-basis:48px;width:48px;height:89px}#reconnect{top:auto;bottom:80px}body.playing #board-area{height:calc(100dvh - 390px);min-height:310px}}@media(max-height:700px) and (min-width:801px){#board-area{inset:0 0 125px 300px}#hand-area{left:300px;height:125px}.panel{top:10px;left:12px;max-height:calc(100% - 20px)}#player-hand{height:94px}.hand-tile{width:44px;flex-basis:44px;height:82px}.panel h1{font-size:44px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}