@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Instrument+Serif:ital@0;1&display=swap');
:root{font-family:"DM Sans","Segoe UI",sans-serif;color:#eee8da;background:#24160f}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #efb66d;outline-offset:3px}.srOnly{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.game,.stage,#scene{position:absolute;inset:0}.stage{overflow:hidden;background:#321d12}.box{display:none}
.gameHud{position:fixed;z-index:8;inset:0 0 auto;height:64px;display:flex;align-items:flex-start;justify-content:space-between;pointer-events:none;padding:12px 18px}
.hudTools{display:flex;align-items:center;gap:7px}
.hudIcon{position:relative;display:grid;place-items:center;flex:none;width:38px;height:38px;padding:7px;border:1px solid #f5d7a752;border-radius:7px;color:#f2d39b;background:#24140ac9;box-shadow:0 2px 12px #170b0580;pointer-events:auto;transition:background .15s,border-color .15s,transform .15s}
.hudIcon:hover,.hudIcon.active{background:#603719e8;border-color:#f1c27b;transform:translateY(-1px)}.hudIcon:active{transform:translateY(0)}
.hudIcon img,.popoverHead img,.chatForm img,.primaryAction img,.searchField img{width:100%;height:100%;object-fit:contain;filter:invert(86%) sepia(33%) saturate(429%) hue-rotate(329deg) brightness(101%);pointer-events:none}
.backButton{width:42px;height:42px}
.presenceCount{position:absolute;right:-4px;top:-5px;min-width:16px;height:16px;padding:0 3px;border-radius:9px;background:#d6a465;color:#291708;font-size:10px;font-weight:800;line-height:16px}
.floatingPanel{position:fixed;z-index:9;top:62px;right:18px;width:min(340px,calc(100vw - 36px));display:none;background:#201712f2;color:#f4ead7;border:1px solid #d9ae7269;box-shadow:0 18px 44px #130900b8;padding:18px;backdrop-filter:blur(12px)}
.floatingPanel.open{display:block}
.popoverHead{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:14px;border-bottom:1px solid #d6ad7350;font-size:13px;letter-spacing:.02em}
.popoverHead button{display:grid;place-items:center;width:25px;height:25px;border:0;background:transparent}.popoverHead button img{width:18px;height:18px}
.floatingPanel h2{font-size:19px;line-height:1.2;margin:17px 0 10px}
.detailLine,.progressLine,.previewHead{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px}.detailLine{color:#c7ad8b}.progressLine{margin-top:20px}.track{height:5px;margin:9px 0 18px;background:#604936}.track div{height:100%;background:#dfa95f;width:0;transition:width .3s}
.statGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:12px 0 18px;border-top:1px solid #d6ad7350}.statGrid small{display:block;color:#ae9375;font-size:9px;letter-spacing:.12em}.statGrid b{display:block;font-size:17px;font-variant-numeric:tabular-nums}
.previewHead{font-weight:700}.previewHead button{border:0;background:none;color:#e8bb7f;padding:3px;font-size:11px}.puzzlePreview{display:block;width:100%;max-height:150px;object-fit:contain;margin:8px 0 15px;background:#110c09}
.roomCode{border-top:1px solid #d6ad7350;padding-top:14px;font-size:11px}.roomCode strong{letter-spacing:.16em;color:#f0c98f}.panelLinks{display:flex;gap:8px;margin-top:18px}.panelLinks button{flex:1;padding:9px;border:1px solid #c69a65;background:#58371f;color:#f7e8d1;font-size:11px}
.chatPanel{width:min(370px,calc(100vw - 36px))}.chatLog{height:260px;overflow:auto;padding:12px 0;font-size:12px}.chatEmpty{color:#b6a28c;line-height:1.5}.chatEntry{margin:0 0 10px;overflow-wrap:anywhere}.chatEntry strong{color:#ecc288;margin-right:7px}.chatForm{display:flex;border:1px solid #a98760;background:#100e0b}.chatForm input{flex:1;min-width:0;border:0;background:none;color:#f4ead7;padding:10px}.chatForm button{width:38px;border:0;background:#634022;padding:8px}.chatForm img{width:20px;height:20px}
.helpPanel dl{font-size:12px;line-height:1.45}.helpPanel dt{color:#ecc288;font-weight:700;margin-top:13px}.helpPanel dd{margin:3px 0 0;color:#d8c9b5}
.selectionRect{position:absolute;z-index:2;display:none;pointer-events:none;border:1px solid #efc786;background:#e7bc7d2b}.remoteCursor{position:absolute;z-index:3;pointer-events:none;color:#2b190d;background:#f1d4a3;border-radius:3px;padding:3px 7px;font-size:11px;white-space:nowrap;transform:translate(8px,8px)}
.remoteCursor{max-width:160px;overflow:hidden;text-overflow:ellipsis;border:1px solid #6a4731;box-shadow:0 2px 5px #21100780;font-weight:800}
.guestReminder{position:fixed;z-index:10;right:20px;bottom:20px;width:38px;height:38px;border:2px solid #583621;border-radius:50%;background:#ffd271;color:#3d2113;font-size:23px;font-weight:900;box-shadow:0 3px 0 #583621}.guestReminder[hidden]{display:none}
.guestDialog{width:min(430px,calc(100vw - 32px));z-index:20;text-align:center;background:#fff7e8;border:2px solid #5a3a25;border-radius:12px;padding:27px 28px;box-shadow:0 8px 0 #8c6748,0 24px 60px #120904aa}
.guestBadge{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 12px;border:2px solid #5a3a25;border-radius:50%;background:#ffd271;color:#462715;font-size:29px;font-weight:900}.guestDialog h2{margin:0 0 10px;color:#352316;font-size:26px}.guestDialog p{color:#695341;font-size:13px;line-height:1.55}.guestDialog button{cursor:pointer}.guestRegister{width:100%;padding:12px;background:#ffc958;border:2px solid #4d311f;border-radius:7px;color:#352315;font-weight:900}.guestSocial{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:11px 0}.guestSocial button{display:flex;align-items:center;justify-content:center;gap:6px;padding:9px 5px;border:1px solid #b9a48b;background:#fff;color:#3d3025;font-size:11px;font-weight:800}.guestSocial img{width:17px;height:17px}.guestDismiss{border:0;background:transparent;color:#705946;font-size:12px;text-decoration:underline}.guestDialog .guestAuthError{color:#a23424;min-height:0;margin:4px 0;font-size:11px}
body.focusMode .gameHud .hudTools{opacity:0;pointer-events:none}body.focusMode .gameHud:hover .hudTools{opacity:1;pointer-events:auto}
.portal{position:fixed;z-index:12;inset:0;overflow:auto;background:#eee9df;color:#261e17}.portal.hidden{display:none}.siteWrap{max-width:1320px;padding:0 32px;margin:auto}
.siteNav{height:90px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #bdb6a9}.siteBrand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:#2a211a;font-size:23px;font-weight:800;letter-spacing:-.065em}.siteBrand img{width:29px;height:29px;filter:drop-shadow(0 1px 1px #75431a)}.siteNav #accountArea{display:flex;align-items:center;gap:10px;font-size:12px;flex-wrap:wrap;justify-content:flex-end}
.portal button,.portal input,.portal select{font:inherit}.portal button{border:0}.siteNav button{background:#2a211a;color:#f7ead6;padding:10px 16px;border:1px solid #2a211a;border-radius:3px;font-size:12px;font-weight:700}.siteNav button:hover{background:#55402b}
.avatar{width:33px;height:33px;object-fit:cover;border-radius:50%}.avatarInput{width:155px;font-size:10px}
.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center;padding:63px 0 75px;border-bottom:1px solid #bdb6a9}.eyebrow,.sectionTitle span{color:#79573a;font-weight:800;font-size:10px;letter-spacing:.18em}.hero h1{font-size:clamp(64px,7.3vw,116px);font-weight:600;letter-spacing:-.092em;line-height:.95;margin:27px 0}.hero h1 em{font-family:"Instrument Serif",Georgia,serif;font-weight:400;letter-spacing:-.04em;color:#a75d35}.heroCopy>p{max-width:440px;font-size:16px;line-height:1.7;color:#625647;margin:0 0 27px}.portalActions{display:flex;gap:11px;flex-wrap:wrap}.portalActions button{min-height:50px;padding:0 20px;font-size:13px;font-weight:700;border-radius:3px}.primaryAction{display:inline-flex;align-items:center;gap:9px;background:#292119;color:#f6ebd8}.primaryAction img{width:18px;height:18px}.primaryAction:hover{background:#60452e}.secondaryAction{background:transparent;border:1px solid #8e8171!important;color:#2e261e}.secondaryAction span{margin-left:18px}.secondaryAction:hover{background:#ddd4c4}.heroFootnote{display:flex;gap:14px;flex-wrap:wrap;margin-top:29px;color:#756959;font-size:10px}.heroFootnote span+span::before{content:"·";margin-right:14px;color:#a77c50}
.heroArtwork{position:relative;justify-self:end;width:min(100%,520px)}.artworkFrame{background:#d5a566;border:15px solid #d4b78d;box-shadow:12px 12px 0 #3b2d1f;transform:rotate(1deg);aspect-ratio:1.18;overflow:hidden}.artworkFrame img{width:100%;height:100%;object-fit:cover;display:block}.artworkCaption{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:23px 0 0;font-size:11px}.artworkCaption span{color:#836c52;letter-spacing:.12em;font-size:10px}.artworkCaption strong{font-weight:600}
.sectionTitle{display:flex;justify-content:space-between;align-items:center;margin:33px 0 15px}.sectionTitle button{background:transparent;color:#67472e;font-size:12px;font-weight:700}.sectionTitle button:hover{text-decoration:underline}.portalGrid{display:grid;grid-template-columns:1.3fr .9fr;gap:20px;padding-bottom:90px}.lobbySection,.personalSection{background:#f8f5ee;border:1px solid #c8beaf;padding:29px}.sectionHead h2{font-size:30px;letter-spacing:-.055em;margin:0}.sectionHead p{font-size:12px;color:#746b5e;margin:4px 0 20px}.filters{display:flex;gap:8px;margin-bottom:18px}.searchField{display:flex;align-items:center;gap:8px;flex:1;min-width:0;padding:0 11px;border:1px solid #bfb5a5;background:#fff}.searchField img{width:16px;height:16px;filter:none;opacity:.5}.filters input{min-width:0;flex:1;border:0;outline:none;background:transparent;padding:10px 0}.filters select{border:1px solid #bfb5a5;background:#fff;padding:10px;color:#33281e;font-size:11px}.roomCard{display:grid;grid-template-columns:1fr auto;gap:6px 15px;padding:14px 0;border-top:1px solid #d6cfc2;align-items:center}.roomCard strong{font-size:14px}.roomCard span{grid-column:1;color:#776a5b;font-size:11px}.roomCard button{grid-column:2;grid-row:1/3;padding:9px 14px;background:#2b2119;color:#f7ead6;font-size:11px;font-weight:700}.roomCard button:hover{background:#67472f}#openRooms:empty:after{content:"No active tables right now.";color:#847565;font-size:12px}#myRooms,#friends{font-size:12px;color:#74695c}.personalSection h3{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#79644d;margin:24px 0 12px}.personalSection .sectionHead+h3{margin-top:12px}.friend{border-top:1px solid #d6cfc2;padding:9px 0}#friendForm{display:flex;gap:7px;margin-top:12px}#friendForm input{min-width:0;flex:1;border:1px solid #bfb5a5;background:#fff;padding:10px;font-size:11px}#friendForm button{background:#2b2119;color:#f7ead6;padding:0 14px;font-size:11px}#portalError{color:#a82e22;font-size:12px;margin:8px 0}
.siteFooter{display:grid;grid-template-columns:1fr 1fr auto auto;align-items:center;gap:25px;border-top:1px solid #bdb6a9;padding:27px 0 35px}.siteFooter .siteBrand{font-size:18px}.siteFooter .siteBrand img{width:23px;height:23px}.siteFooter p,.siteFooter small{font-size:11px;color:#807363}.siteFooter div{display:flex;gap:19px}.siteFooter a:not(.siteBrand){color:#493c2e;text-decoration:none;font-size:11px}.siteFooter a:hover{text-decoration:underline}
dialog{width:min(475px,94vw);max-height:90vh;overflow:auto;border:1px solid #9b8063;border-radius:2px;background:#f4eee3;color:#2c2118;padding:30px;box-shadow:0 30px 80px #0d0804aa}dialog::backdrop{background:#130b07bf}.dialogHead{display:flex;align-items:center;gap:12px;margin-bottom:24px}.dialogHead img{width:34px;height:34px}.dialogHead small{font-size:9px;letter-spacing:.17em;color:#8c6441;font-weight:800}.dialogHead h2{font-size:25px;letter-spacing:-.055em;margin:0}dialog label{display:block;margin:13px 0;font-size:11px;font-weight:700}dialog label small{font-weight:400}dialog input:not([type=checkbox]),dialog select{width:100%;display:block;margin-top:7px;padding:11px;border:1px solid #beae99;background:#fff;color:#2c2118;border-radius:1px;font-size:12px}.cols{display:flex;gap:12px}.cols label{flex:1}.checkLabel input{vertical-align:middle}.defaultImagePreview{width:100%;max-height:160px;object-fit:contain;background:#dfd5c6}.importDetails{font-size:11px;color:#695747;margin:17px 0}.importDetails summary{cursor:pointer}menu{display:flex;gap:8px;padding:0;margin:23px 0 0}menu button{flex:1;padding:11px;border:1px solid #a68d70;background:#e9ddcb;color:#3b2c20;font-size:11px;font-weight:700}menu button:last-child{background:#2c2118;color:#f7ead6}.socialAuth{display:grid;gap:8px}.socialButton{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:43px;border:1px solid #bdb2a3;background:#fff;color:#32251a;font-size:12px;font-weight:700}.socialButton:hover{background:#e9e2d7}.authDivider{display:flex;align-items:center;gap:10px;color:#8a7a68;font-size:10px;margin:20px 0}.authDivider:before,.authDivider:after{content:"";height:1px;background:#c9bcaa;flex:1}#authError{font-size:11px;color:#a82e22;margin:7px 0}
@media(max-width:950px){.hero{gap:30px}.hero h1{font-size:clamp(58px,8vw,84px)}.portalGrid{grid-template-columns:1fr}.siteFooter{grid-template-columns:1fr auto}.siteFooter p{display:none}}
@media(max-width:680px){.siteWrap{padding:0 18px}.siteNav{height:70px}.hero{grid-template-columns:1fr;padding:45px 0 55px}.heroArtwork{justify-self:stretch;width:min(100%,460px);margin:15px auto 0}.hero h1{font-size:clamp(61px,12vw,85px)}.lobbySection,.personalSection{padding:21px}.siteFooter{grid-template-columns:1fr;gap:9px}.siteFooter div{justify-content:flex-start}.filters{flex-wrap:wrap}.filters select{max-width:130px}.gameHud{padding:7px;gap:4px}.hudTools{gap:2px}.hudIcon{width:34px;height:34px;padding:7px}.backButton{width:36px;height:36px}.floatingPanel{top:49px;right:7px;width:min(340px,calc(100vw - 14px))}}
@media(max-width:380px){.hudIcon{width:30px;height:30px;padding:6px}.hudTools{gap:1px}.heroFootnote{gap:7px}.heroFootnote span+span::before{margin-right:7px}}

