/* WoW component adapters for the OSRS Clan Finder visual system. */
body { font-family: Lato, Arial, Helvetica, sans-serif; color: var(--ink); }
a { color: var(--accent); }
a:hover { color: var(--accent-strong); }
.site-frame main { width: min(calc(100% - 2 * var(--page-pad)), var(--content)); max-width: var(--content); margin-inline: auto; padding: 24px 0 48px; min-width: 0; }
.site-frame main > * { min-width: 0; }
.site-frame .site-header { height: auto; }
.site-header .brand { margin: 0; font-size: 18px; }
.site-header .brand img { border-radius: 0; object-fit: contain; }
.site-header .brand__text { display: flex; align-items: baseline; }
.site-header .brand__text small { color: var(--accent); }
.site-header .site-nav a { display: inline-flex; }
.site-header .auth-header-button { display: inline-flex; align-items: center; justify-content: center; }
.site-header summary { cursor: pointer; list-style: none; }
.site-header summary::-webkit-details-marker { display: none; }
.site-header .mobile-nav:not([open]) > nav { display: none; }
.site-header .mobile-nav > nav { position: absolute; display: grid; gap: 0; }
.site-header .mobile-nav > nav a { border: 0; background: transparent; }
.site-header .account-avatar { display: flex; align-items: center; justify-content: center; border-radius: 50%; }
.site-header .account-avatar svg { width: 16px; height: 16px; }
.site-header .account-menu > summary { display: flex; align-items: center; }
.site-header .account-menu > summary .account-name { max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.site-header .account-menu__link { white-space: normal; }
.site-frame :is(.directory-search,.results-header,.empty-state,.panel,.content-card,.community-card,.auth-panel,.profile-tabs,.faq-help,.faq-answer) { border: 1px solid var(--frame-edge); border-radius: var(--panel-radius); background: var(--panel-gradient); box-shadow: var(--panel-shadow); }
.site-frame :is(.directory-filters,.results-main,.results-footer) { border-radius: var(--panel-radius); }
.site-frame .directory-search .directory-filters { margin: 0; box-shadow: none; border: 0; }
.site-frame :is(button,.button,.nav-button,.dropdown-trigger) { border-radius: var(--control-radius); }
.site-frame main :is(button,.button).secondary,
.site-frame main :is(.view-controls button,.profile-tools button,.profile-tabs a,.directory-tabs a,.browse-regions a) { border: 1px solid var(--frame-edge); background: var(--control-gradient); box-shadow: var(--control-shadow); color: var(--muted-bright); border-radius: var(--control-radius); }
.site-frame main :is(.hero-listing-actions,.directory-empty-actions,#guild-contact) .button:not(.secondary), .site-frame main form button[type=submit] { background: var(--accent-gradient); border-color: var(--frame-edge); color: var(--on-accent); box-shadow: var(--accent-shadow); }
.site-frame .view-controls button[aria-pressed=true],.site-frame .directory-tabs .active,.site-frame .profile-tabs a[aria-current] { background: var(--control-selected-gradient); color: var(--accent-strong); box-shadow: var(--control-selected-shadow); }
.site-frame :is(.dropdown-trigger,input:not([type=checkbox]):not([type=range]),textarea,select) { color: var(--ink); border-color: var(--frame-edge); background: var(--inset-gradient); box-shadow: var(--inset-shadow); }
.site-frame .dropdown-panel { border-radius: var(--panel-radius); }
.site-frame .directory-hero { grid-template-columns: minmax(0,1fr); }
.site-frame .hero-copy { max-width: 760px; }
.site-frame .hero-heading > img { object-fit: contain; }
.site-frame .hero-listing-actions { margin-bottom: 12px; }
.site-frame .results-controls { min-width: 0; flex-wrap: wrap; }
.site-frame .results-controls .dropdown-control { min-width: 0; }
.site-frame .results-controls .view-controls { flex-shrink: 0; }
.site-frame #guild-listings.clan-grid { margin-bottom: 16px; }
.site-frame .clan-grid .clan-card__primary-actions > .community-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
.site-frame .clan-grid .clan-card__body > div { margin-bottom: 0; }
.site-frame .clan-grid .clan-sigil { display: block; overflow: hidden; }
.site-frame .clan-grid .clan-sigil .guild-logo { width: 100%; height: 100%; margin: 0; border: 0; border-radius: 0; }
.site-frame .clan-grid .clan-sigil .media-placeholder { display: grid; place-items: center; width: 100%; height: 100%; }
.site-frame .clan-grid .clan-card__banner .guild-banner { width: 100%; height: 100%; min-height: 0; margin: 0; border: 0; }
.site-frame .clan-grid .clan-card__banner .guild-banner img { height: 100%; }
.site-frame .clan-grid .clan-card__facts { margin-block: 0 .6rem; }
.site-frame .clan-grid .clan-card__facts dt { display: flex; align-items: center; gap: .4rem; }
.site-frame .clan-grid .clan-card__facts dt svg { width: 18px; height: 18px; color: var(--accent); flex-shrink: 0; }
.site-frame .clan-grid .clan-card__metadata { margin-bottom: 0; }
.site-frame .clan-grid .clan-card__metadata dt svg { width: 14px; height: 14px; }
.site-frame .clan-grid .tag-list { list-style: none; padding: 0; margin: 0; }
.site-frame .clan-grid .tag-list li { padding: .15rem .45rem; font-size: .65rem; }
.site-frame .clan-grid .tag-list li::before { content: '◇'; margin-right: .25rem; color: var(--accent); }
.site-frame .clan-grid .community-action,.site-frame .clan-grid .compare-toggle { color: var(--ink); }
.site-frame .managed-profile-banner .guild-banner { width: 100%; height: 100%; min-height: 0; margin: 0; border: 0; border-radius: 0; }
.site-frame .managed-profile-banner .guild-banner img { width: 100%; height: 100%; object-fit: cover; }
.site-frame .managed-profile-avatar .clan-sigil,.site-frame .managed-profile-avatar .guild-logo { width: 100%; height: 100%; margin: 0; border: 0; border-radius: 0; }
.site-frame .managed-profile-avatar .media-placeholder { display: grid; place-items: center; width: 100%; height: 100%; font-size: 48px; background: var(--inset-gradient); color: var(--accent); }
.site-frame .managed-profile-actions .community-actions { display: contents; }
.site-frame main .managed-profile-actions :is(button,.button,.text-action),.site-frame main .guild-contact-link { border: 1px solid var(--frame-edge); border-radius: var(--control-radius); background: var(--control-gradient); box-shadow: var(--control-shadow); color: var(--muted-bright); }
.site-frame .managed-profile-actions button { white-space: normal; }
.site-frame .managed-profile-actions .community-action strong { padding: 0 2px; }
.site-frame .managed-profile-title h1 { font-size: clamp(24px,2.5vw,32px); }
.site-frame .managed-profile-meta dt { letter-spacing: 0; }
.site-frame .guild-contact-link { display: inline-flex; gap: 8px; margin-top: 8px; font-size: 13px; }
.site-frame .managed-profile-summary { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; }
.site-frame .managed-profile-stats dd { color: var(--muted-bright); }
.site-frame .profile-layout { display: grid; align-items: start; }
.site-frame .profile-column { display: grid; gap: 24px; align-content: start; min-width: 0; }
.site-frame .profile-column > .panel { margin: 0; }
.site-frame .profile-panel h2 { color: var(--accent); }
.site-frame .profile-panel .preserve { color: var(--muted-bright); }
.site-frame .profile-facts { margin: 0; }
.site-frame .profile-facts > div { border-bottom: 1px solid var(--line); }
.site-frame .profile-facts dd { margin: 0; color: var(--muted-bright); font-size: 13px; }
.site-frame .profile-panel .section-heading { border-color: var(--line); }
.site-frame .profile-panel :is(.recruitment-detail-grid,.recruitment-facts) { min-width: 0; }
.site-frame .page-back-link { color: var(--accent); }
.site-frame .profile-tools { margin-block: 16px; }
.site-frame .profile-tabs { border-radius: var(--panel-radius); }
.site-frame .site-footer { max-width: none; width: 100%; padding-inline: max(var(--page-pad),calc((100% - var(--content))/2)); }
@media (min-width:640px) and (max-width:1199px) { .site-frame .site-page-stage main { max-width: 900px; } }
@media (max-width:767px) { .site-header .auth-header-button .auth-login-icon { display: block; } }
@media (max-width:639px) {
 .site-header .brand { flex-shrink: 1; }
 .site-header .site-header__actions { margin-left: auto; }
 .site-header .account-menu > summary .account-name { display: none; }
 .site-frame main { padding-top: 18px; }
 .site-frame .results-controls .dropdown-control { flex: 1 1 120px; width: auto; }
 .site-frame .managed-profile-copy { text-align: left; }
 .site-frame .managed-profile-actions { max-width: none; }
 .site-frame .profile-sidebar { grid-template-columns: minmax(0,1fr); }
 .site-frame .site-footer { padding-inline: 16px; }
}
.site-frame .clan-card__team { color: var(--accent); font-size: 12px; margin: .3rem 0 0; }
.site-frame .clan-grid .clan-card__facts dd p { font: inherit; margin: 0; }
.site-frame .clan-grid .clan-card__facts dd .schedule-block { margin: 0; }
.site-frame .clan-grid .clan-card__facts dd .small { font-size: 10px; }
.wow-player-profile.social-shell { width: 100%; margin: 0; padding: 0; }
.wow-player-profile .cp-clanLink { display: inline-flex; align-items: center; gap: 8px; color: var(--accent); font-size: 13px; }
.wow-player-profile .cp-profileEyebrow { color: var(--accent); }
.wow-player-profile .cp-identityActions button { white-space: normal; }
@media(max-width:639px){.wow-player-profile .cp-identity { gap: 16px; padding-inline: 18px; }.wow-player-profile .cp-identityText { min-width: 0; flex-basis: 120px; }.wow-player-profile .cp-identityActions { width: 100%; padding-top: 0; }.wow-player-profile .cp-profileIntro { padding-inline: 18px; }.wow-player-profile .profile-layout { grid-template-columns: minmax(0,1fr); }.wow-player-profile .cp-panel { padding: 18px; }}
.site-frame .profile-context { margin: 0 0 24px; }
.site-frame .listing-dates { margin-top: 16px; padding: 20px; }
.site-frame .listing-dates h2 { margin: 0 0 16px; }
.site-frame .listing-dates p:last-child { margin-bottom: 0; }
.site-frame .profile-sidebar .profile-tools { margin-top: 0; }
.site-frame .profile-sidebar .profile-tabs { display: flex; flex-wrap: wrap; margin-bottom: 0; padding: 0; border: 0; box-shadow: none; background: transparent; }
.site-frame .profile-sidebar .profile-tabs a { font-size: 12px; }

/* Reference: OSRS globals/site-theme, SiteHeader, DirectoryClient and ClanProfileHero.
   Keep WoW-specific content and behavior while sharing the reference's visual rules. */
body.site-frame { display: flex; flex-direction: column; min-height: 100vh; font-size: 16px; line-height: 1.5; }
.site-frame > .site-page-stage { flex: 1; width: 100%; min-width: 0; }
.site-frame main { padding-top: 28px; }
.site-frame .site-header__inner { height: 64px; }
.site-header .brand__icon { width: 36px; height: 36px; }
.site-header .brand__text strong,.site-header .brand__text small { font-size: 20px; line-height: 28px; }
.site-header .brand__text small { color: var(--nav-accent); }
.site-header .site-nav a { min-height: 44px; padding-inline: 6px; }
.site-header .site-nav a[aria-current],.site-header .auth-header-button,.site-header .account-menu > summary { color: var(--nav-accent); }
.site-header__actions > .header-list-clan { border-color: #a77f43; }
.site-frame main h1 { font-size: clamp(26px,2.5vw,32px); line-height: 1.2; font-weight: 800; letter-spacing: -.025em; }
.site-frame .directory-hero { padding-block: 16px 32px; gap: 24px; }
.site-frame .hero-copy { max-width: 560px; }
.site-frame .hero-heading h1 { font-size: 28px; text-wrap: balance; }
.site-frame .hero-heading .eyebrow { color: #e9bf78; font-size: 10px; font-weight: 700; letter-spacing: .16em; }
.site-frame .hero-copy > p { max-width: 58ch; margin-top: 16px; color: #c9cbd2; font-size: 13px; line-height: 1.75; font-weight: 400; }
.site-frame .finder-intro-trigger { display: inline-flex; min-height: 68px; gap: 0; margin-top: 4px; padding: 0; overflow: hidden; border: 1px solid var(--frame-edge); border-radius: 9px; background: var(--panel-gradient); box-shadow: var(--panel-shadow); text-decoration: none; }
.finder-intro-trigger > img { width: 64px; height: 64px; padding: 8px; object-fit: contain; border-right: 1px solid #101117; background: var(--inset-gradient); }
.finder-intro-trigger > span { display: grid; gap: 4px; padding: 12px 14px; }
.finder-intro-trigger strong { color: var(--ink); font-size: 13px; }
.finder-intro-trigger small { color: var(--muted); font-size: 11px; font-weight: 400; }
.site-frame .finder-intro-trigger:hover { box-shadow: var(--panel-hover-shadow); }
.site-frame .results-header { border-radius: 8px; background: linear-gradient(180deg,#252731,#20222b); box-shadow: inset 0 0 0 1px #393c48,0 2px 4px #0005; }
.site-frame .results-main,.site-frame .results-footer { border-radius: 0; }
.site-frame .results-controls .view-controls { border-radius: 6px; }
.site-frame .view-controls button { border-radius: 3px; }
.site-frame .directory-tabs { border-radius: 6px; gap: 4px; padding: 4px; }
.site-frame .directory-tabs a { min-height: 36px; font-size: 12px; font-weight: 700; }
.site-frame .search-panel-heading { border-radius: 9px 9px 0 0; }
.site-frame .profile-panel > h2 { text-transform: none; font-weight: 800; letter-spacing: -.015em; }
.site-frame .clan-grid .clan-card__body { padding: 20px; }
.site-frame .clan-grid .clan-card__action-rail { width: 360px; }
.site-frame .clan-grid .clan-card__summary { font-size: 13px; line-height: 1.6; }
.site-frame .clan-grid .clan-sigil { border-radius: 6px; }
.site-frame .clan-grid .tag-list li { border-radius: 5px; }
.site-frame .clan-grid .clan-card__links .clan-card__view { color: var(--gold); }
.site-frame .clan-grid[data-view="grid"] .clan-card__action-rail { width: 100%; }
.site-frame .wow-player-profile { --rl-text: #e6e6ee; --rl-muted: #bebdca; --rl-dim: #aaa9ba; --rl-orange: #ffcf6f; --rl-gold-soft: #e9bf78; }

/* Compact guild identity, modest avatar overlap, then statistics and a separate toolbar. */
.site-frame .managed-profile-hero { display: flex; flex-direction: column; border-radius: 12px; }
.site-frame .managed-profile-body,.site-frame .managed-profile-top { display: contents; }
.site-frame .managed-profile-banner { flex: 0 0 auto; border-color: var(--line); }
.site-frame .managed-profile-banner--empty { height: 88px; aspect-ratio: auto; background: var(--inset-gradient); }
.site-frame .managed-profile-identity { display: grid; grid-template-columns: 108px minmax(0,1fr); align-items: start; gap: 22px; padding: 24px; }
.site-frame .managed-profile-avatar { width: 108px; height: 108px; margin: -50px 0 0; border: 4px solid #252630; box-shadow: 0 0 0 1px #686052,0 4px 12px #0005; background: var(--inset-gradient); }
.site-frame .managed-profile-copy { padding: 0; min-width: 0; text-align: left; }
.site-frame .managed-profile-title h1 { margin: 0; color: var(--ink); font-size: clamp(24px,2.5vw,32px); line-height: 1.18; }
.site-frame .managed-profile-summary { max-width: 64ch; margin: 8px 0 0; font-size: 15px; font-weight: 400; line-height: 1.6; color: var(--muted); }
.site-frame .managed-profile-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.site-frame .managed-profile-meta > div { display: flex; align-items: baseline; gap: 6px; min-height: 30px; padding: 4px 8px; border: 1px solid #ffffff12; border-radius: 5px; background: #15161d50; box-shadow: none; }
.site-frame .managed-profile-meta dt,.site-frame .managed-profile-meta dd { margin: 0; font-size: 12px; line-height: 1.5; text-transform: none; }
.site-frame .managed-profile-stats { order: 1; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 0; padding: 16px 24px; border-top: 1px solid var(--line); background: #10111735; }
.site-frame .managed-profile-stats > div { display: flex; gap: 10px; min-height: 68px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 6px; background: #18192280; box-shadow: inset 0 1px 0 #ffffff04; }
.site-frame .managed-stat-icon { width: 32px; height: 32px; border: 1px solid #5b513c; border-radius: 5px; background: #d9b16f08; box-shadow: none; color: #d2b579; }
.site-frame .managed-stat-icon svg { width: 20px; height: 20px; }
.site-frame .managed-profile-stats dt { font-size: 12px; line-height: 1.5; text-transform: none; font-weight: 400; }
.site-frame .managed-profile-stats dd { margin-top: 2px; font-size: 14px; line-height: 1.6; font-weight: 600; color: var(--ink); }
.site-frame .managed-profile-hero .managed-profile-actions { order: 2; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; width: auto; max-width: none; gap: 8px; margin: 0; padding: 16px 24px; border-top: 1px solid var(--line); }
.site-frame main .managed-profile-actions :is(button,a) { min-height: 40px; width: auto; font-size: 13px; font-weight: 600; }
.site-frame .managed-clan-page .profile-layout,.site-frame.managed-clan-page .profile-layout { grid-template-columns: minmax(0,1fr) 300px; }
.site-frame .profile-sidebar .profile-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 6px; border: 1px solid var(--line); border-radius: 8px; background: #171820; box-shadow: inset 0 1px 4px #0005; }
.site-frame .profile-tabs a { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 8px 6px; text-align: center; }
.site-frame .site-footer { flex-shrink: 0; padding-top: 48px; padding-bottom: 48px; column-gap: 32px; grid-template-columns: minmax(0,1.5fr) minmax(0,5fr); }
.site-frame .site-footer .footer-groups { grid-template-columns: repeat(5,minmax(0,1fr)); gap: 24px; }
.site-frame .site-footer .footer-group h2 { color: var(--ink); font-size: 14px; text-transform: none; letter-spacing: 0; font-weight: 900; }
.site-frame .site-footer .footer-group a { color: var(--muted); font-size: 13px; line-height: 1.5; }
.site-frame .site-footer .footer-group a:hover { color: var(--accent); }
.site-frame .site-footer .brand { font-size: 18px; flex-wrap: wrap; gap: 4px; white-space: normal; }
@media (min-width:1536px) { .site-header .site-nav a { padding-inline: 12px; } }
@media (max-width:1100px) {
 .site-frame .managed-profile-identity { grid-template-columns: 96px minmax(0,1fr); gap: 20px; }
 .site-frame .managed-profile-avatar { width: 96px; height: 96px; }
}
@media (max-width:1023px) {
 .site-header .brand__text strong,.site-header .brand__text small { font-size: 18px; }
 .site-frame .clan-grid .clan-card__action-rail { width: 100%; }
 .site-frame.managed-clan-page .profile-layout { grid-template-columns: minmax(0,1fr); }
 .site-frame .site-footer { grid-template-columns: 1fr; gap: 28px; }
 .site-frame .site-footer .footer-groups { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width:639px) {
 .site-frame main { padding-top: 20px; }
 .site-header .brand__text strong,.site-header .brand__text small { font-size: 15px; line-height: 22.5px; }
 .site-frame main h1,.site-frame .hero-heading h1 { font-size: 26px; }
 .site-frame .directory-hero { padding-block: 4px 24px; margin-bottom: 20px; }
 .site-frame .clan-grid .clan-card__body { padding: 16px; }
 .site-frame .managed-profile-identity { grid-template-columns: minmax(0,1fr); gap: 14px; padding: 0 16px 20px; }
 .site-frame .managed-profile-avatar { width: 80px; height: 80px; margin: -24px 0 0; }
 .site-frame .managed-profile-title h1 { font-size: 24px; }
 .site-frame .managed-profile-summary { font-size: 14px; }
 .site-frame .managed-profile-stats { grid-template-columns: minmax(0,1fr); gap: 10px; padding: 16px; }
 .site-frame .managed-profile-hero .managed-profile-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); padding: 16px; }
 .site-frame main .managed-profile-actions :is(button,a) { width: 100%; min-height: 44px; }
 .site-frame .site-footer { padding-inline: var(--page-pad); }
 .site-frame .site-footer .footer-groups { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
.site-frame .managed-profile-meta dd { font-weight: 600; }
.site-frame .guild-banner:has(.media-placeholder) { background: var(--panel-gradient); }
.site-frame .managed-profile-banner--empty .guild-banner { background: var(--inset-gradient); }
/* Form sections use the same panel frame as account and public content. */
.site-frame .spotlight-editor { position:relative; min-width:0; margin-top:24px; padding-top:20px; border-top:1px solid var(--frame-edge); }
.site-frame .spotlight-editor h3 { margin:0 0 16px; font-size:16px; }
.site-frame .spotlight-field-heading { display:flex; align-items:center; gap:8px; }
.site-frame .spotlight-field-heading label { display:block; margin:0; }
.site-frame .spotlight-field-heading label .small { display:inline; }
.site-frame .spotlight-field-help { margin:0; padding:0; border:0; background:none; }
.site-frame .spotlight-field-help summary { display:grid; place-items:center; width:36px; height:36px; padding:0; border:1px solid var(--frame-edge); border-radius:50%; background:var(--control-gradient); color:var(--accent-strong); cursor:pointer; list-style:none; font-weight:700; }
.site-frame .spotlight-field-help summary::-webkit-details-marker { display:none; }
.site-frame .spotlight-field-help summary:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.site-frame .spotlight-field-help[open] summary { border-color:var(--accent); }
.site-frame .spotlight-field-help p { position:absolute; z-index:10; left:0; right:0; max-width:440px; margin:8px 0 0; padding:16px; border:1px solid var(--frame-edge); border-radius:8px; background:#282a36; color:#e0e1e8; box-shadow:0 8px 24px #0006; font-size:13px; line-height:1.7; }
.site-frame .spotlight-editor > .small { margin:6px 0 10px; line-height:1.6; }
.site-frame .spotlight-editor textarea { width:100%; min-height:90px; resize:vertical; }
.site-frame .spotlight-field-meta { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px 16px; margin:7px 0 16px; }
.site-frame .spotlight-field-meta output { color:var(--muted-bright); font-size:12px; font-variant-numeric:tabular-nums; }
.site-frame .spotlight-message-preview { padding:16px 18px; border:1px solid var(--frame-edge); border-radius:8px; background:var(--inset-gradient); overflow-wrap:anywhere; }
.site-frame .spotlight-message-preview .eyebrow { margin:0 0 10px; font-size:10px; }
.site-frame .spotlight-message-preview strong { display:block; color:var(--ink); font-size:18px; }
.site-frame .spotlight-message-preview [data-spotlight-text] { margin:7px 0 0; color:#e0e1e8; font-size:13px; line-height:1.65; }
.site-frame .home-spotlight .spotlight-description { overflow-wrap:anywhere; }
.site-frame .listing-form-section { margin-block: 24px; padding: 24px; border: 1px solid var(--frame-edge); border-radius: var(--panel-radius); background: var(--panel-gradient); box-shadow: var(--panel-shadow); }
.site-frame .listing-form-section > h2 { margin-top: 0; }
.site-frame .optional-fields { border-color: var(--line); border-radius: 6px; background: var(--inset-gradient); }
@media (max-width:639px) { .site-frame .listing-form-section { padding: 16px; } }
/* OSRS selected tabs and switches are gold, including list/grid and profile tabs. */
.site-frame main .directory-tabs a.active,
.site-frame main .directory-modes a[aria-current],
.site-frame main .view-controls button[aria-pressed="true"],
.site-frame main .profile-tabs a[aria-current] {
 border-color: var(--frame-edge); background: var(--accent-gradient); box-shadow: var(--accent-shadow); color: var(--on-accent);
}
.site-frame main :is(.hero-listing-actions,.directory-empty-actions,#guild-contact) .button:not(.secondary):hover,
.site-frame main form button[type="submit"]:not(:disabled):hover { background: var(--accent-hover-gradient); color: var(--on-accent); }
.site-frame .clan-grid .clan-card:is(:hover,:focus-within) { box-shadow: inset 0 0 0 1px #555968,inset 0 3px 0 #ffffff0a,inset 0 -3px 0 #0003,0 0 0 1px #353844,0 4px 8px #0008; }
.site-frame .managed-profile-heading-row { display: flex; align-items: start; flex-wrap: wrap; gap: 12px 24px; }
.site-frame .managed-profile-title { flex: 1 1 240px; }
.site-frame .managed-profile-support { margin-left: auto; max-width: 100%; }
.site-frame .managed-profile-support .community-actions { display: flex; gap: 8px; flex-wrap: wrap; padding: 0; background: none; border: 0; box-shadow: none; }
.site-frame .managed-profile-support .community-action { min-height: 40px; padding: 8px 12px; font-size: 13px; }
.site-frame .managed-profile-support .community-action svg { width: 16px; height: 16px; }
.site-frame .managed-profile-support .community-action strong { padding: 1px 5px; border-radius: 4px; background: #ffffff0f; }
.site-frame main .managed-profile-actions .guild-contact-link { margin: 0; background: var(--accent-gradient); box-shadow: var(--accent-shadow); color: var(--on-accent); }
.site-frame main .managed-profile-actions .guild-contact-link:hover { background: var(--accent-hover-gradient); }
.site-frame .profile-column > .profile-tabs { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 8px; margin: 0; padding: 6px; border: 1px solid var(--line); border-radius: 8px; background: #171820; box-shadow: inset 0 1px 4px #0005; }
.site-frame .profile-column > .profile-tabs a { min-height: 48px; font-size: 12px; white-space: normal; }
.site-frame .profile-sidebar .listing-dates { margin: 0; }
@media (max-width:639px) {
 .site-frame .managed-profile-support { width: 100%; margin: 0; }
 .site-frame .managed-profile-support .community-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
 .site-frame .managed-profile-support .community-action { min-height: 44px; padding-inline: 6px; font-size: 12px; }
 .site-frame .profile-column > .profile-tabs { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .site-frame .managed-profile-actions > :last-child:nth-child(odd) { grid-column: 1 / -1; }
}
/* Match ClanBannerFrame proportions; existing uploads retain their focus and zoom. */
.site-frame .managed-profile-banner,.site-frame .managed-profile-banner--empty { height: auto; aspect-ratio: 5 / 1; }
.site-frame .managed-profile-banner--empty .guild-banner { background: linear-gradient(180deg,#17182033,#17182099),url('/wow-orgrimmar-background.webp?v=1') center / cover no-repeat; }
.site-frame .media-editor-section .guild-banner { height: auto; min-height: 0; aspect-ratio: 5 / 1; }
@media (max-width:639px) {
 .site-frame .managed-profile-banner,.site-frame .managed-profile-banner--empty,.site-frame .media-editor-section .guild-banner { height: auto; min-height: 0; aspect-ratio: 2.5 / 1; }
}
.site-frame .managed-profile-hero .managed-profile-actions > :is(button,a) { flex: 0 1 auto; width: auto; }
@media (max-width:639px) { .site-frame .managed-profile-hero .managed-profile-actions > :is(button,a) { width: 100%; } }

/* Community composers align with the shared page container, including their heading. */
.site-frame main .panel.content-editor-panel { width: 100%; max-width: none; margin: 0 0 24px; padding: 28px; }
.content-editor-panel form,.content-editor-panel .form-grid,.content-editor-panel label { min-width: 0; }
.site-frame .content-editor-panel .form-grid { gap: 24px; }
.content-editor-panel--post .form-grid { grid-template-columns: minmax(0,2fr) minmax(220px,1fr); }
.site-frame .content-editor-panel label { margin: 0; gap: 10px; color: var(--ink); font-size: 13px; font-weight: 700; }
.site-frame .content-editor-panel input:not([type="hidden"]),.site-frame .content-editor-panel .dropdown-trigger { min-height: 46px; }
.site-frame .panel.content-editor-panel textarea { min-height: 260px; padding: 14px 16px; line-height: 1.7; font-weight: 400; resize: vertical; }
.site-frame .content-editor-panel .content-editor-upload { padding: 20px; border: 1px solid var(--line); border-radius: 6px; background: var(--inset-gradient); box-shadow: var(--inset-shadow); }
.site-frame .content-editor-panel input[type="file"] { border: 0; padding: 0; background: transparent; box-shadow: none; font-size: 13px; font-weight: 400; }
.content-editor-panel input[type="file"]::file-selector-button { margin-right: 12px; padding: 9px 12px; border: 1px solid var(--frame-edge); border-radius: 5px; background: var(--control-gradient); box-shadow: var(--control-shadow); color: var(--gold); font: inherit; font-weight: 700; cursor: pointer; }
.content-editor-panel .small { font-weight: 400; }
.content-editor-panel [data-upload-status]:empty { display: none; }
.content-editor-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px 24px; margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--line); }
.content-editor-footer > p { margin: 0; }
.content-editor-footer .actions { margin: 0; gap: 10px; }
.content-editor-footer .actions > :is(a,button) { min-height: 44px; padding-inline: 20px; }
@media (max-width:639px) {
 .site-frame main .panel.content-editor-panel { padding: 18px; }
 .site-frame .content-editor-panel .form-grid { grid-template-columns: minmax(0,1fr); gap: 20px; }
 .site-frame .panel.content-editor-panel textarea { min-height: 220px; padding: 12px; }
 .site-frame .content-editor-panel .content-editor-upload { padding: 16px; }
 .content-editor-footer { align-items: stretch; margin-top: 24px; padding-top: 18px; }
 .content-editor-footer .actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); width: 100%; }
}

/* Player identity and recruitment use the shared page width and panel rhythm. */
.player-editor-shell,.profile-editor-form,.recruitment-profile { width:100%; min-width:0; }
.site-frame main .profile-editor-section { width:100%; max-width:none; padding:28px; margin:0 0 24px; }
.profile-section-heading { margin-bottom:24px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.profile-section-heading h2 { margin:0 0 6px; font-size:20px; }
.profile-section-heading p { margin:0; color:var(--muted-bright); font-size:13px; line-height:1.7; }
.profile-editor-form :is(.form-grid,.two-col) { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 24px; margin-bottom:20px; }
.profile-editor-form .form-grid:last-child,.profile-editor-form .two-col:last-child { margin-bottom:0; }
.profile-editor-form :is(label,fieldset,.dropdown-control) { min-width:0; }
.site-frame .profile-editor-form label { font-size:13px; font-weight:700; color:var(--ink); gap:9px; }
.profile-editor-form :is(.form-grid,.two-col) > label { margin:0; }
.site-frame .profile-editor-form :is(input:not([type=checkbox]):not([type=hidden]):not([type=file]),.dropdown-trigger) { min-height:46px; font-weight:400; }
.site-frame .profile-editor-form textarea { min-height:220px; padding:14px 16px; line-height:1.7; font-weight:400; resize:vertical; }
.profile-editor-form .small { font-weight:400; }
.profile-editor-form fieldset { margin:0 0 24px; padding:20px; border:1px solid var(--line); border-radius:6px; }
.profile-editor-form legend { padding:0 8px; font-size:14px; font-weight:700; }
.profile-editor-form .choices { gap:10px 20px; }
.profile-editor-form .choices label,.profile-editor-form label.check { display:flex; align-items:center; gap:9px; font-weight:400; line-height:1.6; }
.profile-editor-form input[type=checkbox] { flex:0 0 auto; }
.profile-editor-form .optional-fields { margin:0 0 24px; padding:20px; background:var(--inset-gradient); border:1px solid var(--line); border-radius:6px; }
.profile-editor-form .optional-fields:last-child { margin-bottom:0; }
.profile-editor-form .optional-fields > summary { font-size:14px; line-height:1.6; }
.profile-editor-form .optional-fields[open] > summary { margin-bottom:20px; }
.profile-editor-form .class-choice { display:grid; grid-template-columns:150px minmax(0,1fr); gap:12px 20px; padding:14px 0; }
.profile-editor-form .class-choice > label,.profile-editor-form .class-specs label { margin:0; }
.profile-editor-form .class-specs { align-items:center; }
.profile-editor-form .player-session { padding:12px 0; border-top:1px solid var(--line); }
.profile-editor-form .player-session > label { margin:0; }
.profile-editor-form .player-session [type=time] { width:100%; min-width:0; }
.profile-avatar-upload { display:flex; align-items:center; gap:20px; padding:20px; margin-top:24px; border:1px solid var(--line); border-radius:6px; background:var(--inset-gradient); }
.profile-avatar-preview { width:80px; height:80px; object-fit:cover; border-radius:8px; border:1px solid var(--frame-edge); }
.profile-avatar-upload > label { flex:1; margin:0; }
.site-frame .profile-avatar-upload input[type=file] { padding:0; border:0; box-shadow:none; background:transparent; font-size:13px; font-weight:400; }
.profile-avatar-upload input[type=file]::file-selector-button { margin-right:12px; padding:9px 12px; border:1px solid var(--frame-edge); border-radius:5px; background:var(--control-gradient); box-shadow:var(--control-shadow); color:var(--accent); font:inherit; font-weight:700; cursor:pointer; }
.profile-avatar-upload [data-upload-status]:empty { display:none; }
.profile-editor-footer { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:16px 24px; margin-top:28px; padding-top:22px; border-top:1px solid var(--line); }
.profile-editor-footer > p { margin:0; max-width:480px; }
.profile-editor-footer .actions { margin:0; gap:10px; }
.profile-editor-footer .actions > :is(a,button) { min-height:44px; padding-inline:20px; }
.profile-editor-note { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px 24px; padding:24px; margin-bottom:24px; border:1px solid var(--line); border-radius:var(--panel-radius); background:var(--inset-gradient); }
.profile-editor-note h2 { font-size:16px; margin:0 0 6px; }
.profile-editor-note p { margin:0; color:var(--muted-bright); font-size:13px; }
.player-editor-shell > .delete { margin:24px 0; padding:20px; border:1px solid var(--line); border-radius:6px; }
.site-frame .player-profile-hero { padding:28px; }
.player-profile-identity { display:flex; align-items:center; gap:20px; min-width:0; }
.player-profile-identity > div:last-child { min-width:0; }
.player-profile-identity h1 { margin:4px 0 8px; font-size:clamp(26px,3vw,36px); line-height:1.2; overflow-wrap:anywhere; }
.player-profile-identity p { margin:0; }
.player-profile-monogram { display:grid; place-items:center; flex:0 0 80px; width:80px; height:80px; border:1px solid var(--frame-edge); border-radius:10px; background:var(--inset-gradient); box-shadow:var(--inset-shadow); color:var(--accent); font-size:32px; font-weight:800; }
.player-profile-hero .profile-tools { margin:24px 0 0; }
.player-profile-hero > .recruitment-tags { margin:20px 0 0; padding-top:20px; border-top:1px solid var(--line); }
.player-profile-layout { display:grid; grid-template-columns:minmax(0,1fr) 320px; align-items:start; gap:24px; }
.player-profile-layout .profile-column { min-width:0; display:grid; gap:24px; }
.site-frame .player-profile-layout .panel { min-width:0; padding:24px; margin:0; }
.player-profile-layout h2 { font-size:18px; line-height:1.4; margin:0 0 18px; }
.player-profile-layout p { overflow-wrap:anywhere; }
.player-profile-layout p:last-child { margin-bottom:0; }
.player-profile-bio { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.8; }
.player-profile-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 24px; margin:0; }
.player-profile-facts dt { margin:0 0 5px; color:var(--muted-bright); font-size:12px; }
.player-profile-facts dd { margin:0; font-size:14px; overflow-wrap:anywhere; }
.player-profile-contact .contact-panel { padding:0; margin:20px 0 0; border:0; background:none; box-shadow:none; }
.player-profile-contact .contact-panel h2 { font-size:14px; margin-bottom:10px; }
.player-profile-contact button { white-space:normal; max-width:100%; }
.wow-player-profile .cp-heroCover { background:linear-gradient(110deg,rgba(219,173,99,.13),transparent 70%),var(--inset-gradient); }
.wow-player-profile .cp-hero,.wow-player-profile .cp-panel { background:var(--panel-gradient); border-color:var(--frame-edge); box-shadow:var(--panel-shadow); }
.wow-player-profile .cp-profileEyebrow { display:block; margin-bottom:8px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.wow-player-profile .cp-identityText p { color:var(--muted-bright); font-size:14px; line-height:1.7; }
.wow-player-profile .cp-identityText h1 { font-size:clamp(26px,3vw,34px); }
.wow-player-profile .cp-bio { max-width:760px; }
.wow-player-profile .profile-column { min-width:0; display:grid; align-content:start; gap:24px; }
.wow-player-profile .cp-panel .community-card:last-child { margin-bottom:0; }
.wow-player-profile .cp-panel > p:last-child { margin-bottom:0; }
@media(max-width:850px) {
 .player-profile-layout { grid-template-columns:minmax(0,1fr); }
 .player-profile-layout > aside { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .player-profile-meta { grid-column:1/-1; }
}
@media(max-width:639px) {
 .site-frame main .profile-editor-section,.site-frame .player-profile-hero,.site-frame .player-profile-layout .panel { padding:18px; }
 .profile-editor-form :is(.form-grid,.two-col) { grid-template-columns:minmax(0,1fr); gap:20px; }
 .profile-section-heading { margin-bottom:20px; padding-bottom:16px; }
 .profile-editor-form fieldset,.profile-editor-form .optional-fields { padding:16px; }
 .profile-editor-form .class-choice { grid-template-columns:minmax(0,1fr); gap:12px; }
 .profile-editor-form .class-specs { padding-left:0; }
 .profile-editor-form .choices { gap:12px 16px; }
 .profile-avatar-upload { flex-wrap:wrap; padding:16px; }
 .profile-avatar-upload > label { flex-basis:100%; }
 .profile-editor-footer { margin-top:24px; padding-top:18px; }
 .profile-editor-footer .actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; }
 .profile-editor-footer .actions > :is(a,button) { padding-inline:12px; }
 .profile-editor-note { padding:18px; }
 .player-profile-identity { align-items:start; gap:14px; }
 .player-profile-monogram { width:56px; height:56px; flex-basis:56px; font-size:26px; }
 .player-profile-identity .eyebrow { font-size:10px; }
 .player-profile-hero .profile-tools { gap:10px; }
 .player-profile-hero .profile-tools > a { flex:1 1 160px; }
 .player-profile-layout > aside,.player-profile-facts { grid-template-columns:minmax(0,1fr); }
}
.site-frame main .player-profile-hero .profile-tools > .button:not(.secondary) { background:var(--accent-gradient); color:var(--on-accent); border-color:var(--frame-edge); box-shadow:var(--accent-shadow); }

/* Signed-in notification bell and request shortcuts, matching the OSRS header. */
.site-header .notification-menu { position:relative; flex:0 0 auto; }
.site-header .notification-menu > summary { position:relative; display:flex; align-items:center; justify-content:center; width:38px; height:38px; min-height:38px; padding:0; border:1px solid var(--frame-edge); border-radius:var(--control-radius); background:var(--control-gradient); box-shadow:var(--control-shadow); color:var(--muted-bright); cursor:pointer; }
.site-header .notification-menu > summary::after { display:none; }
.site-header .notification-menu > summary:hover,.site-header .notification-menu[open] > summary { color:var(--accent); border-color:var(--accent); }
.site-header .notification-menu > summary > svg { width:18px; height:18px; }
.site-header .notification-badge { position:absolute; top:-6px; right:-6px; display:grid; place-items:center; min-width:20px; height:20px; padding:0 4px; border:1px solid #1e1e1e; border-radius:20px; background:var(--accent); color:var(--on-accent); font-size:10px; font-weight:900; line-height:1; }
.site-header .notification-popover { position:absolute; z-index:60; top:calc(100% + 19px); right:0; width:min(340px,calc(100vw - 32px)); max-height:calc(100dvh - 88px); overflow-y:auto; overscroll-behavior:contain; border:1px solid var(--frame-edge); border-radius:var(--panel-radius); background:var(--panel-gradient); box-shadow:0 18px 60px #0008,var(--panel-shadow); color:var(--ink); }
.notification-menu:not([open]) > .notification-popover { display:none; }
.site-header .notification-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px; border-bottom:1px solid var(--line); }
.site-header .notification-heading h2 { margin:0; font-size:15px; line-height:1.4; }
.site-header .notification-heading button { min-height:28px; padding:4px 0; font-size:11px; font-weight:400; white-space:nowrap; color:var(--accent); background:none; border:0; box-shadow:none; }
.site-header .notification-list { list-style:none; margin:0; padding:0; max-height:320px; overflow-y:auto; overscroll-behavior:contain; }
.site-header .notification-item { display:flex; align-items:start; gap:12px; padding:12px 16px; border-bottom:1px solid var(--line); font-size:13px; line-height:1.5; color:var(--ink); }
.site-header .notification-item.is-unread .notification-item-title { font-weight:700; }
.site-header :is(.notification-item,.notification-view-all):hover { background:rgba(226,177,92,.1); color:var(--accent); }
.notification-item-copy { display:grid; gap:4px; min-width:0; flex:1; }
.notification-item-title { font-weight:400; overflow-wrap:anywhere; }
.notification-item-copy time { color:var(--muted-bright); font-size:11px; }
.notification-unread-dot { width:6px; height:6px; flex:0 0 6px; border-radius:50%; background:var(--accent); margin-top:7px; }
.site-header .notification-empty,.site-header .notification-error { margin:0; padding:20px 16px; font-size:12px; line-height:1.7; color:var(--muted-bright); }
.site-header .notification-error { color:var(--accent); }
.site-header .notification-view-all { display:flex; align-items:center; justify-content:center; gap:12px; padding:12px 16px; border-top:1px solid var(--line); font-size:12px; font-weight:400; color:var(--accent); }
@media(max-width:639px){
 .site-header .notification-popover { position:fixed; top:76px; right:16px; }
 .site-header .site-header__actions:has(.notification-menu) { gap:10px; }
}
@media(max-width:374px){
 .site-header .site-header__actions:has(.notification-menu) .header-list-clan { display:none; }
}
.site-header .notification-list li:last-child .notification-item { border-bottom:0; }

/* Guild profiles: shared Clan Finder proportions with WoW recruitment details. */
.site-frame.managed-clan-page .managed-profile-hero { border:1px solid var(--frame-edge); }
.site-frame.managed-clan-page .managed-profile-summary { max-width:68ch; }
.site-frame.managed-clan-page .profile-layout { gap:24px; grid-template-columns:minmax(0,1fr) 320px; }
.site-frame.managed-clan-page .profile-column { gap:20px; }
.site-frame.managed-clan-page .profile-panel { padding:24px; }
.site-frame.managed-clan-page .profile-panel h2 { margin:0 0 18px; font-size:19px; color:var(--ink); }
.site-frame.managed-clan-page .section-heading h2 { margin:0; }
.site-frame.managed-clan-page .profile-panel p { font-size:14px; line-height:1.8; overflow-wrap:anywhere; }
.site-frame.managed-clan-page .profile-panel p:last-child { margin-bottom:0; }
.site-frame.managed-clan-page .profile-tabs { gap:6px; padding:8px; margin:0; overflow-x:auto; }
.site-frame.managed-clan-page .profile-tabs a { white-space:nowrap; padding:12px 14px; min-height:44px; }
.site-frame.managed-clan-page .managed-profile-meta .profile-recruiting-status { padding:4px 10px; }
.recruitment-status { display:inline-flex; align-items:center; gap:7px; color:#a4d5b2; font-size:12px; font-weight:600; line-height:1.5; white-space:nowrap; }
.recruitment-status:before { content:''; width:6px; height:6px; flex-shrink:0; border-radius:50%; background:currentColor; }
.recruitment-status.is-closed { color:var(--muted); }
.guild-teams { display:grid; gap:16px; margin-top:24px; }
.guild-team { min-width:0; padding:20px; border:1px solid var(--line); border-radius:8px; background:#14151c66; }
.guild-team .guild-team-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.site-frame.managed-clan-page .guild-team .eyebrow { margin:0 0 4px; color:var(--muted); font-size:10px; letter-spacing:.12em; }
.site-frame.managed-clan-page .guild-team h3 { margin:0; font-size:21px; letter-spacing:-.02em; }
.guild-team-facts { display:flex; flex-wrap:wrap; gap:12px 28px; margin:18px 0; }
.guild-team-facts > div { display:grid; gap:3px; }
.guild-team-facts span { font-size:11px; color:var(--muted); }
.guild-team-facts strong { font-size:14px; font-weight:600; }
.site-frame.managed-clan-page .guild-team .schedule-display { padding:14px 0; border-block:1px solid var(--line); margin:14px 0; }
.site-frame.managed-clan-page .guild-team .schedule-display p { font-size:13px; margin:0 0 5px; }
.site-frame.managed-clan-page .guild-team .schedule-display .local-schedule { margin:10px 0 0; font-size:11px; line-height:1.7; }
.guild-team-openings { display:grid; gap:8px; margin:16px 0; font-size:13px; }
.guild-team-openings > div { display:grid; grid-template-columns:60px minmax(0,1fr); gap:12px; }
.guild-team-openings dt { color:var(--muted); }.guild-team-openings dd { margin:0; overflow-wrap:anywhere; }
.site-frame.managed-clan-page .guild-team-details { border:0; padding:0; background:none; border-radius:0; }
.guild-team-details summary { color:var(--gold); font-size:13px; padding:8px 0; cursor:pointer; min-height:36px; }
.site-frame.managed-clan-page .guild-team-details p { font-size:13px; }
.site-frame.managed-clan-page .guild-join { border-top:2px solid var(--gold); scroll-margin-top:90px; }
.site-frame.managed-clan-page .guild-join .eyebrow { margin:0 0 8px; color:#a4d5b2; font-size:11px; letter-spacing:.08em; }
.site-frame.managed-clan-page .guild-join form button { width:100%; margin-top:8px; white-space:normal; min-height:44px; }
.guild-join-alternative { display:grid; gap:6px; border-top:1px solid var(--line); padding-top:18px; margin-top:18px; font-size:13px; }
.guild-resource { display:inline-block; font-size:13px; margin-top:18px; }
.profile-confirmation { padding:0 6px; }.profile-confirmation p:first-child { color:var(--muted); font-size:13px; font-weight:600; }
.site-frame.managed-clan-page .profile-sidebar .recruitment-tags { gap:6px; margin-bottom:16px; }
.site-frame.managed-clan-page .profile-sidebar .recruitment-tags span { font-size:11px; line-height:1.6; }
.site-frame.managed-clan-page .profile-facts { margin-bottom:0; }
.site-frame.managed-clan-page .profile-facts > div { padding-block:12px; }
.site-frame.managed-clan-page .profile-facts :is(dt,dd) { font-size:13px; line-height:1.6; }
@media(max-width:1000px){.site-frame.managed-clan-page .profile-layout{grid-template-columns:minmax(0,1fr)}.site-frame.managed-clan-page .profile-sidebar{grid-template-columns:repeat(2,minmax(0,1fr));}.profile-confirmation{grid-column:1/-1;}}
@media(max-width:639px){.site-frame.managed-clan-page .profile-panel{padding:18px}.site-frame.managed-clan-page .profile-sidebar{grid-template-columns:minmax(0,1fr)}.site-frame.managed-clan-page .managed-profile-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.site-frame.managed-clan-page .managed-profile-stats>div:last-child{grid-column:1/-1}.guild-team{padding:16px}.guild-team .guild-team-heading{flex-wrap:wrap}.site-frame.managed-clan-page .profile-tabs a{padding:10px 12px;font-size:12px}.site-frame.managed-clan-page .managed-profile-summary{font-size:14px}}

@media(max-width:1000px){.site-frame.managed-clan-page .profile-layout>.profile-column:first-child{order:2}.site-frame.managed-clan-page .profile-sidebar{display:contents}.site-frame.managed-clan-page .profile-sidebar>*{order:3}.site-frame.managed-clan-page .profile-sidebar>.guild-join{order:1}}

/* Hourly spotlight follows the shared Clan Finder feature/standings layout. */
.site-frame .home-spotlight { border:1px solid #0d0e14; border-radius:10px; color:var(--ink); background:linear-gradient(180deg,#292b35,#21222b); box-shadow:inset 0 0 0 1px #3d3f4b,0 3px 6px #0006; }
.site-frame .home-spotlight .spotlight-winner { padding:0; background:none; }
.site-frame .home-spotlight .spotlight-profile { min-height:300px; }
.site-frame .home-spotlight .spotlight-artwork { display:block; inset:2px; border-radius:8px 0 0 8px; }
.site-frame .home-spotlight .spotlight-artwork .guild-banner { height:100%; aspect-ratio:auto; background:#20222b; }
.site-frame .home-spotlight .spotlight-artwork .guild-banner:has(.media-placeholder) { background:linear-gradient(120deg,#17182040,#17182099),url('/wow-orgrimmar-background.webp?v=1') center/cover; }
.site-frame .home-spotlight .spotlight-artwork img { object-fit:cover; object-position:var(--media-x) var(--media-y); }
.site-frame .home-spotlight .spotlight-profile:after { inset:2px; border-radius:8px 0 0 8px; background:linear-gradient(180deg,#15172026,#20222b80 40%,#21222bf5 85%,#21222b),linear-gradient(90deg,#151720b3,#15172026); }
.site-frame .home-spotlight .spotlight-profile-content { padding:22px; }
.site-frame .home-spotlight .spotlight-heading { margin:0 0 18px; }
.site-frame .home-spotlight .spotlight-heading h2 { padding:0; border:0; background:none; color:#e9bf78; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; text-shadow:0 1px 3px #000b; }
.site-frame .home-spotlight .spotlight-winner-identity { align-items:center; gap:14px; }
.site-frame .home-spotlight .spotlight-profile-avatar { width:64px; height:64px; flex-basis:64px; padding:4px; border:1px solid #101117; border-radius:6px; background:linear-gradient(180deg,#30333f,#191a22); box-shadow:inset 0 0 0 1px #4b4e5a,0 2px 5px #0006; }
.site-frame .home-spotlight .spotlight-profile-avatar .guild-logo { border-radius:3px; background:#20222b; }
.site-frame .home-spotlight .guild-logo .media-placeholder { color:#edc582; }
.site-frame .home-spotlight .spotlight-eyebrow { margin:0 0 4px; font-size:10px; color:#c6c6d0; letter-spacing:.03em; }
.site-frame .home-spotlight .spotlight-winner-copy h3 { color:#f0efe8; font-size:25px; line-height:1.2; letter-spacing:-.025em; text-shadow:0 1px 4px #000b; }
.site-frame .home-spotlight .spotlight-winner-copy h3 a { color:inherit; }
.site-frame .home-spotlight .spotlight-description { max-width:58ch; margin-top:7px; font-size:13px; line-height:1.65; color:#e0e1e8; text-shadow:0 1px 3px #000b; }
.site-frame .home-spotlight .spotlight-tags-action { margin-top:18px; gap:14px; }
.site-frame .home-spotlight .spotlight-playstyles>span,.site-frame .home-spotlight .spotlight-community-tags>span,.site-frame .home-spotlight .spotlight-winner-meta>span { padding:4px 8px; border:1px solid #101117; border-radius:5px; background:linear-gradient(180deg,#171820,#1d1e27); box-shadow:inset 0 2px 4px #0007,0 1px 0 #ffffff0d; color:#bebdca; font-size:11px; line-height:1.5; }
.site-frame .home-spotlight .spotlight-playstyles>span { color:#e6e6ee; font-weight:600; }
.site-frame .home-spotlight .spotlight-community-tags { margin-top:6px; }
.site-frame .home-spotlight .spotlight-profile-link { min-height:38px; padding:8px 12px; border:1px solid #101117; border-radius:5px; background:linear-gradient(180deg,#343743,#262832); box-shadow:inset 0 0 0 1px #484b59,0 2px 3px #0006; color:#ffcf6f; }
.site-frame .home-spotlight .spotlight-profile-link:hover { color:#ffe0a7; background:linear-gradient(180deg,#3b3e4c,#2b2e39); text-decoration:none; }
.site-frame .home-spotlight .spotlight-winner-meta { margin-top:16px; padding-top:12px; border-color:#ffffff20; gap:6px; }
.site-frame .home-spotlight .spotlight-winner-meta>span:first-child { color:#ffcf6f; }
.site-frame .home-spotlight .spotlight-round-note { margin-top:9px; color:#aaa9ba; font-size:11px; }
.site-frame .home-spotlight .spotlight-next { padding:22px; border-color:#101117; background:linear-gradient(180deg,#15161d33,#15161d66); box-shadow:inset 1px 0 0 #ffffff08; }
.site-frame .home-spotlight .bump-board-title h3 { color:#e6e6ee; font-size:14px; font-weight:700; }
.site-frame .home-spotlight .spotlight-countdown { color:#aaa9ba; }
.site-frame .home-spotlight .spotlight-countdown strong { color:#edc582; }
.site-frame .home-spotlight .bump-board-subtitle { margin-top:6px; color:#aaa9ba; font-size:12px; }
.site-frame .home-spotlight .bump-ranking-compact { display:grid; gap:8px; margin-top:16px; }
.site-frame .home-spotlight .bump-ranking-compact>li { display:block; padding:0; border:1px solid #0e0f15; border-radius:7px; background:linear-gradient(180deg,#2c2e39,#23252f); box-shadow:inset 0 0 0 1px #3b3e4a,0 2px 3px #0005; }
.site-frame .home-spotlight .bump-preview-link { display:grid; grid-template-columns:40px minmax(0,1fr) auto; align-items:center; gap:12px; min-height:66px; padding:10px; border-radius:6px; text-decoration:none; }
.site-frame .home-spotlight .bump-preview-link:hover { background:#ffffff05; text-decoration:none; }
.site-frame .home-spotlight .bump-preview-link:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
.site-frame .home-spotlight .bump-preview-link .bump-row-avatar { display:block; width:40px; height:40px; padding:3px; border:1px solid #4a4d59; border-radius:6px; background:linear-gradient(145deg,#30333f,#1b1d25); }
.site-frame .home-spotlight .bump-preview-link .guild-logo { width:100%; height:100%; border:0; border-radius:3px; background:#20222b; }
.site-frame .home-spotlight .bump-preview-link .bump-row-clan { display:flex; flex-direction:column; gap:3px; min-width:0; }
.site-frame .home-spotlight .bump-preview-link .bump-row-name { color:#e6e6ee; font-size:13px; font-weight:700; line-height:1.4; overflow-wrap:anywhere; }
.site-frame .home-spotlight .bump-preview-link:hover .bump-row-name { color:#edc582; }
.site-frame .home-spotlight .bump-row-position { color:#aaa9ba; font-size:10px; line-height:1.3; }
.site-frame .home-spotlight .bump-preview-link .bump-row-total { display:flex; flex-direction:column; align-items:center; gap:2px; min-width:46px; padding:4px 7px; border-left:1px solid #444652; line-height:1.2; }
.site-frame .home-spotlight .bump-row-total strong { color:#ffcf6f; font-size:15px; font-weight:800; }
.site-frame .home-spotlight .bump-row-total-label { color:#aaa9ba; font-size:9px; }
.site-frame .home-spotlight .bump-ranking-compact>li.bump-row-selected { border-color:#ba995a; }
.site-frame .home-spotlight .bump-help summary { border-color:#696575; background:#1b1c25; color:#b5b4c4; }
.site-frame .home-spotlight .bump-help p { border-color:#505361; background:#252732; color:#e6e6ee; }
.site-frame .home-spotlight .bump-board-footer { color:#edc582; padding-top:18px; min-height:44px; }
.site-frame .home-spotlight .spotlight-empty { max-width:none; }
.site-frame .home-spotlight.spotlight-no-winner .spotlight-winner { padding:0; }
@media(max-width:767px){.site-frame .home-spotlight{grid-template-columns:minmax(0,1fr)}.site-frame .home-spotlight .spotlight-artwork,.site-frame .home-spotlight .spotlight-profile:after{border-radius:8px 8px 0 0}.site-frame .home-spotlight .spotlight-profile-content,.site-frame .home-spotlight .spotlight-next{padding:18px}.site-frame .home-spotlight .spotlight-next{border-left:0;border-top:1px solid #101117}.site-frame .home-spotlight .spotlight-profile{min-height:0}.site-frame .home-spotlight .spotlight-description{font-size:12px}.site-frame .home-spotlight .spotlight-winner-copy h3{font-size:23px}}

/* Guild artwork editor: shared OSRS surfaces, framed previews and crop controls. */
.site-frame .media-editor { min-width: 0; margin: 20px 0 0; padding: 20px; border: 1px solid var(--frame-edge); }
.site-frame .media-editor legend { padding: 0 8px; color: var(--accent); font-size: 15px; font-weight: 700; }
.site-frame .media-editor-intro,.site-frame .media-editor-note { margin: 0; color: var(--muted-bright); font-size: 13px; line-height: 1.65; }
.site-frame .media-editor-note { margin-top: 18px; color: var(--muted); font-size: 12px; }
.site-frame .media-editor-panels { display: grid; gap: 20px; margin-top: 20px; }
.site-frame .media-editor-section { min-width: 0; margin: 0; padding: 20px; border: 1px solid var(--frame-edge); border-radius: var(--panel-radius); background: var(--inset-gradient); box-shadow: var(--inset-shadow); }
.site-frame .media-editor-section + .media-editor-section { margin: 0; padding-top: 20px; border-top-color: var(--frame-edge); }
.site-frame .media-editor-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.site-frame .media-editor-heading h3 { margin: 0; color: var(--ink); font-size: 15px; font-weight: 700; }
.site-frame .media-optional { color: var(--muted); font-size: 11px; }
.site-frame .media-editor-content { display: grid; gap: 20px; min-width: 0; }
.site-frame [data-media-kind=logo] .media-editor-content { grid-template-columns: minmax(0,1fr) 180px; align-items: center; }
.site-frame .media-upload { min-width: 0; }
.site-frame .media-upload > label { margin: 0 0 6px; font-size: 12px; color: var(--muted-bright); }
.site-frame .media-upload-help { margin: 0 0 14px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.site-frame .media-editor input[type=file] { display: block; width: 100%; min-width: 0; min-height: 44px; padding: 4px; margin: 0; font-size: 12px; line-height: 32px; color: var(--muted-bright); border: 1px solid var(--frame-edge); border-radius: var(--control-radius); background: var(--panel-gradient); box-shadow: none; }
.site-frame .media-editor input[type=file]::file-selector-button { margin-right: 10px; padding: 0 12px; min-height: 34px; border: 1px solid var(--frame-edge); border-radius: var(--control-radius); background: var(--control-gradient); color: var(--accent); font: inherit; font-weight: 700; cursor: pointer; }
.site-frame .media-editor input[type=file]::file-selector-button:hover { background: var(--control-selected-gradient); }
.site-frame .media-upload-formats { margin: 8px 0 0; font-size: 11px; color: var(--muted); line-height: 1.6; }
.site-frame .media-preview-area { min-width: 0; }
.site-frame .media-preview-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; color: var(--muted); font-size: 11px; font-weight: 700; }
.site-frame [data-media-kind=logo] .media-preview-heading { justify-content: center; }
.site-frame .media-preview-stage { display: grid; place-items: center; min-width: 0; }
.site-frame .media-editor-section .guild-logo { width: 144px; height: 144px; margin: 0; border: 4px solid var(--frame-edge); border-radius: 50%; background: var(--panel-gradient); box-shadow: 0 0 0 1px var(--accent),0 6px 18px #0004; }
.site-frame .media-editor-section .guild-banner { width: 100%; height: auto; min-height: 0; aspect-ratio: 5 / 1; border: 1px solid var(--frame-edge); border-radius: var(--control-radius); background: var(--panel-gradient); box-shadow: var(--inset-shadow); }
.site-frame .media-editor-section .media-placeholder { padding: 16px; box-sizing: border-box; text-align: center; color: var(--muted); font-size: 12px; font-weight: 400; }
.site-frame .media-editor-section .media-placeholder::before { content: ''; position: absolute; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 10px; transform: rotate(45deg); opacity: .5; }
.site-frame .media-preview-switch { display: flex; padding: 3px; gap: 3px; border: 1px solid var(--frame-edge); border-radius: var(--control-radius); background: var(--inset-gradient); }
.site-frame .media-preview-switch button { min-height: 32px; padding: 4px 10px; border: 1px solid transparent; background: transparent; box-shadow: none; color: var(--muted); font-size: 11px; font-weight: 700; }
.site-frame .media-preview-switch button[aria-pressed=true] { border-color: var(--frame-edge); background: var(--control-selected-gradient); box-shadow: var(--control-selected-shadow); color: var(--accent); }
.site-frame .media-preview-stage[data-banner-viewport=mobile] .guild-banner { max-width: 390px; aspect-ratio: 2.5 / 1; }
.site-frame .media-preview-caption { margin: 8px 0 0; color: var(--muted); font-size: 11px; text-align: center; }
.site-frame .media-crop-panel { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); }
.site-frame .media-adjustments { margin: 0; gap: 20px; }
.site-frame .media-adjustments label { display: grid; grid-template-columns: 1fr auto; gap: 6px; margin: 0; font-size: 11px; color: var(--muted-bright); }
.site-frame .media-adjustments output { color: var(--accent); font-size: 11px; font-variant-numeric: tabular-nums; }
.site-frame .media-adjustments input[type=range] { grid-column: 1 / -1; width: 100%; min-width: 0; min-height: 28px; margin: 0; padding: 0; box-shadow: none; accent-color: var(--accent); }
.site-frame .media-actions { justify-content: space-between; gap: 12px; margin: 14px 0 0; }
.site-frame .media-actions button { min-height: 36px; margin: 0; padding: 6px 12px; font-size: 11px; }
.site-frame .media-actions .text-button { border: 1px solid transparent; background: transparent; box-shadow: none; color: var(--muted); }
.site-frame .media-actions .text-button:hover { color: #f5b4ad; }
.site-frame .media-status { padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--control-radius); color: var(--muted-bright); background: var(--panel-gradient); font-size: 12px; line-height: 1.6; }
.site-frame .media-status-error { color: #f5b4ad; border-color: #9c514b; }
.site-frame .media-editor :is(input,button):focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
@media (max-width:639px) {
 .site-frame .media-editor { padding: 14px; }
 .site-frame .media-editor-section,.site-frame .media-editor-section + .media-editor-section { padding: 14px; }
 .site-frame [data-media-kind=logo] .media-editor-content { grid-template-columns: minmax(0,1fr); }
 .site-frame .media-adjustments { grid-template-columns: minmax(0,1fr); gap: 12px; }
 .site-frame .media-editor-section .guild-banner { aspect-ratio: 5 / 1; }
}

/* Personal avatar in the account trigger and dropdown, with icon fallback. */
.site-header :is(.account-avatar,.account-menu__avatar) { position: relative; overflow: hidden; }
.site-header :is(.account-avatar,.account-menu__avatar) img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border-radius: inherit; object-fit: cover; background: var(--surface-raised); }

/* Profile recruitment and application details share the Clan Finder tag treatment. */
.site-frame.managed-clan-page .recruitment-status { width: fit-content; max-width: 100%; padding: 4px 9px; border: 1px solid #9ed3ae30; border-radius: 5px; background: #9ed3ae09; color: #a4d5b2; font-size: 11px; font-weight: 600; line-height: 1.6; letter-spacing: 0; text-transform: none; white-space: normal; }
.site-frame.managed-clan-page .recruitment-status::before { width: 5px; height: 5px; box-shadow: 0 0 0 3px #9ed3ae0a; }
.site-frame.managed-clan-page .recruitment-status.is-closed { border-color: var(--line); background: var(--inset-gradient); color: var(--muted); }
.site-frame.managed-clan-page .managed-profile-meta .profile-recruiting-status { padding: 0; border: 0; background: none; box-shadow: none; }
.site-frame.managed-clan-page .guild-join { padding: 22px; border-top: 1px solid var(--frame-edge); }
.site-frame.managed-clan-page .guild-join-heading { margin-bottom: 18px; }
.site-frame.managed-clan-page .guild-join-heading .recruitment-status { margin-bottom: 14px; }
.site-frame.managed-clan-page .guild-join-heading h2 { margin: 0 0 10px; font-size: 22px; letter-spacing: -.02em; }
.site-frame.managed-clan-page .guild-join-heading p { margin: 0; color: var(--muted-bright); font-size: 13px; line-height: 1.7; }
.site-frame.managed-clan-page .guild-join > form { margin: 0; }
.site-frame.managed-clan-page .guild-join form button { margin: 0; min-height: 44px; font-size: 13px; }
.site-frame.managed-clan-page .guild-join > form + p { margin: 8px 0 0; text-align: center; color: var(--muted); font-size: 11px; line-height: 1.6; }
.site-frame.managed-clan-page .guild-join > .full-width { width: 100%; margin-top: 10px; font-size: 12px; min-height: 40px; }
.site-frame.managed-clan-page .guild-join .contact-panel { margin: 0; padding: 14px; border: 1px solid var(--frame-edge); background: var(--inset-gradient); box-shadow: var(--inset-shadow); }
.site-frame.managed-clan-page .guild-join .contact-panel h2 { margin-bottom: 8px; font-size: 14px; }
.site-frame.managed-clan-page .guild-join .contact-panel p { font-size: 12px; }
.site-frame.managed-clan-page .guild-join .contact-panel button { width: 100%; font-size: 12px; }
.site-frame.managed-clan-page .guild-join-alternative { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.site-frame.managed-clan-page .guild-application-link { display: flex; align-items: center; gap: 10px; min-width: 0; min-height: 70px; padding: 12px; border: 1px solid var(--frame-edge); border-radius: var(--control-radius); background: var(--control-gradient); box-shadow: var(--control-shadow); text-decoration: none; }
.site-frame.managed-clan-page .guild-application-link:hover { background: var(--control-selected-gradient); border-color: #8b734e; }
.site-frame.managed-clan-page .guild-application-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.guild-application-icon,.guild-application-arrow { display: flex; flex-shrink: 0; color: var(--accent); }
.guild-application-icon svg { width: 18px; height: 18px; }
.guild-application-arrow { margin-left: auto; }
.guild-application-arrow svg { width: 15px; height: 15px; }
.guild-application-copy { display: grid; min-width: 0; gap: 4px; }
.guild-application-copy strong { color: var(--accent); font-size: 12px; font-weight: 600; line-height: 1.5; }
.guild-application-copy > span { color: var(--muted); font-size: 11px; line-height: 1.6; }
.site-frame .recruitment-tags { display: flex; flex-wrap: wrap; gap: 7px; margin: 12px 0 16px; }
.site-frame .recruitment-tags > span,.site-frame .clan-grid .tag-list li { display: inline-flex; align-items: center; gap: 7px; max-width: 100%; padding: 5px 9px; border: 1px solid var(--frame-edge); border-radius: 5px; background: var(--inset-gradient); box-shadow: var(--inset-shadow); color: var(--muted-bright); font-size: 11px; font-weight: 500; line-height: 1.6; letter-spacing: 0; overflow-wrap: anywhere; }
.site-frame .recruitment-tags > span::before,.site-frame .clan-grid .tag-list li::before { content: ''; display: block; flex: 0 0 5px; width: 5px; height: 5px; margin: 0 1px 0 0; border: 1px solid var(--accent); border-radius: 1px; transform: rotate(45deg); opacity: .8; }
.site-frame .clan-grid .tag-list li { padding: 3px 7px; font-size: 10px; }
@media(max-width:639px) { .site-frame.managed-clan-page .guild-join { padding: 18px; } }
/* Guild contact and private recruitment introductions. */
.site-frame.managed-clan-page .button.guild-discord-button,.site-frame.managed-clan-page #guild-contact .button.guild-discord-button { display:inline-flex; align-items:center; justify-content:center; gap:9px; background:var(--accent-gradient); border:1px solid var(--frame-edge); color:var(--on-accent); box-shadow:var(--accent-shadow); }
.site-frame.managed-clan-page .button.guild-discord-button:hover,.site-frame.managed-clan-page #guild-contact .button.guild-discord-button:hover { background:var(--accent-hover-gradient); border-color:var(--frame-edge); color:var(--on-accent); }
.guild-discord-button svg { width:20px; height:20px; flex:none; }
.site-frame.managed-clan-page .button.guild-interest-button,.site-frame.managed-clan-page #guild-contact .button.guild-interest-button { background:var(--control-gradient); border:1px solid var(--frame-edge); color:var(--ink); box-shadow:var(--control-shadow); }
.site-frame.managed-clan-page .button.guild-interest-button:hover,.site-frame.managed-clan-page #guild-contact .button.guild-interest-button:hover { border-color:var(--gold); color:var(--gold); }
.guild-join .guild-discord-button,.guild-join .guild-interest-button { width:100%; min-height:46px; }
.guild-interest-alternative { margin-top:12px; }
.guild-interest-alternative p { margin:10px 0 0; font-size:12px; line-height:1.6; }
.guild-external-links { display:flex; gap:16px; flex-wrap:wrap; margin-top:20px; padding-top:16px; border-top:1px solid var(--line); font-size:12px; }
.guild-discord-contact p { overflow-wrap:anywhere; }
/* Exact dimensions and treatments from OSRS ClanRecruitmentRequests.module.css. */
.site-frame .guild-interest-dialog { box-sizing:border-box; margin:auto; width:calc(100% - 32px); max-width:540px; max-height:calc(100dvh - 32px); overflow-y:auto; padding:0; border:1px solid var(--frame-edge); border-radius:10px; background:var(--panel-gradient); box-shadow:var(--panel-shadow),0 20px 80px #0009; color:var(--ink); }
.site-frame .guild-interest-dialog::backdrop { background:#06070bc9; backdrop-filter:none; }
.site-frame .guild-interest-dialog>header { display:flex; align-items:start; justify-content:space-between; gap:12px; padding:22px 24px; border:0; border-bottom:1px solid #414450; background:transparent; color:var(--ink); }
.site-frame .guild-interest-dialog h2 { margin:5px 0 0; font-size:22px; font-weight:800; line-height:1.3; overflow-wrap:anywhere; }
.site-frame .guild-interest-dialog .eyebrow { margin:0; color:#e9bf78; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.1em; }
.site-frame .guild-interest-dialog .interest-close { display:grid; flex-shrink:0; place-items:center; width:36px; height:36px; min-width:36px; min-height:36px; padding:0; border:1px solid #484b59; border-radius:5px; background:transparent; box-shadow:none; color:var(--muted); }
.site-frame .guild-interest-dialog .interest-close svg { width:19px; height:19px; }
.site-frame .guild-interest-dialog .interest-close:hover { background:#343743; color:var(--ink); }
.site-frame .guild-interest-body { display:grid; gap:18px; padding:22px 24px 24px; }
.site-frame .guild-interest-body :is(form,[data-interest-result]) { display:grid; gap:18px; margin:0; }
.site-frame .guild-interest-body .muted { margin:0; padding:0; color:var(--muted); font-size:14px; font-weight:400; line-height:1.7; }
.site-frame .guild-interest-body label { display:grid; gap:7px; min-width:0; margin:0; color:var(--ink); font-size:13px; font-weight:600; }
.site-frame .guild-interest-body :is(input:not([type=hidden]),textarea) { width:100%; min-width:0; box-sizing:border-box; margin:0; padding:11px 12px; border:1px solid #4b4e5c; border-radius:6px; background:#1b1d25; box-shadow:inset 0 1px 2px #0003; color:var(--ink); font-size:14px; font-weight:400; line-height:1.6; }
.site-frame .guild-interest-body textarea { min-height:120px; resize:vertical; }
.site-frame .guild-interest-body :is(input,textarea):focus { border-color:#b89b67; outline:2px solid #edc58255; outline-offset:2px; }
.site-frame .guild-interest-contacts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.site-frame .guild-interest-body .actions { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:flex-end; align-items:center; gap:10px; margin:0; }
.site-frame .guild-interest-body :is(button,.button) { display:inline-flex; align-items:center; justify-content:center; gap:8px; width:auto; min-height:44px; padding:10px 16px; border:1px solid #484b59; border-radius:6px; background:var(--control-gradient); box-shadow:none; color:var(--ink); font-size:13px; font-weight:600; line-height:1.4; text-align:center; text-decoration:none; }
.site-frame .guild-interest-body :is(button,.button):hover { border-color:#b89b67; }
.site-frame .guild-interest-body :is(button[type=submit],.interest-primary) { border-color:#101117; background:linear-gradient(180deg,#ffca72,#edac46); box-shadow:inset 0 0 0 1px #f6d098,inset 0 2px 0 #ffffff40,0 2px 3px #0006; color:#21170c; }
.site-frame .guild-interest-body :is(button[type=submit],.interest-primary):hover { background:linear-gradient(180deg,#ffd58f,#f3b653); }
.site-frame .guild-interest-dialog button:disabled { opacity:.5; cursor:not-allowed; }
.site-frame .guild-interest-dialog :is(button,a):focus-visible { outline:2px solid #edc582; outline-offset:3px; }
.site-frame .guild-interest-body :is(.interest-error,.interest-success) { margin:0; padding:12px 14px; border:1px solid #735250; border-radius:6px; background:#482b2b30; color:#efc5c0; font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.site-frame .guild-interest-body .interest-success { border-color:#49735c; background:#285f3c20; color:#bbdec9; }
.interest-success svg { display:block; width:18px; height:18px; margin-bottom:8px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.guild-interest-request form label { display:grid; gap:8px; margin:16px 0; font-size:13px; font-weight:600; }
@media(max-width:639px) {
 .site-frame .guild-interest-dialog>header,.site-frame .guild-interest-body { padding:18px; }
 .site-frame .guild-interest-contacts { grid-template-columns:minmax(0,1fr); }
 .site-frame .guild-interest-body :is(input:not([type=hidden]),textarea) { font-size:16px; }
 .site-frame .guild-interest-body .actions>button { flex:1; }
}
.interest-contact-details { display:flex; flex-wrap:wrap; gap:18px 40px; margin:24px 0; padding:16px; background:#18191f; border:1px solid var(--line); border-radius:8px; }
.interest-contact-details dt { color:var(--muted); font-size:12px; margin-bottom:6px; }
.interest-contact-details dd { margin:0; overflow-wrap:anywhere; }
.interest-return { border-top:1px solid var(--line); padding-top:20px; margin-top:24px; }
.guild-interest-request .preserve { overflow-wrap:anywhere; white-space:pre-wrap; }
.interest-notice { padding:16px; background:#28342c; border:1px solid #43594a; border-radius:8px; }


/* Profile parity: ClanProfileHero.module.css, ClanProfileTabs.module.css and
   Listing Staff from the local OSRS app. WoW keeps Discord as its primary CTA. */
.site-frame.managed-clan-page .managed-profile-summary { max-width:64ch; line-height:1.65; }
.site-frame.managed-clan-page .managed-profile-meta > div { align-items:center; }
.site-frame.managed-clan-page .managed-profile-meta dt { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.site-frame.managed-clan-page .managed-profile-meta dd { font-size:13px; font-weight:400; }
.site-frame.managed-clan-page .managed-profile-meta .profile-recruiting-status { padding:4px 8px; border:1px solid #ffffff12; border-radius:5px; background:#15161d50; }
.site-frame.managed-clan-page .managed-profile-hero .managed-profile-actions { border-radius:0 0 11px 11px; }
.site-frame.managed-clan-page .managed-profile-actions > :is(a,button),
.site-frame.managed-clan-page .guild-interest-button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:40px; padding:9px 14px; line-height:1.4; text-align:center; text-decoration:none; }
.site-frame.managed-clan-page .managed-profile-actions svg,.site-frame.managed-clan-page .guild-interest-button svg { width:17px; height:17px; flex:none; }
.site-frame.managed-clan-page .managed-profile-actions > :is(a,button):hover { border-color:#b89b67; }
.site-frame.managed-clan-page :is(.managed-profile-actions,.guild-people-list,.profile-tabs,.guild-join) :is(a,button):focus-visible { outline:2px solid #edc582; outline-offset:3px; }
.site-frame.managed-clan-page .profile-tabs { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; padding:6px; border:1px solid #41434f; border-radius:8px; background:#171820; box-shadow:inset 0 1px 4px #0005; overflow:visible; }
.site-frame.managed-clan-page .profile-tabs a { display:flex; align-items:center; justify-content:center; gap:6px; min-width:0; min-height:48px; padding:8px 6px; border:1px solid #4b4e5c; border-radius:5px; background:var(--control-gradient); box-shadow:inset 0 1px 0 #ffffff08,0 1px 2px #0004; color:var(--muted-bright); font-size:12px; font-weight:600; white-space:normal; line-height:1.4; text-align:center; }
.site-frame.managed-clan-page .profile-tabs svg { width:16px; height:16px; flex:none; }
.site-frame.managed-clan-page .profile-tabs a[aria-current] { border-color:var(--frame-edge); background:var(--accent-gradient); color:var(--on-accent); box-shadow:var(--accent-shadow); }
.site-frame.managed-clan-page .profile-tabs a:hover { border-color:#9c855b; color:var(--ink); }
.site-frame.managed-clan-page .profile-tabs a[aria-current]:hover { background:var(--accent-hover-gradient); color:var(--on-accent); }
.site-frame.managed-clan-page .guild-join-heading .recruitment-status { margin-bottom:10px; }
.site-frame.managed-clan-page .guild-join-heading h2 { font-size:20px; margin-bottom:8px; }
.site-frame.managed-clan-page .guild-interest-alternative p { font-size:12px; line-height:1.65; color:var(--muted); }
.site-frame.managed-clan-page .guild-listing-people { padding:20px; }
.site-frame.managed-clan-page .guild-listing-people h2 { display:flex; gap:8px; align-items:center; font-size:17px; margin-bottom:16px; }
.guild-listing-people h2 svg,.guild-members-preview h3 svg { width:18px; height:18px; color:var(--accent); flex:none; }
.guild-people-list { list-style:none; margin:0; padding:0; border:1px solid var(--line); border-radius:6px; overflow:hidden; background:#18192250; }
.guild-people-list li { margin:0; padding:0; }
.guild-people-list li+li { border-top:1px solid var(--line); }
.guild-person { display:flex; align-items:center; gap:12px; padding:12px; min-width:0; min-height:66px; color:var(--ink); text-decoration:none; }
.guild-person:hover { background:#ffffff05; color:var(--accent-strong); }
.guild-person-avatar { position:relative; display:grid; place-items:center; flex:0 0 40px; width:40px; height:40px; overflow:hidden; border:1px solid #5b513c; border-radius:5px; background:var(--inset-gradient); color:var(--accent); font-size:13px; font-weight:700; }
.guild-person-avatar img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.guild-person-copy { display:grid; gap:4px; min-width:0; flex:1; }
.guild-person-copy strong { font-size:14px; line-height:1.4; overflow-wrap:anywhere; }
.guild-person-copy>span { color:var(--muted); font-size:12px; line-height:1.5; }
.guild-person>svg { width:14px; height:14px; flex:none; color:var(--muted); }
.guild-members-preview { margin-top:20px; }
.guild-members-preview:first-child { margin-top:0; }
.guild-members-preview h3 { display:flex; align-items:center; gap:7px; margin:0 0 12px; font-size:13px; font-weight:600; }
.guild-members-preview h3>span { margin-left:auto; color:var(--muted); }
.guild-people-more { display:flex; align-items:center; gap:8px; margin-top:12px; font-size:12px; }
.guild-people-more svg { width:15px; height:15px; }
.guild-people-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:var(--line); }
.guild-people-grid li { background:#20212a; }
.guild-people-grid li+li { border:0; }
@media(max-width:639px) {
 .site-frame.managed-clan-page .managed-profile-identity,
 .site-frame.managed-clan-page .managed-profile-copy,
 .site-frame.managed-clan-page .managed-profile-heading-row { display:contents; }
 .site-frame.managed-clan-page .managed-profile-avatar { margin:-24px 0 0 16px; }
 .site-frame.managed-clan-page .managed-profile-title { flex:none; margin:14px 16px 0; }
 .site-frame.managed-clan-page .managed-profile-summary { margin:6px 16px 0; }
 .site-frame.managed-clan-page .managed-profile-meta { margin:12px 16px 20px; }
 .site-frame.managed-clan-page .managed-profile-stats { grid-template-columns:minmax(0,1fr); }
 .site-frame.managed-clan-page .managed-profile-hero .managed-profile-actions { border-radius:0; }
 .site-frame.managed-clan-page .managed-profile-actions > :is(a,button) { min-height:44px; height:auto; padding:8px; }
 .site-frame.managed-clan-page .managed-profile-support { order:3; margin:0; padding:0 16px 16px; }
 .site-frame.managed-clan-page .managed-profile-support .community-action { min-height:44px; }
 .site-frame.managed-clan-page .profile-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .site-frame.managed-clan-page .profile-tabs>a:last-child { grid-column:1/-1; }
 .guild-people-grid { grid-template-columns:minmax(0,1fr); }
}

/* Match OSRS's single content panel and framed section icons. */
.site-frame.managed-clan-page .profile-main-content { gap:0; overflow:hidden; border:1px solid var(--frame-edge); border-radius:8px; background:var(--panel-gradient); box-shadow:var(--panel-shadow); }
.site-frame.managed-clan-page .profile-main-content>.profile-tabs { margin:14px 16px; }
.site-frame.managed-clan-page .profile-main-content>.profile-panel { border:0; border-top:1px solid var(--line); border-radius:0; background:none; box-shadow:none; }
.site-frame.managed-clan-page .profile-panel h2 { display:flex; align-items:center; gap:8px; }
.profile-section-icon { display:flex; align-items:center; justify-content:center; flex:0 0 36px; width:36px; height:36px; border:1px solid #5b513c; border-radius:5px; background:var(--inset-gradient); color:var(--accent); }
.profile-section-icon svg { width:18px; height:18px; flex:none; }
.site-frame.managed-clan-page .managed-stat-icon { color:#d2b579; border-color:#5b513c; background:#d9b16f08; }
.site-frame.managed-clan-page .managed-profile-meta .recruitment-status { padding:0; border:0; background:none; font-size:12px; }
.site-frame.managed-clan-page .guild-reviews .empty-state { padding:22px 16px; background:var(--inset-gradient); box-shadow:var(--inset-shadow); }
.site-frame.managed-clan-page .guild-listing-people h2 { font-size:19px; }
@media(max-width:639px) {
 .site-frame.managed-clan-page .profile-main-content>.profile-tabs { margin:12px; }
}

/* Complete a missing player profile without leaving the recruitment dialog. */
.site-frame .guild-interest-dialog .interest-steps { display:flex; gap:20px; list-style:none; margin:0; padding:0 0 16px; border-bottom:1px solid #414450; }
.interest-steps li { display:flex; align-items:center; gap:8px; min-width:0; color:var(--muted); font-size:12px; font-weight:600; line-height:1.4; }
.interest-steps li>span { display:grid; place-items:center; width:24px; height:24px; flex:none; border:1px solid #484b59; border-radius:50%; background:#1b1d25; }
.interest-steps li[aria-current] { color:var(--accent); }
.interest-steps li[aria-current]>span { border-color:#b89b67; background:#d9b16f15; }
.site-frame .guild-interest-dialog [data-interest-profile] textarea { min-height:94px; }
@media(max-width:380px){.site-frame .guild-interest-dialog .interest-steps{gap:12px}.site-frame .guild-interest-dialog [data-interest-profile] .actions{flex-wrap:wrap}.site-frame .guild-interest-dialog [data-interest-profile] .actions>button{flex-basis:100%}}

/* Community activity follows the compact OSRS social cards and welcome groups. */
.site-frame .community-activity { min-width:0; padding:0; overflow:hidden; }
.community-activity-heading { display:flex; align-items:flex-start; gap:12px; padding:18px 20px 12px; background:transparent; border:0; box-shadow:none; }
.community-activity-heading>div { min-width:0; padding-top:1px; }
.community-activity-avatar { display:block; width:42px; height:42px; flex:0 0 42px; border:1px solid #101117; border-radius:50%; overflow:hidden; background:var(--button-fill); box-shadow:inset 0 0 0 1px #484b59; }
.community-activity-avatar :is(.guild-logo,.guild-person-avatar) { width:100%; height:100%; border:0; border-radius:50%; }
.community-activity-heading h2 { margin:0; font-size:14px; line-height:1.6; font-weight:700; overflow-wrap:anywhere; }
.community-activity-heading h2 a { color:var(--text); text-decoration:none; }
.community-activity-heading h2 a:hover { text-decoration:underline; text-underline-offset:3px; }
.community-activity-heading h2>span { color:var(--muted); font-weight:400; }
.community-activity-meta { display:flex; flex-wrap:wrap; align-items:center; gap:3px 6px; margin-top:2px; color:var(--muted); font-size:11px; line-height:1.6; }
.community-activity-body { padding:0 20px 16px; }
.community-activity-body>p { margin:0; color:var(--text); font-size:14px; line-height:1.75; white-space:pre-wrap; overflow-wrap:anywhere; }
.community-activity-facts { display:flex; flex-wrap:wrap; gap:6px 14px; margin:8px 0 0; padding:0; color:var(--gold); font-size:12px; list-style:none; }
.community-activity-banner { display:block; overflow:hidden; }
.community-activity-banner .guild-banner { width:100%; aspect-ratio:5/1; border:0; border-radius:0; }
.community-activity-footer { display:flex; flex-wrap:wrap; gap:2px; padding:7px 12px; border-top:1px solid #ffffff08; background:#15161d33; box-shadow:inset 0 1px 0 #ffffff04; }
.community-activity-footer a { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:36px; padding:6px 10px; border-radius:5px; color:var(--muted); font-size:12px; font-weight:600; text-decoration:none; }
.community-activity-footer a svg { width:15px; height:15px; }
.community-activity-footer a:hover { color:var(--text); background:#30333f; }
.community-welcome-group { margin-bottom:16px; border:1px solid #454650; border-radius:8px; background:#22232c; overflow:hidden; }
.community-welcome-group>summary { cursor:pointer; padding:16px 18px; color:#f1d1a5; font-size:14px; font-weight:700; line-height:1.6; overflow-wrap:anywhere; }
.community-welcome-group>summary span { display:block; margin-top:4px; color:#bcbcc9; font-size:12px; font-weight:400; }
.community-welcome-members { display:grid; gap:10px; padding:0 10px 10px; }
.community-welcome-members .community-card { margin:0; }
.community-welcome-group>summary:focus-visible,.community-activity a:focus-visible { outline:2px solid #edc582; outline-offset:-3px; }
@media(max-width:767px) {
 .community-activity-heading { padding:16px 16px 10px; }
 .community-activity-body { padding:0 16px 14px; }
 .community-activity-meta { font-size:10px; }
 .community-activity-footer { padding-inline:8px; }
 .community-activity-footer a { min-height:40px; padding-inline:8px; font-size:11px; }
}

.guild-game-selection { padding:18px; border:1px solid #414451; border-radius:8px; background:#1b1d2533; }
.guild-game-selection>legend { padding:0 6px; font-weight:700; }
.additional-game-choices { margin:18px 0 0; padding:0; border:0; }
.additional-game-choices>legend { font-size:13px; font-weight:700; }
.additional-game-choices .choices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.additional-game-choices .choices label { margin:0; padding:10px 12px; border:1px solid #414451; border-radius:6px; background:#1b1d25; }
.additional-game-choices .choices label:has(input:checked) { border-color:#c39c59; background:#d9ab5912; }
.guild-timezone-field { min-width:0; }
.timezone-tools { display:flex; flex-wrap:wrap; gap:4px 16px; margin-top:6px; }
.timezone-tools .text-button { min-height:36px; padding:4px 0; text-align:left; color:var(--gold); font-size:12px; }
@media(max-width:540px) { .additional-game-choices .choices { grid-template-columns:1fr; } }

#guild-form :is(fieldset,label,.dropdown-control) { min-width:0; }
.additional-game-choices .choices label { white-space:normal; overflow-wrap:anywhere; }
.site-frame .timezone-tools .text-button { margin:0; min-height:32px; background:none; border:0; box-shadow:none; max-width:100%; white-space:normal; overflow-wrap:anywhere; text-decoration:underline; text-underline-offset:3px; }

/* Keep the magnifying-glass brand visible at phone widths, too. */
.site-frame .brand__icon, .site-frame .hero-heading > img, .site-frame .auth-dialog-brand img { object-fit: contain; border-radius: 0; }
@media (max-width: 639px) {
  .site-frame .site-header .brand__icon { display: block; width: 30px; height: 30px; }
  .site-frame .site-header .brand { gap: 6px; }
}

/* Save a guild directly from its listing, without leaving the directory. */
.site-frame .clan-grid .clan-card__links { grid-template-columns: 1fr 1fr 1.25fr; }
.site-frame .clan-grid .clan-card__links .guild-save { grid-column: 1; min-height: 44px; padding: .45rem .5rem; font-size: .75rem; }
.site-frame .clan-grid .clan-card__links .compare-toggle { grid-column: 2; }
.site-frame .clan-grid .clan-card__links .clan-card__view { grid-column: 3; }
.site-frame .clan-grid .guild-save[aria-pressed="true"] { color: var(--gold); border-color: var(--gold); }
.site-frame .clan-grid .guild-save[aria-pressed="true"] svg { fill: currentColor; }
.site-frame .guild-save-status { margin: 0; color: var(--muted); font-size: .75rem; line-height: 1.5; }
.site-frame .guild-save-status:empty { display: none; }
.site-frame .guild-save-status.status-error { color: #ffb4ab; }
.site-frame .saved-guilds-link { display: inline-flex; align-items: center; min-height: 44px; font-size: .8rem; white-space: nowrap; }
@media (max-width: 380px) {
 .site-frame .clan-grid .clan-card__links { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .site-frame .clan-grid .clan-card__links .clan-card__view { grid-column: 1 / -1; }
}

/* Recruitment cards: officer-entered facts and clear next steps. */
.site-frame .clan-grid .recruitment-card { padding:20px; display:flex; flex-direction:column; gap:14px; height:100%; }
.recruitment-card-heading { display:flex; align-items:center; gap:12px; }
.recruitment-card-identity { min-width:0; flex:1; }
.site-frame .recruitment-card-identity h3 { margin:0; font-size:20px; }
.recruitment-card-identity p { margin:5px 0 0; color:#b8b9c6; font-size:12px; line-height:1.6; }
.recruitment-card { --listing-avatar-size:60px; }
.site-frame .recruitment-card .clan-sigil { width:var(--listing-avatar-size); height:var(--listing-avatar-size); flex:0 0 var(--listing-avatar-size); padding:2px; border-width:2px; }
.card-trust { font-size:11px; color:#c3c5d0; text-align:right; max-width:120px; }
/* Give players a useful introduction before they open the guild profile. */
.site-frame .recruitment-card .card-description { margin:0; padding:0; border:0; background:none; min-width:0; }
.site-frame .recruitment-card .clan-card__summary { display:block; margin:0; max-width:85ch; font-size:14px; line-height:1.8; color:#c9cbd6; -webkit-line-clamp:unset; overflow:visible; white-space:normal; }
.card-description > summary { display:block; padding:0; list-style:none; cursor:pointer; }
.card-description > summary::-webkit-details-marker { display:none; }
.card-description > summary::marker { content:''; }
.card-description-toggle { display:inline-flex; align-items:center; gap:6px; min-height:44px; margin-top:2px; color:var(--gold); font-size:12px; font-weight:700; }
.card-description-toggle svg { width:14px; height:14px; transform:rotate(90deg); }
.card-description .description-less { display:none; }
.card-description[open] > summary .clan-card__summary,.card-description[open] .description-more { display:none; }
.card-description[open] .description-less { display:inline; }
.card-description[open] .card-description-toggle svg { transform:rotate(270deg); }
.card-description > summary:hover .card-description-toggle { color:#ffe0a7; text-decoration:underline; text-underline-offset:3px; }
.card-description > summary:focus-visible { outline:2px solid var(--gold); outline-offset:5px; border-radius:3px; }
.card-description-full { max-width:85ch; color:#c9cbd6; font-size:14px; line-height:1.8; overflow-wrap:anywhere; }
.card-description-full p { margin:0 0 14px; white-space:pre-line; }
.card-description-full p:last-child { margin-bottom:0; }
.card-recruitment-details { padding:14px 16px; border:1px solid #40434e; border-radius:7px; background:#191b23; display:grid; gap:9px; }
.card-team { margin:0; font-size:13px; font-weight:600; color:#edc582; }
.card-team a { margin-left:10px; font-size:12px; font-weight:400; }
.card-opening { display:flex; align-items:baseline; flex-wrap:wrap; gap:5px 12px; }
.card-label { color:#b8b9c6; font-size:12px; }
.card-opening strong { color:#f0f0f5; font-size:14px; line-height:1.65; }
.card-schedule .local-schedule,.card-schedule-note { margin:0; font-size:13px; line-height:1.7; color:#dbdce5; }
.card-schedule-meta { display:flex; gap:12px; flex-wrap:wrap; align-items:baseline; font-size:12px; color:#b8b9c6; }
.card-schedule-meta details { border:0; padding:0; background:none; }
.card-schedule-meta summary { padding:4px 0; color:#d3b17a; cursor:pointer; }
.card-schedule-meta details p { margin:4px 0; max-width:65ch; font-size:12px; }
.card-progress { display:flex; flex-wrap:wrap; gap:6px 20px; margin:0; font-size:13px; color:#dedfe7; }
.card-progress small { color:#b8b9c6; font-size:11px; }
.card-community { list-style:none; display:flex; flex-wrap:wrap; gap:6px; padding:0; margin:0; }
.card-community li { padding:3px 8px; border-radius:4px; background:#ffffff08; color:#c6c7d1; font-size:11px; }
.card-footer { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; }
.card-confirmed { color:#b8b9c6; font-size:11px; }
.card-more { position:relative; background:none; border:0; padding:0; flex-shrink:0; }
.card-more summary { min-height:44px; display:flex; align-items:center; cursor:pointer; color:#b8b9c6; font-size:12px; padding:0 8px; }
.card-more summary:after { content:'⌄'; margin-left:8px; }
.card-more[open] summary:after { content:'⌃'; }
.card-more-actions { position:absolute; right:0; z-index:5; top:100%; padding:12px; border:1px solid #555866; border-radius:8px; background:#22242e; box-shadow:0 5px 20px #0008; width:240px; display:grid; gap:8px; }
.card-more-actions .community-actions { display:flex; flex-wrap:wrap; gap:8px; }
.site-frame .clan-grid .recruitment-card .card-main-actions { display:flex; flex-wrap:wrap; gap:8px; width:100%; margin:0; }
.site-frame .clan-grid .recruitment-card .card-main-actions>* { min-height:44px; display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:9px 15px; font-size:13px; width:auto; }
.site-frame .clan-grid .recruitment-card .card-main-actions .clan-card__view { color:#211b10; background:var(--accent-gradient); font-weight:700; }
.site-frame .clan-grid .recruitment-card .card-main-actions .guild-save { margin-left:auto; }
.recruitment-card .guild-save-status:empty { display:none; }
.site-frame .clan-grid[data-view="grid"] .recruitment-card-heading { flex-wrap:wrap; }
.site-frame .clan-grid[data-view="grid"] .card-trust { max-width:none; }
.site-frame #spotlight { margin-top:32px; }
@media(max-width:639px){
 .recruitment-card { --listing-avatar-size:54px; }
 .site-frame .clan-grid .recruitment-card { padding:16px; gap:12px; }
 .site-frame .recruitment-card-identity h3 { font-size:18px; }
 .recruitment-card-heading { flex-wrap:wrap; gap:8px 10px; }
 .card-trust { max-width:none; text-align:left; margin-left:calc(var(--listing-avatar-size) + 10px); margin-top:-6px; }
 .card-recruitment-details { padding:12px; }
 .card-opening { display:block; }
 .card-label { display:block; margin-bottom:2px; }
 .site-frame .clan-grid .recruitment-card .card-main-actions>* { padding:9px 10px; font-size:12px; }
 .site-frame .clan-grid .recruitment-card .card-main-actions .clan-card__view { flex:1; }
 .site-frame .clan-grid .recruitment-card .card-main-actions .guild-save { margin-left:0; }
 .site-frame .directory-hero { margin-bottom:0; padding-bottom:18px; }
 .site-frame .directory-hero .hero-listing-actions { margin-top:14px; }
 .site-frame .finder-intro-trigger { display:none; }
}
@media(prefers-reduced-motion:reduce){.card-more-actions{scroll-behavior:auto}}
@media(max-width:639px){
 .site-frame .clan-grid .recruitment-card .card-main-actions { display:grid; grid-template-columns:minmax(0,1fr) auto; }
 .site-frame .clan-grid .recruitment-card .card-main-actions .clan-card__view { grid-column:1 / -1; width:100%; }
 .site-frame .clan-grid .recruitment-card .card-main-actions .card-contact { grid-column:1; width:100%; }
 .site-frame .clan-grid .recruitment-card .card-main-actions .guild-save { grid-column:2; }
}
.card-match { border-top:1px solid #363a43; padding-top:9px; }
.card-match p { margin:0 0 5px; color:#accab6; font-size:12px; font-weight:600; }
.card-match ul { list-style:none; display:flex; flex-wrap:wrap; gap:4px 12px; padding:0; margin:0; }
.card-match li { color:#c0cec5; font-size:12px; }
.card-match li:before { content:'✓'; color:#9fc6ab; margin-right:5px; }
.joining-expectations { display:grid; gap:12px; margin:16px 0; }
.joining-expectations>div { display:grid; grid-template-columns:140px minmax(0,1fr); gap:12px; }
.joining-expectations dt { color:#b8b9c6; font-size:13px; }
.joining-expectations dd { margin:0; overflow-wrap:anywhere; }
.listing-preview-dialog { width:min(850px,calc(100% - 24px)); max-height:90dvh; overflow:auto; padding:24px; background:#22242e; color:#eeeef4; border:1px solid #555866; border-radius:12px; }
.listing-preview-dialog::backdrop { background:#080910cc; }
.listing-preview-dialog header { display:flex; justify-content:space-between; align-items:start; gap:16px; }
.listing-preview-dialog h2 { margin-top:0; }
.listing-preview-dialog .clan-card { margin-bottom:20px; }
.listing-preview-dialog [data-preview-tips]:not(:empty) { border:1px solid #5a513e; background:#312c22; border-radius:8px; padding:16px; margin:16px 0; }
.listing-preview-dialog [data-preview-tips] h3 { margin:0; }
.listing-preview-dialog .card-more { display:none; }
@media(max-width:639px){.joining-expectations>div{grid-template-columns:1fr;gap:3px}.listing-preview-dialog{padding:16px}}
.listing-preview-dialog header { position:static; min-height:0; height:auto; padding:0; margin:0 0 16px; background:none; border:0; box-shadow:none; }
.listing-preview-dialog header h2 { font-size:21px; color:#f0f0f4; }
@media(max-width:639px){
 .recruitment-card-identity { flex-basis:calc(100% - var(--listing-avatar-size) - 10px); }
 .card-trust { flex-basis:calc(100% - var(--listing-avatar-size) - 10px); }
}
.progression-evidence { margin:12px 0; padding:12px 14px; border:1px solid #414450; border-radius:6px; background:#ffffff04; }
.progression-evidence p { margin:0 0 5px; font-size:13px; line-height:1.6; }
.progression-evidence .progression-raid { color:#e4c186; font-size:12px; }
.progression-evidence--compact { padding:0; border:0; background:none; margin:0; }
.progression-source { display:inline-flex; align-items:center; min-height:32px; font-size:12px; }
.recruitment-response p { margin:0; color:#c1cec6; font-size:12px; line-height:1.7; }
.recruitment-activity .recruitment-response p+p { margin-top:10px; color:#b8b9c6; }
.official-roster-summary { display:flex; flex-wrap:wrap; gap:4px 10px; margin:0; font-size:12px; line-height:1.7; }
.official-roster-summary span { color:#b8b9c6; }
.official-roster .roster-table-scroll { max-width:100%; overflow-x:auto; margin-top:16px; border:1px solid #414450; border-radius:6px; }
.official-roster table { width:100%; border-collapse:collapse; min-width:420px; font-size:13px; }
.official-roster th,.official-roster td { padding:10px 12px; text-align:left; border-bottom:1px solid #3a3d48; }
.official-roster th { color:#e8e9ee; font-weight:600; }
.official-roster thead { background:#191b23; }
.official-roster td { color:#c4c7d3; }
.official-roster tbody tr:last-child>* { border-bottom:0; }
.official-roster .roster-table-scroll { max-height:480px; overflow:auto; scrollbar-gutter:stable; }
.official-roster thead { position:sticky; top:0; z-index:1; }
@media(max-width:639px){.official-roster .roster-table-scroll{max-height:420px}}

/* Align cards within each row while allowing full descriptions to expand. */
.site-frame .clan-grid[data-view="grid"] {
 grid-auto-rows:auto;
 align-items:stretch;
}
.site-frame .clan-grid[data-view="grid"] .clan-card { height:100%; }
.site-frame .clan-grid[data-view="grid"] .recruitment-card > * { flex-shrink:0; min-width:0; }
.site-frame .clan-grid[data-view="grid"] .recruitment-card-identity h3 {
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap;
}
.site-frame .clan-grid[data-view="grid"] :is(.recruitment-card-identity p,.card-opening strong,.card-schedule .local-schedule) {
 display:-webkit-box;
 -webkit-box-orient:vertical;
 -webkit-line-clamp:2;
 overflow:hidden;
 overflow-wrap:anywhere;
}
.site-frame .clan-grid[data-view="grid"] .card-opening { display:block; }
.site-frame .clan-grid[data-view="grid"] .card-label { display:block; margin-bottom:2px; }
.site-frame .clan-grid[data-view="grid"] .card-team {
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap;
}
/* Spotlight precedes the search panel in the document and on screen. */
.site-frame #spotlight { margin:0 0 24px; }

/* Compact list rows: introduction, practical details, then one action line. */
.card-content,.card-introduction,.card-bottom { display:contents; }
.recruitment-card .card-recruitment-details { order:1; }
.recruitment-card :is(.card-community,.official-roster-summary,.recruitment-response) { order:2; }
.recruitment-card .card-footer { order:3; }
.recruitment-card .card-main-actions { order:4; }
.recruitment-card .guild-save-status { order:5; }
.site-frame .clan-grid:not([data-view="grid"]) { gap:12px; }
.site-frame .clan-grid:not([data-view="grid"]) .recruitment-card { padding:16px 20px; gap:12px; height:auto; }
.site-frame .clan-grid:not([data-view="grid"]) .recruitment-card-heading { gap:10px; }
.site-frame .clan-grid:not([data-view="grid"]) .recruitment-card-identity h3 { font-size:18px; }
.site-frame .clan-grid:not([data-view="grid"]) .recruitment-card-identity p { margin-top:3px; }
.site-frame .clan-grid:not([data-view="grid"]) .clan-sigil { width:var(--listing-avatar-size); height:var(--listing-avatar-size); flex-basis:var(--listing-avatar-size); }
.site-frame .clan-grid:not([data-view="grid"]) .card-content { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr); gap:20px; align-items:start; }
.site-frame .clan-grid:not([data-view="grid"]) .card-introduction { display:flex; flex-direction:column; gap:8px; min-width:0; }
.site-frame .clan-grid:not([data-view="grid"]) .clan-card__summary { max-width:none; font-size:13px; line-height:1.7; }
.site-frame .clan-grid:not([data-view="grid"]) .card-description-full { max-width:none; font-size:13px; line-height:1.7; }
.site-frame .clan-grid:not([data-view="grid"]) .card-description-toggle { min-height:32px; margin:0; }
.site-frame .clan-grid:not([data-view="grid"]) .card-recruitment-details { min-width:0; padding:0 0 0 20px; border:0; border-left:1px solid #ffffff12; border-radius:0; background:none; gap:6px; }
.site-frame .clan-grid:not([data-view="grid"]) .card-opening { display:block; }
.site-frame .clan-grid:not([data-view="grid"]) .card-label { display:block; margin-bottom:2px; font-size:11px; }
.site-frame .clan-grid:not([data-view="grid"]) .card-opening strong { font-size:13px; font-weight:600; overflow-wrap:anywhere; }
.site-frame .clan-grid:not([data-view="grid"]) .card-schedule-meta { gap:8px; font-size:11px; }
.site-frame .clan-grid:not([data-view="grid"]) .card-bottom { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 16px; padding-top:10px; border-top:1px solid #ffffff0c; }
.site-frame .clan-grid:not([data-view="grid"]) .card-footer { flex:1 1 auto; justify-content:flex-start; gap:12px; margin:0; }
.site-frame .clan-grid:not([data-view="grid"]) .card-more summary { min-height:36px; padding:0 4px; font-size:11px; }
.site-frame .clan-grid:not([data-view="grid"]) .card-more-actions { left:0; right:auto; }
.site-frame .clan-grid:not([data-view="grid"]) .card-main-actions { width:auto; gap:6px; }
.site-frame .clan-grid:not([data-view="grid"]) .card-main-actions > * { min-height:36px; padding:6px 12px; font-size:12px; }
.site-frame .clan-grid:not([data-view="grid"]) .card-main-actions .guild-save { margin-left:0; }
.site-frame .clan-grid:not([data-view="grid"]) .guild-save-status { flex-basis:100%; }
@media(max-width:767px) {
 .site-frame .clan-grid:not([data-view="grid"]) .card-content { grid-template-columns:minmax(0,1fr); gap:10px; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-recruitment-details { padding:10px 0 0; border-left:0; border-top:1px solid #ffffff0c; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-opening { display:flex; gap:4px 8px; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-label { margin:0; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-opening strong { flex:1; min-width:0; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-bottom { gap:0 8px; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-footer { justify-content:space-between; flex-basis:100%; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-more-actions { left:auto; right:0; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-main-actions { display:flex; flex-wrap:nowrap; width:100%; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-main-actions > * { min-height:44px; padding:8px 10px; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-main-actions .clan-card__view { flex:1; width:auto; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-main-actions .card-contact { flex:1; width:auto; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-main-actions .guild-save { flex:0 0 auto; }
}
@media(max-width:639px) {
 .site-frame .clan-grid:not([data-view="grid"]) .recruitment-card { padding:14px; gap:10px; }
 .site-frame .clan-grid:not([data-view="grid"]) .recruitment-card-identity { flex-basis:calc(100% - var(--listing-avatar-size) - 10px); }
 .site-frame .clan-grid:not([data-view="grid"]) .card-trust { margin-left:calc(var(--listing-avatar-size) + 10px); flex-basis:calc(100% - var(--listing-avatar-size) - 10px); font-size:10px; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-description-toggle { min-height:36px; }
 .site-frame .clan-grid:not([data-view="grid"]) .card-main-actions > * { font-size:11px; }
}

/* Balance the directory introduction with the guide card on the right. */
.site-frame .directory-hero { display:grid; grid-template-columns:minmax(0,1fr) 310px; align-items:center; gap:40px; }
.site-frame .directory-hero .hero-copy { max-width:640px; min-width:0; }
.site-frame .directory-hero .hero-listing-actions { margin:18px 0 0; }
.site-frame .directory-hero .finder-intro-trigger { display:flex; align-items:center; width:100%; min-width:0; min-height:108px; margin:0; }
.directory-hero .finder-intro-trigger > img { flex:0 0 64px; width:64px; height:72px; padding:10px; border:0; background:none; }
.directory-hero .finder-intro-trigger > span { flex:1; min-width:0; gap:6px; padding:18px 4px 18px 6px; }
.directory-hero .finder-intro-trigger strong { font-size:15px; line-height:1.4; }
.directory-hero .finder-intro-trigger small { font-size:12px; line-height:1.5; }
.directory-hero .finder-intro-trigger > svg { flex:0 0 18px; width:18px; height:18px; margin:0 18px 0 12px; color:var(--gold); }
@media(max-width:899px) {
 .site-frame .directory-hero { grid-template-columns:minmax(0,1fr); gap:20px; }
 .site-frame .directory-hero .finder-intro-trigger { max-width:340px; min-height:84px; }
}
@media(max-width:639px) {
 .site-frame .directory-hero { gap:16px; }
 .site-frame .directory-hero .finder-intro-trigger { max-width:none; min-height:76px; }
 .directory-hero .finder-intro-trigger > img { flex-basis:56px; width:56px; height:64px; }
 .directory-hero .finder-intro-trigger > span { padding-block:14px; }
 .directory-hero .finder-intro-trigger strong { font-size:14px; }
 .directory-hero .finder-intro-trigger small { font-size:11px; }
}

/* Guild pace, faction and attendance are visible beside recruitment. */
.guild-fit-editor{padding:16px 0}.attendance-choice{align-items:flex-start;gap:10px}.attendance-choice>span{display:block}.attendance-choice .small{display:block;margin-top:4px;font-weight:400}.attendance-choice input{margin-top:4px;flex:none}.guild-fit-badges{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0}.guild-fit-badges:empty{display:none}.fit-badge{display:inline-flex;align-items:center;padding:4px 8px;border:1px solid #535766;border-radius:5px;font-size:12px;font-weight:600;line-height:1.45;color:#e2e4eb;background:#272b35}.fit-pace--casual,.fit-attendance{border-color:#477d65;color:#bce8cd}.fit-pace--balanced{border-color:#827148;color:#f4daa4}.fit-pace--progression{border-color:#87659e;color:#e1c6f0}.fit-faction--alliance{border-color:#4d739e;color:#b4d8ff}.fit-faction--horde{border-color:#a15d59;color:#ffbfba}.card-locations,.card-secondary-games{margin:5px 0 10px;color:#b8bfce;font-size:12px;line-height:1.5}.region-help{grid-column:1/-1;line-height:1.6;margin:10px 0}.guild-fit-editor .two-col{align-items:start}.additional-game-choices .small{line-height:1.6}@media(max-width:600px){.fit-badge{font-size:11px}.guild-fit-badges{gap:6px}.guild-fit-editor{padding:12px 0}}

.two-col:has(>[data-realm-field][hidden]){grid-template-columns:minmax(0,1fr)}

/* Saved listing messages are shown in full in list and grid views. */
.site-frame .home-spotlight .spotlight-winner-copy .spotlight-description,.site-frame .recruitment-card .card-spotlight-message,.site-frame .managed-profile-summary.has-spotlight-message{display:block;-webkit-line-clamp:unset;line-clamp:unset;overflow:visible;text-overflow:clip;white-space:normal;max-height:none;overflow-wrap:anywhere;word-break:normal}
.site-frame .recruitment-card .card-spotlight-message{margin:10px 0 4px;color:#e5d1a4;font-size:14px;line-height:1.7;font-weight:500}
@media(max-width:600px){.site-frame .recruitment-card .card-spotlight-message{font-size:13px}}

/* Keep off-screen guild cards crawlable while avoiding unnecessary layout/paint. */
#guild-listings > .clan-card { content-visibility:auto; contain-intrinsic-size:auto 480px; }
.site-frame .home-spotlight .bump-board-title h3 a { display:inline-flex; align-items:center; min-height:24px; }

/* Keep community support visible beside every recruitment listing. */
.site-frame .guild-support { min-width:0; max-width:100%; }
.site-frame .clan-grid .guild-support { display:grid; gap:3px; padding-top:12px; border-top:1px solid #3c3f4b; }
.site-frame .guild-support .community-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; width:auto; padding:0; margin:0; border:0; background:none; box-shadow:none; }
.site-frame .guild-support .community-action { display:inline-flex; flex-direction:row; align-items:center; justify-content:center; gap:7px; min-height:44px; width:auto; padding:8px 12px; border:1px solid #4a4e5c; border-radius:6px; background:#252832; color:#d8dae4; font-size:12px; line-height:1.4; }
.site-frame .guild-support .community-action:hover:not(:disabled) { border-color:#b29869; background:#302e2c; color:#ffe0a7; }
.site-frame .guild-support .community-action[aria-pressed=true] { border-color:#a98b53; background:#3b3225; color:#ffdb9e; }
.site-frame .guild-support .community-action[aria-pressed=true] svg { color:#f3cb87; }
.site-frame .guild-support .community-action:disabled { opacity:.6; cursor:default; }
.site-frame .guild-support .community-action svg { width:15px; height:15px; flex-shrink:0; }
.site-frame .guild-support .community-action strong { min-width:20px; padding:2px 5px; border-radius:4px; background:#ffffff0c; color:inherit; font-size:11px; text-align:center; }
.site-frame .recommendation-summary { display:block; min-width:0; margin:0; color:#adb4c5; font-size:12px; line-height:1.6; text-align:left; }
.site-frame .recommendation-summary>span { display:block; padding:8px 0; }
.site-frame .recommendation-summary button { display:inline-flex; align-items:center; gap:7px; min-height:44px; max-width:100%; margin:0; padding:6px 0; border:0; border-radius:3px; background:none; box-shadow:none; color:#bdc4d4; font-size:12px; font-weight:400; line-height:1.6; text-align:left; }
.site-frame .recommendation-summary button span { min-width:0; overflow-wrap:anywhere; }
.site-frame .recommendation-summary button svg { width:14px; height:14px; flex-shrink:0; }
.site-frame .recommendation-summary button:hover { color:#ffdc9e; text-decoration:none; }
.site-frame .guild-support :is(button,a):focus-visible { outline:2px solid #f0c788; outline-offset:3px; }
.site-frame .support-status { margin:3px 0 6px; max-width:60ch; font-size:12px; line-height:1.6; color:#f0cd96; overflow-wrap:anywhere; }
.site-frame .support-status:empty { display:none; }
.site-frame .managed-profile-support { flex:0 1 370px; }
.recommendations-dialog { width:min(460px,calc(100% - 32px)); max-height:85dvh; padding:22px; box-sizing:border-box; overflow:auto; border:1px solid #555969; border-radius:12px; background:#22252e; color:#eeeef4; box-shadow:0 24px 80px #0009; }
.recommendations-dialog::backdrop { background:#080910cc; }
.recommendations-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.recommendations-heading h2 { margin:0; font-size:19px; }
.recommendations-heading button { display:flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; padding:8px; }
.recommendations-heading svg { width:18px; height:18px; }
#guild-recommendations-description { margin:10px 0 18px; color:#bec4d1; font-size:13px; line-height:1.7; overflow-wrap:anywhere; }
.recommendation-people { list-style:none; display:grid; gap:8px; margin:0; padding:0; }
.recommendation-person { display:flex; align-items:center; gap:12px; padding:12px; border:1px solid #414654; border-radius:7px; background:#1b1e26; color:#e0e3ec; }
.recommendation-person:hover { border-color:#aa8d5a; background:#292a30; }
.recommendation-person-avatar { position:relative; display:grid; place-items:center; flex:0 0 40px; width:40px; height:40px; border:1px solid #555969; border-radius:50%; background:#36313a; color:#edc582; overflow:hidden; }
.recommendation-person-avatar img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.recommendation-person-copy { display:grid; min-width:0; gap:4px; overflow-wrap:anywhere; }
.recommendation-person-copy strong { font-size:13px; }
.recommendation-person-copy time { font-size:11px; color:#b8bdcd; }
[data-recommendations-status] { font-size:13px; line-height:1.6; color:#e9c58b; }
[data-recommendations-status]:empty { display:none; }
[data-recommendations-more] { width:100%; min-height:44px; margin-top:14px; }
html:has(#guild-recommendations-dialog[open]) { overflow:hidden; }
@media(max-width:639px){
 .site-frame .managed-profile-support { flex-basis:auto; }
 .site-frame .guild-support .community-actions { gap:6px; }
 .site-frame .guild-support .community-action { padding:8px 9px; gap:5px; }
 .recommendations-dialog { padding:16px; }
}
.site-frame .clan-grid:not([data-view="grid"]) .guild-support { border-top:0; padding-top:0; }
.recommendation-people { max-height:55dvh; overflow:auto; overscroll-behavior:contain; }
@media(max-width:639px){
 .site-frame .clan-grid .recruitment-card .card-main-actions { display:grid; grid-template-columns:minmax(0,1fr) auto; width:100%; }
 .site-frame .clan-grid .recruitment-card .card-main-actions .clan-card__view { grid-column:1 / -1; width:100%; flex:none; }
 .site-frame .clan-grid .recruitment-card .card-main-actions .card-contact { grid-column:1; width:100%; flex:none; }
 .site-frame .clan-grid .recruitment-card .card-main-actions .guild-save { grid-column:2; margin-left:0; flex:none; }
}
.site-frame .guild-support .guild-bump svg { transform:rotate(-90deg); }

/* Compact directory headers pair guild identity with support at the top right. */
.site-frame .clan-grid .recruitment-card .recruitment-card-heading { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:16px; }
.site-frame .clan-grid .recruitment-card-title { display:flex; align-items:flex-start; gap:10px; min-width:0; }
.site-frame .clan-grid .recruitment-card-title .clan-sigil { flex-shrink:0; }
.site-frame .clan-grid .recruitment-card-title .recruitment-card-identity { min-width:0; flex:1; }
.site-frame .clan-grid .recruitment-card-name { display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 10px; min-width:0; }
.site-frame .clan-grid .recruitment-card-name h3 { min-width:0; margin:0; overflow-wrap:anywhere; }
.site-frame .clan-grid .recruitment-card-name .card-trust { flex-basis:auto; max-width:100%; margin:0; text-align:left; }
.site-frame .clan-grid .recruitment-card-heading .guild-support { align-self:start; justify-self:end; width:fit-content; max-width:320px; margin:0; padding:0; border:0; order:0; }
.site-frame .clan-grid .recruitment-card-heading .community-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; width:auto; }
.site-frame .clan-grid .recruitment-card-heading .community-action { display:inline-flex; flex:0 0 auto; flex-wrap:nowrap; align-items:center; justify-content:center; width:auto; min-width:0; min-height:40px; height:auto; padding:7px 10px; gap:6px; border-radius:6px; font-weight:600; line-height:18px; }
.site-frame .clan-grid .recruitment-card-heading [data-vote-label] { order:0; flex-basis:auto; text-align:center; white-space:nowrap; }
.site-frame .clan-grid .recruitment-card-heading .recommendation-summary { margin-top:0; text-align:left; }
.site-frame .clan-grid .recruitment-card-heading .recommendation-summary button { justify-content:flex-start; min-height:32px; padding:8px 2px 2px; text-align:left; }
.site-frame .clan-grid .recruitment-card-heading .recommendation-summary>span { padding:4px 0 0; }
.site-frame .clan-grid .recruitment-card-heading .support-status { margin:4px 0 0; text-align:right; }
.site-frame .clan-grid[data-view="grid"] .recruitment-card-heading { grid-template-columns:minmax(0,1fr); }
.site-frame .clan-grid[data-view="grid"] .recruitment-card-heading .guild-support { max-width:280px; }
@media(max-width:767px){
 .site-frame .clan-grid .recruitment-card .recruitment-card-heading { grid-template-columns:minmax(0,1fr); gap:12px; }
 .site-frame .clan-grid .recruitment-card-heading .guild-support { max-width:100%; }
 .site-frame .clan-grid .recruitment-card-heading .recommendation-summary button { min-height:44px; }
}

/* Match the OSRS recommendation row: player name, quiet count and chevron. */
.site-frame .recommendation-summary:empty { display:none; }
.site-frame .recommendation-summary button { width:100%; border:0; border-radius:4px; gap:7px; font-size:11px; font-weight:400; }
.site-frame .recommendation-summary-copy { flex:1; min-width:0; overflow-wrap:anywhere; }
.site-frame .recommendation-summary-name { color:#d6dcd9; font-weight:600; }
.site-frame .recommendation-summary-count { color:#bec7c3; }
.site-frame .recommendation-summary button>svg { color:#9a9e90; }
.site-frame .recommendation-summary button>svg:last-child { width:13px; height:13px; }
.site-frame .recommendation-summary button:hover { color:#d6dcd9; text-decoration:none; }
.site-frame .recommendation-summary button:hover .recommendation-summary-name { color:#ffc267; }
@media(max-width:639px){
 .site-frame .recommendation-summary button { font-size:12px; }
}

.site-frame .clan-grid .recruitment-card-heading .community-action strong { max-width:100%; padding:1px 3px; font-size:12px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.site-frame .recommendation-summary button>svg { fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
@media(max-width:639px){
 .site-frame .managed-profile-actions:has(>.guild-interest-button:first-child)>.guild-interest-button { grid-column:1 / -1; }
 .site-frame .managed-profile-actions:has(>.guild-interest-button:first-child)>.text-action { grid-column:auto; }
}

/* Recruiting details and contact actions share one aligned panel. */
.site-frame .clan-grid:not([data-view="grid"]) .recruitment-card .card-content { grid-template-columns:minmax(0,1.7fr) minmax(340px,1fr); grid-template-rows:auto; align-items:stretch; gap:20px; }
.site-frame .clan-grid:not([data-view="grid"]) .recruitment-card .card-introduction { grid-column:1; grid-row:1; }
.site-frame .clan-grid .recruitment-card .card-recruitment-details { display:flex; flex-direction:column; align-items:stretch; gap:7px; min-width:0; padding:12px; border:1px solid #ffffff10; border-radius:8px; background:#13151b40; }
.site-frame .clan-grid:not([data-view="grid"]) .recruitment-card .card-recruitment-details { grid-column:2; grid-row:1; align-self:stretch; }
.site-frame .clan-grid .recruitment-card .card-recruitment-details>.card-main-actions { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) auto; align-items:stretch; width:100%; min-width:0; margin: auto 0 0; padding-top:10px; gap:6px; }
.site-frame .clan-grid .recruitment-card .card-recruitment-details>.card-main-actions>* { display:inline-flex; align-items:center; justify-content:center; min-width:0; width:100%; min-height:40px; height:100%; margin:0; padding:7px 9px; font-size:12px; line-height:18px; white-space:nowrap; border-radius:6px; box-shadow:none; }
.site-frame .clan-grid .recruitment-card .card-recruitment-details>.card-main-actions .clan-card__view { grid-column:1; }
.site-frame .clan-grid .recruitment-card .card-recruitment-details>.card-main-actions .card-contact { grid-column:2; }
.site-frame .clan-grid .recruitment-card .card-recruitment-details>.card-main-actions .guild-save { grid-column:3; }
.site-frame .clan-grid .card-recruitment-details .guild-save-status { margin:0; font-size:12px; line-height:1.5; }
.site-frame .clan-grid[data-view="grid"] .recruitment-card .card-content { display:flex; flex-direction:column; flex:1; min-width:0; gap:12px; }
.site-frame .clan-grid[data-view="grid"] .recruitment-card .card-introduction { display:flex; flex-direction:column; min-width:0; gap:8px; }
.site-frame .clan-grid[data-view="grid"] .recruitment-card .card-recruitment-details { flex:1; }
.site-frame .site-header a.header-discord-icon { width:40px; min-height:40px; padding:9px; text-align:center; }
.site-header .header-discord-icon svg { display:block; width:22px; height:22px; margin:auto; fill:currentColor; stroke:none; }
@media(max-width:767px){
 .site-frame .clan-grid:not([data-view="grid"]) .recruitment-card .card-content { grid-template-columns:minmax(0,1fr); gap:12px; }
 .site-frame .clan-grid:not([data-view="grid"]) .recruitment-card .card-content>:is(.card-introduction,.card-recruitment-details) { grid-column:1; grid-row:auto; }
}
@media(max-width:639px){
 .site-frame .clan-grid .recruitment-card .card-recruitment-details>.card-main-actions { grid-template-columns:minmax(0,1fr) auto; }
 .site-frame .clan-grid .recruitment-card .card-recruitment-details>.card-main-actions>* { min-height:44px; }
 .site-frame .clan-grid .recruitment-card .card-recruitment-details>.card-main-actions .clan-card__view { grid-column:1 / -1; }
 .site-frame .clan-grid .recruitment-card .card-recruitment-details>.card-main-actions .card-contact { grid-column:1; }
 .site-frame .clan-grid .recruitment-card .card-recruitment-details>.card-main-actions .guild-save { grid-column:2; }
}

/* Quiet, content-sized controls and one compact line of guild context. */
.site-frame .guild-support .community-action { box-shadow:none; background:#ffffff05; border-color:#454a57; font-weight:600; }
.site-frame .guild-support .community-action[aria-pressed=true] { background:#3b3225; border-color:#a98b53; }
.site-frame .clan-grid .clan-card { border-color:#3d424e; border-radius:10px; box-shadow:0 2px 8px #0002; }
.site-frame .clan-grid .recruitment-card>.card-spotlight-message { margin:0; color:#d7c5a5; font-size:13px; font-weight:400; line-height:1.65; }
.site-frame .clan-grid .recruitment-card .card-secondary-games { margin:0; }
.site-frame .clan-grid .recruitment-card .card-context { display:flex; align-items:center; flex-wrap:wrap; gap:6px 12px; min-width:0; }
.site-frame .clan-grid .card-context .guild-fit-badges { margin:0; gap:6px; }
.site-frame .clan-grid .card-context .fit-badge { padding:3px 7px; font-size:11px; font-weight:500; }
.site-frame .clan-grid .card-context .card-locations { margin:0; color:#aeb7c7; font-size:11px; line-height:1.6; }
.site-frame .clan-grid .recruitment-card-name h3 { line-height:1.35; font-weight:650; }
.site-frame .clan-grid .recruitment-card .card-main-actions>* { box-shadow:none; border-radius:6px; }
@media(pointer:coarse),(max-width:767px){
 .site-frame .clan-grid .recruitment-card-heading .community-action { min-height:44px; }
}
@media(max-width:374px){
 .site-frame .clan-grid .recruitment-card-heading .community-action { padding-inline:8px; gap:5px; }
}

/* Recruit Me uses each listing owner's public avatar, with initials underneath. */
.site-frame :is(.recruit-avatar,.player-profile-monogram) { position:relative; overflow:hidden; isolation:isolate; }
.site-frame :is(.recruit-avatar,.player-profile-monogram) .player-avatar-initial { display:grid; place-items:center; width:100%; height:100%; }
.site-frame :is(.recruit-avatar,.player-profile-monogram)>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:inherit; }

/* A filled red heart makes the guild recommendation action easy to recognise. */
.site-frame :is(.guild-support,.engagement-controls) [data-engage="recommend"] svg { color:#e96b7c; fill:#e96b7c; stroke:#e96b7c; }
.site-frame :is(.guild-support,.engagement-controls) [data-engage="recommend"]:is(:hover,[aria-pressed="true"]) svg { color:#f28492; fill:#f28492; stroke:#f28492; }

/* Activity names remain readable; distinct glyphs make playstyles quicker to scan. */
.site-frame .activity-icon { width:17px; height:17px; flex:0 0 17px; color:#d9bf83; vertical-align:-3px; }
.site-frame :is(.card-community li.activity-badge,.recruitment-tags > .activity-badge) { display:inline-flex; align-items:center; gap:6px; padding:4px 8px; color:#e3e1dc; font-size:12px; font-weight:500; line-height:1.4; border:1px solid #d6bd7d22; border-radius:5px; background:#d6bd7d08; }
.site-frame .recruitment-tags > .activity-badge::before { display:none; }
.site-frame .activity-choices .choices { display:flex; flex-wrap:wrap; gap:8px; }
.site-frame .activity-choices .choices > label { display:inline-flex; align-items:center; gap:7px; min-height:40px; margin:0; padding:8px 11px; border:1px solid var(--frame-edge); border-radius:6px; background:#ffffff03; color:#d5d4dc; font-size:13px; font-weight:500; cursor:pointer; transition:border-color .15s,background .15s; }
.site-frame .activity-choices .choices > label:hover { border-color:#d9bf8370; background:#d9bf830a; }
.site-frame .activity-choices .choices > label:has(input:checked) { border-color:#d9bf8390; background:#d9bf8312; color:#f0e4c9; }
.site-frame .activity-choices .choices > label:focus-within { outline:2px solid #d9bf83; outline-offset:3px; }
.site-frame .activity-choices input { margin:0; flex:0 0 auto; accent-color:#d9bf83; }
.site-frame .dropdown-option .activity-label { display:inline-flex; align-items:center; gap:8px; }
.site-frame .dropdown-value.activity-label > .activity-icon { margin-right:8px; }
.site-frame .managed-stat-icon > .activity-icon { width:22px; height:22px; }
@media(max-width:600px) { .site-frame .activity-choices .choices > label { min-height:44px; } }

/* Shared Lucide vocabulary for spotlight, guild metadata and filtering. */
.site-frame .listing-icon { width:16px; height:16px; flex:0 0 16px; color:#d9bf83; vertical-align:-3px; }
.site-frame .activity-icon { width:17px; height:17px; flex-basis:17px; }
.site-frame :is(.listing-meta-item,.listing-inline-label) { display:inline-flex; align-items:center; gap:5px; min-width:0; max-width:100%; vertical-align:middle; }
.site-frame .listing-meta { display:flex; flex-wrap:wrap; gap:4px 10px; line-height:1.6; }
.site-frame .listing-meta-item { overflow-wrap:anywhere; }
.site-frame .listing-meta-item .listing-icon { width:14px; height:14px; flex-basis:14px; color:#c4b587; }
.site-frame .home-spotlight .spotlight-playstyles > .activity-badge { display:inline-flex; align-items:center; gap:6px; padding:4px 8px; color:#e3e1dc; font-size:12px; font-weight:500; line-height:1.4; border:1px solid #d6bd7d22; border-radius:5px; background:#d6bd7d08; }
.site-frame .home-spotlight .spotlight-playstyles > .activity-badge::before,
.site-frame .recruitment-tags > .listing-icon-badge::before { display:none; }
.site-frame .home-spotlight .spotlight-winner-meta { gap:6px 10px; }
.site-frame .home-spotlight .spotlight-winner-meta > .listing-meta-item { padding:3px 6px; font-size:11px; line-height:1.5; }
.site-frame .recruitment-tags > .listing-icon-badge { gap:6px; }
.site-frame .dropdown-option .listing-label { display:inline-flex; align-items:center; gap:8px; }
.site-frame .dropdown-value.listing-label > .listing-icon { margin-right:8px; }
.site-frame label > .listing-icon { width:14px; height:14px; margin-right:5px; }
/* Keep the recruiting label above its values in every card view. */
.site-frame .clan-grid .recruitment-card .card-opening { display:grid; grid-template-columns:minmax(0,1fr); align-items:start; gap:5px; min-width:0; }
.site-frame .clan-grid .recruitment-card .card-opening .card-label { display:inline-flex; align-items:center; justify-self:start; gap:5px; margin:0; font-size:11px; font-weight:500; line-height:1.5; }
.site-frame .clan-grid .recruitment-card .card-opening > strong { display:block; min-width:0; font-size:13px; font-weight:600; line-height:1.6; overflow-wrap:anywhere; }
.site-frame .card-label .listing-icon { width:14px; height:14px; flex-basis:14px; }
.site-frame .card-locations > .listing-icon { width:13px; height:13px; margin-right:4px; }
.site-frame :is(.managed-profile-meta dd,.recruitment-status) > .listing-icon { width:14px; height:14px; margin-right:8px; }
.site-frame .managed-stat-icon > .listing-icon { width:22px; height:22px; }
.site-frame .recruit-kicker > .listing-icon { width:14px; height:14px; margin-right:5px; }
.site-frame .player-profile-facts dd > .listing-icon { margin-right:5px; }

/* Give each icon a reliable text gutter, including the details below avatars. */
.site-frame :is(.activity-badge,.listing-icon-badge,.listing-meta-item,.recruitment-status),
.site-frame .recruitment-card .card-opening .card-label,
.site-frame .managed-profile-meta dd { column-gap:0; }
.site-frame :is(.activity-badge,.listing-icon-badge,.listing-meta-item,.recruitment-status) > .listing-icon,
.site-frame .recruitment-card .card-label > .listing-icon,
.site-frame .managed-profile-meta dd > .listing-icon { margin-inline:0 8px; }
.site-frame :is(.activity-badge,.listing-icon-badge,.listing-meta-item) > .listing-icon { display:block; align-self:center; }
.site-frame .clan-grid .card-community > li.activity-badge,
.site-frame .recruitment-tags > .activity-badge,
.site-frame .community-activity-tags > li.activity-badge,
.site-frame .home-spotlight .spotlight-playstyles > .activity-badge { min-height:28px; padding:4px 9px; border-radius:6px; column-gap:0; line-height:1.5; box-shadow:none; }
.site-frame .clan-grid .card-community,
.site-frame .recruitment-tags,
.site-frame .home-spotlight .spotlight-playstyles { gap:7px; align-items:center; }
.site-frame .home-spotlight .spotlight-community-tags { gap:7px; margin-top:7px; }
.site-frame .home-spotlight .spotlight-community-tags > span { display:inline-flex; align-items:center; min-height:28px; padding:4px 9px; border:1px solid #ffffff14; border-radius:6px; background:#ffffff04; box-shadow:none; font-size:11px; line-height:1.5; }
.site-frame .home-spotlight .spotlight-winner-meta { align-items:center; gap:7px; margin-top:18px; padding-top:14px; }
.site-frame .home-spotlight .spotlight-winner-meta > span,
.site-frame .recruitment-card-identity .listing-meta-item,
.site-frame .community-activity-facts > .listing-meta-item { display:inline-flex; align-items:center; min-height:26px; padding:4px 8px; border:1px solid #ffffff14; border-radius:5px; background:#17192080; box-shadow:none; color:#c9cad3; font-size:11px; line-height:1.5; }
.site-frame .clan-grid .recruitment-card-identity .listing-meta { margin-top:7px; gap:6px; }
.site-frame .managed-profile-meta > div { align-items:center; gap:8px; padding:6px 9px; }
.site-frame .managed-profile-meta dd { display:inline-flex; align-items:center; line-height:1.55; }
.site-frame .managed-profile-meta dd > .listing-icon { display:block; flex-shrink:0; }
.site-frame .community-activity-facts { gap:7px; margin-top:12px; color:#c9cad3; }
.site-frame .community-activity-tags { margin-top:10px; gap:7px; }
.site-frame .community-activity-tags > li.activity-badge { display:inline-flex; align-items:center; border:1px solid #d6bd7d22; background:#d6bd7d08; color:#e3e1dc; font-size:12px; font-weight:500; }
.site-frame .community-links a { display:inline-flex; align-items:center; gap:8px; min-height:36px; }
.site-frame .community-links a svg { width:16px; height:16px; }
@media(max-width:639px) {
 .site-frame .community-activity-heading { padding:16px 16px 10px; }
 .site-frame .community-activity-body { padding-inline:16px; }
 .site-frame .managed-profile-meta > div { padding:5px 8px; }
}
.site-frame .activity-badge > .listing-icon { width:16px; height:16px; flex-basis:16px; }
/* These selectors also override the older spotlight and profile badge gutters. */
.site-frame .listing-meta > .listing-meta-item,
.site-frame .home-spotlight .spotlight-winner-meta > .listing-meta-item,
.site-frame .community-activity-facts > .listing-meta-item,
.site-frame .recruitment-tags > span.activity-badge,
.site-frame .recruitment-tags > .listing-icon-badge,
.site-frame .recruitment-status { column-gap:0; }

/* Treat community search as one control, with focus on its shared boundary. */
.site-frame .feed-toolbar .feed-search { border:1px solid #454a57; border-radius:7px; background:#191c25; box-shadow:none; overflow:hidden; transition:border-color .15s,box-shadow .15s; }
.site-frame .feed-toolbar .feed-search:focus-within { border-color:#c8ab75; box-shadow:inset 0 0 0 1px #c8ab75; }
.site-frame .feed-toolbar .feed-search > input[type="search"],
.site-frame .feed-toolbar .feed-search > input[type="search"]:focus,
.site-frame .feed-toolbar .feed-search > input[type="search"]:focus-visible { appearance:none; -webkit-appearance:none; min-height:44px; margin:0; padding:10px 12px; border:0; border-radius:0; outline:none; outline-offset:0; box-shadow:none; color:#dedee6; font-size:13px; line-height:1.5; }
.site-frame .feed-toolbar .feed-search > input::placeholder { color:#aeb3c1; opacity:1; }
.site-frame .feed-toolbar .feed-search > button[type="submit"] { flex:0 0 44px; min-width:44px; min-height:44px; padding:0; border:0; border-left:1px solid #383d49; border-radius:0; outline:none; background:transparent; box-shadow:none; color:#bdc3d1; }
.site-frame .feed-toolbar .feed-search > button[type="submit"]:hover { background:#ffffff08; color:#efd098; box-shadow:none; }
.site-frame .feed-toolbar .feed-search > button[type="submit"]:focus-visible { outline:2px solid #c8ab75; outline-offset:-5px; background:#ffffff08; color:#efd098; box-shadow:none; }
@media(max-width:600px) { .site-frame .feed-toolbar .feed-search > input[type="search"] { font-size:16px; } }
@media(forced-colors:active) { .site-frame .feed-toolbar .feed-search:focus-within { outline:2px solid Highlight; outline-offset:2px; } }


/* Resources use the shared content width with readable columns. */
.resources-page { width:100%; max-width:none; min-width:0; }
.resources-intro { margin:0 0 24px; padding:18px 22px; border:1px solid #41434f; border-left:3px solid var(--accent); border-radius:8px; background:rgba(35,37,47,.65); }
.resources-intro p { max-width:100ch; margin:0; color:var(--muted,#b8b9c5); font-size:14px; line-height:1.8; }
.resources-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; align-items:stretch; }
.resources-page .resources-section { min-width:0; padding:26px; margin:0; }
.resources-page .resources-side { min-width:0; padding:0; margin:0; }
.resources-page .resources-section-nested { padding:26px; }
.resources-section-nested + .resources-section-nested { border-top:1px solid rgba(255,255,255,.09); }
.resources-section-heading { display:flex; align-items:flex-start; gap:12px; margin-bottom:22px; }
.resources-section-icon { display:flex; align-items:center; justify-content:center; width:36px; height:36px; flex:0 0 36px; border:1px solid rgba(237,197,130,.2); border-radius:9px; color:var(--accent); background:rgba(237,197,130,.06); }
.resources-section-icon svg { width:18px; height:18px; }
.resources-page .resources-section h2 { margin:3px 0 0; font-size:18px; line-height:1.45; font-weight:800; letter-spacing:-.2px; }
.resources-page .resources-list { list-style:none; padding:0; margin:0; }
.resources-list > li { margin:0; padding:0; }
.resources-list > li + li { margin-top:20px; padding-top:20px; border-top:1px solid rgba(255,255,255,.08); }
.resources-page .resources-list h3 { margin:0 0 7px; font-size:15px; line-height:1.5; font-weight:800; }
.resources-page .resources-section p { margin:0 0 16px; color:var(--muted,#b8b9c5); font-size:14px; line-height:1.8; }
.resources-page .resources-list li p, .resources-page .resources-section > p:last-child { margin-bottom:0; }
.resources-page .resources-list + p { margin-top:22px; padding-top:18px; border-top:1px solid rgba(255,255,255,.08); }
.resources-page a { text-underline-offset:3px; }
.resources-page a:focus-visible { outline:2px solid var(--accent); outline-offset:4px; border-radius:2px; }
.resources-checklist { margin:0; padding-left:22px; }
.resources-checklist li { margin:0; padding-left:4px; color:var(--muted,#b8b9c5); font-size:14px; line-height:1.8; }
.resources-checklist li + li { margin-top:12px; }
.resources-checklist li::marker { color:var(--accent); font-weight:800; }
.resources-footer { margin-top:24px; padding:20px 0 0; border-top:1px solid rgba(255,255,255,.1); }
.resources-footer p { margin:0 0 8px; }
.resources-footer .small { max-width:100ch; margin-bottom:0; }
@media(max-width:760px) {
 .resources-grid { grid-template-columns:minmax(0,1fr); gap:16px; }
 .resources-intro { padding:16px 18px; margin-bottom:18px; }
 .resources-page .resources-section, .resources-page .resources-section-nested { padding:21px; }
 .resources-section-heading { margin-bottom:18px; }
}
@media(max-width:360px) {
 .resources-page .resources-section, .resources-page .resources-section-nested { padding:18px; }
 .resources-section-heading { gap:10px; }
 .resources-section-icon { width:32px; height:32px; flex-basis:32px; }
 .resources-page .resources-section h2 { font-size:17px; }
}

.resources-page .resources-section-heading { background:none; border:0; box-shadow:none; padding:0; position:static; }