/* SoulShive reference alignment, 21 Oct 2026.
   Source: REFERINTE/IMAGINE_APROBATA_UTILIZATOR_2026-10-20.png
   and MOCKUP/SOULSHIVE_MOCKUP_COMPLET_ORIGINAL.png.
   Shared presentation only: no synthetic data, no changes to permissions or payments. */
:root{--ss-ref-bg:#060b1b;--ss-ref-surface:#0b142b;--ss-ref-line:#293962;--ss-ref-text:#f4f6ff;--ss-ref-muted:#b7c5e4;--ss-ref-purple:#a44bff;--ss-ref-blue:#357bff}
body.ss27-mockup{background:var(--ss-ref-bg);color:var(--ss-ref-text);overflow-x:clip}
body.ss27-mockup .ss26-content-wrap{box-sizing:border-box;max-width:1500px;width:calc(100% - 48px);margin-inline:auto;min-width:0}
body.ss27-mockup :is(.card,.panel,.ss26-panel){border-color:var(--ss-ref-line);border-radius:14px}
body.ss27-mockup :is(.card,.panel,.ss26-panel) :is(p,li){line-height:1.55}
body.ss27-mockup :is(input,textarea,select){max-width:100%;box-sizing:border-box}
body.ss27-mockup :is(.ss26-page-masthead,.ss26-page-masthead-inner){min-height:0}
body.ss27-mockup .ss26-page-masthead-inner{padding-block:20px}
body.ss27-mockup .ss26-page-masthead-copy h1{font-size:clamp(26px,3vw,42px);margin-block:5px 8px}
body.ss27-mockup .ss26-page-masthead-copy p{font-size:16px;line-height:1.5}
/* Approved home reference: illustration to the right, search and heading to the left.
   Override the old compact-intro rules that removed the artwork entirely. */
body.ss-route-index .ss26-community-hero.ss26-approved-compact-intro{position:relative;isolation:isolate;display:flex;align-items:center;min-height:315px!important;height:auto!important;max-height:none!important;overflow:hidden;border:1px solid #354a84!important;border-radius:16px!important;background:#080e23!important}
body.ss-route-index .ss26-approved-compact-intro .ss26-community-hero-art{display:block!important;position:absolute!important;inset:0!important;background-image:url('/assets/home2026/hero-art.webp')!important;background-position:right center!important;background-size:auto 100%!important;background-repeat:no-repeat!important;opacity:.95!important;z-index:-2!important}
body.ss-route-index .ss26-community-hero.ss26-approved-compact-intro:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#070c1dfc 0%,#070c1df0 30%,#070c1db5 52%,#070c1d0c 100%)!important}
body.ss-route-index .ss26-approved-compact-intro .ss26-community-hero-copy{width:min(100%,690px)!important;max-width:690px!important;text-align:left!important;padding:clamp(24px,3vw,44px)!important;margin:0!important}
body.ss-route-index .ss26-approved-compact-intro h1{font-size:clamp(30px,3.4vw,52px)!important;line-height:1.1!important;text-align:left!important;margin:10px 0!important}
body.ss-route-index .ss26-approved-compact-intro h1 br{display:block!important}
body.ss-route-index .ss26-approved-compact-intro p{margin:10px 0 16px!important;text-align:left!important;font-size:16px!important;max-width:580px!important}
body.ss-route-index .ss26-approved-compact-intro .ss26-hero-search{max-width:560px!important;margin:14px 0!important}
body.ss-route-index .ss26-approved-compact-intro .ss26-community-trust{justify-content:flex-start!important}
/* The approved discovery section must not split into unequal-height columns.
   The featured carousel is followed by the ranking table across the full width. */
body.ss-route-index .ss26-home-discovery-board.ss26-approved-directory{
 display:grid!important;grid-template-columns:minmax(0,1fr)!important;
 align-items:start!important;gap:clamp(12px,1.5vw,20px)!important;
}
body.ss-route-index .ss26-home-discovery-board.ss26-approved-directory > :is(.ss26-recommended,.ss26-catalog-preview){
 grid-column:1/-1!important;min-width:0!important;width:100%!important;
 height:auto!important;align-self:start!important;
}
body.ss-route-index .ss26-approved-directory .ss26-catalog-scroll{max-width:100%!important;overflow-x:auto!important}
body.ss-route-index .ss26-home-rankings{min-width:0}
body.ss-route-index .ss26-home-rankmeta{min-width:0}
body.ss-route-index .ss26-home-rankdetails{display:flex;flex-wrap:wrap;gap:4px 12px;line-height:1.4}
body.ss-route-index .ss26-home-rankdetail{overflow-wrap:anywhere}
/* Consistent hierarchy across public pages, including forms and marketplace. */
body.ss27-mockup main :is(h1,h2,h3){text-wrap:balance}
body.ss27-mockup main :is(.card,.panel,.ss26-panel){min-width:0}
body.ss27-mockup main :is(a,button){touch-action:manipulation}
body.ss27-mockup main :is(a,button,input,select,textarea):focus-visible{outline:3px solid #8fc9ff;outline-offset:2px}

@media(max-width:720px){
 body.ss27-mockup .ss26-content-wrap{width:calc(100% - 24px)!important;padding-top:14px!important}
 body.ss27-mockup .ss26-page-masthead-inner{padding-block:16px!important}
 body.ss27-mockup .ss26-page-masthead-copy h1{font-size:clamp(25px,7vw,34px)!important}
 body.ss-route-index .ss26-community-hero.ss26-approved-compact-intro{min-height:280px!important}
 body.ss-route-index .ss26-approved-compact-intro .ss26-community-hero-art{background-size:auto 100%!important;background-position:72% center!important;opacity:.45!important}
 body.ss-route-index .ss26-community-hero.ss26-approved-compact-intro:after{background:linear-gradient(90deg,#070c1dfb 0%,#070c1de9 62%,#070c1d85 100%)!important}
 body.ss-route-index .ss26-approved-compact-intro .ss26-community-hero-copy{padding:22px 16px!important}
 body.ss-route-index .ss26-approved-compact-intro h1{font-size:clamp(28px,7vw,36px)!important}
 body.ss-route-index .ss26-approved-compact-intro p{font-size:15px!important}
 body.ss-route-index .ss26-home-discovery-board.ss26-approved-directory{gap:14px!important}
 body.ss-route-index .ss26-home-rankdetails{font-size:14px!important}
 body.ss27-mockup main :is(.card,.panel,.ss26-panel){border-radius:12px!important}
}
@media(prefers-reduced-motion:reduce){body.ss27-mockup *{scroll-behavior:auto!important}}

/* Reference-alignment batch 2: server discovery, detail, Boost, community,
   news, partners, account and owner forms. Keep page-specific content intact. */
:root{--ss-ref-radius:16px;--ss-ref-gap:18px;--ss-ref-focus:#9bc8ff}
/* Keep content centered on large displays without clipping wide data tables. */
body.ss27-mockup :is(.sl-page,.sv26,.ssbx,.ssc1,.as26,.ss27-edit,.ssnews26,.pn-page,.ssp26){box-sizing:border-box;min-width:0}
body.ss27-mockup :is(.sl-hero,.sv-hero,.ssbx-hero,.ssc1-hero,.ssnews26-hero,.pn-report-hero,.ss27-edit-hero){position:relative;isolation:isolate;overflow:hidden;border:1px solid var(--ss-ref-line);border-radius:var(--ss-ref-radius);background-color:#0c1630}
body.ss27-mockup :is(.sl-hero,.sv-hero,.ssbx-hero,.ssc1-hero,.ssnews26-hero,.pn-report-hero,.ss27-edit-hero) :is(h1,h2){font-size:clamp(28px,3.5vw,46px);line-height:1.12;overflow-wrap:anywhere}
body.ss27-mockup :is(.sl-hero,.sv-hero,.ssbx-hero,.ssc1-hero,.ssnews26-hero,.pn-report-hero,.ss27-edit-hero) :is(p,.sl-crumb){line-height:1.55}
/* Server directory: filter controls remain usable on phones and never overlap. */
body.ss-route-servers .sl-card.sl-filter{min-width:0;border:1px solid var(--ss-ref-line);border-radius:var(--ss-ref-radius);background:#0b142b}
body.ss-route-servers .sl-filtertabs{display:flex;flex-wrap:wrap;gap:8px;min-width:0;max-width:100%}
body.ss-route-servers .sl-filtertabs :is(a,button){white-space:normal;min-height:42px;max-width:100%}
body.ss-route-servers :is(.sl-card,.sl-filter,.sl-page) :is(input,select){min-width:0;max-width:100%;box-sizing:border-box}
/* Server detail: metrics and title stay readable with long server names. */
body.ss27-mockup .sv26 .sv-title{overflow-wrap:anywhere;line-height:1.15}
body.ss27-mockup .sv26 .sv-facts{display:flex;flex-wrap:wrap;gap:10px}
body.ss27-mockup .sv26 .sv-fact{min-width:0;flex:1 1 135px}
/* Boost cards: prevent badges and pricing text from overlapping. */
body.ss27-mockup .ssbx :is(.ssb27-showcase,.ssbx-promo,.ssbx-seasonal){min-width:0;max-width:100%;box-sizing:border-box}
body.ss27-mockup .ssbx :is(.ssbx-hero-points,.ssbx-seasonal){flex-wrap:wrap}
/* Community and editorial content: shared reference surface rhythm. */
body.ss27-mockup :is(.ssc1-card,.ssnews26-featured-card,.pn-panel,.ss27-edit-card,.as26-panel,.ssp-card){box-sizing:border-box;min-width:0;border-radius:var(--ss-ref-radius)}
body.ss27-mockup :is(.ssc1-duo,.as26-grid,.ss27-edit,.ssnews26-main){min-width:0;max-width:100%}
body.ss27-mockup :is(.as26,.ss27-edit,.ssp26) :is(input,select,textarea){box-sizing:border-box;min-width:0;max-width:100%}
body.ss27-mockup :is(.as26,.ss27-edit) :is(label,.ss27-edit-hint){overflow-wrap:anywhere}
body.ss27-mockup :is(.ssnews26-filterbar,.ssnews26-cats){min-width:0;max-width:100%;flex-wrap:wrap}
body.ss27-mockup :is(.ssnews26-search,.ssnews26-filterbar input){min-width:0;max-width:100%}
body.ss27-mockup :is(.pn-page,.ssp26) :is(.pn-panel,.ssp-card){overflow-wrap:anywhere}
@media(max-width:720px){
 body.ss27-mockup :is(.sl-hero,.sv-hero,.ssbx-hero,.ssc1-hero,.ssnews26-hero,.pn-report-hero,.ss27-edit-hero){border-radius:13px}
 body.ss27-mockup :is(.sl-hero,.sv-hero,.ssbx-hero,.ssc1-hero,.ssnews26-hero,.pn-report-hero,.ss27-edit-hero) :is(h1,h2){font-size:clamp(26px,7vw,34px)}
 body.ss-route-servers .sl-filtertabs :is(a,button){min-height:44px}
 body.ss27-mockup .sv26 .sv-fact{flex-basis:calc(50% - 10px)}
 body.ss27-mockup :is(.as26,.ss27-edit) :is(button,.as26-btn,.ss27-edit-btn){min-height:44px}
 body.ss27-mockup :is(.ssbx,.ssc1,.ssnews26,.pn-page,.ssp26) :is(p,li){overflow-wrap:break-word}
}

/* Reference batch 3: coherent card rhythm across Home, directory, profile,
   marketplace, community, forms and the permission-aware Admin dashboard. */
body.ss27-mockup{--ss-ref-card-gradient:linear-gradient(145deg,#101c38 0%,#0b142b 85%)}
body.ss27-mockup :is(.ss26-home-rankings,.ss26-home-discovery-board,.ssc1-duo,.ssc1-games,.ssp-shell,.ssbx-tiers,.ss27-admin-intro){min-width:0;max-width:100%;box-sizing:border-box}
body.ss27-mockup :is(.ss26-home-rankings,.ss26-home-discovery-board,.ssc1-duo,.ssc1-games,.ssbx-tiers)>*{min-width:0}
body.ss27-mockup :is(.ssc1-card,.ssc1-clan-card,.ssc1-game,.ssp-card,.ssp-stat,.ssbx-tier,.ssbx-how-card){border:1px solid var(--ss-ref-line);border-radius:16px;background-color:var(--ss-ref-surface);box-sizing:border-box;min-width:0}
body.ss27-mockup :is(.ssc1-card,.ssc1-clan-card,.ssp-card,.ssp-stat,.ssbx-tier){box-shadow:0 12px 35px rgba(0,0,0,.12)}
body.ss27-mockup :is(.ssc1-card,.ssp-card,.ssbx-tier) :is(h2,h3,p){overflow-wrap:anywhere}
body.ss27-mockup :is(.ssc1-actions,.ssc1-mini-actions,.ssp-side-btns,.ssbx-hero-points){display:flex;flex-wrap:wrap;gap:10px;min-width:0}
body.ss27-mockup :is(.ssc1-actions,.ssc1-mini-actions,.ssp-side-btns) :is(a,button){min-height:44px;max-width:100%;box-sizing:border-box;white-space:normal}
body.ss-route-profile .ssp-shell{align-items:start;gap:20px}
body.ss-route-profile :is(.ssp-side,.ssp-main){min-width:0;max-width:100%}
body.ss-route-profile .ssp-topstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr));gap:12px}
body.ss-route-community .ssc1-games{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:14px}
body.ss-route-community .ssc1-game{overflow:hidden}
body.ss-route-community .ssc1-game-copy{overflow-wrap:anywhere}
body.ss-route-boost .ssbx-how-card{min-width:0;overflow-wrap:anywhere}
body.ss26-admin-route .ss27-admin-intro{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;border:1px solid var(--ss-ref-line);border-radius:16px;background:var(--ss-ref-card-gradient);padding:clamp(16px,2vw,26px)}
body.ss26-admin-route .ss27-admin-intro__copy{min-width:0;flex:1 1 260px}
body.ss26-admin-route nav.ss27-admin-tabs.ss-admin-menu-grid{width:100%;box-sizing:border-box;min-width:0;max-width:100%;gap:10px!important;padding:12px!important;border:1px solid var(--ss-ref-line);border-radius:16px;background:#0b142b;overflow:visible!important}
body.ss26-admin-route nav.ss27-admin-tabs.ss-admin-menu-grid > .ss-admin-menu-heading{font-size:16px;letter-spacing:.02em;padding:12px 4px 8px}
body.ss26-admin-route nav.ss27-admin-tabs.ss-admin-menu-grid > a.chip{font-size:15px;line-height:1.35;min-width:0;min-height:46px;padding:10px 8px}
body.ss27-mockup :is(.sl-page,.sv26,.ssc1,.ssp26,.ssbx) :is(table,.ss27-ip-table){max-width:100%}
@media(max-width:720px){
 body.ss-route-profile .ssp-shell{display:flex;flex-direction:column;gap:14px}
 body.ss-route-profile :is(.ssp-side,.ssp-main){width:100%}
 body.ss-route-community .ssc1-games{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 body.ss-route-community .ssc1-game{min-height:100px}
 body.ss-route-community .ssc1-game-copy{padding:10px}
 body.ss26-admin-route .ss27-admin-intro{padding:16px}
 body.ss26-admin-route nav.ss27-admin-tabs.ss-admin-menu-grid{padding:10px!important;gap:8px!important}
 body.ss26-admin-route nav.ss27-admin-tabs.ss-admin-menu-grid > a.chip{font-size:14px;min-height:48px}
 body.ss27-mockup :is(.ssc1-card,.ssp-card,.ssbx-tier){border-radius:13px}
}
@media(max-width:390px){body.ss-route-community .ssc1-games{grid-template-columns:minmax(0,1fr)}}

/* Reference batch 4 — Marketplace, server details, Boost and editorial.
   Use the existing page components; never change their data or actions. */
body.ss-route-shop .ss-market-showcase{overflow:hidden;isolation:isolate;border:1px solid var(--ss-ref-line);border-radius:18px;background:linear-gradient(125deg,#121d40,#090f23);min-width:0}
body.ss-route-shop .ss-market-showcase-content{min-width:0;max-width:100%;box-sizing:border-box;padding:clamp(20px,3vw,42px)}
body.ss-route-shop .ss-market-showcase-title{font-size:clamp(30px,4vw,54px);line-height:1.08;overflow-wrap:anywhere}
body.ss-route-shop .ss-market-showcase-description{font-size:16px;line-height:1.6;max-width:70ch}
body.ss-route-shop .ss-market-showcase-stats{display:flex;flex-wrap:wrap;gap:12px;min-width:0}
body.ss-route-shop .ss-market-showcase-stat{min-width:0;flex:1 1 140px;box-sizing:border-box}
body.ss-route-shop .ss-market-featured-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;min-width:0}
body.ss-route-shop .ss-market-featured-card{min-width:0;overflow:hidden;border:1px solid var(--ss-ref-line);border-radius:16px;background:var(--ss-ref-surface)}
body.ss-route-shop :is(.ss-market-featured-image,.ss26-market-product-media){overflow:hidden;aspect-ratio:16/9;max-width:100%}
body.ss-route-shop :is(.ss-market-featured-image,.ss26-market-product-media) img{display:block;width:100%;height:100%;object-fit:cover}
body.ss-route-shop :is(.ss-market-featured-body,.ss26-market-product-body){min-width:0;padding:16px}
body.ss-route-shop :is(.shop-feature-title,.shop-card-title){overflow-wrap:anywhere;line-height:1.3}
body.ss-route-shop .ss27-market-filters{min-width:0;border:1px solid var(--ss-ref-line);border-radius:16px}
body.ss-route-shop .ss27-market-filters form{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
body.ss-route-shop .ss27-market-filters form input{min-width:0;flex:1 1 220px}
body.ss-route-shop :is(.ss27-market-grid,.ss27-market-featured){min-width:0}
body.ss-route-shop .ss27-market-grid>.shop-card{min-width:0;overflow:hidden;border-radius:16px;border:1px solid var(--ss-ref-line)}
body.ss-route-shop .ss27-market-grid .btn{min-height:44px}
body.ss-route-server_info .sv26 :is(.sv-hero,.sv-trust){border:1px solid var(--ss-ref-line);border-radius:16px;min-width:0}
body.ss-route-server_info .sv26 .sv-hero-grid{min-width:0;gap:18px}
body.ss-route-server_info .sv26 .sv-facts{min-width:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,145px),1fr));gap:12px}
body.ss-route-server_info .sv26 .sv-fact{min-width:0;box-sizing:border-box}
body.ss-route-boost .ssbx .ssbx-hero{border:1px solid var(--ss-ref-line);border-radius:18px}
body.ss-route-boost .ssbx .ssbx-hero-in{min-width:0;box-sizing:border-box;padding:clamp(20px,3vw,42px)}
body.ss-route-boost .ssbx .ssbx-hero-in :is(h1,h2){font-size:clamp(30px,4vw,54px);line-height:1.12;overflow-wrap:anywhere}
body.ss-route-boost .ssbx :is(.ssbx-tiers,.ssb27-showcase){min-width:0;max-width:100%}
body.ss-route-news .ssnews26 :is(.ssnews26-main,.ssnews26-filterbar){min-width:0}
body.ss-route-news .ssnews26 :is(.ssnews26-featured-card,.ssnews26-hero){border:1px solid var(--ss-ref-line);border-radius:16px}
@media(max-width:980px){body.ss-route-shop .ss-market-featured-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){
 body.ss-route-shop .ss-market-showcase-content{padding:20px 16px}
 body.ss-route-shop .ss-market-showcase-title{font-size:clamp(28px,8vw,38px)}
 body.ss-route-shop .ss-market-featured-grid{grid-template-columns:minmax(0,1fr);gap:12px}
 body.ss-route-shop .ss-market-featured-card{border-radius:13px}
 body.ss-route-shop .ss27-market-filters form{display:grid;grid-template-columns:minmax(0,1fr)}
 body.ss-route-shop .ss27-market-filters form :is(input,select,button){width:100%;max-width:100%}
 body.ss-route-shop .ss-market-showcase-stat{flex-basis:calc(50% - 8px)}
 body.ss-route-server_info .sv26 .sv-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.ss-route-boost .ssbx .ssbx-hero-in{padding:20px 16px}
}

/* Home layout reconciliation — Home discovery: one authoritative grid rule, no competing two-column layout.
   Cards adapt to real item count; the catalog always follows the featured row. */
body.ss-route-index .ss26-home-discovery-board.ss26-approved-directory{
 display:grid!important;grid-template-columns:minmax(0,1fr)!important;
 align-items:start!important;grid-auto-rows:max-content!important;
 gap:clamp(12px,1.6vw,20px)!important;
}
body.ss-route-index .ss26-home-discovery-board.ss26-approved-directory > :is(.ss26-recommended,.ss26-catalog-preview){
 grid-column:1 / -1!important;min-width:0!important;max-width:100%!important;
 width:100%!important;height:auto!important;margin:0!important;align-self:start!important;
}
body.ss-route-index .ss26-approved-directory .ss26-featured-track{
 min-width:0!important;max-width:100%!important;min-height:0!important;
 align-items:stretch!important;align-content:start!important;
}
@media(min-width:901px){
 body.ss-route-index .ss26-approved-directory .ss26-featured-count-1.ss26-featured-track{grid-auto-columns:100%!important}
 body.ss-route-index .ss26-approved-directory .ss26-featured-count-2.ss26-featured-track{grid-auto-columns:calc((100% - 14px)/2)!important}
 body.ss-route-index .ss26-approved-directory .ss26-featured-count-3.ss26-featured-track{grid-auto-columns:calc((100% - 28px)/3)!important}
}
@media(min-width:591px) and (max-width:900px){
 body.ss-route-index .ss26-approved-directory .ss26-featured-count-1.ss26-featured-track{grid-auto-columns:100%!important}
 body.ss-route-index .ss26-approved-directory .ss26-featured-count-2.ss26-featured-track{grid-auto-columns:calc((100% - 14px)/2)!important}
}
@media(max-width:590px){
 body.ss-route-index .ss26-home-discovery-board.ss26-approved-directory{gap:12px!important}
 body.ss-route-index .ss26-approved-directory .ss26-featured-count-1.ss26-featured-track{grid-auto-columns:100%!important}
}

/* Home: data-dependent panels should never reserve an empty dashboard column.
   Rankings without a 14-day comparison expand across the available width. */
body.ss-route-index .ss26-home-rankings.ss26-rankings-single{
 display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;
 align-items:start!important;
}
body.ss-route-index .ss26-home-rankings.ss26-rankings-single>.ss26-home-rankpanel{
 width:100%!important;min-width:0!important;grid-column:1/-1!important;
}
body.ss-route-index .ss26-growing-pending{
 margin:0;padding:10px 14px;border:1px solid rgba(139,115,225,.25);
 border-radius:12px;background:rgba(91,67,161,.08);color:#b9c7e5;
 font-size:15px;line-height:1.5;grid-column:1/-1;
}
body.ss-route-index .ss26-home-discovery-board .ss26-featured-track:empty{min-height:0!important}

/* Empty-state cards never impersonate a full-width carousel slide. */
body.ss-route-index .ss26-approved-directory .ss26-featured-track:has(.ss26-featured-empty){display:block!important;overflow:visible!important;padding:0!important}
body.ss-route-index .ss26-featured-empty{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border:1px dashed var(--ss-ref-line);border-radius:12px;background:rgba(15,25,53,.65)}
body.ss-route-index .ss26-featured-empty p{margin:0;font-size:16px;line-height:1.5}
body.ss-route-index .ss26-featured-empty a{font-size:15px;font-weight:700;color:#bca5ff}
@media(max-width:590px){body.ss-route-index .ss26-featured-empty{padding:14px;align-items:flex-start;flex-direction:column}}


/* SoulShive reference pass — coordinated primary-page geometry, 2026-10-21.
   These selectors are scoped to actual existing page roots. No invented content,
   no forced card heights, and no modification of application permissions. */
:root{--ss-ref-gap:clamp(14px,1.5vw,22px);--ss-ref-radius:16px;--ss-ref-max:1700px}
body.ss26-page :is(.ss26-content-wrap,.ss26-home-community){box-sizing:border-box;min-width:0}
body.ss26-page :is(.ss26-content-wrap,.ss26-home-community) :is(img,video,iframe){max-width:100%}
body.ss26-page :is(.ss26-content-wrap,.ss26-home-community) :is(h1,h2,h3){overflow-wrap:break-word}
body.ss26-page :is(.ss26-content-wrap,.ss26-home-community) :is(p,li){line-height:1.55}

/* 1. Home — rows follow their own content, never the height of a sibling. */
body.ss-route-index :is(.ss26-home-discovery-board,.ss26-home-rankings,.ss26-home-utility-panels){min-width:0;align-items:start;align-content:start}
body.ss-route-index .ss26-home-rankings{gap:var(--ss-ref-gap);grid-auto-rows:min-content}
body.ss-route-index .ss26-home-rankings>*{min-width:0;min-height:0;height:auto;align-self:start}
body.ss-route-index .ss26-home-utility-panels>*{min-width:0;min-height:0;align-self:start}
body.ss-route-index .ss26-home-discovery-board .ss26-featured-track{align-items:stretch;min-height:0;max-width:100%}
body.ss-route-index .ss26-home-discovery-board .ss26-catalog-preview{overflow:hidden}
body.ss-route-index .ss26-home-discovery-board .ss26-catalog-preview :is(table,.ss26-catalog-table){max-width:100%}

/* 2. Directory — stable filters and result cards, independent of live status. */
body.ss-route-servers .sl-page{min-width:0;max-width:100%}
body.ss-route-servers :is(.sl-hero,.sl-featured,.sl-listtop,.sl-card){min-width:0;box-sizing:border-box}
body.ss-route-servers .sl-heroin{display:grid;gap:var(--ss-ref-gap);align-items:center;min-width:0}
body.ss-route-servers .sl-filtergrid{gap:12px;min-width:0}
body.ss-route-servers .sl-filtergrid>*{min-width:0;max-width:100%}
body.ss-route-servers .sl-filtergrid :is(input,select,button){max-width:100%;box-sizing:border-box;min-height:44px}
body.ss-route-servers .sl-filtertabs{display:flex;flex-wrap:wrap;gap:8px;min-width:0;overflow:visible}
body.ss-route-servers .sl-filtertabs a{min-height:42px;display:inline-flex;align-items:center}
body.ss-route-servers .sl-card{height:auto;overflow:hidden;border-radius:var(--ss-ref-radius)}
body.ss-route-servers .sl-card :is(.sl-fmain,.sl-fmeta,.sl-fname){min-width:0;overflow-wrap:anywhere}
body.ss-route-servers .sl-facts{display:flex;flex-wrap:wrap;gap:10px}

/* 3. Server detail — long server names, connection addresses, and graphs. */
body.ss-route-server_info .sv26{min-width:0;max-width:100%}
body.ss-route-server_info .sv26 :is(.sv-hero,.sv-hero-grid,.sv-trust,.sv-facts){box-sizing:border-box;max-width:100%}
body.ss-route-server_info .sv26 :is(h1,h2,h3,.mono){overflow-wrap:anywhere}
body.ss-route-server_info :is(.ss-chart-observations-scroll,.ss-player-alias-scroll,.ss-map-history-track){max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain}
body.ss-route-server_info :is(.ss-map-history-panel,.ss-chart-observations){min-width:0}

/* 4. Boost — pricing cards may grow with translated labels. */
body.ss-route-boost .ssbx{min-width:0;max-width:100%}
body.ss-route-boost .ssbx :is(.ssbx-hero,.ssbx-hero-in,.ssb27-showcase,.ssb27-pricing-intro){box-sizing:border-box;min-width:0}
body.ss-route-boost .ssbx :is(.ssbx-tiers,.ssb27-showcase){align-items:stretch}
body.ss-route-boost .ssbx :is(.ssbx-tier,.ssb27-offer,.ssb27-price){min-width:0;overflow-wrap:anywhere}
body.ss-route-boost .ssbx :is(.ssbx-actions,.ssb27-global-period-options){display:flex;flex-wrap:wrap;gap:10px}
body.ss-route-boost .ssbx :is(button,.ssbx-btn){min-height:44px}

/* 5. Marketplace — feature tiles and filters respect available width. */
body.ss-route-shop :is(.ss-market-showcase-content,.ss-market-featured-grid,.ss27-market-grid,.ss27-market-filters){box-sizing:border-box;min-width:0;max-width:100%}
body.ss-route-shop :is(.ss-market-featured-card,.shop-card){min-width:0;height:auto;overflow:hidden}
body.ss-route-shop :is(.ss-market-featured-body,.ss-market-featured-heading,.shop-card-title){min-width:0;overflow-wrap:anywhere}
body.ss-route-shop .ss-market-featured-image img{display:block;width:100%;height:100%;object-fit:cover}
body.ss-route-shop .ss-market-showcase-stats{display:flex;flex-wrap:wrap;gap:10px}

/* 6. Community — cards and clan summaries never exceed the viewport. */
body.ss-route-community .ssc1{min-width:0;max-width:100%}
body.ss-route-community .ssc1 :is(.ssc1-hero,.ssc1-duo,.ssc1-clan-card,.ssc1-card,.ssc1-clan-preview){box-sizing:border-box;min-width:0;max-width:100%}
body.ss-route-community .ssc1 :is(.ssc1-actions,.ssc1-collabtypes){display:flex;flex-wrap:wrap;gap:10px}
body.ss-route-community .ssc1 :is(.ssc1-clan-meta,.ssc1-clan-note){overflow-wrap:anywhere}

/* 7. News — articles and discovery remain readable in two languages. */
body.ss-route-news .ssnews26{min-width:0;max-width:100%}
body.ss-route-news .ssnews26 :is(.ssnews26-layout,.ssnews26-grid,.ssnews26-card,.ssnews26-featured-card){min-width:0;max-width:100%}
body.ss-route-news .ssnews26 :is(.ssnews26-card-body,.ssnews26-featured-copy){overflow-wrap:anywhere}
body.ss-route-news .ssnews26 .ssnews26-filterbar{display:flex;flex-wrap:wrap;gap:10px}
body.ss-route-news .ssnews26 .ssnews26-filterbar :is(input,select){min-width:0;max-width:100%}

/* 8. Partners — statistics and benefit cards are content-sized. */
body.ss-route-partners .pn-page{min-width:0;max-width:100%}
body.ss-route-partners :is(.pn-report-hero,.pn-report-content,.pn-report-stats,.pn-panel,.pn-report-benefits){min-width:0;max-width:100%;box-sizing:border-box}
body.ss-route-partners :is(.pn-report-stat,.pn-chart-column){min-width:0;overflow-wrap:anywhere}
body.ss-route-partners .pn-report-button{min-height:44px}

/* 9–10. Add and edit server — form fields must not overflow cards. */
body.ss-route-add-server .as26,body.ss-route-edit-server .ss27-edit{min-width:0;max-width:100%;box-sizing:border-box}
body.ss-route-add-server .as26 :is(.as26-panel,.as26-grid,.as26-field,.as26-preview),
body.ss-route-edit-server .ss27-edit :is(.ss27-edit-card,.ss27-edit-grid,.ss27-edit-field){min-width:0;max-width:100%;box-sizing:border-box}
body.ss-route-add-server .as26 :is(input,select,textarea),
body.ss-route-edit-server .ss27-edit :is(input,select,textarea){width:100%;max-width:100%;box-sizing:border-box;min-height:44px}
body.ss-route-add-server .as26 :is(.as26-btn,.as26-label),
body.ss-route-edit-server .ss27-edit :is(.ss27-edit-btn,.ss27-edit-hint){overflow-wrap:anywhere}
body.ss-route-edit-server .ss27-edit-actions{display:flex;flex-wrap:wrap;gap:10px}

/* 11. Profile — preserve the sidebar on wide screens; stack without overflow. */
body.ss-route-profile .ssp26{min-width:0;max-width:100%}
body.ss-route-profile .ssp26 :is(.ssp-shell,.ssp-side,.ssp-card,.ssp-form-grid,.ssp-admin-grid,.ssp-ach-grid){min-width:0;max-width:100%;box-sizing:border-box}
body.ss-route-profile .ssp26 :is(.ssp-field input,.ssp-field textarea){min-width:0;max-width:100%;box-sizing:border-box}
body.ss-route-profile .ssp26 :is(.ssp-bio,.ssp-activity-row,.ssp-admin-link){overflow-wrap:anywhere}

/* 12. Shared Admin — do not hide privileged actions behind sideways tabs. */
body.ss26-admin-route :is(.bw-panel,.bw-stats,.bw-manual-grid,.bw-edit-grid){min-width:0;max-width:100%;box-sizing:border-box}
body.ss26-admin-route .bw-table-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain}
body.ss26-admin-route :is(.bw-search-row,.bw-list-head){display:flex;flex-wrap:wrap;gap:10px}

/* 13. Shared viewport safety — narrow devices, no artificial full-height panels. */
@media(max-width:900px){
 body.ss-route-index .ss26-home-rankings{grid-template-columns:minmax(0,1fr)!important}
 body.ss-route-index .ss26-home-rankings>*{grid-column:1/-1!important}
 body.ss-route-servers .sl-heroin{grid-template-columns:minmax(0,1fr)!important}
 body.ss-route-shop .ss-market-featured-grid{gap:12px}
 body.ss-route-profile .ssp-shell{grid-template-columns:minmax(0,1fr)!important}
}
@media(max-width:620px){
 body.ss26-page .ss26-content-wrap{width:calc(100% - 24px)!important;padding-top:14px!important}
 body.ss-route-index .ss26-home-discovery-board{gap:12px!important}
 body.ss-route-servers .sl-filtergrid{grid-template-columns:minmax(0,1fr)!important}
 body.ss-route-servers .sl-filtertabs a{flex:1 1 auto;justify-content:center}
 body.ss-route-server_info .sv26 .sv-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.ss-route-boost .ssbx :is(.ssbx-actions,.ssb27-global-period-options)>*{flex:1 1 auto}
 body.ss-route-shop .ss-market-featured-grid{grid-template-columns:minmax(0,1fr)!important}
 body.ss-route-news .ssnews26 .ssnews26-filterbar>*{flex:1 1 100%}
 body.ss-route-add-server .as26-grid,body.ss-route-edit-server .ss27-edit-grid{grid-template-columns:minmax(0,1fr)!important}
 body.ss-route-edit-server .ss27-edit-actions>*{flex:1 1 100%;text-align:center}
 body.ss-route-community .ssc1-duo{grid-template-columns:minmax(0,1fr)!important}
}

/* Reference pass: consistent visual hierarchy across public discovery, editorial,
   account and owner pages. This section intentionally reuses existing markup. */
body.ss27-mockup{--ss-ref-section-space:clamp(18px,2vw,30px);--ss-ref-control-height:46px}
body.ss27-mockup .ss26-content-wrap{padding-bottom:clamp(24px,3vw,48px)}
body.ss27-mockup :is(.sl-page,.sv26,.ssbx,.ssc1,.ssnews26,.pn-page,.as26,.ss27-edit,.ssp26,.ss27-market-grid,.ss27-admin-intro){min-width:0}
body.ss27-mockup :is(.sl-page,.sv26,.ssbx,.ssc1,.ssnews26,.pn-page,.as26,.ss27-edit,.ssp26) :is(h1,h2,h3){overflow-wrap:anywhere;line-height:1.2}
body.ss27-mockup :is(.sl-page,.sv26,.ssbx,.ssc1,.ssnews26,.pn-page,.as26,.ss27-edit,.ssp26) :is(p,li,dd){line-height:1.55}
body.ss27-mockup :is(.sl-page,.sv26,.ssbx,.ssc1,.ssnews26,.pn-page,.as26,.ss27-edit,.ssp26) :is(input,select,textarea){font-size:16px;min-height:var(--ss-ref-control-height);max-width:100%}
body.ss27-mockup :is(.sl-page,.sv26,.ssbx,.ssc1,.ssnews26,.pn-page,.as26,.ss27-edit,.ssp26) :is(button,[role=button],.btn){min-height:44px}
/* A consistent card rhythm, without imposing fixed heights on real data. */
body.ss27-mockup :is(.sl-card,.sv-card,.ssbx-tier,.ssc1-card,.ssc1-clan-card,.ssnews26-card,.pn-panel,.as26-panel,.ss27-edit-card,.ssp-card,.shop-card){height:auto;min-height:0;min-width:0;box-sizing:border-box;border-radius:16px}
body.ss27-mockup :is(.sl-card,.sv-card,.ssbx-tier,.ssc1-card,.ssc1-clan-card,.ssnews26-card,.pn-panel,.as26-panel,.ss27-edit-card,.ssp-card,.shop-card) :is(h2,h3,strong){overflow-wrap:anywhere}
/* Home: a compact editorial rhythm; never stretch the catalog to match featured. */
body.ss-route-index .ss26-approved-directory{align-content:start!important;grid-auto-rows:max-content!important}
body.ss-route-index .ss26-approved-directory>.ss26-recommended,
body.ss-route-index .ss26-approved-directory>.ss26-catalog-preview{min-height:0!important;max-height:none!important}
body.ss-route-index .ss26-approved-directory .ss26-featured-track{min-height:0!important;align-content:start!important}
body.ss-route-index .ss26-approved-directory .ss26-rec-card{min-height:0!important;height:auto!important}
body.ss-route-index .ss26-home-rankings{align-content:start!important;grid-auto-rows:max-content!important}
body.ss-route-index .ss26-home-rankings>.ss26-panel{height:auto!important;min-height:0!important}
/* Server listing: filters and table/cards have independent intrinsic heights. */
body.ss-route-servers .sl-page :is(.sl-filter,.sl-card,.sl-results,.sl-grid){height:auto;min-height:0;align-content:start}
body.ss-route-servers .sl-page :is(.sl-filtergrid,.sl-filtertabs){min-width:0;max-width:100%}
body.ss-route-servers .sl-page :is(.sl-filtergrid,.sl-filtertabs)>*{min-width:0}
/* Server details: allow game/map facts and owner actions to wrap naturally. */
body.ss-route-server_info .sv26 :is(.sv-facts,.sv-actions,.sv-info-grid,.sv-chart){max-width:100%;min-width:0}
body.ss-route-server_info .sv26 :is(.sv-facts,.sv-actions){flex-wrap:wrap}
/* Boost: do not force empty vertical space beneath short offer descriptions. */
body.ss-route-boost .ssbx :is(.ssbx-tiers,.ssb27-showcase){align-content:start}
body.ss-route-boost .ssbx :is(.ssbx-tier,.ssb27-offer){height:auto;min-width:0}
/* Marketplace: consistent thumbnail geometry and text wrapping. */
body.ss-route-shop :is(.ss27-market-grid,.ss-market-featured-grid)>*{min-width:0}
body.ss-route-shop :is(.shop-card,.ss-market-featured-card) :is(img,video){max-width:100%;object-fit:cover}
/* Community, news and partners: responsive editorial grids without blank tracks. */
body.ss-route-community :is(.ssc1-duo,.ssc1-games,.ssc1-clan-grid),
body.ss-route-news :is(.ssnews26-layout,.ssnews26-grid),
body.ss-route-partners :is(.pn-report-benefits,.pn-report-stats){align-content:start;min-width:0}
body.ss-route-community :is(.ssc1-duo,.ssc1-games,.ssc1-clan-grid)>*,
body.ss-route-news :is(.ssnews26-layout,.ssnews26-grid)>*,
body.ss-route-partners :is(.pn-report-benefits,.pn-report-stats)>*{min-width:0}
/* Add/edit server and profiles: labels and error messages cannot push form width. */
body.ss-route-add-server :is(.as26-field,.as26-panel),
body.ss-route-edit-server :is(.ss27-edit-field,.ss27-edit-card),
body.ss-route-profile :is(.ssp-field,.ssp-card){min-width:0;overflow-wrap:anywhere}
/* Admin: navigation may wrap, but data tables retain their own scroll region. */
body.ss26-admin-route :is(.ss27-admin-intro,.bw-panel,.bw-table-wrap){min-width:0;max-width:100%}
body.ss26-admin-route :is(.bw-table-wrap,.table-responsive){overflow-x:auto;overscroll-behavior-inline:contain}
@media(max-width:760px){
 body.ss27-mockup :is(.sl-page,.sv26,.ssbx,.ssc1,.ssnews26,.pn-page,.as26,.ss27-edit,.ssp26) :is(h1,h2){text-wrap:wrap}
 body.ss-route-index .ss26-approved-directory .ss26-rec-card{width:100%;max-width:100%}
 body.ss-route-index .ss26-catalog-scroll{max-width:100%;overflow-x:auto}
 body.ss-route-shop .ss27-market-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 body.ss-route-community :is(.ssc1-duo,.ssc1-games){grid-template-columns:minmax(0,1fr)!important}
 body.ss-route-news .ssnews26-grid{grid-template-columns:minmax(0,1fr)!important}
 body.ss-route-partners .pn-report-benefits{grid-template-columns:minmax(0,1fr)!important}
}
@media(max-width:480px){
 body.ss-route-shop .ss27-market-grid{grid-template-columns:minmax(0,1fr)!important}
 body.ss-route-index .ss26-home-rankings{grid-template-columns:minmax(0,1fr)!important}
 body.ss-route-index .ss26-approved-directory .ss26-featured-track{max-width:100%}
}

/* Unified mockup finishing pass: controls, grids and compact panels.
   Scoped to real page roots so admin permissions and PHP data remain intact. */
@media(min-width:1024px){
 body.ss-route-index .ss26-approved-directory .ss26-featured-track{scroll-padding-inline:0}
 body.ss-route-servers .sl-filtergrid{align-items:end}
 body.ss-route-boost .ssbx-tiers{align-items:start}
 body.ss-route-shop .ss-market-featured-grid{align-items:start}
 body.ss-route-community .ssc1-clan-grid{align-items:start}
 body.ss-route-news .ssnews26-grid{align-items:start}
 body.ss-route-partners .pn-report-benefits{align-items:start}
}
/* A section can grow with content, but cannot force its neighbors to the same height. */
body.ss27-mockup :is(.ss26-home-discovery-board,.ss26-home-rankings,.sl-grid,.ssbx-tiers,.ss-market-featured-grid,.ssc1-clan-grid,.ssnews26-grid,.pn-report-benefits){grid-auto-rows:max-content;align-content:start}
body.ss27-mockup :is(.ss26-home-discovery-board,.ss26-home-rankings,.sl-grid,.ssbx-tiers,.ss-market-featured-grid,.ssc1-clan-grid,.ssnews26-grid,.pn-report-benefits)>*{min-width:0;max-width:100%;align-self:start}
/* Keep server facts and trailer video within their actual cards. */
body.ss-route-server_info .sv26 :is(.sv-facts,.sv-info-grid,.sv-chart,iframe){min-width:0;max-width:100%}
body.ss-route-server_info .sv26 iframe{aspect-ratio:16/9;height:auto}
/* The forms share a readable baseline on touch devices. */
body.ss27-mockup :is(.as26,.ss27-edit,.ssp26,.pn-page) :is(input,select,textarea){font-size:16px;min-width:0;max-width:100%}
body.ss27-mockup :is(.as26,.ss27-edit,.ssp26,.pn-page) :is(button,[type=submit]){min-height:44px}
/* Admin navigation wraps; only wide data tables scroll inside their own panel. */
body.ss26-admin-route :is(.ss27-admin-intro,.bw-panel,.bw-stats){min-width:0;max-width:100%}
body.ss26-admin-route :is(.bw-table-wrap,.table-responsive){overflow-x:auto;overscroll-behavior-inline:contain}
@media(max-width:767px){
 body.ss-route-index .ss26-catalog-scroll{max-width:100%;overflow-x:auto}
 body.ss-route-servers .sl-filtertabs{flex-wrap:wrap;overflow-x:visible}
 body.ss-route-server_info .sv26 .sv-actions{flex-wrap:wrap}
 body.ss-route-boost .ssbx :is(.ssbx-actions,.ssb27-global-period-options){flex-wrap:wrap}
 body.ss-route-shop .ss-market-featured-grid{grid-template-columns:minmax(0,1fr)}
 body.ss-route-community .ssc1-clan-grid{grid-template-columns:minmax(0,1fr)}
 body.ss-route-news .ssnews26-grid{grid-template-columns:minmax(0,1fr)}
 body.ss-route-partners .pn-report-benefits{grid-template-columns:minmax(0,1fr)}
 body.ss-route-profile .ssp-shell{grid-template-columns:minmax(0,1fr)}
}

/* Mobile catalog: real server rows become readable cards, not a 650px-wide table.
   Desktop keeps the approved ranked table. This only changes presentation. */
@media(max-width:640px){
 body.ss-route-index .ss26-approved-directory .ss26-catalog-scroll{overflow-x:visible!important;max-width:100%!important}
 body.ss-route-index .ss26-approved-directory .ss26-catalog-table{display:block;width:100%;min-width:0!important;max-width:100%!important;border-collapse:separate}
 body.ss-route-index .ss26-approved-directory .ss26-catalog-table thead{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
 body.ss-route-index .ss26-approved-directory .ss26-catalog-table tbody{display:grid;gap:12px}
 body.ss-route-index .ss26-approved-directory .ss26-catalog-table tbody tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 12px;padding:14px;border:1px solid rgba(118,138,205,.28);border-radius:14px;background:rgba(13,24,51,.8);min-width:0}
 body.ss-route-index .ss26-approved-directory .ss26-catalog-table tbody td{display:flex;flex-direction:column;gap:4px;min-width:0;padding:0;border:0;overflow-wrap:anywhere;font-size:15px}
 body.ss-route-index .ss26-approved-directory .ss26-catalog-table tbody td::before{content:attr(data-label);display:block;font-size:13px;font-weight:700;letter-spacing:.02em;color:#b8c9ef}
 body.ss-route-index .ss26-approved-directory .ss26-catalog-table tbody td:nth-child(2){grid-column:1/-1;grid-row:1}
 body.ss-route-index .ss26-approved-directory .ss26-catalog-table tbody td:nth-child(1){grid-column:1;grid-row:2}
 body.ss-route-index .ss26-approved-directory .ss26-catalog-table tbody td:nth-child(6){grid-column:2;grid-row:2}
 body.ss-route-index .ss26-approved-directory .ss26-catalog-table tbody .ss26-catalog-name{min-width:0;overflow-wrap:anywhere}
 body.ss-route-index .ss26-approved-directory .ss26-catalog-table tbody .ss26-catalog-name strong{white-space:normal;overflow-wrap:anywhere}
 body.ss-route-index .ss26-approved-directory .ss26-catalog-table tbody .ss26-catalog-empty-row{display:block}
 body.ss-route-index .ss26-approved-directory .ss26-catalog-table tbody .ss26-catalog-empty-row td::before{display:none}
}

/* Shared topbar finishing: one logo, readable action and no clipped controls.
   Applies to every public page that includes site-topbar.php. */
body.ss27-mockup .ssg-header .ssg-inner{box-sizing:border-box;min-width:0}
body.ss27-mockup .ssg-header .ssg-brand{min-width:0;overflow:hidden}
body.ss27-mockup .ssg-header .ssg-brand img{display:block;object-fit:contain;max-width:100%}
body.ss27-mockup .ssg-header .ssg-nav a[aria-current="page"]{color:#fff!important;border-color:#a46cff!important}
body.ss27-mockup .ssg-header :is(.ssg-burger,.ssg-add,.ssg-nav a):focus-visible{outline:3px solid #9bc8ff!important;outline-offset:3px}
@media(max-width:930px){
 body.ss27-mockup .ssg-header .ssg-inner{display:flex!important;align-items:center!important;flex-wrap:nowrap!important;gap:8px!important}
 body.ss27-mockup .ssg-header .ssg-brand{flex:1 1 auto!important;width:auto!important;min-width:0!important;max-width:180px!important;margin-right:auto!important}
 body.ss27-mockup .ssg-header .ssg-brand img{width:100%!important;max-height:48px!important}
 body.ss27-mockup .ssg-header .ssg-actions{flex:0 0 auto!important;min-width:0!important;margin:0!important}
 body.ss27-mockup .ssg-header .ssg-add{display:inline-flex!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important;min-height:44px!important;height:44px!important;width:auto!important;max-width:100%!important;padding:0 12px!important;line-height:1.15!important;font-size:14px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
 body.ss27-mockup .ssg-header .ssg-add .ssg-add-long{display:none!important}
 body.ss27-mockup .ssg-header .ssg-add .ssg-add-short{display:inline!important;white-space:nowrap!important}
 body.ss27-mockup .ssg-header .ssg-burger{flex:0 0 44px!important;width:44px!important;height:44px!important;order:3!important;margin:0!important}
 body.ss27-mockup .ssg-header .ssg-nav{overscroll-behavior:contain;max-width:calc(100vw - 16px);box-sizing:border-box}
}
@media(max-width:390px){
 body.ss27-mockup .ssg-header .ssg-inner{gap:6px!important}
 body.ss27-mockup .ssg-header .ssg-brand{max-width:110px!important}
 body.ss27-mockup .ssg-header .ssg-add{font-size:13px!important;padding-inline:9px!important}
}
/* Consistent touch targets and labels on the primary mockup pages. */
body.ss27-mockup :is(.sl-page,.sv26,.ssbx,.ssc1,.ssnews26,.pn-page,.as26,.ss27-edit,.ssp26) :is(button,[type=submit]){min-height:44px}
body.ss27-mockup :is(.sl-page,.sv26,.ssbx,.ssc1,.ssnews26,.pn-page,.as26,.ss27-edit,.ssp26) :is(input,select,textarea){box-sizing:border-box;max-width:100%;min-width:0}
body.ss27-mockup :is(.sl-page,.sv26,.ssbx,.ssc1,.ssnews26,.pn-page,.as26,.ss27-edit,.ssp26) :is(h1,h2,h3){overflow-wrap:break-word}

/* Featured grid: no phantom third slide when fewer than three cards exist.
   These selectors outrank the legacy fixed-width carousel declarations. */
@media(min-width:901px){
 body.ss-route-index .ss26-approved-directory .ss26-recommended-grid.ss26-featured-track.ss26-featured-count-1{grid-auto-columns:minmax(0,1fr)!important;grid-template-columns:minmax(0,1fr)!important;grid-auto-flow:row!important}
 body.ss-route-index .ss26-approved-directory .ss26-recommended-grid.ss26-featured-track.ss26-featured-count-2{grid-auto-columns:calc((100% - 14px)/2)!important}
}
@media(min-width:591px) and (max-width:900px){
 body.ss-route-index .ss26-approved-directory .ss26-recommended-grid.ss26-featured-track.ss26-featured-count-1{grid-auto-columns:100%!important}
 body.ss-route-index .ss26-approved-directory .ss26-recommended-grid.ss26-featured-track.ss26-featured-count-2{grid-auto-columns:calc((100% - 14px)/2)!important}
}
@media(max-width:590px){
 body.ss-route-index .ss26-approved-directory .ss26-recommended-grid.ss26-featured-track.ss26-featured-count-1{grid-auto-columns:100%!important}
 body.ss-route-index .ss26-approved-directory .ss26-recommended-grid.ss26-featured-track.ss26-featured-count-2{grid-auto-columns:88%!important}
}
/* Do not leave large decorative gaps inside a recommended server card. */
body.ss-route-index .ss26-approved-directory .ss26-approved-feature-tile{min-height:0!important;height:auto!important;align-self:stretch!important}
body.ss-route-index .ss26-approved-directory .ss26-rec-main{min-width:0;overflow-wrap:anywhere}
body.ss-route-index .ss26-approved-directory .ss26-rec-facts{min-height:0!important;display:flex;flex-wrap:wrap;gap:6px 12px;align-content:start}


/* 2026-10-21 | Consolidated mockup layout pass: 10 real page families.
   No new page-specific stylesheets or artificial equal-height placeholders. */
body.ss27-mockup{--ss-layout-gap:clamp(12px,1.5vw,20px);--ss-card-radius:14px}
body.ss27-mockup :is(.ss26-home-discovery-board,.ss26-home-rankings,.sl-grid,.ssbx-tiers,.ss-market-featured-grid,.ssc1-clan-grid,.ssnews26-grid,.pn-report-benefits,.ssnews26-layout){min-width:0;max-width:100%;align-content:start}
body.ss27-mockup :is(.ss26-home-discovery-board,.ss26-home-rankings,.sl-grid,.ssbx-tiers,.ss-market-featured-grid,.ssc1-clan-grid,.ssnews26-grid,.pn-report-benefits,.ssnews26-layout)>*{min-width:0;max-width:100%;height:auto;align-self:start}
/* Home: card image is constrained by aspect ratio rather than inherited row heights. */
body.ss-route-index .ss26-approved-directory .ss26-approved-feature-tile{display:flex!important;flex-direction:column!important;min-width:0!important;height:auto!important;min-height:0!important}
body.ss-route-index .ss26-approved-directory .ss26-approved-feature-tile .ss26-rec-visual{display:block!important;flex:0 0 auto!important;width:100%!important;height:auto!important;aspect-ratio:16/7!important;min-height:0!important;overflow:hidden!important}
body.ss-route-index .ss26-approved-directory .ss26-approved-feature-tile .ss26-rec-visual img{width:100%!important;height:100%!important;object-fit:cover!important}
body.ss-route-index .ss26-approved-directory .ss26-approved-feature-tile .ss26-rec-facts{margin-top:0!important;padding-top:4px!important}
body.ss-route-index .ss26-approved-directory .ss26-approved-feature-tile .ss26-rec-right{margin-top:auto!important}
body.ss-route-index .ss26-approved-directory .ss26-approved-feature-tile .ss26-approved-join{flex:0 0 auto!important}
/* Shared: do not let lengthy server names, links or translated buttons widen columns. */
body.ss27-mockup :is(.sl-page,.sv26,.ssbx,.ss-route-shop .ss-market,.ssc1,.ssnews26,.pn-page,.as26,.ss27-edit,.ssp-shell,.ss27-admin-intro) :is(h1,h2,h3,p,a,button,small,strong){overflow-wrap:break-word}
body.ss27-mockup :is(.sl-page,.sv26,.ssbx,.ssc1,.ssnews26,.pn-page,.as26,.ss27-edit,.ssp-shell) :is(img,video,iframe){max-width:100%}
/* Shared: images retain their natural crop without imposing a blank card height. */
body.ss27-mockup :is(.ssnews26-card-img,.ss-market-featured-grid .card img,.ssc1-clan-grid img){max-width:100%;overflow:hidden}
body.ss27-mockup :is(.ssnews26-card,.ssc1-clan-grid>*,.ssbx-tiers>*,.pn-report-benefits>*){min-width:0;height:auto;align-self:start}
/* Form columns and page actions remain usable on narrow mobile screens. */
@media(max-width:720px){
 body.ss27-mockup :is(.ssnews26-layout,.ssnews26-grid,.ssc1-duo,.ssc1-clan-grid,.pn-report-benefits){grid-template-columns:minmax(0,1fr)!important}
 body.ss27-mockup :is(.as26,.ss27-edit,.pn-page,.ssbx,.ssnews26) :is(input,select,textarea){width:100%;min-width:0;max-width:100%;box-sizing:border-box;font-size:16px}
 body.ss27-mockup :is(.as26,.ss27-edit,.pn-page,.ssbx,.ssnews26) :is(button,[type=submit]){min-height:44px;white-space:normal;text-align:center}
 body.ss-route-index .ss26-approved-directory .ss26-approved-feature-tile .ss26-rec-visual{aspect-ratio:16/8!important}
}
@media(prefers-reduced-motion:reduce){
 body.ss-route-index .ss26-approved-directory .ss26-featured-track{scroll-behavior:auto!important}
}

/* Final structural pass: one source of truth for the approved Home composition.
   Keep content-height cards; do not reserve space for absent recommendations. */
@media(min-width:901px){
 body.ss-route-index .ss26-approved-directory .ss26-featured-track.ss26-featured-count-1{display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-auto-flow:row!important;overflow:visible!important}
 body.ss-route-index .ss26-approved-directory .ss26-featured-track.ss26-featured-count-2{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-flow:row!important;overflow:visible!important}
 body.ss-route-index .ss26-approved-directory .ss26-featured-track.ss26-featured-count-2>*{min-width:0;width:auto!important}
}
body.ss-route-index .ss26-approved-directory .ss26-featured-empty{min-height:0!important;height:auto!important;grid-column:1/-1}
body.ss-route-index .ss26-home-rankings.ss26-rankings-single{grid-template-columns:minmax(0,1fr)!important}
body.ss-route-index .ss26-home-rankings.ss26-rankings-single .ss26-growing-pending{max-width:100%;margin:0}
/* Match mockup panel spacing without forcing all grid items to equal heights. */
body.ss27-mockup :is(.sl-page,.sv26,.ssbx,.ssc1,.ssnews26,.pn-page,.ssp26) :is(.card,.panel){align-self:start;min-width:0}
@media(max-width:720px){
 body.ss-route-index .ss26-approved-directory .ss26-featured-track.ss26-featured-count-1{grid-auto-columns:100%!important}
 body.ss-route-index .ss26-home-rankings .ss26-home-rankpanel{min-height:0!important}
 body.ss-route-index .ss26-home-utility-panels{margin-block:12px 16px}
}

/* Admin ticket controls: accessible labels without breaking compact mockup layout. */
.tk-field-label{display:block;font-size:.85rem;font-weight:650;margin:0 0 .35rem;color:inherit}
.tk-reply-form textarea{display:block;width:100%;min-height:100px;resize:vertical}
.tk-reply-form select{min-width:130px}
.tk-pagination a:focus-visible,.tk-actions button:focus-visible,.tk-reply-form button:focus-visible{outline:2px solid #9d87ff;outline-offset:3px}
@media(max-width:720px){.tk-reply-form form{flex-wrap:wrap}.tk-reply-form textarea{min-height:120px}}