/* Invitations use the native Sabo modal frame and Yacheika UI font. */
#table-invitations-dialog{width:min(600px,calc(100vw - 48px));max-width:none;max-height:calc(100dvh - 84px);margin:42px auto auto;padding:0;border:0;border-radius:0;overflow:visible;background:transparent;color:var(--cream-900);font:500 18px/22px var(--font-ui)}
#table-invitations-dialog::backdrop{background:rgba(0,0,0,.65)}
#table-invitations-dialog[open]{display:flex;flex-direction:column}
#table-invitations-dialog .ti-shell{max-height:calc(100dvh - 84px)}
#table-invitations-dialog .modal-header-title{margin:0;padding:14px 24px;color:var(--cream-900);font:600 24px/30px var(--font-ui);white-space:nowrap}
#table-invitations-dialog .ti-body{padding:24px;gap:16px;overflow-y:auto}
#table-invitations-dialog p,.table-invitations-notifications p{margin:0}
#table-invitations-dialog [hidden],.table-invitations-notifications [hidden],.table-invitations-notifications[hidden]{display:none!important}
.ti-note{color:var(--cream-600,#b8a991);font:500 16px/20px var(--font-ui)}
.ti-picker-table{font:600 18px/22px var(--font-ui)}
.ti-friends{display:flex;flex-direction:column;gap:12px}
.ti-friend{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 16px;padding:12px 0;border-bottom:1px solid var(--choco-500)}
.ti-person{display:flex;align-items:center;gap:12px;min-width:0}
.ti-person strong{overflow-wrap:anywhere;font:600 18px/22px var(--font-ui)}
.ti-friend-person{display:flex;flex-direction:column;gap:6px;min-width:0}
.ti-friend-status{display:flex;flex-wrap:wrap;gap:4px 12px;padding-left:48px}
.ti-friend-status .friend-status,.ti-unavailable{font:500 14px/18px var(--font-ui)}
.ti-unavailable{color:var(--cream-600,#b8a991)}
.ti-person .player-avatar{display:grid;place-items:center;flex:none;width:36px;height:36px;border:0;border-radius:0;background:var(--choco-500);color:var(--cream-900);font:600 16px/20px var(--font-ui)}
.ti-person .player-avatar-green{color:#85a54c}.ti-person .player-avatar-gold{color:#c9aa68}.ti-person .player-avatar-red{color:#b86f6d}.ti-person .player-avatar-blue{color:#6ca1b4}
.ti-person .player-avatar svg{width:18px;height:22px}.ti-person .player-avatar-photo{overflow:hidden}.ti-person .player-avatar-photo img{width:100%;height:100%;object-fit:cover}
.ti-button{display:inline-flex;justify-content:center;align-items:center;min-height:42px;padding:10px 16px;margin:0;border:0;border-radius:0;clip-path:polygon(5px 0,calc(100% - 5px) 0,calc(100% - 5px) 5px,100% 5px,100% calc(100% - 5px),calc(100% - 5px) calc(100% - 5px),calc(100% - 5px) 100%,5px 100%,5px calc(100% - 5px),0 calc(100% - 5px),0 5px,5px 5px);background:var(--choco-500);color:var(--cream-900);font:600 16px/20px var(--font-ui);cursor:pointer}
.ti-button:is(:hover,:focus-visible):not(:disabled){background:var(--choco-600)}
.ti-button-primary{background:var(--cream-900);color:var(--choco-100)}
.ti-button-primary:is(:hover,:focus-visible):not(:disabled){background:#f2e9dc}
.ti-button:disabled{opacity:.6;cursor:default}
.ti-button:focus-visible{outline:2px solid var(--cream-900);outline-offset:-3px}
.ti-error{grid-column:1/-1;color:#eeaaa3;font:500 16px/20px var(--font-ui);overflow-wrap:anywhere}
.ti-feedback{display:flex;align-items:center;justify-content:space-between;gap:16px;color:#eeaaa3;font:500 16px/20px var(--font-ui)}
.ti-picker-footer{display:flex;justify-content:flex-end}
.table-invitations-notifications{position:fixed;z-index:90;right:24px;bottom:24px;display:flex;flex-direction:column;gap:16px;width:min(420px,calc(100vw - 48px));max-height:calc(100dvh - 120px);padding:0 8px 8px 0;overflow-y:auto;overscroll-behavior:contain;color:var(--cream-900);font:500 18px/22px var(--font-ui)}
.ti-popup{position:relative;isolation:isolate;display:flex;flex-direction:column;gap:12px;flex:none;padding:20px;filter:drop-shadow(8px 8px 0 rgba(0,0,0,.25))}
.ti-popup-title{font:600 18px/22px var(--font-ui)}
.ti-popup-detail{color:var(--cream-600,#b8a991);font:500 16px/20px var(--font-ui);overflow-wrap:anywhere}
.ti-popup-actions{display:flex;flex-wrap:wrap;gap:8px}
@media(max-width:600px){.ti-friend{grid-template-columns:minmax(0,1fr)}.ti-friend>.ti-button{justify-self:start}}