/* UI > Tables, 142:335937. Native vector corners + fills, never stretched SVGs. */
body.tables-page{background:var(--choco-100);color:var(--cream-900);font:500 18px/20px var(--font-ui)}
body.tables-page:before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.2;background-image:linear-gradient(var(--choco-400) 2px,transparent 2px);background-size:2px 10px;mask-image:repeating-linear-gradient(90deg,transparent 0 4px,#000 4px 6px,transparent 6px 10px);background-position:4px 4px}
.tables-page>.site-header,.tables-page>.site-footer{display:none}
body.tables-page #main{width:100%;max-width:none;padding:0;margin:0;min-height:100dvh;position:relative;z-index:1}
.tables-page #app{padding:0;margin:0}
.tables-page #notice:not([hidden]){position:fixed;z-index:30;bottom:16px;left:50%;transform:translateX(-50%);width:min(680px,calc(100vw - 32px));margin:0}
.tables-page-view{min-height:100dvh;padding-bottom:32px}
.tables-page-view :is(h1,h2,h3,p,fieldset,legend){padding:0;margin:0;border:0;letter-spacing:normal}
.tables-page-view :is(button,input,select){font:inherit;color:inherit;box-shadow:none;border-radius:0}
.tables-page-view button:disabled{opacity:1;cursor:default}
.tables-page-view img{display:block;max-width:none;margin:0;flex:none}
.tables-header{height:67px}
.tables-header-inner{width:min(1180px,calc(100% - 48px));margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:22px;height:67px;box-sizing:border-box}
.tables-nav-leading{display:flex;align-items:center;gap:42px;min-width:0}
.tables-header nav{display:flex;gap:32px;align-items:center}
.tables-header nav a,.tables-header nav button{padding:15px 0 10px;margin:0;background:none;border:0;color:var(--cream-900);font:500 18px/20px var(--font-ui);text-decoration:none;white-space:nowrap;cursor:pointer}
.tables-header nav :is(a,button):hover{text-decoration:underline;text-underline-offset:4px}
.tables-header-account{display:flex;gap:8px;align-items:center;padding-bottom:0;flex:none}
.tables-button{position:relative;isolation:isolate;border:0;background:none;margin:0;padding:13px 18px 15px;min-height:48px;font:600 18px/20px var(--font-ui);color:var(--choco-100);cursor:pointer}
.tables-header .tables-button{min-height:42px;padding:10px 17px 12px}
.tables-button-hover{color:var(--cream-900)}
.tables-button>span{transition:translate 120ms ease-out,filter 120ms ease-out}
.tables-button-primary:hover:not(:disabled)>span{translate:0 -4px}
.tables-button-primary:hover:not(:disabled)>.tables-skin{filter:drop-shadow(0 4px 0 rgb(0 0 0/.25))}
.tables-page-view .tables-button-primary{color:var(--choco-100)}
.tables-button>.tables-skin-secondaryHover{--tables-fill:var(--choco-600);visibility:hidden}
.tables-button-hover:hover:not(:disabled)>.tables-skin-secondaryHover{visibility:visible}
.tables-button:disabled>span{opacity:.45}
.tables-page-view :is(button,a,input,select):focus-visible{outline:2px solid var(--cream-900);outline-offset:4px}
.tables-layout{display:grid;grid-template-columns:480px minmax(0,680px);gap:20px;width:min(1180px,calc(100% - 48px));margin:48px auto 0;align-items:start}
.tables-create-column{position:sticky;top:24px;min-width:0}
.tables-main-column,.tables-directory{display:flex;flex-direction:column;gap:20px;min-width:0}
.tables-panel{position:relative;isolation:isolate;filter:drop-shadow(4px 4px 0 rgb(0 0 0/.25));min-width:0}
.tables-skin{--tables-fill:var(--choco-300);position:absolute;inset:0;z-index:-1;pointer-events:none}
.tables-skin-input{--tables-fill:var(--choco-400)}.tables-skin-hover{--tables-fill:var(--choco-500)}.tables-skin-primary{--tables-fill:var(--cream-900)}
.tables-skin:before,.tables-skin:after{content:"";position:absolute;background:var(--tables-fill)}
.tables-skin:before{inset:5px 0}.tables-skin:after{inset:0 5px}
.tables-corner{position:absolute;width:5px;height:5px}.tables-corner-tl{top:0;left:0}.tables-corner-tr{top:0;right:0}.tables-corner-bl{bottom:0;left:0}.tables-corner-br{bottom:0;right:0}
.tables-create-form{display:flex;flex-direction:column;gap:24px;padding:20px 24px 24px}
.tables-create-form h1,.tables-chat h2{font:600 24px/30px var(--font-ui)}
.tables-create-form fieldset{min-width:0}
.tables-create-form legend,.tables-deck>label{display:block;margin-bottom:10px;font:500 16px/19px var(--font-ui)}
.tables-mode-list{display:flex;flex-direction:column;gap:10px}
.tables-mode{position:relative;isolation:isolate;display:flex;align-items:center;gap:16px;padding:12px 17px;min-height:66px;box-sizing:border-box;cursor:pointer}
.tables-mode>input{appearance:none;position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.tables-mode>.tables-skin-hover{visibility:hidden}
.tables-mode:is(:hover,:has(input:checked),:focus-within)>.tables-skin-hover{visibility:visible}
.tables-mode:has(input:disabled){cursor:default}.tables-mode input:disabled{cursor:default}
.tables-mode-copy{display:flex;flex-direction:column;gap:4px;min-width:0;font:500 16px/19px var(--font-ui)}
.tables-mode-copy strong{font-weight:600}.tables-mode-copy>span{color:var(--choco-800)}
.tables-mode-icon{position:relative;display:block;width:18px;height:18px;flex:none}
.tables-mode-icon.is-large{width:42px;height:42px}
.tables-mode-cell{position:absolute;width:8px;height:8px;display:flex;overflow:hidden}
.tables-mode-cell.cell-0{left:0;top:0}.tables-mode-cell.cell-1{right:0;top:0}.tables-mode-cell.cell-2{left:0;bottom:0}.tables-mode-cell.cell-3{right:0;bottom:0}
.is-large .tables-mode-cell{width:20px;height:20px}
.mode-trio .cell-0,.mode-trio .cell-1{top:1px}.mode-trio .cell-2{left:5px;bottom:1px}
.is-large.mode-trio .cell-0,.is-large.mode-trio .cell-1{top:2px}.is-large.mode-trio .cell-2{left:11px;bottom:1px}
.tables-half{width:10px;height:20px;overflow:hidden;flex:none}.tables-half+span img{margin-left:-10px}
/* Dropdown List: 432x96 at the design width, two 48px choices. */
.tables-select-wrap{position:relative;isolation:isolate;height:48px;z-index:3}
.tables-select-wrap summary{list-style:none;position:relative;isolation:isolate;display:flex;align-items:center;justify-content:space-between;height:48px;padding:13px 16px 15px 18px;cursor:pointer;outline:0}
.tables-select-wrap summary::-webkit-details-marker{display:none}
.tables-select-wrap summary>.tables-skin-hover{visibility:hidden}
.tables-select-wrap summary[aria-disabled=false]:is(:hover,:focus-visible)>.tables-skin-hover{visibility:visible}
.tables-page-view .tables-select-wrap summary:focus:not(:focus-visible){outline:0}
.tables-select-wrap summary[aria-disabled=true]{cursor:default}
.tables-select-wrap summary>img{pointer-events:none}
.tables-dropdown-list{position:absolute;left:0;right:0;top:calc(100% + 4px);isolation:isolate;padding:0 5px;filter:drop-shadow(4px 4px 0 rgb(0 0 0/.25))}
.tables-select-wrap:not([open])>.tables-dropdown-list{display:none}
.tables-dropdown-list>button{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:space-between;gap:16px;height:48px;width:100%;padding:13px 11px 15px 13px;background:none;border:0;text-align:left;cursor:pointer;outline:0}
.tables-dropdown-meta{color:var(--choco-800)}
.tables-dropdown-list>button>.tables-skin{visibility:hidden;inset-inline:-5px}
.tables-dropdown-list>button:is(:hover,:focus-visible)>.tables-skin{visibility:visible}
.tables-dropdown-list>button:is(:hover,:focus-visible){outline:0}
.tables-dropdown-list>button:first-of-type :is(.tables-corner-bl,.tables-corner-br),.tables-dropdown-list>button:last-of-type :is(.tables-corner-tl,.tables-corner-tr){background:var(--choco-500)}
.tables-deck-label{display:block;margin-bottom:5px;font:500 16px/19px var(--font-ui)}
.tables-deck>label{margin-bottom:5px}
.tables-deck p{font:500 16px/19px var(--font-ui);color:var(--choco-700);margin-top:5px}
.tables-check-list{display:flex;flex-direction:column;gap:16px}
.tables-check{display:flex;align-items:center;gap:8px;cursor:pointer;min-height:20px}
.tables-check-box{display:block;width:20px;height:20px;flex:none}
.tables-chat{height:310px;padding:20px 24px 24px;display:flex;flex-direction:column;gap:8px;box-sizing:border-box}
.tables-chat-window{flex:1;min-height:0;position:relative}
.tables-chat-list{height:100%;overflow:auto;scrollbar-width:none;overscroll-behavior:contain;display:flex;flex-direction:column;gap:4px;padding:0;outline:0}
.tables-chat-list::-webkit-scrollbar{display:none}
.tables-chat-list>:first-child{margin-top:auto}
.tables-chat-message{display:flex;align-items:baseline;gap:8px;flex:none;font:500 18px/20px var(--font-ui)}
.tables-chat-message>span{flex:1;min-width:0;overflow-wrap:anywhere;white-space:pre-wrap}
.tables-chat-message strong{font-weight:500}.tables-chat-message time{flex:none;color:var(--choco-600);font:500 16px/19px var(--font-ui)}
.tables-chat-fade{position:absolute;top:0;left:0;width:562px;max-width:100%!important;height:32px;pointer-events:none}
.tables-chat-window:not(.is-overflowing) .tables-chat-fade{display:none}
.tables-colour-0{color:#87b528}.tables-colour-1{color:#eaa737}.tables-colour-2{color:#ef5454}.tables-colour-3{color:#56a1d0}
.tables-chat-placeholder{color:var(--choco-700);font:500 16px/19px var(--font-ui)}
.tables-chat-form{position:relative;isolation:isolate;padding-top:16px;display:flex;align-items:center;flex:none;height:58px;box-sizing:border-box}
.tables-chat-form>.tables-skin{top:16px}
.tables-chat-form input{appearance:none;display:block;flex:1;min-width:0;height:42px;min-height:0;margin:0;padding:10px 8px 12px 18px;background:none;border:0;outline:0;box-shadow:none}
.tables-chat-form input::placeholder{color:var(--choco-800);opacity:1}
.tables-chat-form button{height:42px;width:46px;flex:none;display:grid;place-items:center;padding:0 16px 0 10px;border:0;background:none;cursor:pointer;visibility:hidden}
.tables-chat-form.has-draft button{visibility:visible}
.tables-chat-form input:focus-visible{outline:0}
.tables-chat .tables-chat-error{position:absolute;bottom:4px;left:24px;right:24px;margin:0;font:500 12px/14px var(--font-ui)}
.tables-chat-error[hidden]{display:none}
.tables-room{display:flex;flex-direction:column;gap:1px;min-width:0;filter:drop-shadow(4px 4px 0 rgb(0 0 0/.25))}
.tables-room:has(details[open]){z-index:4}
.tables-room-header{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:space-between;gap:16px;height:42px;padding-left:14px}
.tables-room-header h3{display:flex;align-items:center;gap:8px;font:500 18px/20px var(--font-ui);min-width:0}
.tables-room-header>.tables-room-leave{display:flex;align-items:center;gap:8px;flex:none;height:42px;padding:11px 14px;margin:0;border:0;background:none;color:var(--red-500);font:500 18px/20px var(--font-ui);cursor:pointer}
.tables-room-leave:hover:not(:disabled){text-decoration:underline;text-underline-offset:4px}
.tables-room-header>.tables-room-leave:disabled{opacity:.45;cursor:default}
.tables-room-host{display:flex;align-items:center;gap:20px;flex:none}
.tables-room-host>.tables-button{height:42px;min-height:42px;padding:10px 17px 12px}
.tables-room-body{position:relative;isolation:isolate;padding:0 5px;height:167px}
.tables-room-groups{display:flex;height:167px;align-items:stretch}
.tables-room-group{flex:1;min-width:0;display:flex;justify-content:center;align-items:flex-start;gap:48px;padding:24px 20px}
.tables-versus{position:relative;width:54px;flex:none;overflow:hidden}.tables-versus img{position:absolute;left:50%;top:calc(50% + .5px);transform:translate(-50%,-50%)}
.tables-player{width:72px;flex:none;display:flex;flex-direction:column;align-items:center;gap:8px}
.tables-avatar{position:relative;flex:none;width:64px;height:64px}
.tables-avatar-border,.tables-vacant-default,.tables-vacant-hover{position:absolute;top:-4px;left:-4px;width:72px;height:72px}
.tables-avatar-initials{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--choco-400);font:600 24px/30px var(--font-ui)}
.tables-seat-button{padding:0;margin:0;border:0;background:none;cursor:pointer;text-align:center}
.tables-vacant-hover{visibility:hidden}
.tables-seat-button:is(:hover,:focus-visible):not(:disabled) .tables-vacant-hover{visibility:visible}
.tables-seat-button:is(:hover,:focus-visible):not(:disabled) .tables-vacant-default{visibility:hidden}
.tables-seat-button:is(:hover,:focus-visible):not(:disabled) .tables-player-name{color:var(--choco-800)}
.tables-player-menu{position:relative;width:72px;flex:none;z-index:3}
.tables-player-menu:has([open]),.tables-player-menu[open]{z-index:5}
.tables-player-menu summary{list-style:none}
.tables-player-menu summary::-webkit-details-marker{display:none}
.tables-player-options{left:50%;right:auto;translate:-50% 0;width:220px;box-sizing:border-box;z-index:6}
.tables-player-menu:not([open])>.tables-player-options{display:none}
.tables-player-menu summary:focus-visible{outline:2px solid var(--cream-900);outline-offset:4px}
.tables-player-name{max-width:112px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:500 16px/19px var(--font-ui)}
.tables-player-name.is-vacant{color:var(--choco-700)}
.tables-player-chips{display:flex;height:20px;isolation:isolate}
.tables-player-chips img{position:relative;z-index:1}.tables-player-chips img:not(:last-child){margin-right:-6px;z-index:2}
.tables-return{padding:0;margin:0;border:0;background:none;color:var(--cream-900);font:500 16px/19px var(--font-ui);cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.tables-empty{padding:24px;color:var(--choco-800);font:500 18px/24px var(--font-ui)}
.tables-empty h2{color:var(--cream-900);font:600 24px/30px var(--font-ui);margin-bottom:8px}
.tables-mine{display:flex;flex-direction:column;gap:12px}.tables-mine>div{display:flex;justify-content:space-between;gap:16px;font:500 16px/19px var(--font-ui)}
.tables-error{color:var(--red-500);font:500 16px/19px var(--font-ui)}
#tables-guest-dialog{width:min(400px,calc(100vw - 32px));padding:24px;border:0;border-radius:0;background:var(--choco-300);color:var(--cream-900);font:500 18px/24px var(--font-ui)}
#tables-guest-dialog::backdrop{background:rgb(0 0 0/.3)}
#tables-guest-dialog form{display:grid;gap:16px}#tables-guest-dialog h2{margin:0;font:600 24px/30px var(--font-ui)}
#tables-guest-dialog input{width:100%;box-sizing:border-box}#tables-guest-dialog .tables-guest-actions{display:flex;justify-content:flex-end;gap:12px}
@media(max-width:1220px){.tables-layout{grid-template-columns:minmax(360px,480px) minmax(530px,680px)}.tables-room-group{gap:28px;padding-inline:10px}.tables-nav-leading{gap:28px}.tables-header nav{gap:20px}}
@media(max-width:980px){.tables-layout{grid-template-columns:minmax(300px,360px) minmax(0,1fr);width:calc(100% - 32px);gap:16px}.tables-header-inner{width:calc(100% - 32px)}.tables-nav-leading{gap:24px}.tables-header nav{gap:16px}.tables-header-account .tables-button{padding-inline:12px}.tables-mode{padding-inline:12px;gap:12px}.tables-mode-copy>span{font-size:14px}.tables-create-form,.tables-chat{padding-inline:20px}.tables-room-group{gap:8px;padding-inline:4px}.tables-versus{width:30px;overflow:hidden}.tables-player{width:64px}}
@media(max-width:760px){.tables-header{height:auto}.tables-header-inner{height:auto;align-items:center;flex-wrap:wrap;padding-top:16px;gap:12px}.tables-nav-leading{width:100%;justify-content:space-between;gap:16px}.tables-header nav{gap:12px}.tables-header nav :is(a,button){font-size:16px}.tables-layout{display:flex;flex-direction:column;margin-top:24px}.tables-create-column,.tables-main-column{width:100%;position:static}.tables-create-form{padding:20px 24px 24px}.tables-room-group{gap:24px;padding-inline:10px}.tables-versus{width:54px;overflow:visible}.tables-player{width:72px}}
@media(max-width:430px){.tables-header nav{gap:8px}.tables-header nav :is(a,button){font-size:14px}.tables-room-group{gap:4px;padding-inline:0}.tables-versus{width:30px;overflow:hidden}.tables-player{width:64px}.tables-player-name{max-width:74px;font-size:14px}.tables-room-title h3{font-size:14px}}
@media(prefers-reduced-motion:reduce){.tables-button>span{transition:none}}

.tables-page-view .tables-button{font-weight:600}
.tables-mode:has(input:focus-visible){outline:2px solid var(--cream-900);outline-offset:3px}

.tables-attribution{width:min(1180px,calc(100% - 48px));margin:32px auto 0;color:var(--choco-700);font:500 12px/16px var(--font-ui)}
.tables-attribution a{text-decoration:none}.tables-attribution a:hover{text-decoration:underline}

/* Transforms do not affect ordinary inline spans: the label must be a box. */
.tables-button>span:not(.tables-skin){display:inline-block}
.tables-skin-amber{--tables-fill:#e79953}
.tables-resume{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;height:56px;padding:12px 21px 12px 17px;margin:0;border:0;background:none;filter:drop-shadow(4px 4px 0 rgb(0 0 0/.25));cursor:pointer;text-align:left}
.tables-page-view .tables-resume{color:var(--choco-100);font:600 16px/19px var(--font-ui)}
.tables-resume-leading{display:flex;align-items:center;gap:10px;min-width:0}
.tables-resume-avatars{display:flex;isolation:isolate;flex:none}
.tables-resume-avatars>span{position:relative;display:grid;place-items:center;width:32px;height:32px;box-sizing:border-box;border:1px solid var(--choco-100);border-radius:50%;background:var(--choco-500);color:var(--cream-900);font:600 12px/16px var(--font-ui);margin-right:-12px;z-index:4}
.tables-resume-avatars>span:nth-child(2){z-index:3}.tables-resume-avatars>span:nth-child(3){z-index:2}.tables-resume-avatars>span:last-child{margin:0;z-index:1}
.tables-resume-status{flex:none}
.tables-resume:hover:not(:disabled) .tables-resume-copy{text-decoration:underline;text-underline-offset:3px}

/* Menu Auth=True 142:335873; Dropdown List 142:335818. */
.tables-header{position:relative;z-index:10}
.tables-user-menu{position:relative;flex:none}
.tables-user-trigger{position:relative;isolation:isolate;display:flex;align-items:center;height:42px;padding-left:5px;list-style:none;cursor:pointer;outline:0}
.tables-user-trigger::-webkit-details-marker{display:none}
.tables-user-trigger>.tables-skin-secondaryHover{--tables-fill:var(--choco-600);visibility:hidden}
.tables-user-trigger:is(:hover,:focus-visible)>.tables-skin-secondaryHover{visibility:visible}
.tables-user-trigger[aria-disabled=true]{cursor:default}
.tables-user-trigger[aria-disabled=true]>.tables-skin-secondaryHover{visibility:hidden}
.tables-user-name{display:flex;align-items:center;gap:5px;padding:10px 12px 12px 10px;font:600 18px/20px var(--font-ui)}
.tables-user-name>span{max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tables-user-avatar{width:42px;height:42px;flex:none;display:grid;place-items:center;background:var(--choco-400);color:var(--cream-900);font:600 16px/19px var(--font-ui);mask:url('/assets/tables/user-avatar-mask.svg') 0 0/42px 42px no-repeat}
.tables-user-options{left:auto;right:0;width:240px;box-sizing:border-box}
.tables-user-menu:not([open])>.tables-user-options{display:none}
.tables-page-view :is(.tables-user-trigger,.tables-select-wrap summary):focus-visible{outline:2px solid var(--cream-900);outline-offset:4px}

.tables-user-avatar>img[width="42"]{width:42px;height:42px;object-fit:cover}
