/* Shared forum shell and palette remain authoritative. Only faction content is styled. */
.sf23{--sf-bg:var(--ui-canvas,var(--srp-paper));--sf-panel:var(--ui-panel,var(--srp-surface));--sf-line:var(--ui-border,var(--srp-line));--sf-text:var(--ui-text,var(--srp-ink));--sf-muted:var(--ui-muted,var(--srp-muted));--sf-gold:var(--ui-gold,var(--srp-accent));--sf-input:var(--ui-raised,var(--srp-surface));}
.sf23 { max-width: none; margin: 0px; padding: 0px 0px 24px; color: var(--sf-text); font: 14px / 1.5 Arial, "Segoe UI", sans-serif; }
.sf23 * { box-sizing: border-box; }
.sf23 a { color: inherit; }
.sf23 h1, .sf23 h2, .sf23 h3 { font-family: Arial, "Segoe UI", sans-serif !important; text-shadow: none !important; letter-spacing: 0px !important; }
.sf23 p { color: var(--sf-muted); margin: 5px 0px 0px; }
.sf23-icon { display: inline-block; width: 18px; height: 18px; flex: 0 0 18px; vertical-align: middle; }
.sf23-heading { display: flex; align-items: center; gap: 20px; padding: 0px; margin: 0px 0px 20px; }
.sf23-heading > div { flex: 1 1 0%; min-width: 180px; }
.sf23-heading p { font-size: 14px; white-space: nowrap; }
.sf23-directory-search { display: flex; align-items: center; gap: 5px; margin: 0px !important; }
.sf23-directory-search label { display: flex; gap: 8px; align-items: center; width: 210px; border: 1px solid var(--sf-line); border-radius: 5px; background: var(--sf-input); padding: 7px 10px; color: var(--sf-muted); }
.sf23-directory-search input { outline-offset: 6px; min-width: 0px !important; width: 100% !important; padding: 0px !important; margin: 0px !important; border: 0px !important; background: transparent !important; color: var(--sf-text) !important; box-shadow: none !important; font: 12px Arial, sans-serif !important; }
.sf23-search-submit { font: 12px Arial, sans-serif; border: 0px; background: none; color: var(--sf-gold); cursor: pointer; padding: 6px; }
.sf23-filters { display: flex; gap: 8px; flex-shrink: 0; }
.sf23-filters a { padding: 8px 12px; border: 1px solid var(--sf-line); border-radius: 5px; text-decoration: none; font-size: 11px; white-space: nowrap; color: var(--sf-text); }
.sf23-filters a[aria-current="page"] { background: linear-gradient(rgb(217, 170, 77), rgb(229, 182, 74)); border-color: rgb(217, 170, 77); color: rgb(33, 29, 19); box-shadow: rgba(255, 255, 255, 0.2) 0px 1px inset; }
.sf23-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 16px; }
.sf23-card { min-width: 0px; border: 1px solid var(--sf-line); background: var(--sf-panel); border-radius: 7px; overflow: hidden; }
.sf23-card-cover { display: block; position: relative; aspect-ratio: 300 / 126; overflow: hidden; background: rgb(36, 40, 45); }
.sf23-art, .sf23-photo { position: absolute; inset: 0px; display: block; width: 100%; height: 100%; object-fit: cover; }
.sf23-art { background-image: url("faction-reference-v23-1.png"); background-size: 341.333% 1219.05%; background-repeat: no-repeat; }
.sf23-scene--police { background-position: 6.62983% 15.0355%; }
.sf23-scene--medical { background-position: 50.1381% 15.0355%; }
.sf23-scene--mob { background-position: 93.6464% 15.0355%; }
.sf23-scene--family { background-position: 6.62983% 32.3404%; }
.sf23-scene--gang { background-position: 50.1381% 32.3404%; }
.sf23-scene--news { background-position: 93.6464% 32.3404%; }
.sf23-card-body { padding: 11px 15px 10px; }
.sf23-card h2 a { text-decoration: none; }
.sf23-card h2 { overflow-wrap: anywhere; min-height: 22px; }
.sf23-card-meta { display: flex; align-items: center; gap: 22px; margin: 8px 0px 9px; min-height: 27px; flex-wrap: wrap; }
.sf23-pill { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--sf-line); border-radius: 4px; padding: 3px 8px; font-size: 12px; line-height: 1.4; white-space: nowrap; }
.sf23-pill .sf23-icon { width: 16px; height: 16px; flex-basis: 16px; }
.sf23-pill--government { color: rgb(159, 201, 248); background: rgb(33, 51, 76); border-color: rgb(53, 86, 120); }
.sf23-pill--official { color: rgb(243, 194, 80); background: rgb(60, 48, 23); border-color: rgb(139, 103, 37); }
.sf23-pill--unofficial { color: rgb(208, 213, 218); background: rgb(36, 41, 47); border-color: rgb(80, 88, 96); }
.sf23-pill--official .sf23-icon { border-radius: 50%; background: rgb(232, 178, 59); color: rgb(32, 27, 18); padding: 2px; }
.sf23-pill--unofficial .sf23-icon { border: 1px solid currentcolor; border-radius: 50%; padding: 2px; }
.sf23-card-count { display: flex; align-items: center; gap: 7px; color: var(--sf-muted); font-size: 12px; }
.sf23-card-count .sf23-icon { color: rgb(145, 151, 158); width: 16px; height: 16px; }
.sf23-link { display: flex; align-items: center; gap: 6px; border-top: 1px solid var(--sf-line); padding: 9px 0px 0px; font-size: 12px; text-decoration: none; color: var(--sf-gold) !important; }
.sf23-link .sf23-icon { width: 16px; height: 16px; }
.sf23-hero { position: relative; min-height: 232px; overflow: hidden; border-radius: 7px; background: rgb(33, 35, 38); }
.sf23-hero::after { content: ""; position: absolute; inset: 0px; background: linear-gradient(90deg, rgba(8, 11, 14, 0.9) 0%, rgba(8, 11, 14, 0.145) 62%, rgba(8, 11, 14, 0.133) 100%); }
.sf23-hero .sf23-art { background-size: 341.333% 1219.05%; }
.sf23-hero .sf23-art--hero { background-size: 109.871% 830.27%; background-position: 52.1739% 65.8031%; }
.sf23-hero-content { position: relative; z-index: 1; padding: 40px 25px 20px; max-width: 70%; }
.sf23-eyebrow { display: block; font-size: 11px; color: rgb(241, 189, 73); margin: 0px 0px 6px; font-weight: 700; }
.sf23-hero-content h1 { font-size: 34px !important; color: rgb(255, 255, 255) !important; }
.sf23-hero-content p { color: rgb(216, 218, 222); font-size: 14px; margin: 0px 0px 13px; }
.sf23-hero .sf23-pill { font-size: 12px; }
.sf23-primary { position: absolute; right: 24px; bottom: 24px; z-index: 2; border: 1px solid rgb(182, 184, 186); border-radius: 5px; background: rgba(22, 27, 32, 0.796); display: flex; align-items: center; gap: 12px; text-decoration: none; padding: 11px 16px; font-weight: 600; font-size: 13px; color: rgb(255, 255, 255) !important; }
.sf23-stats { display: grid; grid-template-columns: repeat(5, minmax(0px, 1fr)); border: 1px solid var(--sf-line); border-radius: 6px; background: var(--sf-panel); margin-top: 3px; padding: 13px 0px; }
.sf23-stat { display: flex; align-items: flex-start; gap: 14px; min-width: 0px; padding: 0px 18px; border-right: 1px solid var(--sf-line); }
.sf23-stat:last-child { border-right: 0px; }
.sf23-stat > .sf23-icon { width: 23px; height: 23px; flex-basis: 23px; color: rgb(145, 153, 162); margin-top: 4px; }
.sf23-stat span { font-size: 11px; color: var(--sf-muted); display: block; margin-bottom: 7px; }
.sf23-stat strong { display: flex; align-items: center; gap: 7px; color: var(--sf-text); font-size: 16px; font-weight: 600; white-space: nowrap; }
.sf23-stat:first-child strong { font-size: 23px; line-height: 1.1; }
.sf23-stat strong > .sf23-icon { width: 16px; height: 16px; flex-basis: 16px; border: 1px solid rgb(155, 161, 168); border-radius: 50%; padding: 2px; }
.sf23-stat .sf23-positive { color: var(--sf-gold); }
.sf23-stat .sf23-positive > .sf23-icon { color: rgb(23, 27, 32); background: rgb(231, 179, 65); border-color: rgb(231, 179, 65); }
.sf23-note { display: flex; align-items: center; gap: 5px; font-size: 10px; margin: 6px 4px 12px !important; }
.sf23-note .sf23-icon { width: 12px; height: 12px; flex-basis: 12px; }
.sf23-detail { display: grid; grid-template-columns: minmax(0px, 2fr) minmax(240px, 1fr); gap: 12px; align-items: start; }
.sf23-panel { border: 1px solid var(--sf-line); border-radius: 6px; background: var(--sf-panel); padding: 17px; margin: 0px 0px 8px; min-width: 0px; }
.sf23-panel h2 { display: flex; align-items: center; gap: 12px; margin-bottom: 9px !important; }
.sf23-panel h2 > .sf23-icon { color: rgb(181, 188, 196); }
.sf23-panel p { font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.sf23-information dl { margin: 12px 0px 0px; }
.sf23-information dl > div { display: flex; gap: 18px; justify-content: space-between; padding: 13px 2px; border-top: 1px solid var(--sf-line); font-size: 12px; }
.sf23-information dt { color: var(--sf-muted); }
.sf23-information dd { margin: 0px; max-width: 65%; overflow-wrap: anywhere; }
.sf23-information a { color: var(--sf-gold); text-decoration: underline; }
.sf23-information .sf23-icon { width: 13px; height: 13px; }
.sf23-members header { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.sf23-members header > a { font-size: 11px; color: var(--sf-gold); text-decoration: none; white-space: nowrap; }
.sf23-members header > a .sf23-icon { width: 14px; height: 14px; }
.sf23-members ul { list-style: none; margin: 0px; padding: 0px; }
.sf23-members li { display: flex; align-items: center; gap: 16px; border-top: 1px solid var(--sf-line); padding: 6px 0px; }
.sf23-members li img { width: 36px; height: 36px; border-radius: 50%; border: 1px solid rgb(170, 140, 84); object-fit: cover; object-position: 50% 12%; background: rgb(48, 52, 59); }
.sf23-members li a { font-size: 12px; text-decoration: none; }
.sf23-members small { color: var(--sf-muted); font-size: 10px; }
.sf23-member-pages { display: flex; justify-content: space-between; margin-top: 10px; }
.sf23-manage, .sf23-photos { margin-top: 12px; }
.sf23 :is(summary, button) { cursor: pointer; }
.sf23 summary { color: var(--sf-gold); font-size: 12px; }
.sf23-manage form { margin-top: 14px; }
.sf23-manage label { display: grid; gap: 7px; color: var(--sf-text); }
.sf23-manage input, .sf23-manage select { min-width: 0px !important; width: 100% !important; background: var(--sf-input) !important; color: var(--sf-text) !important; border: 1px solid var(--sf-line) !important; padding: 9px !important; font: 13px Arial, sans-serif !important; border-radius: 4px !important; }
.sf23-search { display: flex; align-items: end; gap: 10px; }
.sf23-search label { flex: 1 1 0%; }
.sf23-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.sf23-gallery { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 10px; margin-top: 12px; }
.sf23-gallery img { width: 100%; aspect-ratio: 1.8 / 1; object-fit: cover; border-radius: 4px; }
.sf23 :is(a, input, button, select, summary):focus-visible { outline: 2px solid var(--sf-gold); outline-offset: 3px; }
@media (max-width: 1200px){.sf23-heading { flex-wrap: wrap; gap: 12px; }
.sf23-heading > div { flex: 1 0 35%; }
.sf23-filters { margin-left: auto; }
.sf23-directory-search label { width: 180px; }
.sf23-stat { gap: 9px; padding: 0px 12px; }}
@media (max-width: 850px){.sf23-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
.sf23-detail { grid-template-columns: 1fr; }
.sf23-stats { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 15px 0px; }
.sf23-stat:nth-child(3) { border-right: 0px; }
.sf23-stat strong { font-size: 14px; }
.sf23-heading > div { flex-basis: 100%; }
.sf23-directory-search { flex: 1 1 0%; }
.sf23-directory-search label { width: 100%; }
.sf23-filters { margin: 0px; }
.sf23-members li img { width: 36px; height: 36px; }}
@media (max-width: 560px){.sf23-grid { grid-template-columns: 1fr; gap: 12px; }
.sf23-heading { margin-bottom: 15px; }
.sf23-heading p { white-space: normal; font-size: 13px; }
.sf23-directory-search { flex-basis: 100%; }
.sf23-filters { width: 100%; gap: 5px; }
.sf23-filters a { padding: 7px 8px; font-size: 10px; flex: 1 1 0%; text-align: center; }
.sf23-hero { min-height: 225px; }
.sf23-hero-content { padding: 22px 16px 70px; max-width: 100%; }
.sf23-primary { right: 16px; left: 16px; bottom: 15px; justify-content: center; padding: 9px; }
.sf23-stats { grid-template-columns: repeat(2, minmax(0px, 1fr)); padding: 12px 0px; }
.sf23-stat { padding: 0px 12px; }
.sf23-stat:nth-child(2n) { border-right: 0px; }
.sf23-stat:nth-child(3) { border-right: 1px solid var(--sf-line); }
.sf23-stat:last-child { grid-column: 1 / -1; }
.sf23-stat strong { font-size: 14px; }
.sf23-panel { padding: 14px; }
.sf23-search { align-items: stretch; flex-direction: column; }
.sf23-gallery { grid-template-columns: 1fr; }
.sf23-members header { align-items: start; flex-wrap: wrap; }
.sf23-information dl > div { padding: 10px 0px; }}
@media (max-width: 850px){.sf23-stats { grid-template-columns: repeat(3, minmax(0px, 1fr)); }}
@media (max-width: 560px){.sf23-stats { grid-template-columns: repeat(2, minmax(0px, 1fr)); }}
.sf23-hero .sf23-art:not(.sf23-art--hero) { background-size: 341.333%; }
.sf23-hero .sf23-art--hero { background-image: url("faction-hero-v23-1.png"); background-size: cover; background-position: center center; }
.sf23-hero .sf23-art--hero { background-position: center 25%; }
/* Read the same live palette tokens as the existing forum panels. */
html[data-srp-palette] #wrapper#wrapper#wrapper .sf23{color:var(--ui-text)}
html[data-srp-palette] #wrapper#wrapper#wrapper .sf23 :is(h1,h2,h3){color:var(--ui-text)!important}
html[data-srp-palette] #wrapper#wrapper#wrapper .sf23 h2 a{color:var(--ui-text)!important}
html[data-srp-palette] #wrapper#wrapper#wrapper .sf23 .sf23-hero h1{color:#fff!important}
html[data-srp-palette] #wrapper#wrapper#wrapper .sf23-directory-search input[type=search]{border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:var(--ui-text)!important;padding:0!important;min-height:0!important;height:18px!important;line-height:18px!important}
html[data-srp-palette] #wrapper#wrapper#wrapper .sf23-directory-search label{height:32px!important;min-height:0!important;padding:6px 10px!important;line-height:18px!important}
.sf23-filters a[aria-current=page]{background:var(--ui-gold);border-color:var(--ui-gold);color:var(--ui-canvas)!important;box-shadow:none}
.sf23-pill--official{color:var(--ui-gold);background:var(--ui-selected);border-color:var(--ui-gold)}
.sf23-pill--official .sf23-icon,.sf23-stat .sf23-positive>.sf23-icon{background:var(--ui-gold);border-color:var(--ui-gold);color:var(--ui-canvas)}
.sf23-pill--unofficial{background:var(--ui-raised);border-color:var(--ui-border);color:var(--ui-muted)}
.sf23-eyebrow{color:#efc06b}.sf23-hero .sf23-pill--official{color:#efc06b;background:#211b12d9;border-color:#bd9445}.sf23-hero .sf23-pill--official .sf23-icon{background:#efc06b;color:#211b12}
html[data-srp-palette] #wrapper#wrapper#wrapper .sf23 h1{font:700 28px/1.2 Arial,'Segoe UI',sans-serif!important;margin:0 0 6px!important;color:var(--ui-text)!important}
html[data-srp-palette] #wrapper#wrapper#wrapper .sf23 h2{font:700 16px/1.35 Arial,'Segoe UI',sans-serif!important;color:var(--ui-text)!important}
html[data-srp-palette] #wrapper#wrapper#wrapper .sf23 .sf23-hero h1{font-size:34px!important;color:#fff!important}
@media(max-width:560px){html[data-srp-palette] #wrapper#wrapper#wrapper .sf23 h1{font-size:26px!important}html[data-srp-palette] #wrapper#wrapper#wrapper .sf23 .sf23-hero h1{font-size:29px!important}}

.sf23 .sf24-rank{color:var(--ui-muted);font-size:12px;margin-left:auto;overflow-wrap:anywhere}.sf23 .sf24-cover-manage form{display:grid;gap:12px}.sf23 .sf24-cover-manage input[type=file]{display:block;max-width:100%;margin-top:8px}.sf23 .sf23-photo{width:100%;height:100%;object-fit:cover}
