/* Quiet salon: the painting is the main composition, navigation stays secondary. */
html body.at-home #app .menu-workspace.salon-menu{display:block!important;max-width:none!important;min-height:100dvh!important;margin:0!important;padding:42px clamp(24px,6.5vw,124px) 56px!important;box-sizing:border-box}
html body.at-home #app .salon-menu::after{background:linear-gradient(90deg,#08140cf2 0%,#0a170ede 31%,#0b160f77 58%,#10180c08 100%)!important}
html body.at-home #app .salon-menu>.home-menu{max-width:690px!important;margin:0!important}
html body.at-home #app .salon-menu.salon-home>.home-menu{max-width:440px!important}
html body #app .salon-top{display:flex;align-items:center;gap:28px;max-width:690px;margin:0 0 46px;position:relative;z-index:1}
html body #app .salon-top .menu-brand{padding:0!important;border:0!important;background:none!important;box-shadow:none!important;width:310px;min-height:0;flex-shrink:0}
html body #app .salon-top .menu-brand img{display:block;width:100%;max-width:none;height:auto}
html body #app .salon-tools{display:flex;gap:4px;margin-left:auto;align-items:center}
html body #app .salon-tools button{position:relative;width:42px!important;min-width:42px!important;height:44px!important;min-height:44px!important;padding:11px!important;border:0!important;background:none!important;color:#c6bea3;box-shadow:none!important;display:grid;place-items:center}
html body #app .salon-tools svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5}
html body #app .salon-tools #home-friends svg{fill:currentColor;stroke:none}
html body #app .salon-tools #home-mute::after{display:none!important}
html body #app .salon-tools .friend-badge{position:absolute;right:0;top:0;font-size:11px;background:#baa16e;color:#14251b;border-radius:50%;padding:1px 4px}
html body #app .salon-home .salon-top{max-width:440px;flex-wrap:wrap;gap:0;margin-bottom:26px}
html body #app .salon-home .menu-brand{width:100%;margin-bottom:24px}
html body #app .salon-home .salon-tools{margin:0 0 0 auto}
html body #app .salon-menu .home-subhead[hidden]{display:none!important}
html body #app .salon-menu .home-subhead{margin:0 0 32px!important}
html body #app .salon-home .salon-profile{display:flex;gap:15px;align-items:center;text-align:left;width:100%;border:0;background:none;box-shadow:none;padding:0;min-height:64px;margin:0 0 36px;color:#eee2c8}
html body #app .salon-profile>.avatar-art{width:62px;height:62px;flex:0 0 62px;border:1px solid #c5aa70;border-radius:50%}
html body #app .salon-profile>span:nth-child(2){min-width:0;display:flex;flex-direction:column;gap:4px}
html body #app .salon-profile strong{font:500 22px/1.3 'Literata',Georgia;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:280px}
html body #app .salon-profile small{margin-left:auto;white-space:nowrap;font-size:12px;color:#bdbda9}
html body #app .salon-profile .rank-badge{font-size:14px}
html body #app .salon-guest{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:26px;font:14px/1.5 'Golos Text',sans-serif;color:#c1c3b0}
html body #app .salon-guest button{width:auto;padding:8px 0 8px 16px;min-height:44px;background:none;border:0;box-shadow:none;color:#ebdfc4}
html body #app .salon-home .salon-play{display:grid;gap:16px}
html body #app .salon-home .salon-play button{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;width:100%;min-height:85px;padding:17px 24px;border-radius:6px;border:1px solid #ac966566;background:#13251bcc;color:#ede2c8;box-shadow:none;text-align:left}
html body #app .salon-home .salon-play button>span{font:500 25px/1.3 'Literata',Georgia}
html body #app .salon-home .salon-play button>small{font:13px/1.5 'Golos Text',sans-serif;margin-top:5px;color:#bbbda8}
html body #app .salon-home .salon-play .home-primary{background:linear-gradient(#cbb579,#b39b60)!important;border-color:#dec68a!important;color:#172519!important}
html body #app .salon-home .salon-play .home-primary>small{color:#243026}
html body #app .salon-home .salon-play button:hover:not(:disabled){filter:brightness(1.08)}
html body #app .salon-home .salon-configure{display:flex;align-items:center;justify-content:space-between;background:none;box-shadow:none;border:0;color:#c9c7b1;width:100%;padding:12px 2px;margin:8px 0 26px;font:14px/1.5 'Golos Text',sans-serif}
html body #app .salon-links{display:flex;gap:30px;margin:0 0 20px}
html body #app .salon-links button{padding:8px 0;background:none;box-shadow:none;border:0;color:#e0d4b7;width:auto;font:18px/1.4 'Literata',Georgia}
html body #app .salon-menu .home-online{justify-content:flex-start;gap:7px;margin:0!important;border:0!important;padding:0!important;font-size:11px;color:#b3b69f;flex-wrap:wrap}
html body #app .salon-menu .home-online strong{font-weight:400!important}
html body #app .salon-menu :is(.search-setup,.setup-flow,.queue-state){background:none!important;border:0!important;padding:12px 0!important}
html body #app .salon-menu .play-modes{margin-bottom:30px}
html body #app .salon-menu .play-modes button{background:none!important;border-bottom:1px solid #baa16e40!important;color:#c2c3b0}
html body #app .salon-menu .play-modes [aria-current=page]{border-bottom:2px solid #c6af77!important;color:#f1e6cc;background:none!important}
html body #app .salon-menu .public-table-choice{display:grid;grid-template-columns:22px 1fr;align-items:center;gap:6px 10px;margin:24px 0;font:15px/1.5 'Golos Text',sans-serif}
html body #app .salon-menu .public-table-choice input{min-height:18px;width:18px;height:18px;accent-color:#bba36d}
html body #app .salon-menu .public-table-choice small{grid-column:2;font-size:12px;color:#c1c3b0}
@media(min-width:1100px){html body.at-home #app .salon-home{padding-top:clamp(42px,8vh,90px)!important}}
@media(max-width:720px){
 html body.at-home #app .menu-workspace.salon-menu{padding:24px 24px 36px!important}
 html body.at-home #app .salon-menu::after{background:linear-gradient(90deg,#09160de8,#09160dae)!important}
 html body #app .salon-top{margin-bottom:32px;gap:10px;flex-wrap:wrap}
 html body #app .salon-top .menu-brand{width:min(240px,65%)}
 html body #app .salon-tools{gap:0}
 html body #app .salon-tools button{width:36px!important;min-width:36px!important;padding:8px!important}
 html body #app .salon-home .salon-top{margin-bottom:16px}
 html body #app .salon-home .menu-brand{width:100%;max-width:370px;margin:0 auto 14px}
 html body #app .salon-home .salon-profile{margin-bottom:28px}
 html body #app .salon-profile strong{max-width:200px;font-size:20px}
 html body #app .salon-home .salon-play button{padding:16px 20px;min-height:83px}
 html body #app .salon-home .salon-play button>span{font-size:22px}
 html body #app .salon-guest{font-size:12px;margin-bottom:22px}
 html body #app .salon-home .salon-configure{margin-bottom:18px}
 html body #app .salon-menu .home-online{font-size:10px;gap:5px}
}
@media(prefers-reduced-motion:no-preference){html body #app .salon-play button{transition:filter .15s ease}}
html body #app .salon-menu .salon-top .menu-brand{position:static!important;inset:auto!important;transform:none!important}
html body #app .salon-menu .salon-top .menu-brand img{position:static!important;inset:auto!important}

html body #app .salon-menu .appearance-save{bottom:0!important}
/* v264: stable navigation, compact setup and a separate status area. */
html body #app .salon-home .salon-configure{display:grid;gap:10px;margin:20px 0 24px;padding:0}
html body #app .salon-home .salon-configure button{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:52px;padding:12px 16px;border:1px solid #b9a27055;background:#14261b7a;color:#e8ddc2;border-radius:5px;font:20px/1.4 'Literata',Georgia}
html body #app .salon-profile small{font:16px/1.4 'Golos Text',sans-serif}
html body.at-home #app .salon-menu>.home-menu{max-width:640px!important}
html body.at-home #app .salon-menu.salon-search>.home-menu{max-width:560px!important}
html body #app .salon-menu .home-subhead{display:grid!important;grid-template-columns:1fr auto;gap:16px!important;align-items:center!important;margin:0 0 32px!important}
html body #app .salon-menu .home-subhead .home-back{justify-self:start;grid-column:1;grid-row:1}
html body #app .salon-menu .home-subhead h2{grid-column:1/-1;grid-row:2;order:initial!important;font-size:30px!important}
html body #app .salon-menu .home-subhead .profile-logout{grid-column:2;grid-row:1}
html body #app .salon-menu .home-subhead[hidden]{display:none!important}
html body #app .salon-search .queue-state{padding:8px 0 24px!important}
html body #app .salon-search .queue-state h3{margin:0 0 14px!important;font-size:24px}
html body #app .salon-search .queue-count{font-size:24px!important;margin:0 0 24px!important}
html body #app .salon-search .queue-seats{margin:0!important}
html body #app .salon-search .queue-seat{border:0!important;border-radius:0;min-height:88px;padding:14px 0!important}
html body #app .salon-search .queue-seat.filled{background:#c4ab6e0a;border-radius:6px;padding:14px 12px!important}
html body #app .salon-search .queue-state>p{margin:24px 0 10px;font-size:13px;line-height:1.7}
html body #app .salon-search .queue-cancel{margin:0!important;min-height:48px}
html body #app .salon-menu .compact-setting{display:grid;grid-template-columns:minmax(100px,1fr) minmax(140px,1fr);align-items:center;gap:16px;margin:18px 0;font:15px/1.5 'Golos Text',sans-serif;color:#cac8b3}
html body #app .salon-menu .compact-setting select{width:100%;padding:10px 36px 10px 14px;background:#172b20;color:#efe3c7;border:1px solid #b6a06b70;border-radius:5px;cursor:pointer}
html body #app .salon-menu .compact-setting option{background:#172b20;color:#efe3c7}
html body #app .salon-menu .play-modes{margin-bottom:26px;border:0!important}
html body #app .salon-menu .play-modes [aria-current=page]{color:#f4e7c9!important;opacity:1!important}
html body #app .salon-menu .rank-navigation{display:flex;gap:12px;margin:24px 0}
html body #app .salon-menu .rank-navigation button{flex:1;padding:12px;border:1px solid #b9a27055;background:#14261b99;color:#e8ddc2;font:17px 'Literata',Georgia;border-radius:5px}
html body #app .salon-menu .rank-ladder{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 14px;padding:0!important;margin:28px 0!important;list-style:none}
html body #app .salon-menu .rank-ladder li{display:flex!important;flex-direction:column!important;justify-content:flex-start;align-items:center!important;text-align:center;gap:10px;padding:20px 8px!important;min-width:0;border:1px solid #b9a27028!important;background:linear-gradient(#1c3023aa,#14221880)!important;border-radius:8px;position:relative}
html body #app .salon-menu .rank-ladder li.is-current{border-color:#d3b778!important;background:linear-gradient(#3d4229b8,#203222cc)!important}
html body #app .salon-menu .rank-ladder .rank-art{width:104px!important;height:104px!important;flex:none!important;display:block!important;margin:0!important}
html body #app .salon-menu .rank-ladder .rank-emblem{width:100%!important;height:100%!important;object-fit:contain}
html body #app .salon-menu .rank-ladder li>span{display:flex;flex-direction:column;align-items:center;gap:7px}
html body #app .salon-menu .rank-ladder strong{font:19px/1.4 'Literata',Georgia;color:#ebdec0}
html body #app .salon-menu .rank-ladder small{font:12px/1.5 'Golos Text',sans-serif;color:#bebfa8}
html body #app .salon-menu .rank-current-label{font:11px 'Golos Text',sans-serif;color:#e4cb91}
html body #app .salon-status{display:block!important;margin:38px 0 0;padding:14px 0;width:fit-content;color:#b9bba6}
html body #app .salon-status .home-online{font-size:12px!important;gap:7px!important;line-height:1.8}
html body #app .history-privacy{display:flex;align-items:center;gap:12px;margin:24px 0 6px;font:14px/1.6 'Golos Text',sans-serif;color:#d5ceb8}
html body #app .history-privacy input{width:18px;height:18px;min-height:18px!important;accent-color:#bfa66c;flex:none}
html body #app #history-privacy-status{min-height:20px;font-size:12px;color:#bec8ad;margin:0 0 12px}
html body #modal:has(#friends-dialog-root){width:min(620px,calc(100vw - 32px))!important;max-height:85dvh!important}
html body #modal #friends-dialog-root{min-width:0}
@media(min-width:1100px){
 html body.at-home #app .menu-workspace.salon-menu{padding-bottom:108px!important}
 html body #app .salon-menu .salon-tools{position:fixed;right:36px;bottom:24px;z-index:12;margin:0;padding:6px 10px;background:#0f2118e6;border:1px solid #bca57440;border-radius:30px;gap:10px}
 html body #app .salon-home .salon-top{margin-bottom:38px}
 html body #app .salon-home .menu-brand{margin-bottom:0}
 html body #app .salon-status{position:fixed;bottom:22px;left:clamp(24px,6.5vw,124px);margin:0;padding:12px 16px;background:#0e1e15ed;border:1px solid #bca57425;border-radius:26px;z-index:10}
}
@media(max-width:720px){
 html body #app .salon-home .salon-configure button{font-size:18px}
 html body #app .salon-profile small{font-size:14px}
 html body #app .salon-profile strong{max-width:160px}
 html body #app .salon-menu .rank-ladder{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 html body #app .salon-menu .rank-ladder .rank-art{width:90px!important;height:90px!important}
 html body #app .salon-menu .home-subhead h2{font-size:25px!important}
 html body #app .salon-status .home-online{font-size:10px!important;gap:5px!important}
}
html body #app .salon-home .salon-configure{grid-template-columns:minmax(0,1fr);justify-content:stretch;width:100%}
html body #app .salon-menu .home-subhead{height:auto!important;min-height:0!important}
html body #app .salon-menu:not(.salon-home) .salon-status{position:static;margin:42px 0 0;max-width:100%}
/* v265: footer participates in layout; search state never changes unrelated pages. */
html body.at-home #app .menu-workspace.salon-home{display:flex!important;flex-direction:column;align-items:flex-start!important;padding-bottom:28px!important}
html body #app .salon-home>.salon-top,html body #app .salon-home>.home-menu{flex-shrink:0}
html body #app .salon-home>.salon-top{width:100%}
html body #app .salon-home .salon-status{position:static!important;flex-shrink:0;margin:30px 0 0!important;max-width:100%}
html body #app .salon-menu .participation-note{margin:20px 0 0;font:14px/1.6 'Golos Text',sans-serif;color:#d3c9ae}
html body #modal .friends-page .friend-person{display:grid!important;grid-template-columns:44px minmax(0,1fr);gap:3px 12px;flex:1;min-width:0;padding:8px 4px;background:none!important;border:0!important;box-shadow:none!important}
html body #modal .friends-page .friend-person>.avatar-art{grid-row:1/3;width:44px;height:44px}
html body #modal .friends-page .friend-identity{grid-column:2;min-width:0}
html body #modal .friends-page .friend-identity strong{font-size:18px}
html body #modal .friends-page .friend-renown{grid-column:2;font-size:13px;gap:5px;min-width:0;flex-wrap:wrap}
html body #modal .friends-page .friend-renown .rank-emblem{width:24px;height:24px}
html body #modal .friends-page .friend-row{gap:4px}
html body #modal .friends-page .friend-tabs{display:flex;gap:8px}
html body #modal .friends-page .friend-tabs button{min-width:0;flex:1;font-size:15px!important;padding:10px 5px!important;min-height:46px}
@media(min-width:1100px){
 html body #app .salon-home .salon-status{margin-top:auto!important;position:relative!important;inset:auto!important;transform:translateY(0);}
 html body #app .salon-home>.home-menu{margin-bottom:30px!important}
}
@media(max-width:720px){
 html body #app .salon-home .menu-brand{max-width:300px;margin-bottom:8px}
 html body #app .salon-home .salon-top{margin-bottom:14px}
 html body #app .salon-home .salon-profile{margin-bottom:22px;gap:12px}
 html body #app .salon-home .salon-profile>.avatar-art{width:52px;height:52px;flex-basis:52px}
 html body #app .salon-home .salon-play button{padding:14px 16px;min-height:78px}
 html body #app .salon-home .salon-play button>span{font-size:20px}
 html body #app .salon-home .salon-play button>small{font-size:12px}
 html body #app .salon-home .salon-configure{margin:16px 0 18px;gap:8px}
 html body #app .salon-home .salon-configure button{font-size:17px;min-height:48px}
 html body #app .salon-menu .salon-top{margin-bottom:22px}
 html body #app .salon-menu .home-subhead{gap:8px!important;margin-bottom:24px!important}
 html body #app .salon-menu .compact-setting{grid-template-columns:minmax(0,1fr) minmax(125px,1fr);gap:12px}
 html body #modal:has(#friends-dialog-root){padding:20px 16px!important}
 html body #modal .friends-page .friend-identity strong{font-size:16px}
}
html body.at-home #app .menu-workspace.salon-home{gap:0!important}
html body #app .salon-home .salon-links{margin-bottom:0}
html body #app .salon-home #form-error:empty{display:none}
@media(min-width:1100px) and (max-height:820px){
 html body.at-home #app .menu-workspace.salon-home{padding-top:30px!important}
 html body #app .salon-home .salon-top{max-width:360px;margin-bottom:24px}
 html body #app .salon-home .salon-profile{margin-bottom:24px}
 html body #app .salon-home .salon-play button{min-height:76px;padding:13px 22px}
 html body #app .salon-home .salon-play button>span{font-size:23px}
 html body #app .salon-home .salon-configure{margin:16px 0 18px}
}
html body.at-home #app .menu-workspace.salon-home>.home-menu{margin-bottom:24px!important}
/* v266: paired text/surface states and a reserved desktop footer. */
html body.at-home #app .menu-workspace.salon-menu .home-content:not(.paper-content) :is(button.home-primary,button.search-primary){color:#19271d!important;text-shadow:none!important}
html body.at-home #app .menu-workspace.salon-menu .home-content:not(.paper-content) :is(button.home-primary,button.search-primary):is(:hover,:focus-visible,:active){color:#19271d!important;background:#d0ba81!important;border-color:#e0ca94!important;text-shadow:none!important}
html body.at-home #app .menu-workspace.salon-menu .home-content:not(.paper-content) :is(button.home-primary,button.search-primary):disabled{color:#243026!important;background:#a39b7e!important;border-color:#a39b7e!important;opacity:1!important;filter:none!important;cursor:not-allowed}
html body.at-home #app .menu-workspace.salon-menu .paper-content button.home-primary:is(:hover,:focus-visible,:active){color:#f4ead2!important;background:#314d3a!important;border-color:#314d3a!important}
html body.at-home #app .menu-workspace.salon-menu .settings-list{display:grid;gap:30px;padding:0!important;border:0!important;background:none!important;border-radius:0;max-width:560px}
html body.at-home #app .menu-workspace.salon-menu .settings-list section{display:grid;gap:10px;min-width:0}
html body.at-home #app .menu-workspace.salon-menu .settings-list h3{font:14px/1.5 'Golos Text',sans-serif;color:#bdc1ac;margin:0 0 4px;padding:0}
html body.at-home #app .menu-workspace.salon-menu .settings-list button{display:grid!important;grid-template-columns:minmax(0,1fr) 18px;align-items:center;gap:18px;width:100%;padding:15px 18px!important;min-height:56px;border:1px solid #b9a27055!important;border-radius:5px!important;background:#14261bd9!important;box-shadow:none!important;color:#efe2c6!important;text-align:left}
html body.at-home #app .menu-workspace.salon-menu .settings-list button:is(:hover,:focus-visible,:active){background:#284131!important;border-color:#c4ae79!important;color:#fff0d0!important}
html body.at-home #app .menu-workspace.salon-menu .settings-copy{display:block;min-width:0}
html body.at-home #app .menu-workspace.salon-menu .settings-copy strong{display:block;font:500 21px/1.4 'Literata',Georgia;color:inherit!important}
html body.at-home #app .menu-workspace.salon-menu .settings-copy small{display:block;margin-top:4px;font:13px/1.5 'Golos Text',sans-serif;color:#c1c7b3!important}
html body.at-home #app .menu-workspace.salon-menu .settings-list svg{width:18px;height:18px;fill:none;stroke:#c4b487;stroke-width:1.5;justify-self:end}
@media(min-width:1100px){
 html body.at-home{--salon-side:clamp(24px,6.5vw,124px);--salon-bottom:24px;--salon-dock-height:52px;--salon-dock-space:96px}
 html body.at-home #app{height:calc(100dvh - var(--salon-dock-space))!important;min-height:0!important}
 html body.at-home #app .menu-workspace.salon-menu{min-height:calc(100dvh - var(--salon-dock-space))!important;padding-bottom:32px!important}
 html body.at-home #app .menu-workspace.salon-menu .salon-status{position:fixed!important;left:var(--salon-side)!important;right:auto!important;top:auto!important;bottom:var(--salon-bottom)!important;display:flex!important;align-items:center;box-sizing:border-box;height:var(--salon-dock-height)!important;min-height:var(--salon-dock-height)!important;margin:0!important;padding:0 16px!important;transform:none!important;z-index:15}
 html body.at-home #app .menu-workspace.salon-menu .salon-tools{position:fixed!important;right:var(--salon-side)!important;left:auto!important;top:auto!important;bottom:var(--salon-bottom)!important;display:flex;align-items:center;box-sizing:border-box;height:var(--salon-dock-height)!important;min-height:var(--salon-dock-height)!important;margin:0!important;padding:0 10px!important;z-index:15}
}
@media(max-width:720px){
 html body.at-home #app .menu-workspace.salon-menu .settings-list{gap:24px}
 html body.at-home #app .menu-workspace.salon-menu .settings-list button{padding:13px 15px!important;gap:12px}
 html body.at-home #app .menu-workspace.salon-menu .settings-copy strong{font-size:19px}
}

/* Shared identity row for both games. */
html body #app .salon-profile .rank-badge{display:flex;align-items:center;gap:7px;margin:0;min-height:32px;line-height:20px}
html body #app .salon-profile .rank-badge .rank-emblem{width:32px;height:32px;flex:0 0 32px;margin:0}
html body #app .salon-profile .rank-badge .rank-name{display:block;font-size:16px;line-height:20px;margin:0;transform:none}

/* Keep desktop shading behind the content, with a short fade into the artwork. */
@media(min-width:1100px){
 html body.at-home #app .salon-menu{--menu-shade-width:690px}
 html body.at-home #app .salon-home{--menu-shade-width:440px}
 html body.at-home #app .salon-menu::after{background:linear-gradient(90deg,#08140cf2 0px,#0a170ede calc(var(--salon-side) + var(--menu-shade-width) - 40px),#0b160f66 calc(var(--salon-side) + var(--menu-shade-width) + 80px),#0b160f00 calc(var(--salon-side) + var(--menu-shade-width) + 220px))!important}
}

.profile-game-tabs{display:flex;gap:8px;margin:0 0 24px}.profile-game-tabs button{min-width:120px;padding:10px 20px}.profile-game-tabs [aria-pressed=true]{background:#baa26c!important;color:#18251b!important}html body #app .appearance-editor .profile-deck-entry{margin:12px 0;font-size:16px}

html body #app .profile-game-tabs{display:flex;gap:24px;margin:8px 0 24px;border-bottom:1px solid #baa16b40}html body #app .profile-game-tabs button{min-width:0;padding:12px 4px;border:0!important;border-bottom:2px solid transparent!important;border-radius:0;background:none!important;color:#bfc4b0!important;font:16px/1.4 'Golos Text',sans-serif}html body #app .profile-game-tabs [aria-pressed=true]{border-bottom-color:#dac080!important;color:#f0dfb2!important}html body #app .profile-game-tabs button span{margin-right:6px;color:#d3b878}html body #app .public-profile-heading{margin-bottom:20px}

/* One shared column offset for identity and request controls. */
html body #modal .friends-page{--friend-avatar:44px;--friend-gap:12px}
html body #modal .friends-page .friend-row{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:8px;row-gap:12px;padding:16px 0;align-items:center}
html body #modal .friends-page .friend-person{grid-template-columns:var(--friend-avatar) minmax(0,1fr);column-gap:var(--friend-gap);padding:0!important;width:100%;margin:0}
html body #modal .friends-page .friend-person>.avatar-art{align-self:start;margin-top:3px}
html body #modal .friends-page .friend-request-actions{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px;width:auto;min-width:0;margin-left:calc(var(--friend-avatar) + var(--friend-gap));padding:0}
html body #modal .friends-page .friend-request-actions button{margin:0;min-height:40px;padding:9px 14px!important;font:14px/1.35 'Golos Text',sans-serif!important}
html body #modal .friends-page .friend-remove-confirm{grid-column:1/-1;box-sizing:border-box}
@media(max-width:400px){html body #modal .friends-page{--friend-avatar:40px;--friend-gap:10px}html body #modal .friends-page .friend-person>.avatar-art{width:40px;height:40px}html body #modal .friends-page .friend-request-actions{margin-left:0}html body #modal .friends-page .friend-request-actions button{flex:1;padding:9px 10px!important}}

html body #app .menu-workspace .game-setup-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin:20px 0 16px}
html body #app .menu-workspace .game-setup-row>label{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:8px;min-width:0;margin:0!important;padding:0}
html body #app .menu-workspace .game-setup-row>label>span{font:14px/1.4 'Golos Text',sans-serif}
html body #app .menu-workspace .game-setup-row select{box-sizing:border-box;width:100%!important;max-width:100%;min-width:0;min-height:46px;font:14px 'Golos Text',sans-serif}
html body #app .menu-workspace div.search-terms{padding:0!important;color:#b8bba8;font:13px/1.6 'Golos Text',sans-serif}
html body #app .menu-workspace div.search-terms p{margin:10px 0}

html body #modal .friends-page{container-type:inline-size;--friend-avatar:40px;--friend-gap:10px}
html body #modal .friends-page .friend-tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;border:1px solid #bba36b44;border-radius:6px;background:#0d241966;margin-bottom:16px}
html body #modal .friends-page .friend-tabs button{background:none!important;box-shadow:none!important;border:1px solid transparent!important;min-height:38px;padding:7px!important}
html body #modal .friends-page .friend-tabs button[aria-pressed=true]{background:#c0ab7220!important;border-color:#c0ab724f!important}
html body #modal .friends-page .friend-row{padding:12px;gap:10px;margin:10px 0 0;border:1px solid #b39d6b38;border-radius:6px;background:#11291d66}
html body #modal .friends-page .friend-person>.avatar-art{width:40px;height:40px;align-self:center;margin:0}
html body #modal .friends-page .friend-identity strong{font-size:17px;line-height:1.3}
html body #modal .friends-page .friend-identity small{margin-top:2px;font-size:11px}
html body #modal .friends-page .friend-renown{font-size:12px}
html body #modal .friends-page .friend-renown .rank-emblem{width:18px;height:18px}
html body #modal .friends-page .friend-request-actions{margin:0;grid-column:2;grid-row:1;flex-wrap:nowrap;align-items:center}
html body #modal .friends-page .friend-request-actions button{min-height:36px;padding:8px 10px!important;font-size:12px!important;box-shadow:none!important}
html body #modal .friends-page .friend-request-actions .quiet{background:none!important;border-color:transparent!important;color:#b7bba8}
@container(max-width:440px){html body #modal .friends-page .friend-request-actions{grid-column:1/-1;grid-row:2;display:flex;margin:0}html body #modal .friends-page .friend-request-actions button{flex:1}}

/* Keep search actions legible and aligned before hover. */
html body #app .salon-search :is([data-checkers-cancel],.queue-cancel){display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;padding:12px 18px;border:1px solid #c4ad75!important;border-radius:6px;background:#3a4d35!important;color:#f4e5bb!important;font:500 16px 'Golos Text',sans-serif;text-align:center;box-shadow:inset 0 1px 0 #fff1}
html body #app .salon-search :is([data-checkers-cancel],.queue-cancel):hover{background:#4b5e40!important;border-color:#e4cd91!important}
html body #app .salon-search :is([data-checkers-cancel],.queue-cancel):focus-visible{outline:2px solid #eed598;outline-offset:3px}
html body #app .salon-search .checkers-queue{display:grid;justify-items:center;gap:18px;padding:28px 0 0}
html body #app .salon-search .checkers-queue h3,html body #app .salon-search .checkers-queue p{margin:0}
html body #app .salon-search .queue-duel{display:grid;grid-template-columns:70px auto 70px;align-items:center;gap:28px;margin:6px 0}
html body #app .salon-search [data-checkers-cancel]{margin:6px 0 0}
html body #app .salon-search .rank-navigation{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:24px 0 0;width:100%}
html body #app .salon-search .rank-navigation button{display:flex;align-items:center;justify-content:center;min-width:0;margin:0;min-height:48px}