/* Shared interface polish. Cosmetics keep their own colors and artwork. */
#login-screen{overflow-y:auto;padding:24px;box-sizing:border-box}.auth-box{max-height:calc(100dvh - 48px);overflow-y:auto;box-sizing:border-box}.account-tabs{display:flex;gap:6px;background:var(--surface-soft);padding:5px;border-radius:12px;margin-bottom:20px}.account-tabs button{flex:1;border:0;border-radius:8px;padding:10px;background:transparent;color:var(--text-dim);cursor:pointer;font:inherit}.account-tabs button[aria-pressed="true"]{background:rgba(192,132,252,.16);color:var(--text-main,#fff)}#account-form{text-align:left}#account-form label,.password-settings label{display:block;font-size:12px;margin:12px 0 6px}#account-form .account-remember{display:flex;align-items:center;gap:8px;font-size:12px}#account-status{min-height:18px;margin:12px 0;font-size:12px}#local-access{margin-top:16px;text-align:left;font-size:12px}#local-access summary,.password-settings summary{cursor:pointer;color:var(--text-dim);margin-bottom:12px}.password-settings{margin-bottom:20px}#account-form button:disabled{opacity:.6;cursor:wait}[hidden]{display:none!important}
.hosting-settings{border:1px solid var(--border-bright);border-radius:12px;padding:16px;margin-bottom:20px;font-size:13px;line-height:1.6}.hosting-settings summary{cursor:pointer;font-weight:700}.hosting-settings p{color:var(--text-dim);margin:12px 0}.hosting-settings label{display:block;margin-top:12px}.hosting-settings .btn-modern{width:auto}
:root { --surface-soft:rgba(255,255,255,.035); --ui-line:rgba(210,202,230,.12); }
body { --text-dim:#b0aabc; --inner-specular:none; }
button,input,select,textarea,body * { font-family:var(--user-font,'Segoe UI',sans-serif); }
button { touch-action:manipulation; }
button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible { outline:2px solid var(--accent);outline-offset:3px; }
[hidden] { display:none!important; }
.tay-icon { display:inline-block;width:19px;height:19px;flex:0 0 auto;vertical-align:-4px; }
.inline-icon,.nav-icon { display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto; }
.inline-icon { margin-right:4px; }
.role-badge .tay-icon { width:12px;height:12px;vertical-align:-2px; }
.role-badge { display:inline-flex;align-items:center;gap:4px;line-height:1.3; }
.role-list { display:flex;flex-wrap:wrap;gap:4px; }
.btn-modern,.pill-btn { gap:7px;transition:background-color .15s,border-color .15s,color .15s; }
.btn-modern:hover,.pill-btn:hover { transform:none; }
.ambient-orb { animation:none;opacity:.1;filter:blur(80px); }
.navbar { display:flex;flex-wrap:nowrap;margin:12px 16px 0;padding:10px 16px;min-height:62px;height:auto;gap:14px;border-radius:16px;box-shadow:none;background:var(--bg-island); }
.nav-brand { gap:10px;min-width:0; }
.nav-brand>span { font-size:15px;white-space:nowrap; }
.tay-logo { width:32px;height:32px;border-radius:10px;font-size:12px;box-shadow:none; }
.nav-controls,.nav-right { gap:8px;min-width:0; }
.nav-controls { order:0;width:auto;flex:1;justify-content:center; }
.nav-right { margin-left:auto;flex-shrink:0; }
.active-call-pill { max-width:145px; }
.active-call-pill span:last-child { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.rnnoise-pill { font-size:10px;box-shadow:none; }
.user-chip { max-width:210px;background:var(--surface-soft);border-color:var(--ui-line); }
.user-chip .role-list,.user-chip>.role-badge { display:none; }
.xp-widget { width:110px;min-width:90px; }
.app-shell { padding:12px 16px 16px;gap:14px;grid-template-columns:clamp(200px,var(--user-sidebar),280px) minmax(0,1fr); }
.nav-sidebar { padding:12px 9px;gap:14px;border-radius:16px;box-shadow:none;backdrop-filter:none;background:var(--bg-island);overflow:hidden; }
.nav-sidebar>.sidebar-navigation { flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden; }
.nav-search { display:flex;align-items:center;gap:8px;margin:0 5px 12px;padding:10px;background:var(--surface-soft);border:1px solid var(--ui-line);border-radius:10px;color:var(--text-dim); }
.nav-search .tay-icon { width:16px;height:16px; }
.nav-search input { width:100%;min-width:0;color:var(--text-primary);background:none;border:0;outline:0;font-size:12px;user-select:text; }
.nav-search:focus-within { border-color:var(--accent); }
.nav-search input::placeholder { color:var(--text-dim);opacity:.8; }
.nav-menu { flex:1;min-height:0;overflow-x:hidden;overflow-y:auto;gap:8px;scrollbar-gutter:stable;padding:0 2px 8px; }
.nav-group { flex:none;min-width:0; }
.nav-group>summary { list-style:none;display:flex;align-items:center;justify-content:space-between;padding:10px 10px 8px;color:var(--text-dim);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;border-radius:7px; }
.nav-group>summary::-webkit-details-marker { display:none; }
.nav-group>summary:hover { color:var(--text-primary);background:var(--surface-soft); }
.nav-group>summary .tay-icon { width:13px;height:13px;transition:transform .15s; }
.nav-group[open]>summary .tay-icon { transform:rotate(90deg); }
.nav-group-items { display:grid;gap:3px; }
.nav-tab,body[data-density=compact] .nav-tab { min-height:37px;height:auto;padding:9px 10px;font-size:12px;font-weight:500;border-radius:9px;line-height:1.3;transition:background-color .15s,color .15s;border:1px solid transparent; }
.nav-tab-left { gap:10px;min-width:0; }
.nav-tab-left>span:last-child { overflow-wrap:anywhere; }
.nav-icon { opacity:.75; }
.nav-tab:hover { transform:none;background:var(--surface-soft); }
.nav-tab.active { background:color-mix(in srgb,var(--accent) 13%,transparent);border-color:color-mix(in srgb,var(--accent) 25%,transparent);color:var(--text-primary);box-shadow:none; }
.nav-tab.active .nav-icon { color:var(--accent);opacity:1; }
.nav-badge { margin-left:5px;background:var(--surface-soft);color:var(--text-dim);font-size:10px;min-width:21px;text-align:center;padding:2px 5px; }
.nav-sidebar>div:last-child:not(.sidebar-navigation) { flex-shrink:0;border-radius:10px!important;background:var(--surface-soft)!important;padding:10px!important; }
#sidebar-role-state { display:none; }
#sidebar-rnnoise-state,#sidebar-xp-info { font-size:10px!important;line-height:1.7; }
#nav-no-results { padding:12px;font-size:12px;line-height:1.5;color:var(--text-dim); }
.views-wrapper,.section-view,.panel-glass { min-width:0; }
.section-view { animation:none!important; }
.panel-glass { box-shadow:none;background:var(--bg-island);border:1px solid var(--ui-line); }
.panel-head { height:auto;min-height:52px;padding:14px 18px;gap:10px;flex-wrap:wrap;line-height:1.5;border-bottom-color:var(--ui-line); }
.panel-head>span:first-child { display:flex;align-items:center;gap:8px;text-transform:none;font-size:14px;letter-spacing:0; }
.feature-scroll { padding:24px; }
.feature-hero,.vip-hero { padding:24px 26px;margin-bottom:22px;min-height:0;border:1px solid var(--ui-line);background:linear-gradient(120deg,color-mix(in srgb,var(--accent) 5%,transparent),transparent),var(--surface-soft);box-shadow:none; }
.feature-hero h1,.vip-hero h1 { font-size:clamp(23px,2.4vw,32px);line-height:1.2;letter-spacing:-.6px;margin:10px 0; }
h1,h2,h3,.nav-brand,.room-top { font-weight:650!important; }
.feature-hero p,.vip-hero p { max-width:720px;line-height:1.7;color:var(--text-dim); }
.eyebrow,.shop-eyebrow { letter-spacing:1.5px;font-size:9px; }
.feature-card,.trade-compose,.trade-offer,.football-match,.trophy-card,.drawing-stage { background:var(--surface-soft);border-color:var(--ui-line);box-shadow:none; }
.feature-heading { gap:12px;flex-wrap:wrap; }
.feature-heading h2,.leisure-subtitle { font-size:18px; }
.feature-card p,.trophy-card p { line-height:1.65; }
.input-modern { min-width:0;box-shadow:none; }
.voice-intro { align-items:center;padding:6px 4px 18px; }
.voice-intro h1 { font-size:24px;letter-spacing:-.5px; }
.voice-intro .eyebrow { color:var(--text-dim); }
.voice-layout { gap:14px;grid-template-columns:255px minmax(0,1fr); }
.room-card { border-radius:12px;box-shadow:none;background:var(--surface-soft);padding:15px; }
.room-card:hover { transform:none; }
.room-card.active { border-color:color-mix(in srgb,var(--accent) 50%,transparent);box-shadow:none; }
.room-top { align-items:center;gap:8px;font-size:13px; }
.room-top>span:first-child { overflow-wrap:anywhere; }
.room-top>span:first-child::before { content:none; }
.room-top>span:first-child>.tay-icon { width:16px;height:16px;margin-right:6px;color:var(--text-dim); }
.room-badge { white-space:nowrap;font-size:9px; }
.mini-chip { max-width:100%; }
.mini-chip .role-badge,.mini-chip .lvl-tag { display:none; }
.social-room-controls { flex-wrap:wrap;gap:8px; }
.speaker-tile { box-shadow:none; }
.speaker-name { max-width:100%;flex-wrap:wrap; }
.speaker-name>span:first-child { overflow-wrap:anywhere; }
.voice-dock { gap:12px;flex-wrap:wrap;box-shadow:none; }
.dock-controls { flex-wrap:wrap; }
.home-banner { flex-wrap:wrap;gap:16px;border-radius:16px;padding:24px;box-shadow:none; }
.home-banner>div:first-child { flex:1;min-width:220px; }
.home-banner>div:last-child { flex-wrap:wrap; }
.stat-card { box-shadow:none;min-width:0;padding:18px; }
.stat-val { overflow-wrap:anywhere; }
.shop-item-card { box-shadow:none;transition:border-color .15s; }
.shop-item-card:hover { transform:none; }
.shop-card-price strong { display:inline-flex;align-items:center;gap:6px; }
.shop-card-price .tay-icon { width:16px;height:16px; }
.game-cover-icon .tay-icon { width:72px;height:72px;stroke-width:1; }
.trophy-icon .tay-icon { width:40px;height:40px;stroke-width:1.4; }
.trophy-mini .tay-icon { width:24px;height:24px; }
.founder-glyph .tay-icon { width:140px;height:140px;stroke-width:1; }
.help-question,.help-answer p { user-select:text; }
.social-dialog,.feature-dialog { max-width:min(580px,calc(100vw - 40px));box-shadow:0 16px 60px #0005; }
.app-background *, .section-view:not(.active) * { animation-play-state:paused!important; }
.low-power .navbar,.low-power .panel-glass,.low-power .nav-sidebar,.low-power .voice-dock { backdrop-filter:none!important; }
.low-power .ambient-orb { display:none; }
body[data-theme=light] { --ui-line:#cec6d9;--surface-soft:#f8f5fc;--text-dim:#645d70;--text-primary:#302a3c;background:#e6e1ed!important; }
body[data-theme=light] .nav-tab,body[data-theme=light] .pill-btn,body[data-theme=light] .btn-outline { color:#40364e!important; }
body[data-theme=light] .role-Admin { color:#a3304f; }
body[data-theme=light] #sidebar-rnnoise-state,body[data-theme=light] #sidebar-xp-info { color:#775719!important; }
body[data-theme=light] .feature-card .btn-modern,body[data-theme=light] .customize-preview .btn-modern { color:#40364e; }
body[data-theme=light] .nav-group>summary,body[data-theme=light] .nav-search input { color:#4c445b; }
body[data-theme=light] .nav-tab.active { color:#30243e!important; }
body[data-theme=light] select option { background:#f8f5fc;color:#30243e; }
body[data-theme=light] .social-dialog,body[data-theme=light] .feature-dialog { background:#f1ecf7; }
body[data-theme=light] .feature-hero,body[data-theme=light] .vip-hero,body[data-theme=light] .feature-card,body[data-theme=light] .trade-compose,body[data-theme=light] .trade-offer,body[data-theme=light] .football-match,body[data-theme=light] .trophy-card { color:#30243e; }
@media(max-width:1200px) {
 .navbar { gap:10px;padding:10px 12px; }
 .nav-brand>span { display:none; }
 .xp-widget { display:none; }
 .nav-controls { flex:1;justify-content:center; }
 .user-chip .role-list,.user-chip>.role-badge { display:none; }
 .feature-scroll { padding:18px; }
 .voice-layout { grid-template-columns:220px minmax(0,1fr); }
 .game-cover-icon .tay-icon { width:56px;height:56px; }
}
@media(max-width:1000px) {
 .app-shell { grid-template-columns:195px minmax(0,1fr);padding:10px;gap:10px; }
 .navbar { margin:10px 10px 0; }
 .nav-controls { order:0;width:auto; }
 .nav-brand .rnnoise-pill { display:none; }
 .xp-timer-pill { display:none!important; }
 .voice-layout { grid-template-columns:185px minmax(0,1fr);gap:10px; }
 .feature-scroll { padding:14px; }
 .feature-hero,.vip-hero { padding:20px; }
 .voice-intro h1 { font-size:21px; }
 .room-card { padding:12px; }
 .room-top { flex-wrap:wrap; }
 .founder-glyph .tay-icon { width:100px;height:100px; }
 .two-col-grid { grid-template-columns:minmax(0,1fr); }
 .stats-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .nav-tab,body[data-density=compact] .nav-tab { padding:8px;font-size:11px; }
}
@media(max-height:680px) {
 .nav-sidebar>div:last-child:not(.sidebar-navigation) { display:none; }
 .nav-group>summary { padding-top:8px;padding-bottom:6px; }
 .feature-hero,.vip-hero { padding:16px 20px;margin-bottom:16px; }
 .feature-hero h1,.vip-hero h1 { font-size:24px; }
}
