/* ===========================================================================
 * claude / LEONIDA — phpBB theme  (modern · clean · clear)
 * Child of prosilver. Original work. Calm dark UI with a single sunset accent,
 * generous spacing and a clear hierarchy. Tokens mirror the Astro site.
 * ======================================================================== */

@import url("../../prosilver/theme/stylesheet.css");
@import url("https://api.fontshare.com/v2/css?f[]=clash-display@500,600,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700&display=swap");

:root{
  --bg:#0e0c16;
  --surface:#17141f;        /* cards */
  --surface-2:#1d1928;      /* strips / inputs */
  --surface-3:#221d2e;      /* hover */
  --border:rgba(255,255,255,0.07);
  --border-2:rgba(255,255,255,0.12);

  --text:#ece7f4;
  --muted:#a8a1bb;
  --faint:#6e6783;

  --accent:#ff7fae;
  --accent-hover:#ff96bd;
  --accent-ink:#2a0d18;
  --accent-soft:rgba(255,127,174,0.12);

  --grad:linear-gradient(100deg,#ff6fa6,#ff8e7a 55%,#ffb892);

  --head:"Clash Display",system-ui,sans-serif;
  --body:"Hanken Grotesk",system-ui,sans-serif;

  --r:12px; --r-lg:16px; --r-pill:999px;
  --gap:20px;
}

/* ---------------------------------------------------------------- base --- */
html,body{
  background:var(--bg) !important; background-image:none !important;
  color:var(--text); font-family:var(--body); font-size:15px; line-height:1.6;
}
#wrap{ max-width:1080px; margin:0 auto; padding:0 20px; border:0; background:transparent; }
#page-body{ margin-top:0; }
a,a:link{ color:var(--accent); text-decoration:none; }
a:hover{ color:var(--accent-hover); }
h1,h2,h3,h4,.forumtitle,.topictitle{ font-family:var(--head); color:var(--text); letter-spacing:-0.01em; line-height:1.2; }
hr{ border:0; border-top:1px solid var(--border); }
::selection{ background:var(--accent); color:var(--accent-ink); }
img{ max-width:100%; }

/* removes the noisy phpBB rounded-corner gradients everywhere */
.rounded, .bg1, .bg2, .panel, .post, .forabg, .forumbg, .navbar, .headerbar,
.cp-main .panel, ul.cplist{ background-image:none !important; box-shadow:none !important; }

/* --------------------------------------------------------------- header --- */
#page-header .headerbar, .headerbar{
  background:transparent !important; border:0 !important; padding:22px 0 6px !important; margin:0 !important;
}
#page-header .headerbar > .inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
#site-description{ display:flex; align-items:center; gap:16px; margin:0; float:none; width:auto; flex:1 1 auto; }
#site-description .site_logo{
  display:inline-block; width:230px; max-width:60vw; height:48px; margin:0;
  background:url("./images/logolong.png") left center / contain no-repeat;
}
#site-description h1{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
#site-description p:not(.skiplink){ display:none; } /* tagline lives in the hero */
#search-box{ margin:0 0 0 auto !important; float:none; }
#search-box .inputbox{ background:var(--surface-2) !important; border:1px solid var(--border-2) !important; }

/* ------------------------------------------------------ nav / breadcrumb -- */
.navbar{ background:transparent !important; border:0 !important; }
.navbar.top{ border-bottom:1px solid var(--border) !important; border-radius:0 !important; }
.navbar .inner{ padding:8px 0; }
.navbar a, .linklist a, .breadcrumbs a, #nav-main a{ color:var(--muted) !important; }
.navbar a:hover, .breadcrumbs a:hover{ color:var(--text) !important; }
.dropdown-contents{ background:var(--surface) !important; border:1px solid var(--border-2) !important; border-radius:var(--r) !important; color:var(--text); }
.dropdown .pointer, .dropdown .pointer-inner{ border-color:var(--surface) transparent !important; }

/* =======================================================================
 * HERO (custom index_body.html) — one calm branded moment
 * ===================================================================== */
.lh-board-hero{
  position:relative; overflow:hidden; margin:14px 0 26px;
  border:1px solid var(--border-2); border-radius:var(--r-lg);
  background:linear-gradient(120deg,#1a1330,#221733 60%,#2a1730);
}
.lh-board-hero::before{
  content:""; position:absolute; right:-10%; top:-60%; width:60%; height:200%;
  background:radial-gradient(closest-side, rgba(255,127,174,0.35), transparent 70%); pointer-events:none;
}
.lh-board-hero__inner{ position:relative; z-index:1; padding:34px 34px 30px; }
.lh-board-hero__logo{ display:block; width:240px; max-width:60vw; height:54px; margin-bottom:16px;
  background:url("./images/logolong.png") left center / contain no-repeat; }
.lh-board-hero__title{ font-family:var(--head); font-weight:600; font-size:clamp(28px,3.6vw,42px); letter-spacing:-0.03em; margin:0; color:#fff; }
.lh-board-hero__tag{ margin:8px 0 0; color:#d9d2e8; font-size:16px; }
.lh-board-hero__stats{ display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.lh-stat{ display:inline-flex; align-items:baseline; gap:7px; padding:6px 13px; background:rgba(0,0,0,0.28); border:1px solid var(--border-2);
  border-radius:var(--r-pill); font-family:var(--head); font-weight:600; font-size:12.5px; color:#e9e4f2; }
.lh-stat strong{ color:var(--accent); font-weight:700; }
.lh-board-hero__cta{ display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }

/* =======================================================================
 * FORUM / TOPIC LISTS — clean cards, clear rows
 * ===================================================================== */
/* Vice City scene behind the whole board (subtle, fixed) */
body#phpbb{
  background:
    linear-gradient(180deg, rgba(10,8,16,0.90), rgba(10,8,16,0.95) 55%, rgba(10,8,16,0.985)),
    url("/assets/art-couple-car.webp") center top / cover no-repeat fixed !important;
}

/* Category card — glassy, lifted */
.forabg, .forumbg{
  background:rgba(21,18,29,0.80) !important;
  -webkit-backdrop-filter:blur(12px) saturate(120%); backdrop-filter:blur(12px) saturate(120%);
  border:1px solid var(--border-2) !important; border-radius:var(--r-lg) !important;
  overflow:hidden; padding:0; margin:0 0 20px; box-shadow:0 20px 44px rgba(0,0,0,0.40);
}
.forabg > .inner, .forumbg > .inner{ border:0; padding:0; background:transparent; }
ul.topiclist, ul.topiclist li{ background:transparent; }

/* Category header — gradient label bar with an accent edge */
ul.topiclist li.header{
  background:linear-gradient(90deg, rgba(255,127,174,0.14), rgba(255,127,174,0.02) 60%) !important;
  border-bottom:1px solid var(--border-2) !important; position:relative;
}
ul.topiclist li.header::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--grad); }
li.header dl.row-item dt .list-inner{
  font-family:var(--head); font-weight:700; text-transform:uppercase; letter-spacing:0.07em;
  font-size:14px; padding:15px 22px; color:#fff !important;
}
li.header dl.row-item dt, li.header dl.row-item dd{ color:#fff !important; border:0 !important; }
li.header dd{ font-family:var(--head); font-size:9.5px; text-transform:uppercase; letter-spacing:0.12em;
  color:var(--faint) !important; padding-top:18px; }
li.header a{ color:#fff !important; }

/* Rows — spacious, hover lift */
ul.topiclist li.row{ border-top:1px solid var(--border); transition:background .18s ease, box-shadow .18s ease; }
ul.topiclist li.row:first-child{ border-top:0; }
ul.topiclist li.row:hover{ background:rgba(255,255,255,0.035) !important; box-shadow:inset 3px 0 0 var(--ic, var(--accent)); }
li.row dl.row-item, li.row dl.row-item dt, li.row dl.row-item dd{ border:0; background:transparent; }
li.row dl.row-item{ padding:2px 6px; }

/* Per-forum coloured icon tiles + distinct glyphs (cycled) */
li.row dl.row-item dt{ position:relative; --ic:var(--accent); --ic-soft:var(--accent-soft); --ic-glyph:"\f0e6"; }
ul.topiclist.forums li.row:nth-of-type(5n+1) dt{ --ic:#ff7fae; --ic-soft:rgba(255,127,174,0.16); --ic-glyph:"\f0a1"; }
ul.topiclist.forums li.row:nth-of-type(5n+2) dt{ --ic:#2de2e6; --ic-soft:rgba(45,226,230,0.16); --ic-glyph:"\f086"; }
ul.topiclist.forums li.row:nth-of-type(5n+3) dt{ --ic:#8aa2ec; --ic-soft:rgba(138,162,236,0.16); --ic-glyph:"\f5a0"; }
ul.topiclist.forums li.row:nth-of-type(5n+4) dt{ --ic:#ffc24b; --ic-soft:rgba(255,194,75,0.16); --ic-glyph:"\f1b9"; }
ul.topiclist.forums li.row:nth-of-type(5n+5) dt{ --ic:#3fcf8e; --ic-soft:rgba(63,207,142,0.16); --ic-glyph:"\f005"; }
li.row dl.row-item dt .list-inner{ padding:20px 16px 20px 80px; min-height:80px; color:var(--muted); font-size:13.5px; }
li.row dl.row-item dt::before{
  content:""; position:absolute; left:18px; top:50%; transform:translateY(-50%);
  width:50px; height:50px; border-radius:15px; background:var(--ic-soft);
  border:1px solid color-mix(in srgb, var(--ic) 35%, transparent);
}
li.row dl.row-item dt::after{
  content:var(--ic-glyph); font-family:"Font Awesome 5 Free","FontAwesome"; font-weight:900;
  position:absolute; left:18px; top:50%; transform:translateY(-50%); width:50px; height:50px;
  display:flex; align-items:center; justify-content:center; font-size:19px; color:var(--ic); pointer-events:none;
}
li.row .forumtitle, li.row a.topictitle{ font-family:var(--head); font-weight:600; font-size:16.5px; color:var(--text); }
li.row .forumtitle:hover, li.row a.topictitle:hover{ color:var(--ic, var(--accent)); }
.row-item-desc, .responsive-show, .topic-poster, .row .author{ color:var(--faint); }
.subforum{ display:inline-block; margin:6px 5px 0 0; padding:3px 10px; background:rgba(255,255,255,0.05);
  border:1px solid var(--border-2); border-radius:var(--r-pill); font-size:12px; color:var(--muted) !important; }
.subforum:hover{ color:var(--accent) !important; border-color:var(--accent); }

/* Topic / post counters → pill badges */
dd.topics, dd.posts, dd.views{ padding-top:26px; }
dd.topics, dd.posts, dd.views{ font-family:var(--head); font-weight:700; font-size:15px; color:var(--text); }
dd.topics dfn, dd.posts dfn, dd.views dfn, dd.lastpost dfn{
  display:block; font-family:var(--head); font-weight:600; font-size:9px; text-transform:uppercase;
  letter-spacing:0.12em; color:var(--faint); margin-top:3px;
}
dd.lastpost{ border-left:1px solid var(--border) !important; padding:20px 0 20px 20px; }
dd.lastpost span{ color:var(--muted); font-size:12.5px; line-height:1.6; }
dd.lastpost .lastsubject{ color:var(--text); font-weight:600; }
dd.lastpost .username, dd.lastpost .username-coloured{ font-weight:700; }
dd.lastpost time{ color:var(--faint); }

/* =======================================================================
 * VIEWTOPIC — author header on top, full-width content
 * ===================================================================== */
h2.topic-title, .topic-title{ font-size:26px !important; margin-bottom:6px; font-weight:600; }

.post{ background:rgba(21,18,29,0.82) !important; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); border:1px solid var(--border-2); border-radius:var(--r-lg);
  margin-bottom:14px; overflow:hidden; }
.post .inner{ display:flex !important; flex-direction:column !important; padding:0 !important; }
.postprofile{
  order:-1; width:100% !important; min-width:0 !important; float:none !important;
  display:flex !important; flex-wrap:wrap; align-items:center; gap:4px 14px;
  margin:0 !important; padding:13px 20px !important;
  background:var(--surface-2) !important; border:0 !important; border-bottom:1px solid var(--border) !important; border-radius:0 !important;
}
.postprofile dt, .postprofile dt.author, .postprofile dt.has-avatar{ display:flex !important; align-items:center; gap:11px; margin:0 !important; border:0 !important; }
.postprofile .avatar-container, .postprofile .avatar, .postprofile .avatar img{ width:64px !important; height:64px !important; margin:0 !important; border-radius:13px !important; overflow:hidden; }
.postprofile .username, .postprofile .username-coloured{ font-family:var(--head); font-weight:700; font-size:17px; }
.postprofile dd{ display:inline-flex; align-items:center; gap:5px; margin:0 !important; font-size:12.5px; color:var(--muted); }
.postprofile dd.profile-rank{ color:var(--accent); font-family:var(--head); text-transform:uppercase; letter-spacing:0.07em; font-size:10.5px; }
.postprofile dd.profile-joined, .postprofile .profile-icons, .postprofile dd.profile-warnings,
.postprofile dd.profile-contact, .postprofile dd.profile-custom-field{ display:none !important; }
.postbody{ order:0; width:100% !important; margin:0 !important; padding:20px !important; }
.postbody > h3{ font-family:var(--head); font-weight:600; font-size:15px !important; margin:0 0 2px; }
.postbody .author{ font-size:12.5px; color:var(--faint); margin-bottom:14px; }
.postbody .author a{ color:var(--muted); }
.postbody .content{ font-size:15.5px; line-height:1.8; color:var(--text); }
.post-buttons{ opacity:.5; } .post-buttons:hover{ opacity:1; }
blockquote{ background:var(--surface-2); border:1px solid var(--border); border-left:3px solid var(--accent); border-radius:var(--r); color:var(--muted); }
.codebox{ background:#0a0810; border:1px solid var(--border-2); border-radius:var(--r); } .codebox code,.codebox p{ color:var(--text); }

/* =======================================================================
 * Toolbars / pagination / buttons / inputs / tabs / cp
 * ===================================================================== */
.action-bar{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:14px 0; padding:0; background:transparent; border:0; }
.action-bar .pagination{ margin-left:auto; font-size:13px; }
.pagination li a, .pagination li span{ background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r); color:var(--text); }
.pagination li.active span, .pagination li a:hover{ background:var(--accent); border-color:transparent; color:var(--accent-ink); }

.button, a.button, input.button1, input.button2, button.button1, button.button2{
  font-family:var(--head); font-weight:600; background:var(--surface-2) !important; background-image:none !important;
  border:1px solid var(--border-2) !important; border-radius:var(--r-pill) !important; color:var(--text) !important; box-shadow:none !important;
}
.button:hover, a.button:hover, input.button2:hover{ border-color:var(--accent) !important; }
.button.button-primary, .button1, a.button1, button.button1, input.button1{
  background:var(--accent) !important; border-color:transparent !important; color:var(--accent-ink) !important;
}
.button.button-primary:hover, .button1:hover{ background:var(--accent-hover) !important; }

input.inputbox, textarea.inputbox, select, .inputbox{
  background:var(--surface-2) !important; border:1px solid var(--border-2) !important; color:var(--text) !important; border-radius:var(--r) !important;
}
input.inputbox:focus, textarea.inputbox:focus{ border-color:var(--accent) !important; box-shadow:0 0 0 3px var(--accent-soft) !important; }

.panel, .cp-main .panel, .notification_list{ background:rgba(21,18,29,0.82) !important; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); border:1px solid var(--border-2) !important; border-radius:var(--r-lg); color:var(--text); }
ul.tabs{ border-bottom:1px solid var(--border); }
ul.tabs li a{ background:var(--surface-2) !important; border:1px solid var(--border) !important; border-bottom:0 !important; border-radius:var(--r) var(--r) 0 0 !important; color:var(--muted) !important; font-family:var(--head); font-weight:600; text-transform:uppercase; letter-spacing:0.04em; font-size:12px; }
ul.tabs li.activetab a{ background:var(--accent) !important; color:var(--accent-ink) !important; border-color:transparent !important; }
#navigation a, .cp-menu a{ background:var(--surface-2) !important; border:1px solid var(--border) !important; border-radius:var(--r) !important; color:var(--muted) !important; margin-bottom:6px; }
#navigation a:hover, .cp-menu a:hover{ color:var(--text) !important; border-color:var(--accent) !important; }
#navigation a.active-subsection, .cp-menu a.active-subsection{ background:var(--accent) !important; color:var(--accent-ink) !important; border-color:transparent !important; }

/* notices, tables, footer */
.post-notice, .notice, .rules, .successbox, .warning, div.error{
  background:var(--surface-2) !important; border:1px solid var(--border) !important; border-left:3px solid var(--accent) !important; border-radius:var(--r) !important; color:var(--text) !important;
}
.unapproved, .post-notice.unapproved{ border-left-color:#ffc97a !important; color:#ffc97a !important; }
table.table1 thead th{ background:var(--surface-2); color:var(--accent); font-family:var(--head); text-transform:uppercase; letter-spacing:0.05em; }
table.table1 tbody td{ background:transparent; border-color:var(--border); color:var(--text); }
table.table1 tbody tr:hover td{ background:var(--surface-3); }

form.headerspace{ display:none !important; }      /* redundant index quick-login */
#page-body > p.time{ display:none; }              /* noisy time line */
.stat-block{ background:rgba(21,18,29,0.82) !important; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); border:1px solid var(--border-2) !important; border-radius:var(--r-lg); padding:18px 20px; margin-bottom:var(--gap); }
.stat-block h3{ font-family:var(--head); font-size:12px; text-transform:uppercase; letter-spacing:0.12em; color:var(--accent); border:0; margin:0 0 10px; }
.stat-block p{ color:var(--muted); margin:0; }
.stat-block strong{ color:var(--text); }
#page-footer, .copyright{ color:var(--faint); }

@media (max-width:760px){
  dd.lastpost{ display:none; }
  #page-header .headerbar > .inner{ flex-direction:column; align-items:flex-start; }
}

/* =======================================================================
 * CURATION PASS — user images (avatars) + font discipline
 * ===================================================================== */

/* Every user gets an image: branded default avatar when none is set */
.postprofile dt.no-avatar .avatar-container,
.postprofile .avatar-container:empty,
.avatar-container.no-avatar{
  width:64px; height:64px; border-radius:13px; overflow:hidden;
  background:url("./images/default-avatar.svg") center / cover no-repeat;
}
.postprofile .avatar-container{ flex:0 0 auto; }
.postprofile .avatar img, .avatar-container img{ width:100%; height:100%; object-fit:cover; border-radius:11px; background:transparent !important; }

/* memberlist / pm / online avatars stay consistent */
.contact-icon, .avatar img{ border-radius:11px; }

/* Font discipline:
 *   Clash Display  -> only titles, headings, hero, big numbers
 *   Hanken Grotesk -> all UI controls + small labels (cleaner, more legible) */
.button, a.button, input.button1, input.button2, button.button1, button.button2,
ul.tabs li a, #navigation a, .cp-menu a, .lh-stat,
.postprofile .username, .postprofile .username-coloured,
dd.topics dfn, dd.posts dfn, dd.views dfn, dd.lastpost dfn,
.postprofile dd.profile-rank, li.header dd, table.table1 thead th{
  font-family:var(--body) !important;
  letter-spacing:0.02em;
}
.postprofile .username, .postprofile .username-coloured{ font-weight:700; letter-spacing:0; }

/* Counts read as clean tabular numbers (Clash kept for the figure) */
dd.topics, dd.posts, dd.views{ font-variant-numeric:tabular-nums; }

/* Thread: a touch more breathing room + clearer separation */
.post + .post{ margin-top:14px; }
.postbody .content{ max-width:72ch; }
.postprofile{ gap:6px 16px; }
.postprofile .username, .postprofile .username-coloured{ font-size:17px; color:var(--text) !important; }

/* Links inside content underline on hover (clearer affordance) */
.postbody .content a:hover{ text-decoration:underline; }

/* =======================================================================
 * READABILITY & CONTRAST FIXES  (kill prosilver light surfaces / faint text)
 * ===================================================================== */

/* 1. Embossed text-shadow on headings → flat + crisp */
h1,h2,h3,h4,h5,dt,legend,.cp-main h2,.cp-main h3,.stat-block h3,
.postbody h3,.column1 h3,.column2 h3{ text-shadow:none !important; }

/* 2. Prosilver alternating light row backgrounds → transparent (dark card shows) */
.bg1,.bg2,.bg3,
li.row.bg1,li.row.bg2,tr.bg1,tr.bg2,
.forumbg .bg1,.forumbg .bg2{
  background-color:transparent !important; background-image:none !important; color:var(--text) !important;
}
li.row.bg1:hover,li.row.bg2:hover,tr.bg1:hover td,tr.bg2:hover td{ background-color:var(--surface-3) !important; }

/* 3. Neutralise stray (blue) borders inside forum/topic lists */
.forabg,.forumbg,.forabg *,.forumbg *,
ul.topiclist li,ul.topiclist dl,ul.topiclist dt,ul.topiclist dd{
  border-color:var(--border) !important;
}
.forabg,.forumbg{ box-shadow:none !important; }

/* 4. Member list: readable rows + headers */
.section-memberlist .forumbg, .section-memberlist .forabg{ background:var(--surface) !important; }
.section-memberlist li.row{ border-top:1px solid var(--border) !important; }
.section-memberlist li.row:hover{ background:var(--surface-3) !important; }
.section-memberlist .row .list-inner,
.section-memberlist dd, .section-memberlist dt{ color:var(--text) !important; }
.section-memberlist dd dfn{ color:var(--faint) !important; }

/* 5. Post author strip: real rank BADGE + readable post count */
/* Ranks now render as coloured badge images (text baked in). Drop the pill,
 * hide the duplicate text title, show the badge. */
.postprofile dd.profile-rank{
  display:block !important; padding:0 !important; margin:3px 0 1px !important;
  background:none !important; border:0 !important; font-size:0 !important; line-height:0 !important;
}
img[src*="images/ranks/"]{ height:20px !important; width:auto !important; vertical-align:middle; display:inline-block; }
.postprofile dd.profile-rank img{ height:21px !important; }
/* memberlist / profile rank cells: keep readable, badge sits inline */
.cp-main dd.profile-rank, td .rank-img, .rank-img{ font-size:0; }
.cp-main dd.profile-rank img, td .rank-img img, .rank-img img{ height:20px !important; }
.postprofile dd.profile-posts{ color:var(--muted) !important; }
.postprofile dd.profile-posts strong,
.postprofile dd.profile-posts a,
.postprofile dd strong{ color:var(--text) !important; }

/* 6. View profile / UCP: readable labels + values + section heads */
.cp-main dl.details dt, dl.details dt{ color:var(--muted) !important; font-weight:600; }
.cp-main dl.details dd, dl.details dd{ color:var(--text) !important; }
.cp-main h3, .panel h3, .column1 h3, .column2 h3{
  color:var(--accent) !important; font-family:var(--head) !important; text-transform:none;
  border-bottom:1px solid var(--border) !important; padding-bottom:8px;
}
.cp-main .panel, #cp-main .panel, .cp-main .column1, .cp-main .column2{ color:var(--text) !important; }

/* 7. Generic faint legacy classes → readable */
.gensmall,.gen,.genmed,.postdetails,.color_palette_placeholder,
.notification_text,.pm-message,.content,.signature{ color:var(--text) !important; }
small,.gensmall{ color:var(--muted) !important; }

/* 8. Inputs/selects inside panels stay legible */
select,option{ background:var(--surface-2) !important; color:var(--text) !important; }

/* =======================================================================
 * SHARED SITE HEADER — mirrors the main site nav across the forum
 * ===================================================================== */
/* Values mirror the main site Nav.astro exactly so the header is identical
 * across the static site and the forum. */
/* Header continuity with the main site: flush to the very top, identical
 * border-box math so the logo lands at the exact same x/y on every page. */
html, body#phpbb{ margin:0 !important; padding:0 !important; }
.lh-sitebar{
  position:sticky; top:0; z-index:1000; margin:0 !important;
  background:rgba(9,8,15,0.68);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,0.12);
}
.lh-sitebar *, .lh-sitebar *::before, .lh-sitebar *::after{ box-sizing:border-box; }
.lh-sitebar__inner{
  box-sizing:border-box;
  display:flex; align-items:center; gap:18px;
  max-width:1320px; margin:0 auto; padding:12px 24px;
}
.lh-sitebar__brand{ display:inline-flex; align-items:center; gap:11px; flex:0 0 auto; }
.lh-sitebar__brand img{ height:48px; width:auto; display:block; }
.lh-sitebar__nav{ display:flex; gap:2px; margin-left:8px; }
.lh-sitebar__nav a{
  display:inline-flex; align-items:center; gap:7px; padding:8px 14px; border-radius:999px;
  font-family:"Hanken Grotesk",system-ui,sans-serif; font-weight:600; font-size:14px; color:#948bb0;
  transition:background .2s ease, color .2s ease; text-decoration:none; line-height:1;
}
.lh-sitebar__nav a .lh-ico{ width:16px; height:16px; flex:0 0 auto; }
.lh-sitebar__nav a:hover{ color:#e7e0f4; }
.lh-sitebar__nav a.is-active{ background:rgba(255,157,192,0.14); color:#ff6fa6 !important; }
.lh-sitebar__spacer{ flex:1; }
.lh-sitebar__search{
  display:inline-flex; align-items:center; gap:8px; width:240px; height:36px; padding:0 14px;
  background:rgba(22,19,31,0.52); border:1px solid rgba(255,255,255,0.12); border-radius:999px; color:#5f5677;
}
.lh-sitebar__search .lh-ico{ width:16px; height:16px; flex:0 0 auto; }
.lh-sitebar__search input{
  flex:1; min-width:0; background:none; border:0; outline:none; color:#e7e0f4;
  font-family:"Hanken Grotesk",system-ui,sans-serif; font-size:14px;
}
.lh-sitebar__search input::placeholder{ color:#5f5677; }
.lh-sitebar__auth{ display:inline-flex; align-items:center; gap:10px; flex:0 0 auto; }
.lh-auth-link{ font-family:"Clash Display",system-ui,sans-serif; font-weight:700; font-size:14px; color:#948bb0; text-decoration:none; white-space:nowrap; }
.lh-auth-link:hover{ color:#fff6f4; }
.lh-auth-btn{
  display:inline-flex; align-items:center; height:36px; padding:0 16px; border-radius:999px;
  background:#ff9dc0; color:#3a1024 !important; font-family:"Clash Display",system-ui,sans-serif; font-weight:700; font-size:14px;
  text-decoration:none; white-space:nowrap; box-shadow:0 10px 38px rgba(255,157,192,0.34); transition:background .2s ease;
}
.lh-auth-btn:hover{ background:#ff8ab2; color:#3a1024 !important; }

/* The forum carries branding in the sitebar (and the board hero) — retire the
 * duplicate phpBB logo/search headerbar, keep the functional navbar below it. */
body.has-sitebar #page-header .headerbar{ display:none !important; }
body.has-sitebar #page-header{ margin-top:14px; }

@media (max-width:980px){
  .lh-sitebar__search{ display:none; }
  .lh-sitebar__nav{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .lh-sitebar__nav a{ white-space:nowrap; }
}
@media (max-width:620px){
  .lh-sitebar__inner{ flex-wrap:wrap; gap:10px 14px; padding:10px 14px; }
  .lh-sitebar__spacer{ display:none; }
  .lh-sitebar__nav{ order:3; width:100%; }
}

/* Board-hero CTAs (New posts / Active topics) — crisp on the gradient.
 * Secondary = glassy ghost; primary = solid pink. Calm, clean hovers. */
.lh-board-hero__cta .button{
  transition:background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
  background:rgba(255,255,255,0.07) !important;
  border:1px solid rgba(255,255,255,0.20) !important;
  color:#fff !important; background-image:none !important;
}
.lh-board-hero__cta .button:hover{
  background:rgba(255,255,255,0.14) !important;
  border-color:rgba(255,255,255,0.38) !important;
  color:#fff !important;
}
.lh-board-hero__cta .button.button-primary{
  background:var(--accent) !important; border-color:transparent !important; color:var(--accent-ink) !important;
  box-shadow:0 8px 26px rgba(255,127,174,0.34) !important;
}
.lh-board-hero__cta .button.button-primary:hover{
  background:#ffa6c8 !important; border-color:transparent !important; color:var(--accent-ink) !important;
  box-shadow:0 10px 30px rgba(255,127,174,0.45) !important;
}

/* =======================================================================
 * PROFILE PAGE — tame the oversized avatar, tidy the layout
 * ===================================================================== */
#memberlist .panel .column1, .page-body .column1{ }
.memberlist-title, h2.login-title{ color:var(--text) !important; }
/* Profile avatar: cap it to a tidy card instead of a full-column blow-up */
.page-body .panel .avatar,
.page-body .panel img.avatar,
#viewprofile .avatar,
dl.left-box dt .avatar,
.column1 .avatar{
  max-width:160px !important; max-height:160px !important; width:auto !important; height:auto !important;
  border-radius:18px !important; border:1px solid var(--border-2);
  background:transparent !important; object-fit:contain; display:block;
}
.page-body .panel dl.left-box{ float:none !important; width:auto !important; }
.page-body .panel dl.left-box dt{ border:0 !important; }

/* =======================================================================
 * USER CONTROL PANEL — spacious, modern, clear
 * ===================================================================== */
body.section-ucp #page-body,
body.section-mcp #page-body{ margin-top:18px; }

/* Top tab strip → pill tabs */
body.section-ucp #tabs ul.tabs,
body.section-ucp ul.tabs{ border-bottom:0 !important; display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; }
body.section-ucp ul.tabs li a{
  background:var(--surface-2) !important; border:1px solid var(--border-2) !important;
  border-radius:var(--r-pill) !important; padding:9px 18px !important;
  font-family:var(--body) !important; font-weight:700 !important; font-size:13px !important;
  text-transform:none !important; letter-spacing:0 !important; color:var(--muted) !important;
  transition:color .15s ease, border-color .15s ease, background .15s ease;
}
body.section-ucp ul.tabs li a:hover{ color:var(--text) !important; border-color:var(--accent) !important; }
body.section-ucp ul.tabs li.activetab a,
body.section-ucp ul.tabs li.activetab a:hover{
  background:var(--accent) !important; color:var(--accent-ink) !important; border-color:transparent !important;
  box-shadow:0 8px 22px rgba(255,127,174,0.28) !important;
}

/* Two-column UCP layout: roomier gap */
body.section-ucp .cp-menu{ padding-right:8px; }

/* Left navigation → clean list with smooth hovers + accent active */
body.section-ucp #navigation ul,
body.section-ucp .cp-menu ul{ display:flex; flex-direction:column; gap:6px; }
body.section-ucp #navigation a,
body.section-ucp .cp-menu a{
  display:block; background:var(--surface) !important; border:1px solid var(--border) !important;
  border-radius:var(--r) !important; padding:11px 14px !important; margin:0 !important;
  font-family:var(--body) !important; font-weight:600 !important; font-size:14px !important;
  color:var(--muted) !important; transition:color .15s ease, border-color .15s ease, background .15s ease, transform .15s ease;
}
body.section-ucp #navigation a:hover,
body.section-ucp .cp-menu a:hover{
  color:var(--text) !important; border-color:var(--accent) !important; background:var(--surface-2) !important;
  transform:translateX(2px);
}
body.section-ucp #navigation a.active-subsection,
body.section-ucp .cp-menu a.active-subsection,
body.section-ucp #navigation a.active-subsection:hover,
body.section-ucp .cp-menu a.active-subsection:hover{
  background:var(--accent-soft) !important; color:var(--accent) !important; border-color:rgba(255,127,174,0.35) !important;
  transform:none;
}

/* Content panels: more breathing room + clear headings */
body.section-ucp .cp-main .panel,
body.section-ucp .panel{ padding:22px 24px !important; margin-bottom:18px; border-radius:var(--r-lg) !important; }
body.section-ucp .cp-main h2,
body.section-ucp .cp-main h3,
body.section-ucp .panel h2,
body.section-ucp .panel h3{
  font-family:var(--head) !important; color:var(--text) !important; letter-spacing:-0.01em;
  padding-bottom:12px; margin-bottom:16px; border-bottom:1px solid var(--border) !important;
}

/* Forms: well-spaced label / field rows */
body.section-ucp fieldset dl,
body.section-ucp dl.fields1,
body.section-ucp dl.fields2{ padding:12px 0 !important; border-bottom:1px solid var(--border) !important; }
body.section-ucp fieldset dl:last-child{ border-bottom:0 !important; }
body.section-ucp dl.fields1 dt,
body.section-ucp dl.fields2 dt{ color:var(--text) !important; font-family:var(--body); font-weight:600; }
body.section-ucp dl.fields1 dd label{ color:var(--muted) !important; }
body.section-ucp dl dd input.inputbox,
body.section-ucp dl dd textarea.inputbox,
body.section-ucp dl dd select{ padding:10px 12px !important; }
body.section-ucp .cp-main .panel + .panel{ margin-top:18px; }

/* PM / message list rows in UCP */
body.section-ucp ul.cplist li.row{ background:transparent !important; }
body.section-ucp ul.cplist li.row:hover{ background:var(--surface-2) !important; }

/* =======================================================================
 * COOKIE / ANALYTICS CONSENT — themed, shared with the main site
 * ===================================================================== */
.lh-consent{
  position:fixed; inset:0; z-index:2147483000; display:grid; place-items:center; padding:24px;
  background:rgba(8,6,14,0.74);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
}
.lh-consent[hidden]{ display:none; }
.lh-consent__inner{
  position:relative; overflow:hidden; max-width:480px; width:100%; padding:30px 28px 24px;
  border-radius:18px; border:1px solid rgba(255,255,255,0.12);
  background:linear-gradient(180deg, rgba(28,22,40,0.98), rgba(15,11,23,0.99));
  box-shadow:0 30px 90px rgba(0,0,0,0.65);
}
.lh-consent__inner::before{ content:""; position:absolute; left:0; right:0; top:0; height:4px; background:linear-gradient(100deg,#ff6fa6,#ff8e7a 55%,#ffb892); }
.lh-consent__inner strong{ display:block; font-family:var(--head); font-weight:600; font-size:22px; letter-spacing:-0.015em; color:#fff; margin-bottom:10px; }
.lh-consent__inner p{ margin:0; color:#c7c0d8; font-size:14px; line-height:1.62; }
.lh-consent__inner a{ color:#ff9dc0; font-weight:600; }
.lh-consent__actions{ display:flex; gap:10px; margin-top:22px; }
.lh-consent__btn{ flex:1; cursor:pointer; font-family:var(--head); font-weight:700; font-size:14px; padding:12px 22px; border-radius:999px; border:1px solid transparent; transition:background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease; }
.lh-consent__btn--ghost{ background:transparent; border-color:rgba(255,255,255,0.22); color:#d4cde3; }
.lh-consent__btn--ghost:hover{ border-color:#ff9dc0; color:#fff; }
.lh-consent__btn--primary{ background:linear-gradient(100deg,#ff6fa6,#ff8e7a 60%,#ffb892); color:#2a0d18; box-shadow:0 8px 26px rgba(255,127,174,0.4); }
.lh-consent__btn--primary:hover{ transform:translateY(-1px); }