/* Codename font: Clarity City Medium (500, open font licence). Files go in site_assets/fonts/ as clarity-city-medium.woff2
   (or .woff / .ttf / .otf); until then a copy installed on the viewer's computer is used, else the site's Overpass. */
@font-face{font-family:'Clarity City';font-weight:500;src:local('Clarity City Medium'),local('ClarityCity-Medium'),url('/assets/fonts/clarity-city-medium.woff2') format('woff2'),url('/assets/fonts/clarity-city-medium.woff') format('woff'),url('/assets/fonts/clarity-city-medium.ttf') format('truetype'),url('/assets/fonts/clarity-city-medium.otf') format('opentype');font-display:swap}
@import url("/assets/themes/dispatch.css?v=1");

#community-app { position:fixed; inset:0; z-index:100; display:flex; flex-direction:column; color:var(--sdn-eee6ea, #eee6ea); background:radial-gradient(ellipse at 0 0,var(--sdn-17394166, #17394166),transparent 50%),var(--sdn-151719, #151719); font:15px/1.6 'Segoe UI',sans-serif; letter-spacing:normal; }
#community-app * { box-sizing:border-box; } #community-app [hidden] { display:none!important; }
#community-app a { color:inherit; text-decoration:none; } #community-app button,#community-app input,#community-app select,#community-app textarea { font:inherit; letter-spacing:normal; color:inherit; }
#community-app button { cursor:pointer; border:1px solid var(--sdn-743047, #743047); background:var(--sdn-4d2030, #4d2030); padding:9px 14px; border-radius:7px; } #community-app button:hover { background:var(--sdn-69273e, #69273e); }
#community-app :focus-visible { outline:2px solid var(--sdn-75e3eb, var(--color-accent,#75e3eb)); outline-offset:3px; }
#community-app input,#community-app select,#community-app textarea { background:var(--sdn-14151b, #14151b); border:1px solid var(--sdn-6d3547, #6d3547); border-radius:6px; padding:10px; max-width:100%; } #community-app textarea { width:100%; min-height:180px; resize:vertical; }
.app-header { display:flex; align-items:center; gap:32px; padding:18px 30px; background:var(--sdn-16171ded, #16171ded); border-bottom:1px solid var(--sdn-693044, #693044); flex-shrink:0; }
.app-brand { display:flex; flex-direction:column; line-height:1.1; }.app-brand span { color:var(--sdn-75e3eb, var(--color-accent,#75e3eb)); font:800 26px Consolas,monospace; letter-spacing:4px; }.app-brand small { font:10px Consolas,monospace; letter-spacing:2px; margin-top:6px; color:var(--sdn-aa959f, #aa959f); }
.app-header nav { display:flex; flex:1; gap:7px; }.app-header nav a { padding:10px 14px; font-weight:700; border-radius:7px; white-space:nowrap; }.app-header nav a[aria-current=page] { background:var(--sdn-5b2033, var(--color-accent-pending,#5b2033)); color:var(--sdn-8ceaf1, #8ceaf1); }.account-link { font-size:12px; white-space:nowrap; }
#app-workspace { flex:1; overflow:auto; padding:30px; min-height:0; }#app-view { max-width:1250px; margin:auto; }#community-app h1 { font:800 clamp(28px,4vw,46px)/1.15 'Segoe UI',sans-serif; color:var(--sdn-eee6ea, #eee6ea); margin:0 0 14px; text-transform:uppercase; letter-spacing:1px; }#community-app h2 { font-size:23px; margin:0 0 12px; }#community-app h3 { font-size:15px; margin:0 0 12px; color:var(--sdn-78dce5, #78dce5); text-transform:uppercase; }#community-app p { margin:0 0 18px; }.app-muted { color:var(--sdn-baaeb6, #baaeb6); font-size:13px; }.app-heading { display:flex; justify-content:space-between; align-items:start; gap:20px; margin-bottom:22px; }.app-heading button { white-space:nowrap; }
/* The top bar (#app-page-title) already carries every page's title, so the big
   .app-heading <h1> underneath it was just repeating the same words a second time
   right below it. Drop only the h1 - the subtitle text and any action button/nav
   (Add category, pagination, filters, etc.) that ships alongside it in the same
   heading() call still render normally. Thread/post view never uses .app-heading
   (it has its own .thread-view-heading), so it's untouched by this. */
.app-heading h1 { display:none; }
.app-panel {    padding:24px; }.app-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.character-card { border-top:3px solid var(--character-color,var(--sdn-75e3eb, var(--color-accent,#75e3eb))); }.character-card h2 { color:var(--character-color,var(--sdn-75e3eb, var(--color-accent,#75e3eb))); overflow-wrap:anywhere; }.character-card .portrait { height:140px; margin:-10px -10px 18px; border-radius:7px; background:var(--sdn-11151b, #11151b); display:grid; place-items:center; color:var(--sdn-6a8b96, #6a8b96); }.character-card img { width:100%; height:100%; object-fit:cover; border-radius:7px; }.character-card a { display:block; }.character-card dl { display:grid; grid-template-columns:90px 1fr; font-size:12px; margin:12px 0 0; }.character-card dt { color:var(--sdn-aa98a2, #aa98a2); }.character-card dd { margin:0; overflow-wrap:anywhere; }.app-empty { padding:40px 20px; text-align:center; color:var(--sdn-b6a8b0, #b6a8b0);   }
.forum-row { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:22px 24px; border-bottom:1px solid var(--sdn-85415835, #85415835); }.forum-row:last-child { border:0; }.forum-row:hover { background:var(--sdn-39192366, #39192366); }.forum-row strong { display:block; font-size:20px; }.forum-row small { color:var(--sdn-9fafb7, #9fafb7); }.forum-list { padding:0; overflow:hidden; }.app-actions { display:flex; gap:10px; justify-content:flex-end; margin-top:18px; }.app-pill { display:inline-block; background:var(--sdn-492130, #492130); padding:4px 9px; border-radius:20px; font-size:11px; color:var(--sdn-a0e5eb, #a0e5eb); margin-right:6px; }
.forum-post { display:grid; grid-template-columns:205px minmax(0,1fr); padding:0; overflow:hidden; margin:20px 0; }.post-author { padding:20px; background:var(--sdn-14151b, #14151b); border-right:1px solid var(--sdn-85415840, #85415840); }.post-author h3 { color:var(--character-color,var(--sdn-75e3eb, var(--color-accent,#75e3eb))); overflow-wrap:anywhere; }.post-author img { width:100%; aspect-ratio:2/3; object-fit:cover; border-radius:8px; margin:12px 0; }.post-author .portrait-empty { aspect-ratio:2/3; display:grid; place-items:center; background:var(--sdn-24232d, #24232d); border-radius:8px; margin:12px 0; font-size:12px; color:var(--sdn-9bb4bc, #9bb4bc); }.post-body { padding:28px; min-width:0; }.post-body header { color:var(--sdn-a897a1, #a897a1); font-size:12px; border-bottom:1px solid var(--sdn-85415844, #85415844); padding-bottom:14px; margin-bottom:24px; }.post-copy { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.9; }.post-ranks { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; font:11px Consolas,monospace; }.post-ranks strong { display:block; color:var(--sdn-75e3eb, var(--color-accent,#75e3eb)); }.reply-box { margin-top:24px; }.reply-box label { display:block; margin:12px 0; }.app-footer { display:flex; justify-content:space-between; padding:10px 30px; font:10px Consolas,monospace; color:var(--sdn-9fa4ad, #9fa4ad); background:var(--sdn-111317, #111317); border-top:1px solid var(--sdn-74304755, #74304755); gap:15px; }
#profile-views { max-width:1250px; margin:auto; }#profile-views iframe,#catalog-view iframe { width:100%; border:0; height:calc(100dvh - 205px); min-height:400px; display:block; border-radius:12px; }#app-dialog { background:var(--sdn-1b1b23, #1b1b23); color:var(--sdn-eee6ea, #eee6ea); border:1px solid var(--sdn-743047, #743047); border-radius:12px; padding:26px; width:min(540px,95vw); }#app-dialog::backdrop { background:#000a; }#app-dialog label { display:flex; flex-direction:column; gap:6px; margin-top:16px; }#app-form-error { color:var(--sdn-ffb5c3, #ffb5c3); }#app-toast { position:absolute; bottom:50px; right:24px; color:var(--sdn-75e3eb, var(--color-accent,#75e3eb)); }.player-field { margin-top:24px; }.player-field a { display:block; padding:12px; border-bottom:1px solid var(--sdn-85415844, #85415844); }
@media(max-width:1000px) { .app-header { gap:12px; padding:14px; flex-wrap:wrap; }.app-header nav { order:3; flex-basis:100%; overflow:auto; }.account-link { margin-left:auto; }.app-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:650px) { #app-workspace { padding:18px 12px; }.app-header nav a { font-size:12px; padding:9px 11px; }.app-grid,.app-split { grid-template-columns:1fr; }.app-heading { flex-wrap:wrap; }.app-panel { padding:18px; }.forum-list { padding:0; }.forum-post { display:block; padding:0; }.post-author { border-right:0; border-bottom:1px solid var(--sdn-85415840, #85415840); display:grid; grid-template-columns:70px minmax(0,1fr); gap:10px; }.post-author img,.post-author .portrait-empty { grid-column:1; grid-row:1/5; margin:0; }.post-author h3,.post-author p,.post-ranks { grid-column:2; margin:0; }.post-body { padding:20px; }.app-footer { padding:8px 12px; flex-wrap:wrap; font-size:9px; }.app-footer span:last-child { display:none; } }
@media(prefers-reduced-motion:reduce) { }
#community-app .character-card .portrait { width:auto; aspect-ratio:auto; }

/* A windowed/cased element (a character sheet, a thread, a card) carries its own
   accent as one of these custom properties, set closest to where it's needed
   (--sheet-accent on the sheet window, --character-color on a character card,
   --thread-frame-accent on a thread). Chaining them as one fallback here means the
   scrollbar on anything inside such a container automatically picks up whichever
   accent is actually in scope — its own coloration, or an accent to it — without
   needing a separate scrollbar rule per container type. Elements with none of
   these in their ancestry keep the same neutral default as before. */
#community-app * { --scrollbar-accent:var(--sheet-accent,var(--character-color,var(--thread-frame-accent,var(--name-icon-color,var(--sdn-6c3b4c, #6c3b4c))))); scrollbar-color:var(--scrollbar-accent) var(--sdn-16171d, #16171d); scrollbar-width:thin; }
#community-app *::-webkit-scrollbar { width:7px; height:4px; }
#community-app *::-webkit-scrollbar-track { background:var(--sdn-16171d, #16171d); }
#community-app *::-webkit-scrollbar-thumb { background:var(--scrollbar-accent); border-radius:8px; }

.faction-banner { height:150px; background:var(--sdn-15171e, #15171e); border-radius:8px; overflow:hidden; display:grid; place-items:center; color:var(--sdn-75e3eb, var(--color-accent,#75e3eb)); margin-bottom:18px; }.faction-banner img { width:100%; height:100%; object-fit:cover; }.faction-identity { display:flex; align-items:center; gap:14px; margin-bottom:16px; }.faction-identity img { width:60px; height:60px; object-fit:contain; border-radius:7px; }.faction-detail>img { width:100%; max-height:300px; object-fit:cover; border-radius:8px; margin-bottom:20px; }.faction-card h2 { overflow-wrap:anywhere; }

/* Persistent compact navigation outside the scrolling workspace. */
.app-body { display:flex; flex:1; min-height:0; position:relative; }
.app-content { display:flex; flex-direction:column; flex:1; min-width:0; }
#community-app.has-sidebar .app-header nav { display:none; }
#community-app.has-sidebar .account-link { margin-left:auto; }
#app-sidebar { width:204px; flex:none; padding:14px 10px; background:var(--sdn-14151bed, #14151bed); border-right:1px solid var(--sdn-693044, #693044); display:flex; flex-direction:column; position:fixed; top:var(--header-height,64px); left:0; height:calc(100vh - var(--header-height,64px)); overflow-y:auto; box-sizing:border-box; z-index:10100; box-shadow:8px 0 24px #0007; transition:width .28s cubic-bezier(.2,.7,.2,1); }
#community-app #sidebar-toggle { width:100%; display:flex; align-items:center; gap:13px; min-height:43px; padding:10px; border-radius:7px; margin-bottom:10px; background:transparent; border:0; color:var(--sdn-75e3eb, var(--color-accent,#75e3eb)); text-align:left; flex:none; cursor:pointer; }
#sidebar-toggle-icon{flex:0 0 21px}
#sidebar-toggle span { font:700 10px Consolas,monospace; letter-spacing:1.5px; }
#sidebar-links { display:flex; flex-direction:column; gap:5px; flex:none; }
#sidebar-links a { display:flex; align-items:center; gap:13px; min-height:43px; padding:10px; border-radius:7px; font-size:13px; font-weight:600; white-space:nowrap; }
#sidebar-links svg { flex:0 0 21px; color:var(--sdn-9cbbc3, #9cbbc3); }
.sidebar-link-icon{flex:0 0 21px;display:inline-flex;align-items:center;justify-content:center;font-size:16px;line-height:1}
#sidebar-footer-actions{flex:none;margin-top:14px;padding-top:10px;border-top:1px solid var(--sdn-693044, #693044);display:flex;flex-direction:column;gap:5px}
#sidebar-footer-actions button,#sidebar-footer-actions a{display:flex;align-items:center;gap:13px;min-height:43px;padding:10px;border-radius:7px;font-size:13px;font-weight:600;white-space:nowrap;background:transparent;border:0;color:inherit;text-align:left;width:100%;cursor:pointer;text-decoration:none}
/* The neutral skin's blanket `:is(button,.app-pill){background:...}` rule (neutral-forum.css) outranks the plain rule above on specificity, so it was winning and leaving a permanent background on these icon buttons at all times, not just on hover. These two extra-ID selectors outrank it back, restoring the transparent-except-on-hover look these buttons should share with the rest of the sidebar. */
#community-app #sidebar-footer-actions button,#community-app #sidebar-footer-actions a,#community-app #sidebar-links .bookmarks-menu{background:transparent;border:0;border-color:transparent;color:inherit;box-shadow:none;text-shadow:none}
/* Same hover treatment as the regular nav links above (background highlight + brightened icon), so Edit sidebar / Discord / Log out read as consistent with the rest of the menu. */
#sidebar-footer-actions svg{flex:0 0 21px;color:var(--sdn-9cbbc3, #9cbbc3);transition:color .12s ease}
#sidebar-footer-actions button:hover,#sidebar-footer-actions a:hover{background:var(--sdn-ffffff08, #ffffff08)}
#sidebar-footer-actions button:hover svg,#sidebar-footer-actions a:hover svg{color:var(--sdn-b9eaf0, #b9eaf0)}
#sidebar-footer-actions #sidebar-logout:hover{color:#ffb3b3}
#sidebar-footer-actions #sidebar-logout:hover svg{color:#ffb3b3}
.sidebar-collapsed #sidebar-footer-actions button span,.sidebar-collapsed #sidebar-footer-actions a span{display:none}
#sidebar-links svg{transition:color .12s ease}
#sidebar-links a:hover { background:var(--sdn-ffffff08, #ffffff08); }#sidebar-links a:hover svg { color:var(--sdn-b9eaf0, #b9eaf0); }#sidebar-links a[aria-current=page] { background:var(--sdn-5b2033, var(--color-accent-pending,#5b2033)); color:var(--sdn-91edf4, #91edf4); }#sidebar-links a[aria-current=page] svg { color:var(--sdn-91edf4, #91edf4); }
#community-app.sidebar-collapsed #app-sidebar { width:64px; padding:14px 10px; }
.sidebar-collapsed #sidebar-links a span,.sidebar-collapsed #sidebar-toggle span { display:none; }
#community-app #app-back { background:transparent; border:1px solid var(--sdn-693044, #693044); border-radius:5px; padding:5px 10px; color:var(--sdn-b9eaf0, #b9eaf0); font:600 12px 'Segoe UI',sans-serif; white-space:nowrap; }
/* Backdrop dims the rest of the page and closes the sidebar on outside click, whenever it's expanded — at every viewport width. Kept permanently in the layout (never display:none) and faded via opacity instead, so it eases in alongside the sidebar's own width transition rather than popping in as a hard "jump" the instant the sidebar starts opening. */
#community-app #sidebar-dismiss { display:block; position:absolute; top:var(--header-height,64px); left:204px; right:0; z-index:10099; border:0; border-radius:0; background:linear-gradient(90deg,#000000b0 0%,#00000078 22%,#0000002e 55%,#00000000 85%); padding:0; cursor:default; opacity:0; pointer-events:none; transition:opacity .22s ease; }
/* The main content the sidebar itself sits over is still "page content" and should read as dimmed too, so a flat backing tint (matching the gradient's darkest stop) sits behind the sidebar's own footprint; the sidebar's z-index keeps it rendering crisply on top regardless. */
#community-app #sidebar-dismiss::before { content:''; position:absolute; top:0; left:-204px; width:204px; bottom:0; background:#000000b0; }
#community-app:not(.sidebar-collapsed) #sidebar-dismiss:not([hidden]) { opacity:1; pointer-events:auto; }
/* Overrides the site-wide [hidden]{display:none} rule so the fade above can actually run in both directions; opacity+pointer-events already make it fully inert while hidden. */
#community-app #sidebar-dismiss[hidden] { display:block!important; opacity:0; pointer-events:none; }
@media(prefers-reduced-motion:reduce) { #sidebar-dismiss { transition:none; } }
@media(max-width:1000px) { #community-app.has-sidebar .app-header { flex-wrap:nowrap; } }
@media(max-width:650px) {
 #community-app.has-sidebar .app-content { margin-left:56px; }
 #community-app.sidebar-collapsed #app-sidebar { width:56px; padding:10px 6px; }
 #sidebar-links a { min-height:44px; }.app-body #app-workspace { padding:18px 10px; }
}

/* Character directory: compact profiles alongside a dedicated filter column. */
.character-directory { display:grid; grid-template-columns:200px minmax(0,1fr); gap:24px; align-items:start; }
.character-results { min-width:0; }
#community-app .character-filters { display:flex; flex-direction:column; gap:18px; margin:0; padding:18px;   position:sticky; top:0; }
#community-app .character-filters h2 { font-size:12px; text-transform:uppercase; letter-spacing:1px; margin:0; }
.character-filters label { font-weight:700; gap:7px; }
#community-app .character-filters input,#community-app .character-filters select { width:100%; min-width:0; font-size:13px; }
#community-app #clear-character-filters { padding:6px 0; background:transparent; border:0; text-align:left; color:var(--sdn-a4b4bd, #a4b4bd); font-size:12px; }
#community-app #character-count { margin:0 0 12px; font-size:12px; }
#character-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,310px),1fr)); gap:12px; }
#community-app .character-card { display:grid; grid-template-columns:88px minmax(0,1fr); overflow:hidden; min-width:0;      }
#community-app .character-card:hover {  }
#community-app .character-card-portrait { display:grid; place-items:center; background:var(--sdn-101217, #101217); min-height:158px; overflow:hidden; color:var(--character-color); }
#community-app .character-card-portrait img { display:block; width:100%; height:100%; object-fit:cover; border-radius:0; }
.character-card-portrait svg { width:38px; fill:none; stroke:currentColor; stroke-width:1.5; opacity:.4; }
.character-card-info { min-width:0; padding:13px 14px; }
.character-card-tags { display:flex; align-items:center; flex-wrap:wrap; gap:6px 10px; font-size:10px; line-height:1.4; text-transform:uppercase; font-weight:700; color:var(--character-color); margin-bottom:8px; }
#community-app .character-card h2 { font-size:18px; line-height:1.2; margin:0 0 5px; color:var(--character-color); }
#community-app .character-card .character-codename { font-size:12px; margin:0 0 8px; color:var(--sdn-c7cbd0, #c7cbd0); overflow-wrap:anywhere; }
#community-app .character-card dl { grid-template-columns:68px minmax(0,1fr); gap:3px 7px; font-size:11px; line-height:1.5; margin:10px 0 0; }
#community-app .character-card dt { color:var(--sdn-969da7, #969da7); }
#community-app .character-card dd a { display:inline; }
#community-app .character-card dd a:hover { color:var(--character-color); text-decoration:underline; }
@media(max-width:850px) { .character-directory { grid-template-columns:170px minmax(0,1fr); gap:16px; } #community-app .character-filters { padding:14px; } }
@media(max-width:650px) { .character-directory { grid-template-columns:1fr; gap:18px; } #community-app .character-filters { position:static; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .character-filters h2,.character-filters label:first-of-type,.character-filters button { grid-column:1/-1; } #community-app .character-card { grid-template-columns:70px minmax(0,1fr); } .character-card-info { padding:12px; } }
.index-banner-welcome-panel { display:flex; flex-direction:column; align-items:flex-start; gap:6px; }
.index-banner-discord { display:inline-flex; align-items:center; gap:7px; padding:7px 12px; border-radius:999px; background:var(--color-accent-pending,#5b2033); font-size:12px; font-weight:700; }
.index-banner-discord:hover { color:var(--sdn-8be3eb, #8be3eb); }
.welcome-intro { position:relative; overflow:hidden; padding:clamp(24px,5vw,64px); border-radius:12px; background:linear-gradient(110deg,var(--sdn-101319, #101319) 40%,var(--sdn-351b28, #351b28)); border:1px solid var(--sdn-ffffff0a, #ffffff0a); }
.welcome-intro::after { content:''; position:absolute; top:-100px; right:-100px; width:380px; height:650px; transform:rotate(25deg); border:1px solid var(--sdn-75e3eb12, #75e3eb12); box-shadow:40px 0 0 var(--sdn-75e3eb04, #75e3eb04),80px 0 0 var(--sdn-75e3eb03, #75e3eb03); pointer-events:none; }
.welcome-intro>* { position:relative; z-index:1; }
#community-app .welcome-intro h1 { font-size:clamp(32px,4.5vw,62px); max-width:15ch; margin-bottom:24px; }
#community-app .welcome-lead { font-size:clamp(17px,2vw,22px); color:var(--sdn-8be3eb, #8be3eb); line-height:1.5; }
.welcome-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.welcome-actions a { padding:11px 17px; border-radius:6px; font-size:13px; font-weight:700; background:var(--sdn-5b2033, var(--color-accent-pending,#5b2033)); }
.welcome-actions a:last-child { background:var(--sdn-ffffff08, #ffffff08); }.welcome-actions a:hover { color:var(--sdn-8be3eb, #8be3eb); }.welcome-actions span { margin-left:14px; }
.welcome-onboarding { display:grid; grid-template-columns:1fr 1.6fr; gap:30px; padding:32px 4px; }
#community-app .welcome-onboarding h2 { font-size:22px; margin-top:9px; }
#community-app .welcome-onboarding p { font-size:14px; color:var(--sdn-b9b3bc, #b9b3bc); }
#community-app .welcome-onboarding a { color:var(--sdn-8be3eb, #8be3eb); text-decoration:underline; text-underline-offset:3px; }
@media(max-width:650px) { .welcome-onboarding { grid-template-columns:1fr; gap:8px; }.welcome-intro::after { opacity:.4; }.welcome-actions { flex-direction:column; } }

/* Persistent city map beneath the app content; no moving or interactive overlays. */
#community-app {
 background-color:var(--sdn-12161b, #12161b);
 background-image:linear-gradient(90deg,var(--sdn-12161b12, #12161b12),var(--sdn-12161b55, #12161b55) 48%,var(--sdn-12161b05, #12161b05)),radial-gradient(ellipse at 25% 10%,var(--sdn-25434a22, #25434a22),transparent 65%),url('/assets/city-dispatch-map.svg');
 background-position:center;
 background-size:cover,cover,cover;
 background-repeat:no-repeat;
}

/* One persistent map layer pans behind the stationary application shell. */
#community-app { isolation:isolate; overflow:hidden; background:var(--sdn-12161b, #12161b); }
#community-app::before { content:''; position:absolute; z-index:-1; inset:-100%; pointer-events:none; background:linear-gradient(90deg,var(--sdn-12161b12, #12161b12),var(--sdn-12161b55, #12161b55) 48%,var(--sdn-12161b05, #12161b05)),url('/assets/city-dispatch-map.svg') center/cover no-repeat; transform:translate(var(--map-x,0%),var(--map-y,0%)); transition:transform 1650ms cubic-bezier(.22,.68,.18,1); }








@media(prefers-reduced-motion:reduce) { #community-app::before { transition:none; } }

.faction-roster { margin-top:28px; padding:24px;   }
.roster-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:22px; }
#community-app .roster-heading h2 { margin:0; }.roster-heading h2 span { font-size:14px; color:var(--sdn-75e3eb, var(--color-accent,#75e3eb)); margin-left:8px; }
#community-app .roster-heading button { font-size:12px; padding:7px 12px; }
.faction-role+.faction-role { margin-top:24px; }
#community-app .faction-role h3 { border-bottom:1px solid var(--sdn-ffffff12, #ffffff12); padding-bottom:8px; font-size:12px; letter-spacing:1px; }
.faction-members { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr)); gap:12px; }
.faction-member { display:flex; align-items:center; gap:12px; padding:12px;   min-width:0; }
.faction-member-avatar { width:42px; height:54px; flex-shrink:0; background:var(--sdn-11141a, #11141a); display:grid; place-items:center; color:var(--character-color); border-radius:4px; overflow:hidden; }.faction-member-avatar img { width:100%; height:100%; object-fit:cover; }
.faction-member-info { flex:1; min-width:0; overflow-wrap:anywhere; }.faction-member-info strong { color:var(--character-color); font-size:14px; }#community-app .faction-member-info p { font-size:12px; margin:2px 0; }.faction-member-info small { color:var(--sdn-959da8, #959da8); font-size:11px; }
.faction-member-actions { display:flex; gap:4px; }#community-app .faction-member-actions button { padding:3px 7px; background:transparent; border:0; color:var(--sdn-b8c9d0, #b8c9d0); }#community-app .faction-member-actions button:hover { background:var(--sdn-5b2033, var(--color-accent-pending,#5b2033)); color:white; }
@media(max-width:650px) { .faction-roster { padding:16px; }.roster-heading { flex-wrap:wrap; } }

/* Ambient dispatch traffic is decorative and never intercepts input. */
.dispatch-ambience { position:absolute; inset:110px 24px 55px 225px; z-index:-1; pointer-events:none; overflow:hidden; }
.dispatch-signal { position:absolute; left:var(--signal-x); top:var(--signal-y); color:#e9bd50; display:flex; align-items:center; gap:12px; animation:dispatch-arrival 7s ease both; }
.dispatch-beacon { position:relative; display:grid; place-items:center; width:30px; height:30px; border:1px solid #e9bd5070; border-radius:50%; font:900 20px 'Segoe UI',sans-serif; text-shadow:0 0 12px #ffd46a66; animation:dispatch-blink 1.7s ease-in-out 3; }
.dispatch-beacon::after { content:''; position:absolute; inset:-9px; border:1px solid #e9bd5030; border-radius:50%; animation:dispatch-ring 2s ease-out 3; }
.dispatch-transmission { width:190px; padding:9px 12px; background:var(--sdn-11171cdd, #11171cdd); border-left:2px solid #d6a94170; font:10px/1.6 Consolas,monospace; letter-spacing:.4px; }
.dispatch-transmission small { display:block; font-size:8px; color:var(--sdn-8e9fa6, #8e9fa6); letter-spacing:1.5px; margin-bottom:3px; }.dispatch-transmission span { color:var(--sdn-bccbd0, #bccbd0); }
@keyframes dispatch-arrival { 0%,100% { opacity:0; transform:translateY(5px); } 10%,82% { opacity:.85; transform:translateY(0); } }
@keyframes dispatch-blink { 0%,100% { opacity:.45; } 50% { opacity:1; } }
@keyframes dispatch-ring { from { transform:scale(.65); opacity:.8; } to { transform:scale(1.65); opacity:0; } }
.sidebar-collapsed .dispatch-ambience { left:85px; }
@media(max-width:650px) { .dispatch-ambience,.sidebar-collapsed .dispatch-ambience { left:75px; right:12px; }.dispatch-transmission { width:145px; font-size:9px; } }
@media(prefers-reduced-motion:reduce) { .dispatch-ambience { display:none; } }

/* Faction directory and detail surfaces let the city map show through. */
#community-app .faction-card,#community-app .faction-detail,#community-app .faction-roster { background:rgba(8,11,16,.8); border:1px solid var(--sdn-ffffff12, #ffffff12); box-shadow:0 8px 24px #0002; }
#community-app .faction-card { display:flex; flex-direction:column; transition:background-color .18s,border-color .18s; }
#community-app .faction-card:hover {   }
#community-app .faction-card .faction-banner { background:var(--sdn-11182088, #11182088); }
#community-app .faction-card .faction-identity h2 { margin:0; font-size:21px; }
#community-app .faction-card>.app-muted { flex:1; }
.faction-card-footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; border-top:1px solid var(--sdn-ffffff10, #ffffff10); padding-top:13px; font-size:11px; color:var(--sdn-a4adb6, #a4adb6); }
.faction-card-footer strong { color:var(--sdn-75e3eb, var(--color-accent,#75e3eb)); font-size:12px; }.faction-card-footer strong span { margin-left:8px; }
@media(prefers-reduced-motion:reduce) { #community-app .faction-card { transition:none; } }

/* SHARED SURFACE SYSTEM — all main-app content containers use app-surface.
   Keep appearance here; page selectors only own layout and content sizing. */
#community-app {
 --surface-fill:rgba(8,11,16,.82);
 --surface-hover:rgba(8,11,16,.9);
 --surface-border:rgba(255,255,255,.10);
 --surface-radius:8px;
 --surface-shadow:0 8px 24px #0002;
 --surface-space:24px;
 --surface-compact:16px;
 --surface-inset:rgba(255,255,255,.025);
 /* Semantic color tokens — swap these to re-theme the whole app.
    See THEME-TOKENS.md for the full inventory and migration plan. */
 --color-accent:#75e3eb;
 --color-accent-secondary:#713219;
 --color-accent-pending:#5b2033;
 --color-accent-default:#ffc45b;
}
#community-app .app-surface {
 background:var(--surface-fill);
 border:1px solid var(--surface-border);
 border-radius:var(--surface-radius);
 box-shadow:var(--surface-shadow);
}
#community-app :is(.app-panel,.faction-roster,.welcome-intro,.welcome-onboarding) { padding:var(--surface-space); }
#community-app :is(.character-filters,.chapter-list,.faction-member) { padding:var(--surface-compact); }
#community-app :is(.forum-list,.forum-post,.character-card) { padding:0; }
#community-app .welcome-onboarding { margin-top:24px; }
#community-app .welcome-intro::after { display:none; }
#community-app :is(.character-card,.faction-card):hover { background:var(--surface-hover); border-color:var(--sdn-75e3eb55, #75e3eb55); }
#community-app .character-card { border-left:3px solid var(--character-color,var(--sdn-75e3eb, var(--color-accent,#75e3eb))); }
#community-app .character-card:hover { border-left-color:var(--character-color,var(--sdn-75e3eb, var(--color-accent,#75e3eb))); }
#community-app .app-surface .app-empty { background:transparent; border:0; box-shadow:none; }
#community-app :is(.faction-member,.post-author) { background:var(--surface-inset); box-shadow:none; }
#community-app :is(.character-card-portrait,.faction-banner,.portrait-empty) { background:var(--surface-inset); }
#community-app .faction-card .faction-banner { background:var(--surface-inset); }
#community-app :is(.forum-row,.post-author,.post-body header,.faction-role h3,.faction-card-footer) { border-color:var(--surface-border); }
#community-app :is(.forum-row,.post-body) { padding:var(--surface-space); }
#app-dialog { background:rgba(8,11,16,.96); border:1px solid var(--surface-border); border-radius:var(--surface-radius); padding:var(--surface-space); box-shadow:var(--surface-shadow); }
/* #community-app's `contain:layout` makes it the positioning container for this dialog's
   native `position:fixed`/`inset:0` box, and with an explicit width set, that leaves the
   box pinned flush to the top-left corner instead of centered — the auto-margin centering
   trick needs `margin:auto` spelled out explicitly here rather than relying on the UA
   dialog default, which isn't taking effect inside a `contain`-ed ancestor. */
#app-dialog { margin:auto; max-height:85vh; box-sizing:border-box; }
#app-dialog form{display:flex;flex-direction:column;max-height:85vh;}
#app-dialog #app-dialog-content{overflow-y:auto;order:2;}
#app-dialog #app-form-error{order:1;}
#app-dialog .app-actions{order:0;position:sticky;top:0;z-index:5;justify-content:flex-end;gap:10px;margin:calc(var(--surface-space,26px) * -1) calc(var(--surface-space,26px) * -1) 14px;padding:14px var(--surface-space,26px);background:rgba(8,11,16,.96);border-bottom:1px solid var(--surface-border);}
@media(max-width:650px) { #community-app { --surface-space:16px; --surface-compact:12px; } }

/* Section environments. Only World location changes animate the map. */
#community-app::before { opacity:0; transition:none; }
#community-app::after { content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(90deg,var(--sdn-12161b44, #12161b44),var(--sdn-12161b88, #12161b88) 50%,var(--sdn-12161b44, #12161b44)),var(--section-scene) center/cover no-repeat; opacity:.32; }
#community-app[data-scene=world]::before { opacity:1; }
#community-app[data-scene=world]::after { display:none; }
#community-app[data-scene=world][data-map-pan=true]::before { transition:transform 1650ms cubic-bezier(.22,.68,.18,1); }
#community-app[data-world-location=overview] { --map-x:0%; --map-y:0%; }
#community-app[data-world-location=united-states] { --map-x:12%; --map-y:5%; }
#community-app[data-world-location=new-york] { --map-x:23%; --map-y:-16%; }
#community-app[data-world-location=new-jersey] { --map-x:12%; --map-y:-23%; }
#community-app[data-world-location=florida] { --map-x:-18%; --map-y:23%; }
#community-app[data-world-location=other-us] { --map-x:-24%; --map-y:-12%; }
#community-app[data-world-location=around-the-world] { --map-x:-9%; --map-y:12%; }
#community-app[data-scene=characters],#community-app[data-scene=player] { --section-scene:url('/assets/backdrop-records-office.webp'); }
#community-app[data-scene=guidebook] { --section-scene:url('/assets/backdrop-manual-office.webp'); }
#community-app[data-scene=factions] { --section-scene:url('/assets/backdrop-factions-office.webp'); }
#community-app[data-scene=rules] { --section-scene:url('/assets/backdrop-rules-handbook.webp'); }
#community-app[data-scene=welcome] { --section-scene:url('/assets/backdrop-welcome-office.webp'); }
#community-app[data-scene=events] { --section-scene:url('/assets/backdrop-events-office.webp'); }
#community-app:not([data-scene=world]) .dispatch-ambience { display:none; }
@media(prefers-reduced-motion:reduce) { #community-app[data-scene=world][data-map-pan=true]::before { transition:none; } }

/* Responsive artwork: fill the viewport, preserve proportions, never tile.
   Per-scene focal points keep the office props in frame on portrait displays. */
#community-app { --scene-focus-x:50%; --scene-focus-y:50%; }
#community-app::after { background-size:100% 100%,cover; background-repeat:no-repeat; background-position:center,var(--scene-focus-x) var(--scene-focus-y); }
#community-app[data-scene=welcome] { --scene-focus-x:65%; }
#community-app[data-scene=events] { --scene-focus-x:72%; }
#community-app:is([data-scene=welcome],[data-scene=events])::after {
 opacity:1;
 background-image:linear-gradient(90deg,var(--sdn-080d1640, #080d1640),var(--sdn-080d161a, #080d161a) 55%,var(--sdn-080d160d, #080d160d)),var(--section-scene);
}
/* Tall windows and phones: favor the right-hand desk and briefing materials. */
@media(max-aspect-ratio:1/1) {
 #community-app[data-scene=welcome] { --scene-focus-x:78%; }
 #community-app[data-scene=events] { --scene-focus-x:94%; }
}
/* Ultrawide screens: retain the lower desk edge rather than cropping it away. */
@media(min-aspect-ratio:21/9) {
 #community-app:is([data-scene=welcome],[data-scene=events]) { --scene-focus-x:50%; --scene-focus-y:76%; }
}

/* Illustrated setting-wide backdrops and a geographic dispatch camera. */
#community-app::after { opacity:1; background-image:linear-gradient(90deg,var(--sdn-080d1640, #080d1640),var(--sdn-080d161a, #080d161a) 55%,var(--sdn-080d160d, #080d160d)),var(--section-scene); }
#community-app[data-scene=characters],#community-app[data-scene=player] { --scene-focus-x:76%; }
#community-app[data-scene=guidebook],#community-app[data-scene=rules] { --scene-focus-x:72%; }
#community-app[data-scene=factions] { --scene-focus-x:80%; }
#community-app::before,#community-app[data-scene=world]::before { display:none; }
.world-backdrop { position:absolute; inset:84px 0 32px 204px; z-index:-1; pointer-events:none; overflow:hidden; background:var(--sdn-142a35, #142a35); display:none; }
#community-app[data-scene=world] .world-backdrop { display:block; }
.sidebar-collapsed .world-backdrop { left:64px; }
.world-backdrop::after { content:''; position:absolute; inset:0; box-shadow:inset 0 0 120px var(--sdn-07131fbb, #07131fbb); background:repeating-linear-gradient(0deg,transparent 0 3px,var(--sdn-020d1218, #020d1218) 3px 4px); }
.world-map-caption { position:absolute; right:25px; bottom:24px; z-index:1; border-left:3px solid #e3b752; background:var(--sdn-091c25e8, #091c25e8); padding:12px 18px; color:var(--sdn-d5e3de, #d5e3de); }
.world-map-caption span,.world-map-caption small { display:block; font:9px Consolas,monospace; letter-spacing:2px; color:var(--sdn-86afb0, #86afb0); }.world-map-caption strong { display:block; font:800 19px 'Segoe UI',sans-serif; letter-spacing:1px; margin:6px 0; }
.dispatch-beacon { border-radius:5px; background:#d1a448; color:var(--sdn-15232a, #15232a); text-shadow:none; border:2px solid var(--sdn-10232c, #10232c); box-shadow:3px 3px 0 var(--sdn-07141daa, #07141daa); }
.dispatch-beacon::after { border-radius:7px; border-color:#d1a44880; }
.dispatch-transmission { border:1px solid var(--sdn-558084, #558084); border-left:3px solid #d1a448; background:var(--sdn-0d232bed, #0d232bed); box-shadow:3px 3px 0 var(--sdn-06151b88, #06151b88); }
@keyframes dispatch-arrival { 0%,100% { opacity:0; transform:translateY(3px); } 8%,85% { opacity:1; transform:translateY(0); } }
@media(max-width:650px) { .world-backdrop,.sidebar-collapsed .world-backdrop { inset:77px 0 38px 56px; }.world-map-caption { right:12px; bottom:12px; padding:8px 10px; }.world-map-caption strong { font-size:14px; } }
.world-location-pin { position:absolute; left:0; top:0; width:12px; height:12px; margin:-6px; border:2px solid var(--sdn-132c35, #132c35); border-radius:50%; background:#dfb54e; box-shadow:0 0 0 4px #dfb54e22; }

.world-map-texture { position:absolute; left:0; top:0; transform-origin:0 0; will-change:transform; backface-visibility:hidden; opacity:.8; }
.world-backdrop { contain:layout paint; }
.district-signal { position:absolute;width:9px;height:9px;border:2px solid #e5cc83;border-radius:50%;background:#224849;box-shadow:0 0 0 5px #ddc47715;z-index:1; }
.district-signal::after { content:'';position:absolute;inset:-3px;border:1px solid #e5cc8380;border-radius:50%;animation:district-pulse 5s ease-out infinite; }
@keyframes district-pulse { 0% { transform:scale(1);opacity:.7; }45%,100% { transform:scale(4);opacity:0; } }
@media(prefers-reduced-motion:reduce) {.district-signal::after { animation:none; } }
/* Avoid the costly full-screen inset shadow during composited map motion. */
.world-backdrop::after { box-shadow:none; background:radial-gradient(ellipse at center,transparent 45%,var(--sdn-07131f66, #07131f66)),repeating-linear-gradient(0deg,transparent 0 3px,var(--sdn-020d1210, #020d1210) 3px 4px); }

/* Dispatch-console section change: a restrained diagonal scan, no flash. */
.app-content { position:relative; overflow:hidden; }
@media(prefers-reduced-motion:reduce) { }

/* Move between illustrated office viewpoints; no scan-strip overlay. */
#community-app::after { z-index:-2; transform-origin:50% 55%; }
@media(prefers-reduced-motion:reduce) { }

/* Characters: physical split-flap leaderboard from the dispatch office. */
#community-app[data-scene=characters] { --section-scene:url('/assets/backdrop-character-rankings.webp'); --scene-focus-x:78%; --scene-focus-y:45%; }
@media(max-aspect-ratio:1/1) { #community-app[data-scene=characters] { --scene-focus-x:86%; } }
@media(prefers-reduced-motion:reduce) { }

/* Keep the handbook and coffee in frame on narrow screens. */
#community-app[data-scene=rules] { --scene-focus-x:76%; --scene-focus-y:50%; }
@media(max-aspect-ratio:1/1) { #community-app[data-scene=rules] { --scene-focus-x:85%; } }


/* A persistent WebGL office, with no image-wall transition tricks. */
.dispatch-office { position:absolute; inset:84px 0 32px 204px; z-index:-2; overflow:hidden; pointer-events:none; }
.dispatch-office canvas { display:block; width:100%; height:100%; }
.sidebar-collapsed .dispatch-office { left:64px; }
#community-app[data-office-ready=true]::after { display:none; }
#community-app[data-office-travel=true] :is(#app-view,#profile-views) { opacity:0; pointer-events:none; }
#community-app[data-office-ready=true] :is(#app-view,#profile-views) { transition:opacity 180ms ease; }
#community-app[data-office-travel=true] .world-backdrop { opacity:0; }
#community-app[data-office-ready=true] .world-backdrop { transition:opacity 180ms ease; }
@media(max-width:650px) { .dispatch-office,.sidebar-collapsed .dispatch-office { inset:77px 0 38px 56px; } }
@media(prefers-reduced-motion:reduce) { #community-app[data-office-ready=true] :is(#app-view,#profile-views,.world-backdrop) { transition:none; } }

/* Subtle printed pigment and warm edge shading, confined to the office art. */
.dispatch-office::after { content:''; position:absolute; inset:0; pointer-events:none; background-image:var(--office-grain),radial-gradient(ellipse at 54% 40%,transparent 40%,rgba(28,22,20,.25) 100%); }

/* Illustrated front entrance and its inked door-opening transition. */
#community-app[data-scene=welcome] { --section-scene:url('/assets/backdrop-welcome-entrance.webp'); --scene-focus-x:70%; --scene-focus-y:50%; }
@media(max-width:650px) { #community-app[data-scene=welcome] { --scene-focus-x:75%; } }
@media(prefers-reduced-motion:reduce) { }

/* Functional roster is the board itself; the painted wall stays quiet. */
#community-app[data-scene=characters] { --section-scene:url('/assets/backdrop-hero-roster.webp'); --scene-focus-x:70%; }
#community-app .hero-roster { background:var(--sdn-101516f5, #101516f5); border:8px solid #493a30; outline:1px solid #a28b61; border-radius:3px; padding:22px; box-shadow:0 18px 45px #0008,inset 0 0 0 1px #85714c; }
.roster-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:2px 2px 20px; margin-bottom:20px; border-bottom:2px solid #85714c; }
#community-app .roster-heading h1 { font-size:clamp(25px,3vw,40px); letter-spacing:.13em; color:#dfd1ae; margin:5px 0 0; }
.roster-heading span { font:10px Consolas,monospace; letter-spacing:2px; color:var(--sdn-93abad, #93abad); }
#community-app .roster-heading button { font-size:12px; padding:9px 12px; }
#community-app .hero-roster .character-filters { background:transparent; border:0; border-radius:0; box-shadow:none; padding:0 20px 0 0; border-right:1px solid var(--sdn-394344, #394344); }
#community-app .hero-roster .character-card { background:var(--sdn-1b2223, #1b2223); border-top:0; border-radius:2px; box-shadow:none; }
#community-app .hero-roster .character-card-portrait { min-height:130px; }
.hero-roster #character-count { margin-top:0; }
@media(max-width:650px) { #community-app .hero-roster { padding:14px; border-width:5px; } .roster-heading { align-items:flex-start; flex-wrap:wrap; } #community-app .hero-roster .character-filters { padding:0 0 16px; border-right:0; border-bottom:1px solid var(--sdn-394344, #394344); } }
@media(prefers-reduced-motion:reduce) { }

/* Keep the entrance visible beside the welcome copy. */
#community-app[data-scene=welcome] .welcome-intro { max-width:600px; background:linear-gradient(120deg,var(--sdn-0b1018f0, #0b1018f0),var(--sdn-0b1018cf, #0b1018cf)); }
#community-app[data-scene=welcome] .welcome-onboarding { max-width:600px; grid-template-columns:1fr; gap:14px; }
#community-app .hero-roster { position:relative; }
#community-app .hero-roster::before,#community-app .hero-roster::after { content:''; position:absolute; top:9px; width:5px; height:5px; border-radius:50%; background:#9b8b6c; box-shadow:0 1px 1px #000; pointer-events:none; }
#community-app .hero-roster::before { left:9px; } #community-app .hero-roster::after { right:9px; }

/* The roster and its cards occupy one perspective plane on the office wall. */
#community-app .hero-roster {
 margin:38px 32px 70px 48px;
 transform:perspective(1900px) rotateY(-7deg) rotateZ(-1.2deg);
 transform-origin:50% 45%;
 border:14px solid #4a3023;
 outline:2px solid #1b120e;
 border-radius:2px;
 background:radial-gradient(ellipse at 65% -15%,#a37c3933,transparent 55%),repeating-linear-gradient(0deg,var(--sdn-ffffff02, #ffffff02) 0 1px,transparent 1px 5px),#141615;
 box-shadow:inset 0 0 0 2px #ac8a4b,inset 0 0 0 6px #27231c,inset 0 10px 35px #0009,8px 10px 0 #271c15,18px 28px 36px #0009;
 padding:28px;
}
#community-app .roster-heading {
 background:linear-gradient(180deg,#66513540,#1b1b17 75%);
 margin:-20px -20px 24px;padding:22px 22px 20px;
 border-top:1px solid #c3a25c88;border-bottom:3px double #a48b53;
}
#community-app .roster-heading h1 {
 font-family:Georgia,'Times New Roman',serif;font-weight:700;
 letter-spacing:.19em;color:#dcc69b;text-shadow:0 2px 2px #000;
}
#community-app .hero-roster .character-card {
 background:linear-gradient(180deg,#2a2c28,#191c1a 48%,#101311 49%,#1d201c 51%,#22251f);
 border:1px solid #575446;border-left:3px solid var(--character-color);
 box-shadow:0 3px 0 #080b09,inset 0 1px 0 #b5a67925;
}
#community-app .hero-roster .character-card:hover { background:linear-gradient(180deg,#34382f,#23291f);border-color:#8e8060;border-left-color:var(--character-color); }
#community-app .hero-roster .character-card-portrait { background:#121612; }
#community-app .hero-roster::before,#community-app .hero-roster::after { width:6px;height:6px;background:radial-gradient(circle at 30% 25%,#e2c883,#73603a 60%,#292216); }
@media(max-width:1000px) { #community-app .hero-roster { margin:24px 15px 50px;transform:perspective(1900px) rotateY(-4deg) rotateZ(-.7deg);padding:20px;border-width:10px; } #community-app .roster-heading { margin:-12px -12px 20px;padding:16px; } }
@media(max-width:650px) { #community-app .hero-roster { margin:10px 3px 25px;transform:rotate(-.4deg);padding:14px;border-width:7px; } #community-app .roster-heading { margin:-6px -6px 18px;padding:12px; } #community-app .roster-heading h1 { font-size:25px;letter-spacing:.08em; } }

/* Reserve four rows of two roster entries; keep the angled wall-board treatment. */
#community-app .roster-heading h1:focus { outline:none; }
#community-app .hero-roster { min-height:790px; }
#community-app .hero-roster #character-cards { grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:minmax(142px,auto); gap:16px; align-content:start; }
#community-app .hero-roster .character-card { grid-template-columns:76px minmax(0,1fr); min-height:142px; }
#community-app .hero-roster .character-card-portrait { min-height:142px; }
#community-app .hero-roster .character-card-info { padding:12px; }
#community-app .hero-roster .character-card h2 { font-size:17px; }
@media(max-width:1100px) { #community-app .hero-roster #character-cards { grid-template-columns:1fr; } #community-app .hero-roster { min-height:760px; } }
@media(max-width:650px) { #community-app .hero-roster { min-height:0; } #community-app .hero-roster #character-cards { grid-auto-rows:minmax(142px,auto); } }
@media(min-width:1101px) { #community-app .hero-roster #character-cards { min-height:616px; } }

/* The page title sits outside the wall-mounted search and roster board. */
#community-app[data-scene=characters] .app-heading h1:focus { outline:none; }
#community-app .hero-roster { margin-top:18px; min-height:720px; }
@media(max-width:1000px) { #community-app .hero-roster { margin-top:14px; min-height:700px; } }
@media(max-width:650px) { #community-app .hero-roster { margin-top:8px; min-height:0; } }

/* Painted scenery replaces the geometric CSS frame; contents share its perspective. */
#community-app .hero-roster {
 border:0;outline:0;border-radius:0;box-shadow:none;
 background:url('/assets/roster-painted-board.webp') center/cover no-repeat;
 padding:100px 8% 85px;
 filter:drop-shadow(9px 17px 12px #0006);
}
#community-app .hero-roster::before,#community-app .hero-roster::after { content:none; }
#community-app .hero-roster .character-card {
 background:linear-gradient(130deg,#36342ee8,#242522e8 70%);
 border:1px solid color-mix(in srgb,var(--character-color) 40%,#292a25);
 border-left:3px solid color-mix(in srgb,var(--character-color) 75%,#292a25);
 box-shadow:0 3px 5px #0006,inset 0 1px #d5c7a514;
}
#community-app .hero-roster .character-card:hover { background:linear-gradient(130deg,#403d33ef,#2a2c25ef);border-color:var(--character-color); }
#community-app .hero-roster .character-card-tags { color:var(--character-color); }
#community-app .hero-roster .character-card h2 { color:var(--character-color);font-weight:700; }
#community-app .hero-roster .character-card-portrait { background:#1d211f99; }
#community-app .hero-roster .character-filters label { color:#c7c0af; }
#community-app .hero-roster .character-filters :is(input,select) { color:#e0dbcd;background:var(--sdn-171c1bd9, #171c1bd9);border-color:#82725266; }
@media(max-width:1000px) { #community-app .hero-roster { padding:85px 8% 70px; } }
@media(max-width:650px) { #community-app .hero-roster { padding:70px 9% 60px; } }

/* Factions are physical photo prints pinned to the illustrated office wall. */
#community-app .faction-photo-wall { grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),340px)); gap:44px 36px; align-items:start; padding:30px 18px 55px; }
#community-app .faction-photo-wall .faction-card {
 position:relative;display:flex;padding:13px 13px 18px;border:1px solid #c6bfab;border-radius:1px;
 color:#302e29;background:repeating-linear-gradient(12deg,#75654c04 0 1px,transparent 1px 4px),linear-gradient(130deg,#eee8d9,#d9d1be);
 box-shadow:2px 4px 5px #0007,7px 13px 16px #0006;
 transform:rotate(-2deg);transform-origin:50% 10px;transition:transform 160ms ease,box-shadow 160ms ease;
}
#community-app .faction-photo-wall .faction-card:nth-child(3n+2) { transform:rotate(1.7deg); }
#community-app .faction-photo-wall .faction-card:nth-child(3n) { transform:rotate(-.8deg); }
#community-app .faction-photo-wall .faction-card::before { content:'';position:absolute;z-index:2;top:-7px;left:calc(50% - 7px);width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 25%,#ead399,#927143 48%,#443625 78%);box-shadow:2px 4px 3px #0008; }
#community-app .faction-photo-wall .faction-card:hover,#community-app .faction-photo-wall .faction-card:focus-visible { transform:rotate(0deg) translateY(-3px);box-shadow:3px 6px 7px #0006,9px 18px 22px #0006;border-color:#b3a37f; }
#community-app .faction-photo-wall .faction-banner { height:auto;aspect-ratio:4/3;margin:0 0 15px;border-radius:0;background:radial-gradient(ellipse,#575d57,var(--sdn-252b29, #252b29));box-shadow:inset 0 0 0 1px #0003; }
#community-app .faction-photo-wall .faction-banner img { display:block;filter:saturate(.82) contrast(.95); }
#community-app .faction-photo-wall .faction-photo-placeholder { color:#c8c5b9;font:700 12px/1.7 Consolas,monospace;letter-spacing:3px;text-align:center;transform:rotate(-5deg); }
#community-app .faction-photo-wall .faction-identity { gap:10px;margin:0 4px 10px; }
#community-app .faction-photo-wall .faction-identity h2 { color:#302e29;font:800 22px/1.15 'Segoe UI',sans-serif;text-transform:uppercase;letter-spacing:.025em; }
#community-app .faction-photo-wall .faction-identity img { width:32px;height:32px;border-radius:0; }
#community-app .faction-photo-wall .faction-card>.app-muted { color:#575347;font-size:13px;line-height:1.55;margin:0 4px 16px; }
#community-app .faction-photo-wall .faction-card-footer { color:#665d4b;border-color:#88795b55;font:11px Consolas,monospace;margin:0 4px; }
#community-app .faction-photo-wall .faction-card-footer strong { color:#584530;font:700 11px 'Segoe UI',sans-serif;text-transform:uppercase; }
@media(max-width:650px) { #community-app .faction-photo-wall { padding:22px 8px 40px;gap:30px; } }
@media(prefers-reduced-motion:reduce) { #community-app .faction-photo-wall .faction-card { transition:none; } }

/* Readable personnel cards, clipped onto the painted roster. */
#community-app .hero-roster #character-cards { grid-auto-rows:minmax(170px,auto);gap:22px 18px; }
#community-app .hero-roster .character-card {
 position:relative;overflow:visible;grid-template-columns:86px minmax(0,1fr);min-height:170px;
 background:repeating-linear-gradient(8deg,var(--sdn-ffffff02, #ffffff02) 0 1px,transparent 1px 4px),linear-gradient(120deg,#45433ceF,#30322ded);
 border:1px solid #81775f;border-left:4px solid var(--character-color);
 box-shadow:2px 5px 7px #0007,inset 0 1px #eee0c32a;
}
#community-app .hero-roster .character-card::before { content:'';position:absolute;top:-8px;left:calc(50% - 10px);width:20px;height:13px;border-radius:3px 3px 1px 1px;background:linear-gradient(90deg,#51442e,#c4b18a 40%,#8a7956 65%,#493e2c);border:1px solid #3a3327;box-shadow:1px 3px 3px #0006;pointer-events:none; }
#community-app .hero-roster .character-card-portrait { min-height:170px;background:#191e1b;overflow:hidden; }
#community-app .hero-roster .character-card-info { padding:16px 15px; }
#community-app .hero-roster .character-card h2 { font-size:22px;line-height:1.22;font-weight:800;margin:0 0 8px; }
#community-app .hero-roster .character-card-tags { font-size:12px;line-height:1.4;gap:7px 10px;margin-bottom:10px; }
#community-app .hero-roster .character-card .character-codename { font-size:15px;color:#e0dccf;margin-bottom:10px; }
#community-app .hero-roster .character-card dl { grid-template-columns:82px minmax(0,1fr);font-size:14px;line-height:1.5;gap:5px 9px;margin-top:10px; }
#community-app .hero-roster .character-card dt { color:#c4beac;font-weight:600; }
#community-app .hero-roster .character-card dd { color:#f0ede2; }
#community-app .hero-roster .character-card:hover { background:linear-gradient(120deg,#504c40,#393c33); }
@media(min-width:1101px) { #community-app .hero-roster #character-cards { min-height:746px; } }
@media(max-width:650px) { #community-app .hero-roster .character-card { grid-template-columns:64px minmax(0,1fr); } #community-app .hero-roster .character-card-info { padding:15px 10px; } #community-app .hero-roster .character-card h2 { font-size:20px; } #community-app .hero-roster .character-card dl { grid-template-columns:1fr;gap:2px; } #community-app .hero-roster .character-card dd { margin-bottom:5px; } }

/* Give the board controls readable sizing and breathing room inside the frame. */
#community-app .hero-roster { padding:135px 10% 105px; }
#community-app .hero-roster .character-directory { grid-template-columns:230px minmax(0,1fr);gap:28px; }
#community-app .hero-roster .character-filters { padding-right:24px;gap:22px; }
#community-app .hero-roster .character-filters h2 { font-size:16px;line-height:1.35;letter-spacing:.04em; }
#community-app .hero-roster .character-filters label { font-size:14px;gap:10px; }
#community-app .hero-roster .character-filters :is(input,select) { font-size:15px;min-height:46px;padding:11px 12px; }
#community-app .hero-roster #clear-character-filters { font-size:14px;padding:8px 0; }
#community-app .hero-roster #character-count { font-size:14px;margin-bottom:20px; }
@media(max-width:1250px) { #community-app .hero-roster .character-directory { grid-template-columns:200px minmax(0,1fr);gap:22px; } }
@media(max-width:1000px) { #community-app .hero-roster { padding:115px 10% 90px; } #community-app .hero-roster .character-directory { grid-template-columns:1fr; } #community-app .hero-roster .character-filters { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));position:static;padding:0 0 24px;border-right:0;border-bottom:1px solid #82725266;gap:16px; } #community-app .hero-roster .character-filters :is(h2,button),#community-app .hero-roster .character-filters label:first-of-type { grid-column:1/-1; } }
@media(max-width:650px) { #community-app .hero-roster { padding:100px 11% 80px; } #community-app .hero-roster .character-filters { grid-template-columns:1fr; } #community-app .hero-roster .character-filters :is(input,select) { font-size:16px; } }

/* Wall-mounted roster display: a quiet monitor housing around the live directory. */
#community-app .hero-roster {
 padding:44px 40px 54px;
 border:18px solid var(--sdn-272c2d, #272c2d);border-bottom-width:32px;border-radius:13px;
 outline:1px solid #525b5c;
 background:radial-gradient(ellipse at 48% 0%,var(--sdn-33515238, #33515238),transparent 65%),linear-gradient(145deg,var(--sdn-111e22, #111e22),var(--sdn-0b1115, #0b1115) 70%);
 box-shadow:inset 0 0 0 2px var(--sdn-060b0d, #060b0d),inset 0 0 55px var(--sdn-244b511c, #244b511c),7px 9px 0 var(--sdn-111719, #111719),20px 28px 30px #0008;
 filter:none;
}
#community-app .hero-roster::before { content:'SDN / PERSONNEL NETWORK';position:absolute;top:auto;bottom:-24px;left:20px;width:auto;height:auto;border-radius:0;background:none;box-shadow:none;color:var(--sdn-a1abad, #a1abad);font:9px Consolas,monospace;letter-spacing:2px; }
#community-app .hero-roster::after { content:'';position:absolute;top:auto;bottom:-20px;left:auto;right:20px;width:5px;height:5px;border-radius:50%;background:var(--sdn-9bbcb6, #9bbcb6);box-shadow:0 0 5px var(--sdn-9bbcb650, #9bbcb650); }
#community-app .hero-roster .character-card::before { content:none; }
#community-app .hero-roster .character-card { border-radius:3px;background:linear-gradient(135deg,var(--sdn-283336e8, #283336e8),var(--sdn-1a2428ed, #1a2428ed));box-shadow:0 2px 6px #0005,inset 0 1px var(--sdn-d8eeed0a, #d8eeed0a); }
#community-app .hero-roster .character-card:hover { background:linear-gradient(135deg,var(--sdn-344145, #344145),var(--sdn-223136, #223136)); }
#community-app .hero-roster .character-filters :is(input,select) { background:var(--sdn-0e191dd9, #0e191dd9);border-color:var(--sdn-65757480, #65757480); }
@media(max-width:1000px) { #community-app .hero-roster { padding:32px 26px 40px;border-width:13px;border-bottom-width:30px; } }
@media(max-width:650px) { #community-app .hero-roster { padding:25px 18px 32px;border-width:9px;border-bottom-width:28px;border-radius:9px; } }

/* Viewport-fit roster; page extra entries rather than growing the monitor. */
#community-app #app-workspace:has(#app-view:not([hidden]) .hero-roster) { overflow:hidden;padding:18px 30px 28px;display:flex; }
#community-app #app-view:not([hidden]).hz-heroroster { width:100%;height:100%;min-height:0;display:flex;flex-direction:column; }
#community-app #app-view:not([hidden]).hz-heroroster>.app-heading { flex:none;margin-bottom:12px; }
#community-app .hero-roster { flex:1;min-height:0!important;height:auto;margin:12px 28px 20px;padding:24px;transform:perspective(2200px) rotateY(-4deg) rotateZ(-.6deg); }
#community-app .hero-roster .character-directory { height:100%;min-height:0;grid-template-columns:205px minmax(0,1fr);gap:24px; }
#community-app .hero-roster .character-results { display:flex;flex-direction:column;min-height:0; }
#community-app .hero-roster #character-count { flex:none;margin:0 0 12px; }
#community-app .hero-roster #character-cards { flex:1;min-height:0!important;gap:14px;grid-auto-rows:auto;align-content:stretch; }
#community-app .hero-roster .character-card { min-height:0;overflow:hidden; }
#community-app .hero-roster .character-card-portrait { min-height:0;height:100%; }
#community-app .hero-roster .character-filters { display:flex;flex-direction:column;gap:clamp(8px,1.6vh,20px);padding:0 18px 0 0;border-bottom:0;border-right:1px solid var(--sdn-65757455, #65757455); }
#community-app .hero-roster .character-filters :is(input,select) { min-height:36px;padding:7px 10px; }
#community-app .hero-roster .character-filters label { gap:5px; }
@media(max-width:800px) { #community-app #app-workspace:has(#app-view:not([hidden]) .hero-roster) { padding:12px; } #community-app .hero-roster { margin:6px 4px 12px;padding:16px;transform:none; } #community-app .hero-roster .character-directory { grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:12px; } #community-app .hero-roster .character-filters { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px;padding:0 0 10px;border-right:0;border-bottom:1px solid var(--sdn-65757455, #65757455); } #community-app .hero-roster .character-filters h2 { display:none; } #community-app .hero-roster .character-filters label:first-of-type { grid-column:auto; } #community-app .hero-roster .character-filters button { grid-column:1/-1; padding:0; } #community-app .hero-roster .character-filters :is(input,select) { min-width:0;font-size:16px; } #community-app .hero-roster .character-card dl { grid-template-columns:75px minmax(0,1fr);gap:3px 5px; } }
@media(max-height:750px) { #community-app #app-view:not([hidden]).hz-heroroster .app-heading h1 { font-size:28px;margin-bottom:0; } #community-app .hero-roster .character-filters { gap:7px; } }

/* Guidebook: open reference volume on the illustrated desktop. */
#community-app[data-scene=guidebook] { --section-scene:url('/assets/backdrop-guidebook-desktop-sdn.webp'); --scene-focus-x:50%; }
.guide-volume { display:grid;grid-template-columns:minmax(0,1fr) 145px;max-width:1100px;margin:35px auto 70px;transform:rotate(-1deg);align-items:start; }
.guide-spread { display:grid;grid-template-columns:1fr 1fr;border:8px solid #3b2924;border-radius:5px 12px 12px 5px;box-shadow:0 5px 0 #b7a98a,0 9px 0 #46382b,10px 24px 30px #0009;min-height:580px; }
.book-leaf { position:relative;padding:35px 35px 55px;color:#3c382e;background:repeating-linear-gradient(9deg,#76674d04 0 1px,transparent 1px 4px),#e3d8bb; }
.book-front { background:linear-gradient(90deg,#d9cdaa,#eee4cb 80%,#ae9c7d);display:flex;flex-direction:column;justify-content:space-between;border-radius:1px 0 0 3px; }
.book-chapter { background:linear-gradient(90deg,#9c8d72,#dbceb0 7%,#eee4cb 30%,#ded1b3);border-left:1px solid #635846; }
.book-running { font:10px Consolas,monospace;letter-spacing:2px;display:block;padding-bottom:16px;border-bottom:1px solid #6c634c55; }
.book-title small { font:11px Consolas,monospace;letter-spacing:2px; }
#community-app .book-title h2 { font:900 clamp(36px,5vw,66px)/.95 Georgia,serif;color:#343f36;margin:16px 0 25px; }
#community-app .book-title p { font:italic 18px/1.6 Georgia,serif; }
.book-imprint { font:10px/1.8 Consolas,monospace;letter-spacing:1px; }
#community-app .book-chapter h2 { font:700 30px/1.2 Georgia,serif;color:#37382e;margin:28px 0 22px; }
#community-app .book-chapter p { font:17px/1.9 Georgia,serif; }
.book-page-number { position:absolute;bottom:20px;right:32px;font:13px Georgia,serif; }
.book-tabs { display:flex;flex-direction:column;gap:8px;padding-top:28px; }
#community-app .book-tabs a { padding:11px 12px;margin-left:-4px;border-radius:0 5px 5px 0;background:#8c5144;color:#f2e7cf;font:700 12px/1.3 'Segoe UI',sans-serif;box-shadow:3px 3px 3px #0005;border:1px solid #332a2355;min-height:46px; }
#community-app .book-tabs a:nth-child(3n+2) { background:var(--sdn-526a65, #526a65); } #community-app .book-tabs a:nth-child(3n) { background:#9a8050; }
.book-tabs a span { opacity:.65;margin-right:8px;font-family:Consolas,monospace; }
#community-app .book-tabs a[aria-current=page] { background:#e4d7b9;color:#37382e;transform:translateX(5px);box-shadow:3px 4px 4px #0006; }
/* Rules: sincerely terrible corporate motivation on the restroom wall. */
#community-app[data-scene=rules] { --section-scene:url('/assets/backdrop-rules-restroom-v5.webp'); --scene-focus-x:50%; }
@media(max-width:800px) { .guide-volume { grid-template-columns:minmax(0,1fr) 115px;transform:none;margin:20px auto 45px; }.guide-spread { grid-template-columns:1fr;min-height:540px; }.book-front { display:none; }.book-leaf { padding:24px 22px 50px; }.book-tabs { gap:6px; } }
@media(max-width:450px) { .guide-volume { grid-template-columns:minmax(0,1fr) 88px; }.guide-spread { border-width:4px; }.book-leaf { padding:20px 14px 45px; }#community-app .book-tabs a { font-size:11px;padding:9px 7px; }.book-tabs a span { display:none; }#community-app .book-chapter h2 { font-size:24px; }#community-app .book-chapter p { font-size:16px; } }
.collection-pages { display:flex;align-items:center;justify-content:space-between;gap:20px;margin:28px 0 12px;font:12px Consolas,monospace; }
.thread-post-pager { margin:0 0 18px; }
.thread-post-pager .collection-pages { margin:0; padding:10px 16px; border:1px solid color-mix(in srgb,var(--thread-frame-accent,#b58549) 30%,#ffffff14); border-radius:8px; background:color-mix(in srgb,var(--thread-frame-accent,#b58549) 8%,#171b1d); }
.thread-post-pager+.thread-post-pager { margin:18px 0 0; }
#community-app button:disabled { opacity:.35;cursor:default; }

/* Faction photos turn into their creased, ruled record-card backs. */
.faction-card-back { position:relative;max-width:1080px;margin:30px auto 60px;padding:32px 38px 20px;color:#38382f;background:linear-gradient(112deg,transparent 28%,#74634412 28.2%,var(--sdn-fff5, #fff5) 28.5%,transparent 29%),linear-gradient(12deg,transparent 69%,#6c563517 69.3%,var(--sdn-fff5, #fff5) 69.6%,transparent 70%),repeating-linear-gradient(0deg,#584a2410 0 1px,transparent 1px 5px),#ded3b5;box-shadow:2px 3px 2px #0004,12px 20px 28px #0008;border:1px solid #b6a784;border-radius:3px 9px 4px 2px;transform-origin:50% 30%; }
.index-card-heading { display:flex;justify-content:space-between;align-items:start;gap:24px;border-bottom:3px double #96685b;padding-bottom:20px; }
.index-card-heading span,.index-card-footer { font:11px Consolas,monospace;letter-spacing:2px;color:#766148; }
#community-app .index-card-heading h2 { color:#34372f;font:700 clamp(27px,4vw,42px) Georgia,serif;margin:10px 0; }
.index-card-heading p { font:italic 17px/1.5 Georgia,serif; }
.card-return { white-space:nowrap;font:700 12px 'Segoe UI',sans-serif;border-bottom:1px solid #6d6652;padding:8px 0; }
.index-card-body { padding:24px 0;background:repeating-linear-gradient(transparent 0 31px,var(--sdn-657d8830, #657d8830) 31px 32px); }
#community-app .faction-card-back :is(.faction-detail,.faction-roster,.faction-member,.app-empty) { background:transparent;border:0;box-shadow:none;color:#38382f;border-radius:0; }
#community-app .faction-card-back .faction-detail { padding:0 0 26px; }
.faction-card-back .faction-detail>img { float:right;width:32%;max-height:240px;margin:0 0 22px 24px;border:7px solid #efe7d2;box-shadow:2px 4px 7px #0004;transform:rotate(2deg); }
#community-app .faction-card-back :is(h3,.app-muted,.faction-member-info small) { color:#635b49; }
.faction-card-back .post-copy { font:17px/32px Georgia,serif;margin-bottom:18px; }
#community-app .faction-card-back button { color:#514835;background:#d3c6a7;border:1px solid #9c8c6e;border-radius:3px;font-size:12px; }
#community-app .faction-card-back button:hover { background:#e6dcc3; }
.faction-card-back .faction-roster { clear:both;padding:20px 0 0;border-top:2px solid #9b786c!important; }
.faction-card-back .faction-member { border-bottom:1px solid #8f806455!important; }
.index-card-footer { display:flex;justify-content:space-between;border-top:1px solid #897a5d;padding-top:16px;margin-top:12px; }

/* Events are live newspaper articles, not cards layered on a newspaper image. */
#community-app[data-scene=events] { --section-scene:url('/assets/backdrop-guidebook-desktop-sdn.webp');--scene-focus-x:50%; }
.event-newspaper { position:relative;max-width:1130px;margin:24px auto 65px;padding:28px 36px 20px;color:#302f29;background:repeating-linear-gradient(4deg,#5e542108 0 1px,transparent 1px 4px),#ded9c5;box-shadow:1px 3px 0 #bcb59b,4px 6px 0 #d1cbb5,8px 17px 26px #0008;transform:rotate(-.6deg); }
.newspaper-edition,.newspaper-rule { display:flex;justify-content:space-between;gap:18px;font:10px Consolas,monospace;letter-spacing:1.2px; }
.newspaper-edition { border-bottom:1px solid #575548;padding-bottom:10px; }
#community-app .newspaper-masthead h2 { font:900 clamp(42px,6vw,76px)/1.1 Georgia,serif;color:#242923;letter-spacing:-4px;text-align:center;margin:16px 0; }
.newspaper-rule { border-block:3px double #4e5044;padding:8px 0;font-weight:bold; }
.newspaper-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:22px;align-items:start; }
.news-teaser { display:block;padding:8px 22px 24px;border-right:1px solid #746f5855;border-bottom:1px solid #746f5855;min-width:0; }
.news-teaser:nth-child(3n) { border-right:0; }
.news-teaser:first-child { grid-column:span 2; }
.news-teaser:nth-child(2) { border-right:0; }
.news-teaser:last-child { grid-column:auto / span 1; }
.news-category { font:700 10px Consolas,monospace;letter-spacing:2px;text-transform:uppercase; }
#community-app .news-teaser h3 { font:700 26px/1.12 Georgia,serif;text-transform:none;letter-spacing:-.7px;color:#292d27;margin:10px 0 16px; }
#community-app .news-teaser:first-child h3 { font-size:40px; }
.news-teaser img { width:100%;height:160px;object-fit:cover;filter:saturate(.4) contrast(.95);margin-bottom:12px; }
.news-teaser:first-child img { height:210px; }
#community-app .news-teaser p { font:15px/1.6 Georgia,serif;margin-bottom:12px; }
.news-continue { font:700 10px Consolas,monospace;letter-spacing:1px; }
.news-teaser:hover h3 { text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px; }
.event-newspaper .collection-pages { border-top:3px double #555448;padding-top:14px; }
#community-app .event-newspaper button { border:1px solid #827b65;border-radius:0;background:transparent;color:#373a31;padding:7px 12px;font-size:12px; }
#community-app .event-newspaper button:hover { background:#c8c2ab; }
.newspaper-empty { grid-column:1/-1;min-height:280px;padding:60px 20px;text-align:center;font-family:Georgia,serif; }
#community-app .newspaper-empty h3 { font:italic 32px Georgia,serif;text-transform:none;color:#474c3f;margin-top:22px; }
.newspaper-return { display:inline-block;margin:22px 0;font:12px Consolas,monospace;border-bottom:1px solid #77715b; }
.newspaper-story { padding:8px 24px 35px; }
#community-app .newspaper-story h2 { font:700 clamp(32px,4vw,54px)/1.1 Georgia,serif;color:#272c26;margin:15px 0 18px; }
.news-deck { font:italic 21px/1.5 Georgia,serif;border-bottom:1px solid #77715b66;padding-bottom:22px; }
.newspaper-story>img { width:100%;max-height:350px;object-fit:cover;margin-bottom:25px;filter:saturate(.5); }
.news-body { font:17px/1.9 Georgia,serif;white-space:pre-wrap;overflow-wrap:anywhere;column-count:2;column-gap:36px;column-rule:1px solid #77715b44; }
.newspaper-open { animation:paper-open .35s ease-out; }
@keyframes paper-open { from { opacity:.4;transform:perspective(1600px) rotateY(-9deg) rotate(-.6deg); } to { opacity:1;transform:rotate(-.6deg); } }
@media(max-width:800px) { .event-newspaper { padding:22px 20px;transform:none; }.newspaper-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.news-teaser:first-child { grid-column:1/-1; }.news-teaser { padding:15px 12px; }.faction-card-back { padding:24px 20px; }.index-card-heading { flex-direction:column;gap:6px; }.newspaper-edition span:last-child { display:none; } }
@media(max-width:520px) { .newspaper-grid { display:block; }.news-teaser { border-right:0; }.news-body { column-count:1; }.newspaper-story { padding:0 2px 25px; }.faction-card-back .faction-detail>img { float:none;width:100%;margin:0 0 20px; }.collection-pages { gap:8px; }.collection-pages button { padding:7px!important;font-size:12px!important; } }
@media(prefers-reduced-motion:reduce) { .newspaper-open { animation:none; } }
#community-app[data-scene=guidebook] #app-workspace { padding:20px 28px 35px; }
#community-app[data-scene=guidebook] #app-view { width:100%;max-width:1900px; }
#community-app[data-scene=guidebook] .guide-volume { width:100%;max-width:none;grid-template-columns:minmax(0,1fr) 175px;margin:15px auto 40px;transform:rotate(-.35deg); }
#community-app[data-scene=guidebook] .guide-spread { min-height:max(780px,calc(100dvh - 285px)); }
#community-app[data-scene=guidebook] .book-leaf { padding:42px clamp(24px,3vw,64px) 65px; }
#community-app[data-scene=guidebook] .book-chapter h3 { font:700 23px/1.3 Georgia,serif;color:#514534;margin:28px 0 15px;border-bottom:1px solid #9c8d7255;padding-bottom:9px; }
#community-app[data-scene=guidebook] .book-chapter :is(ul,ol) { padding-left:24px;font:18px/1.75 Georgia,serif; }
#community-app[data-scene=guidebook] .book-chapter li { margin-bottom:10px; }
#community-app[data-scene=guidebook] .book-chapter a { color:#874018;text-decoration:underline; }
#community-app[data-scene=guidebook] .book-chapter blockquote { margin:22px 0;padding:14px 20px;border-left:3px solid #987042;background:#b5a47c22;font-style:italic; }
@media(max-width:800px) { #community-app[data-scene=guidebook] #app-workspace { padding:18px 12px; }#community-app[data-scene=guidebook] .guide-volume { grid-template-columns:minmax(0,1fr) 110px;transform:none; }#community-app[data-scene=guidebook] .book-leaf { padding:25px 22px 50px; } }
@media(max-width:450px) { #community-app[data-scene=guidebook] .guide-volume { grid-template-columns:minmax(0,1fr) 82px; }#community-app[data-scene=guidebook] .book-leaf { padding:22px 14px 50px; } }
/* A short newspaper edition: three columns on wide screens, two below. */
.newspaper-grid.event-edition-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
#community-app .event-edition-grid .news-teaser { grid-column:auto;border-right:1px solid #746f5855;padding:12px 20px 24px; }
#community-app .event-edition-grid .news-teaser:last-child { border-right:0; }
#community-app .event-edition-grid .news-teaser h3 { font-size:29px; }
#community-app .event-edition-grid .news-teaser:first-child h3 { font-size:34px; }
#community-app .event-edition-grid .news-teaser img { height:185px; }
.news-meta { display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:14px; }
.event-status { display:inline-block;padding:5px 9px;font:900 11px/1.2 'Segoe UI',sans-serif;letter-spacing:1px;border:1px solid currentColor; }
.event-status.is-active { background:var(--color-accent-secondary,#713219);color:#fff1cd;border-color:var(--color-accent-secondary,#713219); }
.event-status.is-complete { background:#c5c5b3;color:#3f493d;border-color:#6b735f; }
@media(max-width:1199px) { .newspaper-grid.event-edition-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .newspaper-grid.event-edition-grid { display:block; }#community-app .event-edition-grid .news-teaser { border-right:0;padding:18px 4px; } }
/* Dispatch is the persistent primary navigation action, including collapsed mode. */
#community-app #sidebar-links a[href="#/dispatch"] { margin-block:10px;background:linear-gradient(110deg,#e97919,var(--color-accent-default,#ffc45b));color:#26190b;border:1px solid #ffc970;border-radius:999px;font-weight:900;letter-spacing:1.2px;box-shadow:0 3px 8px #0004; }
#community-app #sidebar-links a[href="#/dispatch"] svg { color:#26190b; }
#community-app #sidebar-links a[href="#/dispatch"]:hover { background:linear-gradient(110deg,#f6912d,#ffd887);box-shadow:0 3px 12px #e9791940; }
#community-app #sidebar-links a[href="#/dispatch"][aria-current=page] { background:linear-gradient(110deg,#f6912d,#ffd887);color:#26190b;box-shadow:inset 0 0 0 2px #fff1c488,0 3px 10px #0005; }
#community-app.sidebar-collapsed #sidebar-links a[href="#/dispatch"] { border-radius:14px; }
/* A full-size employee handbook, with readable pages and room for chapter copy. */
#community-app[data-scene=guidebook] #app-view { max-width:1500px; }
#community-app .guide-volume { max-width:1400px;grid-template-columns:minmax(0,1fr) 155px;margin:24px auto 65px; }
#community-app .guide-spread { min-height:740px; }
#community-app .book-leaf { padding:40px 42px 60px; }
#community-app .book-title h2 { font-size:clamp(34px,4.4vw,66px);letter-spacing:-2px;line-height:1.04;overflow-wrap:normal; }
#community-app .book-chapter p { font-size:18px;line-height:1.75;margin-bottom:20px; }
#community-app .book-tabs a { font-size:13px;min-height:52px; }
@media(max-width:1100px) { #community-app .book-leaf { padding:28px 25px 55px; }#community-app .book-title h2 { font-size:clamp(28px,3.8vw,46px);letter-spacing:-1px; } }
@media(max-width:800px) { #community-app .guide-volume { grid-template-columns:minmax(0,1fr) 110px;margin-top:20px; }#community-app .guide-spread { min-height:650px; }#community-app .book-tabs a { font-size:12px; } }
@media(max-width:450px) { #community-app .guide-volume { grid-template-columns:minmax(0,1fr) 82px; }#community-app .book-leaf { padding:22px 15px 50px; }#community-app .book-chapter p { font-size:16px;line-height:1.7; }#community-app .book-tabs a { font-size:10px;padding:9px 6px; } }
#community-app .hero-roster { display:flex;flex-direction:column; }
#community-app .hero-roster .character-directory { height:auto;flex:1;min-height:0; }
.wall-notice { position:relative;color:#3e3b2c;padding:22px 20px;background:linear-gradient(115deg,#fff2,transparent 65%),#dfd7bd;box-shadow:2px 3px 4px #0005; }
.wall-notice::before { content:'';position:absolute;top:-10px;left:34%;width:70px;height:23px;transform:rotate(-4deg);background:#ceba8199;border:1px solid #e6d9b355; }
#community-app .wall-notice h2 { color:#3b3e32;font:700 22px/1.15 Georgia,serif;margin:16px 0; }
.wall-notice footer { font:8px Consolas,monospace;letter-spacing:1px; }
@media(max-width:850px) { }
@media(max-width:600px) { }
#community-app .news-teaser.news-slot-5 { grid-column:1/-1; }
@media(max-width:800px) {
 #community-app .hero-roster .character-directory { display:flex;flex-direction:column;gap:10px; }
 #community-app .hero-roster .character-filters { position:relative;display:block;flex:none;padding:0;margin:0;border:0;z-index:4; }
 #community-app .hero-roster .character-results { flex:1; }
}
@media(max-width:520px) {
 #community-app #app-view:not([hidden]).hz-heroroster .app-heading { gap:8px;margin-bottom:8px; }
 #community-app #app-view:not([hidden]).hz-heroroster .app-heading h1 { font-size:24px;margin-bottom:0; }
 #community-app #app-view:not([hidden]).hz-heroroster .app-heading button { padding:6px 10px;font-size:12px; }
 #community-app .hero-roster { padding:12px;margin:8px 0 12px; }
 #community-app .hero-roster .character-card { grid-template-columns:62px minmax(0,1fr); }
 #community-app .hero-roster .character-card h2 { font-size:18px; }
 #community-app .hero-roster .character-card-info { padding:10px; }
}

/* Full-width handbook takes precedence over earlier size iterations. */
#community-app[data-scene=guidebook] #app-view { max-width:1900px; }
/* Open records use the workspace, independently of the roster card grid. */
#community-app #profile-views { width:100%;max-width:1900px;min-width:0; }
#community-app #profile-views iframe { height:calc(100dvh - 170px); }
#community-app #profile-views iframe[hidden] { display:none; }
.guide-spread.handbook-reading { display:block; }
#community-app .handbook-reading .handbook-article { min-height:780px;border-left:0;background:linear-gradient(90deg,#e3d7b8 0%,#eee4cb 44%,#c7b99b 49.7%,#a69779 50%,#d7c9ab 50.5%,#eee4cb 56%,#dfd1b3 100%); }
.handbook-prose { column-count:2;column-gap:clamp(65px,6vw,120px);column-fill:balance; }
#community-app .handbook-prose ol { list-style:decimal outside;padding-left:1.65em; }
#community-app .handbook-prose ul { list-style:disc outside;padding-left:1.4em; }
#community-app .handbook-prose li { display:list-item; }
#community-app .handbook-prose li::marker { color:#673c22;font-weight:800; }
#community-app .handbook-prose h3 { break-after:avoid; }
#community-app .handbook-prose :is(li,blockquote) { break-inside:avoid; }
#community-app .handbook-prose strong { font-weight:800;color:#673c22; }
#community-app .handbook-prose p { orphans:3;widows:3; }
#community-app .handbook-reading>.book-chapter>h2 { text-align:center;margin-bottom:36px; }
@media(max-width:950px) { .handbook-prose { column-count:1; }#community-app .handbook-reading .handbook-article { background:linear-gradient(90deg,#cec1a2,#eee4cb 10%,#ded1b3); } }
/* Bookmarks: persistent navigation launcher and player-scoped collection popout. */
#sidebar-links .bookmarks-menu { display:flex;align-items:center;gap:13px;min-height:43px;padding:10px;border:0;border-radius:7px;background:transparent;color:inherit;font:600 13px 'Segoe UI',sans-serif;text-align:left;cursor:pointer; }
/* Same hover treatment as the regular nav links (background highlight + brightened icon), matching Edit sidebar / Log out. */
#sidebar-links .bookmarks-menu:hover { background:var(--sdn-ffffff08, #ffffff08); }
#sidebar-links .bookmarks-menu:hover svg { color:var(--sdn-b9eaf0, #b9eaf0); }
.sidebar-collapsed #sidebar-links .bookmarks-menu span { display:none; }
.page-bookmark { display:flex;align-items:center;gap:7px;flex:none;padding:6px 10px;border:1px solid #9e754b66;background:#231e19;color:#e7d2a8;border-radius:6px;font-size:12px;cursor:pointer; }
.page-bookmark[hidden] { display:none; }.page-bookmark[aria-pressed=true] { color:var(--color-accent-default,#ffc45b); }.page-bookmark[aria-pressed=true] svg { fill:#ffc45b22; }
.page-bookmark:disabled { opacity:.8;cursor:default; }
.bookmarks-dialog { box-sizing:border-box;width:min(640px,calc(100vw - 28px));max-height:85dvh;padding:24px;background:#1d1c1a;color:#f4ebd9;border:1px solid #816342;border-radius:14px;box-shadow:0 24px 90px #0009; }
.bookmarks-dialog::backdrop { background:#08090bb3; }
.bookmarks-dialog header { display:flex;align-items:start;justify-content:space-between;gap:18px; }
.bookmarks-dialog h2 { margin:0 0 7px;font-size:23px;letter-spacing:1px; }.bookmarks-dialog small { color:#baa994; }
.bookmarks-dialog button { cursor:pointer; }.bookmarks-dialog .close-bookmarks { font-size:25px;padding:0 9px;background:transparent;border:0;color:#ead8be; }
.bookmarks-dialog nav { display:flex;gap:7px;flex-wrap:wrap;margin:22px 0 8px;padding:0;background:none;position:static; }
.bookmarks-dialog nav button { padding:7px 10px;border:1px solid #725638;border-radius:6px;background:#29231c;color:#dbc7a9;font-size:12px; }
.bookmarks-dialog nav button[aria-pressed=true] { background:var(--color-accent-default,#ffc45b);color:#251b11; }
.bookmark-list section { padding:8px 0;background:none; }.bookmark-list h3 { font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#d7a861;margin:14px 0 6px; }.bookmark-owned { font:700 10px Consolas,monospace;color:var(--color-accent-default,#ffc45b); }
@media(max-width:650px) { .page-bookmark span { display:none; }.bookmarks-dialog { padding:18px; } }
#community-app .bookmarks-dialog { position:fixed;inset:0;margin:auto;overflow:auto; }
#community-app .bookmarks-dialog h2 { font:800 23px/1.2 'Segoe UI',sans-serif;margin:0 0 7px; }
#community-app .bookmarks-dialog h3 { font:800 12px/1.4 'Segoe UI',sans-serif; }
#community-app .bookmarks-dialog nav button[aria-pressed=true] { background:var(--color-accent-default,#ffc45b);color:#251b11; }
#community-app .bookmarks-dialog .close-bookmarks,#community-app .bookmark-row button { background:transparent;border:0; }
#community-app .hero-roster .character-filters { overflow-y:auto; }
@media(max-width:800px) {#community-app .hero-roster .character-filters { overflow:visible; } }
/* Chapter heading is centered on the spread's spine, independently of either leaf. */
#community-app .guide-spread { position:relative; }
#community-app .guide-spread>.handbook-spine-title { position:absolute;z-index:2;top:25px;left:0;width:100%;box-sizing:border-box;padding:0 20px;margin:0;text-align:center;font:700 30px/1.2 Georgia,serif;color:#37382e; }
#community-app[data-scene=guidebook] .book-leaf { padding:88px clamp(24px,2.5vw,48px) 38px; }
#community-app[data-scene=guidebook] .guide-spread { min-height:max(620px,calc(100dvh - 310px)); }
#community-app .handbook-reading .handbook-article { min-height:620px; }
#community-app .book-running { font-size:9px;letter-spacing:1px;padding-bottom:9px;margin-bottom:18px; }
#community-app[data-scene=guidebook] .book-chapter p { font:16px/1.55 Georgia,serif;margin:0 0 13px; }
#community-app[data-scene=guidebook] .book-chapter h3 { font:700 20px/1.25 Georgia,serif;margin:20px 0 10px;padding-bottom:6px; }
#community-app[data-scene=guidebook] .book-chapter :is(ul,ol) { font:16px/1.5 Georgia,serif;margin:10px 0 16px; }
#community-app[data-scene=guidebook] .book-chapter li { margin-bottom:5px; }
#community-app[data-scene=guidebook] .book-chapter blockquote { font-size:15px;line-height:1.5;margin:15px 0;padding:10px 15px; }
.handbook-prose { column-gap:clamp(48px,4vw,80px); }
@media(max-width:800px) { #community-app[data-scene=guidebook] .book-leaf { padding:82px 22px 32px; }#community-app .guide-spread>.handbook-spine-title { font-size:25px; } }
@media(max-width:450px) { #community-app[data-scene=guidebook] .book-leaf { padding:96px 14px 28px; }#community-app .guide-spread>.handbook-spine-title { font-size:23px;top:22px; } }
/* Chapter tabs identify each spread; no heading crosses the spine. */
#community-app[data-scene=guidebook] .book-leaf { padding-top:32px; }
@media(max-width:800px) { #community-app[data-scene=guidebook] .book-leaf { padding-top:24px; } }
/* Compact handbook typography. */
#community-app[data-scene=guidebook] .book-chapter p { font-size:14px;line-height:1.5;margin-bottom:10px; }
#community-app[data-scene=guidebook] .book-chapter :is(ul,ol) { font-size:14px;line-height:1.45;margin:8px 0 12px; }
#community-app[data-scene=guidebook] .book-chapter li { margin-bottom:4px; }
#community-app[data-scene=guidebook] .book-chapter h3 { font-size:18px;line-height:1.25;margin:16px 0 8px;padding-bottom:5px; }
#community-app[data-scene=guidebook] .book-chapter blockquote { font-size:13px;line-height:1.45;padding:9px 13px;margin:12px 0; }
/* Viewport-sized spreads with native paragraph/list-aware column breaks. */
#community-app[data-scene=guidebook] #app-workspace { overflow:hidden;padding-bottom:12px; }
#community-app[data-scene=guidebook] .app-heading { margin-bottom:10px; }
#community-app[data-scene=guidebook] .guide-volume { margin:10px auto 0;transform:none;grid-template-rows:var(--book-height,500px) 40px;row-gap:8px; }
#community-app[data-scene=guidebook] .guide-spread { height:var(--book-height,500px);min-height:0;box-sizing:border-box;overflow:hidden; }
#community-app[data-scene=guidebook] .handbook-reading .handbook-article { height:100%;min-height:0;box-sizing:border-box;display:flex;flex-direction:column;padding:22px 38px 26px; }
.handbook-page-window { min-height:0;flex:1;overflow:hidden; }
#community-app .handbook-page-window .handbook-prose { height:100%;column-fill:auto;column-count:2;column-gap:64px;overflow:visible; }
#community-app .handbook-page-window .handbook-prose p { break-inside:avoid; }
#community-app .handbook-page-window .handbook-prose :is(h2,h3,h4) { break-after:avoid; }
#community-app .handbook-pagination { grid-column:1;display:flex;align-items:center;justify-content:space-between;padding:0;background:none;position:static; }
#community-app .handbook-pagination button { padding:7px 14px;font-size:12px; }.handbook-pagination span { font:700 12px Consolas,monospace;color:#f4ebd9; }
#community-app .guide-volume .book-tabs { height:var(--book-height,500px);min-height:0;overflow-y:auto;box-sizing:border-box;padding-top:22px;gap:5px; }
#community-app .guide-volume .book-tabs a { min-height:0;padding:9px 10px;font-size:12px;flex-shrink:0; }
#community-app .handbook-reading .book-page-number { display:none; }
@media(max-width:950px) { #community-app .handbook-page-window .handbook-prose { column-count:1;column-gap:32px; } }
@media(max-width:650px) { #community-app[data-scene=guidebook] .handbook-reading .handbook-article { padding:16px 14px 20px; }#community-app .guide-volume .book-tabs { padding-top:16px; }#community-app[data-scene=guidebook] .app-heading h1 { font-size:24px; }#community-app .book-running { font-size:8px;margin-bottom:10px; }#community-app .handbook-pagination button { padding:6px;font-size:11px; } }

#community-app .guide-volume .book-tabs { overflow-x:hidden; }

/* Printed employee-reference layout: compact copy and an in-book folio. */
#community-app[data-scene=guidebook] .guide-volume { grid-template-rows:var(--book-height,500px);row-gap:0; }
#community-app[data-scene=guidebook] .handbook-reading .handbook-article { padding-bottom:12px; }
#community-app .handbook-pagination { flex:none;margin-top:12px;padding-top:8px;border-top:1px solid #766c5380;min-height:28px; }
#community-app .handbook-pagination button { background:transparent;border:1px solid #78664666;border-radius:2px;color:#493e2c;font:700 11px/1.2 'Segoe UI',sans-serif;text-transform:uppercase;letter-spacing:.6px;padding:6px 10px;box-shadow:none; }
#community-app .handbook-pagination button:hover:not(:disabled) { background:#78664618;border-color:#786646; }
#community-app .handbook-pagination button:disabled { opacity:.35; }
#community-app .handbook-pagination span { color:#594d38;font-size:11px; }
#community-app[data-scene=guidebook] .book-chapter p { font-size:13px;line-height:1.38;margin:0 0 7px; }
#community-app[data-scene=guidebook] .book-chapter :is(ul,ol) { font-size:13px;line-height:1.3;margin:5px 0 9px;padding-left:1.6em; }
#community-app[data-scene=guidebook] .book-chapter li { margin:0 0 2px;padding:0; }
#community-app[data-scene=guidebook] .book-chapter h3 { font:800 13px/1.3 'Segoe UI',sans-serif;letter-spacing:.65px;text-transform:uppercase;color:#443b2c;margin:13px 0 6px;padding:5px 0;border-top:2px solid #776448;border-bottom:1px solid #77644855; }
#community-app[data-scene=guidebook] .book-chapter blockquote { font:italic 12px/1.4 Georgia,serif;border-left:3px solid #8a6238;background:#8a62380d;padding:7px 10px;margin:9px 0; }
#community-app .handbook-prose hr { border:0;border-top:1px solid #77644866;margin:10px 0; }
#community-app .book-running { border-bottom:1px solid #77644880; }

/* Readable, paginated notices pinned to the restroom wall. */
.policy-wall { max-width:1120px;margin:28px auto 24px;padding:14px 18px; }
.policy-posters { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;align-items:start; }
#community-app .policy-poster { padding:25px 23px 18px;transform:rotate(-1deg);border:1px solid #81745755; }
#community-app .policy-poster:nth-child(2) { transform:rotate(1.2deg);margin-top:18px;background-color:#d6d7ba; }
#community-app .policy-poster:nth-child(3) { transform:rotate(-.6deg);background-color:#e0c985; }
#community-app .policy-poster h2 { font:900 clamp(21px,2.1vw,29px)/1.07 'Arial Black',sans-serif;letter-spacing:-.5px;margin:18px 0;border-bottom:2px solid #5d5842;padding-bottom:14px; }
#community-app .policy-poster ul { padding-left:17px;margin:0;font:15px/1.45 Georgia,serif; }
#community-app .policy-poster li { margin-bottom:12px; }
#community-app .policy-poster strong { color:#342e22; }
#community-app .policy-poster footer { margin-top:20px;padding-top:10px;border-top:1px solid #665b4666; }
#community-app .policy-poster a { color:#504126;font:700 11px 'Segoe UI',sans-serif; }
.rules-rating { display:flex;justify-content:space-between;margin:0 0 15px;gap:8px; }
.rules-rating span { font:800 9px 'Segoe UI',sans-serif;text-align:center; }.rules-rating b { display:block;font-size:32px;color:#843a25; }
.policy-wall .collection-pages { margin-top:28px; }
@media(max-width:1099px) { .policy-posters { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:699px) { .policy-posters { grid-template-columns:minmax(0,1fr); }.policy-wall { max-width:390px;padding:12px 8px;margin-top:10px; } }
/* Illustrated morale posters share the wall with actual policy notices. */
.policy-wall { max-width:1320px; }
.policy-posters { gap:26px 32px; }
#community-app .policy-poster { padding:19px 21px 15px; }
#community-app .policy-poster h2 { font-size:23px;margin:13px 0;padding-bottom:10px; }
#community-app .policy-poster li { margin-bottom:8px; }
#community-app .policy-poster ul { font-size:14px;line-height:1.4; }
#community-app .decorative-poster { text-align:center;border:6px solid #303b33;background:repeating-linear-gradient(0deg,#00000003 0 1px,transparent 1px 3px),#d5caaa;transform:rotate(2deg); }
#community-app .decorative-poster h2 { border:0;font:900 26px/1.02 'Arial Black',sans-serif;letter-spacing:-1px;margin:10px 0 0; }
.poster-art { display:block;width:100%;height:130px;margin:8px 0; }
#community-app .decorative-poster .fake-motto { font:italic 15px/1.35 Georgia,serif;margin:9px 0; }
#community-app .decorative-poster footer { font-size:7px; }
#community-app .coffee-pep { background-color:#c3c9ae;transform:rotate(-2deg);margin:12px 18px 0; }
#community-app .cape-pep { background-color:#deb66f; }
#community-app .team-pep { background-color:#b5c6bd; }
@media(min-width:1500px) { .policy-posters { grid-template-columns:repeat(3,minmax(0,1fr)); } }
/* Varied paper sizes, with deliberate separation between morale notices. */
.policy-posters { align-items:start;gap:32px 38px; }
#community-app .policy-poster { box-sizing:border-box;justify-self:center;width:100%; }
#community-app .policy-poster:nth-child(3) { width:94%;margin-top:12px; }
#community-app .policy-poster:nth-child(5) { width:100%;margin-top:8px; }
#community-app .decorative-poster.hero-pep { width:80%;margin:0;min-height:360px;transform:rotate(2.2deg);padding:20px 15px; }
#community-app .hero-pep .poster-art { height:160px; }
#community-app .decorative-poster.coffee-pep { width:94%;min-height:0;margin:10px 0 0;transform:rotate(-2.5deg);padding:14px 18px; }
#community-app .coffee-pep .poster-art { height:86px;margin:4px 0; }
#community-app .coffee-pep h2 { font-size:23px; }
#community-app .decorative-poster.cape-pep { width:82%;min-height:340px;margin:8px 0 0;transform:rotate(-2deg); }
#community-app .cape-pep .poster-art { height:145px; }
#community-app .decorative-poster.team-pep { width:96%;margin:0;min-height:0;transform:rotate(1.4deg); }
#community-app .team-pep .poster-art { height:90px; }
@media(min-width:1100px) { #community-app .policy-posters>.team-pep { grid-column:3; } }
@media(max-width:699px) { #community-app .decorative-poster.hero-pep,#community-app .decorative-poster.cape-pep { min-height:0;width:86%; } }
/* The room and notices now share one fixed coordinate system. Narrow views crop it. */
#community-app[data-scene=rules] #app-workspace { position:relative;overflow:hidden;padding:0; }
#community-app[data-scene=rules] #app-view { height:100%;max-width:none; }
#community-app[data-scene=rules] .app-heading { position:absolute;top:20px;left:30px;z-index:2;pointer-events:none; }
#community-app .policy-wall { position:absolute;inset:0;margin:0;padding:0;max-width:none;overflow:hidden; }
#community-app .policy-posters { display:block;position:absolute;width:1672px;height:941px;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--room-scale,1));background:url('/assets/backdrop-rules-restroom-v5.webp') center / 100% 100% no-repeat; }
#community-app .policy-posters>.policy-poster { position:absolute;box-sizing:border-box;margin:0;min-height:0;width:270px;padding:16px 17px;transform:rotate(-.7deg); }
#community-app .policy-posters>.policy-poster:nth-child(1) { left:221px;top:255px;width:185px;height:455px;padding:21px 13px;transform:rotate(.4deg); }
#community-app .policy-posters>.policy-poster:nth-child(2) { left:558px;top:175px; }
#community-app .policy-posters>.policy-poster:nth-child(3) { left:861px;top:168px;transform:rotate(.8deg); }
#community-app .policy-posters>.policy-poster:nth-child(4) { left:567px;top:525px;transform:rotate(.6deg); }
#community-app .policy-posters>.policy-poster:nth-child(5) { left:865px;top:543px;transform:rotate(-.9deg); }
#community-app .policy-posters>.policy-poster:nth-child(6) { left:1239px;top:183px;width:167px;height:230px;padding:10px;transform:rotate(-1deg); }
#community-app .policy-posters>.policy-poster h2 { font-size:21px;margin:12px 0;padding-bottom:9px; }
#community-app .policy-posters>.policy-poster ul { font-size:14px;line-height:1.4; }
#community-app .policy-posters>.decorative-poster:nth-child(1) h2 { font-size:25px; }
#community-app .policy-posters>.decorative-poster:nth-child(1) .poster-art { height:170px; }
#community-app .policy-posters>.decorative-poster:nth-child(6) h2 { font-size:18px;letter-spacing:-.7px;margin:5px 0; }
#community-app .policy-posters>.decorative-poster:nth-child(6) .poster-art { height:60px;margin:3px 0; }
#community-app .policy-posters>.decorative-poster:nth-child(6) .fake-motto { font-size:12px; }
#community-app .policy-posters>.decorative-poster:nth-child(6) footer { display:none; }
#community-app .policy-wall>.collection-pages { position:absolute;z-index:3;bottom:16px;left:50%;transform:translateX(-50%);display:flex;gap:20px;align-items:center;margin:0;padding:10px 15px;border:1px solid #e8b965;border-radius:8px;background:#1b211eed;box-shadow:0 4px 18px #0008;white-space:nowrap;color:#ffe3a6; }
#community-app .policy-wall>.collection-pages button { background:var(--color-accent-default,#ffc45b);color:#251b10;border:1px solid #ffda91;padding:10px 18px;font-weight:800;font-size:14px;border-radius:5px; }
#community-app .policy-wall>.collection-pages button:disabled { background:#49483e;color:#aba48f;border-color:#6a6554;opacity:1; }
@media(max-width:699px) { #community-app .policy-wall>.collection-pages { gap:10px;padding:8px;bottom:10px; }#community-app .policy-wall>.collection-pages button { padding:9px 10px;font-size:12px; } }
#community-app .policy-posters>.decorative-poster:nth-child(1) h2 { font-size:20px;overflow-wrap:normal;word-break:normal;letter-spacing:-.9px; }
#community-app .policy-posters>.decorative-poster:nth-child(1) .poster-art { height:145px; }
#community-app .policy-posters>.decorative-poster:nth-child(1) footer { font-size:6px;margin-top:10px; }
#community-app .policy-posters>.policy-poster:nth-child(4) { top:510px; }
#community-app .policy-posters>.policy-poster:nth-child(5) { top:526px; }
/* Rules pagination shares the title row and clears the doorway at the right. */
#community-app .policy-wall>.collection-pages { top:20px;bottom:auto;left:auto;right:clamp(28px,8vw,150px);transform:none;margin:0; }
@media(max-width:699px) {
 #community-app[data-scene=rules] .app-heading { top:22px;left:16px; }
 #community-app[data-scene=rules] .app-heading h1 { font-size:25px; }
 #community-app .policy-wall>.collection-pages { top:18px;bottom:auto;right:14px;gap:7px;padding:7px; }
 #community-app .policy-wall>.collection-pages button { padding:8px;font-size:11px; }
 #community-app .policy-wall>.collection-pages span { font-size:10px; }
}
/* Five physical mounting spots, clear of sink, valves, dividers and dispenser. */
#community-app .policy-posters>.policy-poster:nth-child(1) { left:263px;top:258px;width:151px;height:420px;padding:15px 9px; }
#community-app .policy-posters>.decorative-poster:nth-child(1) h2 { font-size:17px;letter-spacing:-.8px; }
#community-app .policy-posters>.decorative-poster:nth-child(1) .poster-art { height:130px; }
#community-app .policy-posters>.decorative-poster:nth-child(1) .fake-motto { font-size:13px; }
#community-app .policy-posters>.policy-poster:nth-child(2) { left:565px;top:82px;width:216px; }
#community-app .policy-posters>.policy-poster:nth-child(3) { left:801px;top:82px;width:216px; }
#community-app .policy-posters>.policy-poster:nth-child(4) { left:1071px;top:119px;width:305px; }
#community-app .policy-posters>.policy-poster:nth-child(5) { left:1071px;top:510px;width:305px; }
#community-app .policy-posters>.policy-poster:nth-child(2) h2,#community-app .policy-posters>.policy-poster:nth-child(3) h2 { font-size:18px;margin:9px 0; }
#community-app .policy-posters>.policy-poster:nth-child(2) ul,#community-app .policy-posters>.policy-poster:nth-child(3) ul { font-size:13px;line-height:1.3; }
#community-app .policy-posters>.policy-poster:nth-child(2) footer,#community-app .policy-posters>.policy-poster:nth-child(3) footer { margin-top:10px;font-size:7px; }
#community-app .policy-posters>.policy-poster:nth-child(3) { top:28px; }
/* Remove administrative microcopy and reduce oversized wall notices. */
#community-app .policy-posters>.policy-poster:nth-child(3) { top:98px;padding:12px 14px; }
#community-app .policy-posters>.policy-poster:nth-child(3) h2 { margin:3px 0 9px;font-size:17px; }
#community-app .policy-posters>.policy-poster:nth-child(3) li { margin-bottom:6px; }
#community-app .policy-posters>.policy-poster:nth-child(4),
#community-app .policy-posters>.policy-poster:nth-child(5) { width:263px;left:1092px;padding:13px 16px; }
#community-app .policy-posters>.policy-poster:nth-child(4) h2,
#community-app .policy-posters>.policy-poster:nth-child(5) h2 { font-size:19px;margin:5px 0 10px; }
#community-app .policy-posters>.policy-poster:nth-child(4) ul,
#community-app .policy-posters>.policy-poster:nth-child(5) ul { font-size:13px;line-height:1.35; }
#community-app .policy-posters>.policy-poster:nth-child(4) .rules-rating,
#community-app .policy-posters>.policy-poster:nth-child(5) .rules-rating { margin-bottom:10px; }
#community-app .policy-posters>.policy-poster:nth-child(4) .rules-rating b,
#community-app .policy-posters>.policy-poster:nth-child(5) .rules-rating b { font-size:27px; }
#community-app .policy-posters>.policy-poster:nth-child(5) { top:477px; }
/* Full-bleed minimalist morale prints, with no duplicate HTML headings. */
#community-app .policy-posters>.decorative-poster:nth-child(1) { left:230px;top:255px;width:178px;height:auto;padding:0;border:0;background:none;transform:rotate(.4deg); }
#community-app .policy-posters>.decorative-poster:nth-child(4) { left:1105px;top:130px;width:218px;height:auto;padding:0;border:0;background:none;transform:rotate(-.8deg); }
#community-app .morale-print { display:block;width:100%;height:auto;max-height:none;object-fit:contain; }
#community-app .policy-posters>.policy-poster:not(.decorative-poster) { padding-right:9px; }
#community-app .policy-posters>.policy-poster:not(.decorative-poster) ul { padding-right:0;margin-right:0; }
#community-app .policy-posters>.policy-poster:not(.decorative-poster) li { padding-right:0;margin-right:0; }
/* Keep readable paper sizes; cropped notices continue on subsequent pages. */
#community-app .policy-posters { left:var(--room-left,0px);top:0;transform:scale(var(--room-scale,1));transform-origin:0 0; }
#community-app .policy-posters>.policy-poster[hidden] { display:none; }
#community-app .policy-posters>.decorative-poster:nth-child(4) { height:327px; }
#community-app .policy-posters>.compact-rule-fallback { top:95px;max-height:calc((100dvh - 220px)/var(--room-scale));overflow-y:auto; }
@media(max-width:699px) { #community-app .policy-wall>.collection-pages { top:16px;right:8px;gap:5px;padding:5px; }#community-app[data-scene=rules] .app-heading h1 { font-size:19px; }#community-app .policy-wall>.collection-pages button { padding:7px 6px;font-size:10px; } }
/* Printed policy sheets: ink rules, numbered clauses and neutral stock. */
#community-app .policy-posters>.policy-poster::before { width:38px;height:13px;top:-6px;left:calc(50% - 19px);opacity:.75; }
#community-app .policy-posters>.policy-poster:not(.decorative-poster) { background:linear-gradient(105deg,#ffffff15,transparent 60%),#e4dfce;border:1px solid #80796570;border-radius:0;box-shadow:2px 3px 3px #0005; }
#community-app .policy-posters>.policy-poster:not(.decorative-poster) h2 { font-family:'Arial Narrow','Segoe UI',sans-serif;font-weight:900;letter-spacing:.2px;border-top:4px solid #343e36;border-bottom:1px solid #343e36;padding-top:8px;padding-bottom:8px;color:#29352f; }
#community-app .policy-posters>.policy-poster:not(.decorative-poster) ul { list-style:none;padding-left:0;counter-reset:clause; }
#community-app .policy-posters>.policy-poster:not(.decorative-poster) li { position:relative;padding:5px 0 7px 23px;margin:0;border-bottom:1px solid #554e372b; }
#community-app .policy-posters>.policy-poster:not(.decorative-poster) li:last-child { border-bottom:0; }
#community-app .policy-posters>.policy-poster:not(.decorative-poster) li::before { counter-increment:clause;content:counter(clause,decimal-leading-zero);position:absolute;left:0;top:7px;font:700 9px Consolas,monospace;color:#636651; }
#community-app .policy-posters>.policy-poster:nth-child(6) { left:833px;top:486px;width:240px;height:auto;padding:13px 9px 13px 16px;transform:rotate(.5deg); }
#community-app .policy-posters>.policy-poster:nth-child(6) h2 { font-size:19px;margin:5px 0 10px; }
#community-app .policy-posters>.policy-poster:nth-child(6) ul { font-size:13px;line-height:1.35; }
/* Handbook editorial treatment: chapter titles live in the opening text column. */
#community-app .handbook-prose .chapter-opener { break-inside:avoid;break-after:avoid;margin:0 0 18px;padding:0 0 12px;border-bottom:3px double #69563b; }
#community-app .chapter-opener>span { font:800 9px/1.4 Consolas,monospace;letter-spacing:2px;color:#986037; }
#community-app .handbook-prose .chapter-opener h2 { display:block;position:static;transform:none;font:900 30px/1.05 'Segoe UI',sans-serif;text-transform:uppercase;color:#293e3d;margin:5px 0 0;padding:0;border:0;background:none; }
#community-app .handbook-illustration { float:right;margin:2px 0 14px 18px;width:28%;break-inside:avoid;transform:rotate(2deg); }
#community-app .handbook-illustration img { display:block;width:100%;height:auto;box-shadow:2px 3px 0 #54422a30; }
#community-app .handbook-stamp { display:inline-block;font:800 9px/1.3 Consolas,monospace;letter-spacing:1px;color:#8f482b;border:1px solid #8f482b;padding:5px 7px;transform:rotate(-2deg);margin:0 0 12px; }
#community-app[data-scene=guidebook] .book-chapter .welcome-slogan { font:900 27px/1.05 'Segoe UI',sans-serif;letter-spacing:-.7px;text-transform:none;border:0;margin:4px 0 14px;padding:0;color:#2c4645; }
#community-app[data-scene=guidebook] .book-chapter .welcome-lead { font:bold 14px/1.4 Georgia,serif;color:#754226; }
#community-app[data-scene=guidebook] .book-chapter blockquote { border-left:4px solid #a85b32;background:#a85b3212;padding:12px 14px;margin:14px 0;break-inside:avoid; }
#community-app[data-scene=guidebook] .welcome-checklist { list-style:none;padding:0; }
#community-app[data-scene=guidebook] .welcome-checklist li { padding:5px 0 7px 19px;position:relative; }
#community-app .welcome-checklist li::before { content:'✦';position:absolute;left:0;color:#a45b32; }
#community-app[data-scene=guidebook] .book-chapter .handbook-signoff { margin-top:18px;font-style:italic;color:#754226; }
#community-app .handbook-prose .first-shift-heading { break-before:column;margin-top:0; }
#community-app .handbook-closing-print { margin:24px auto 0;width:180px;break-inside:avoid;transform:rotate(-2deg); }
#community-app .handbook-closing-print img { display:block;width:100%;height:auto;box-shadow:3px 4px 0 #54422a30; }
/* Original artwork printed into the handbook stock, without mounted-poster effects. */
#community-app .handbook-prose .handbook-plate { float:none;width:100%;max-width:none;margin:12px 0 18px;transform:none;border:0;background:none;box-shadow:none;break-inside:avoid; }
#community-app .handbook-plate img { display:block;width:100%;height:auto;max-height:clamp(170px,calc(var(--book-height,700px) * .34),340px);object-fit:contain;object-position:center;mix-blend-mode:multiply;box-shadow:none;border:0; }
#community-app .handbook-plate figcaption { margin:5px 0 0;font:italic 11px/1.3 Georgia,serif;text-align:center;color:#71543b; }
#community-app .handbook-prose .handbook-plate-wrap { float:right;width:47%;margin:0 0 12px 16px; }
#community-app .handbook-prose .handbook-keep-section { break-inside:avoid;page-break-inside:avoid;display:flow-root;margin-bottom:14px; }
#community-app .handbook-keep-section h3 { margin-top:0; }
#community-app .handbook-welcome .welcome-slogan { font-size:25px; }
#community-app .handbook-prose[data-chapter=welcome] .handbook-plate { margin:10px 0 14px; }
#community-app .handbook-prose[data-chapter=welcome] .handbook-plate img { max-height:clamp(145px,calc(var(--book-height,700px) * .28),290px); }
#community-app .handbook-prose[data-chapter=welcome] .handbook-signoff { margin-top:10px; }
/* Visible handbook navigation, using the Rules pagination palette. */
#community-app .handbook-pagination { gap:12px;min-height:42px;margin-top:12px;padding:9px 12px;border:1px solid #e8b965;border-radius:6px;background:#1b211eed;color:#ffe3a6; }
#community-app .handbook-pagination button { background:var(--color-accent-default,#ffc45b);color:#251b10;border:1px solid #ffda91;padding:10px 18px;font:800 14px/1.2 'Segoe UI',sans-serif;border-radius:5px;letter-spacing:.3px;text-transform:none;min-height:40px; }
#community-app .handbook-pagination button:hover:not(:disabled) { background:#ffda91;border-color:#ffe7b7; }
#community-app .handbook-pagination button:focus-visible { outline:2px solid #fff0c9;outline-offset:3px; }
#community-app .handbook-pagination button:disabled { background:#49483e;color:#aba48f;border-color:#6a6554;opacity:1; }
#community-app .handbook-pagination span { margin-left:auto;color:#ffe3a6;font:700 12px/1.3 Consolas,monospace;white-space:nowrap; }
/* Give Plot subheadings room between their printed divider rules. */
#community-app[data-scene=guidebook] .handbook-prose[data-chapter=setting] h3 { margin:20px 0 10px;padding:10px 0 9px;line-height:1.45; }
/* Faction membership sits on dark, readable panels within the paper record. */
#community-app .faction-card-back .faction-roster { background:#181f20;border:1px solid #535a52;border-radius:6px;padding:18px;color:#f0e8d6; }
#community-app .faction-card-back .faction-roster .roster-heading { background:#101617;border-bottom:1px solid #66624e;border-radius:4px;padding:12px 14px;margin-bottom:18px;gap:16px; }
#community-app .faction-card-back .faction-roster .roster-heading h2 { color:#f6eddb;margin:0;font-size:21px; }
#community-app .faction-card-back .faction-roster .roster-heading h2 span { color:var(--color-accent-default,#ffc45b); }
#community-app .faction-card-back .faction-roster .faction-role h3 { color:#d7c69f;border-color:#66624e; }
#community-app .faction-card-back .faction-member { background:#252e30;border:1px solid #4d5959!important;border-radius:5px;color:#f0e8d6;padding:14px; }
#community-app .faction-card-back .faction-member-info strong,#community-app .faction-card-back .faction-member-info strong a { color:#ffcf79;font-size:16px; }
#community-app .faction-card-back .faction-member-info p { color:#f0e8d6;font-size:14px; }
#community-app .faction-card-back .faction-member-info small { color:#bdc8c7;font-size:12px; }
#community-app .faction-card-back #add-faction-member { background:var(--color-accent-default,#ffc45b);color:#251b10;border:1px solid #ffda91;border-radius:4px;padding:9px 13px;font-weight:800; }
#community-app .faction-card-back .faction-member-actions button { background:#151d1e;color:#f2d6a0;border:1px solid #5c655e;border-radius:4px;min-width:30px;min-height:30px; }
#community-app .faction-card-back .faction-member-actions button:hover { background:#493629;color:#fff0d6; }
#community-app .faction-card-back .faction-roster .app-empty { color:#c9d0c9; }
/* Membership roster belongs to the printed faction file, with clear ink contrast. */
#community-app .faction-card-back .faction-roster { background:#d1c5a6;border:1px solid #8b7c5e;border-radius:1px;color:#292e29;box-shadow:inset 0 1px 0 #fff5;padding:16px 18px; }
#community-app .faction-card-back .faction-roster .roster-heading { background:transparent;border-radius:0;border-bottom:3px double #7e7155;padding:0 0 12px;margin-bottom:14px; }
#community-app .faction-card-back .faction-roster .roster-heading h2 { color:#283b36;font:800 20px/1.2 'Segoe UI',sans-serif;text-transform:uppercase;letter-spacing:1px; }
#community-app .faction-card-back .faction-roster .roster-heading h2 span { color:#75452b; }
#community-app .faction-card-back .faction-roster .faction-role h3 { color:#574c37;border-color:#968768;font-weight:800; }
#community-app .faction-card-back .faction-member { background:#e6dcc2;border:1px solid #a39576!important;border-radius:1px;color:#29322c;box-shadow:1px 2px 0 #76654625; }
#community-app .faction-card-back .faction-member-info strong,#community-app .faction-card-back .faction-member-info strong a { color:#263f39;font-size:16px; }
#community-app .faction-card-back .faction-member-info strong a:hover { color:#8c472a;text-decoration:underline; }
#community-app .faction-card-back .faction-member-info p { color:#363b30; }
#community-app .faction-card-back .faction-member-info small { color:#625a47; }
#community-app .faction-card-back #add-faction-member { background:#394940;color:#fff0cc;border:1px solid #27382f;border-radius:2px;box-shadow:none; }
#community-app .faction-card-back #add-faction-member:hover { background:#4a5c50; }
#community-app .faction-card-back .faction-member-actions button { background:#d3c5a3;color:#394238;border:1px solid #968566;border-radius:2px; }
#community-app .faction-card-back .faction-member-actions button:hover { background:#b7a783;color:#202c26; }
#community-app .faction-card-back .faction-roster .app-empty { color:#625a47; }
/* Reset inherited roster-board offsets inside the faction paper inset. */
#community-app .faction-card-back .faction-roster .roster-heading { margin:0 0 16px;padding:0 0 12px;border-top:0;display:flex;align-items:center;justify-content:space-between;gap:16px; }
#community-app .faction-card-back .faction-roster .roster-heading h2 { display:flex;align-items:baseline;gap:10px;margin:0;line-height:1.25; }
#community-app .faction-card-back .faction-roster .roster-heading h2 span { margin:0;font:700 14px/1.25 Consolas,monospace;letter-spacing:0; }
#community-app .faction-card-back .faction-roster #add-faction-member { margin:0;flex:none;min-height:36px;line-height:1.25;padding:8px 12px; }
#community-app .faction-card-back .faction-roster .faction-role:first-of-type { margin-top:0; }
/* Clearer handbook hierarchy and a single numbered chapter title. */
#community-app[data-scene=guidebook] .book-chapter .handbook-prose h3:not(.welcome-slogan) { font-size:15px; }
#community-app .handbook-prose .chapter-opener h2 { margin-top:0; }
/* Keep the pagination strip dark, while both controls remain visibly gold. */
#community-app .handbook-pagination { align-self:stretch;box-sizing:border-box;width:100%;background:#202925;border:1px solid #b99555; }
#community-app .handbook-pagination button { background:var(--color-accent-default,#ffc45b);color:#251b10;border:1px solid #ffe0a0;box-shadow:0 1px 0 #fff2 inset; }
#community-app .handbook-pagination button:disabled { background:#d7bd87;color:#665435;border-color:#e4cca0;opacity:1;box-shadow:none;cursor:default; }
#community-app .page-bookmark[aria-pressed=true] { background:var(--color-accent-default,#ffc45b);color:#291f11;border-color:#ffe0a0; }
#community-app .page-bookmark[aria-pressed=true] svg { fill:currentColor; }
#community-app .page-bookmark[aria-pressed=true]:disabled { opacity:1; }
.bookmark-toast { position:fixed;z-index:10000;pointer-events:none;padding:10px 14px;border:1px solid #c99751;border-radius:5px;background:#202823;color:#ffe1a2;font:700 13px/1.3 'Segoe UI',sans-serif;box-shadow:0 4px 15px #0005;opacity:0;transform:translateY(-5px);transition:opacity .3s ease,transform .3s ease; }
.bookmark-toast.visible { opacity:1;transform:translateY(0); }
@media(prefers-reduced-motion:reduce) { .bookmark-toast { transition:none; } }
#community-app .faction-card-back .faction-prose,.faction-format-preview { white-space:normal;font:15px/1.45 Georgia,serif;display:flow-root; }
#community-app .faction-prose p { font:inherit;margin:0 0 9px; }
#community-app .faction-prose h3 { font:800 17px/1.3 'Segoe UI',sans-serif;color:#354035;margin:18px 0 7px; }
#community-app .faction-prose h3:first-child { margin-top:0; }
#community-app .faction-prose :is(ul,ol) { margin:7px 0 12px;padding-left:22px; }
#community-app .faction-inline-image { width:32%;margin:12px 0 14px 20px;clear:both; }
#community-app .faction-inline-image.right { float:right; }
#community-app .faction-inline-image.left { float:left;margin:12px 20px 14px 0; }
#community-app .faction-inline-image img { width:100%;height:auto;display:block;border:5px solid #efe7d2;box-sizing:border-box;box-shadow:1px 2px 4px #0003; }
#community-app .faction-format-tools { display:flex;flex-wrap:wrap;gap:6px;margin:8px 0; }
#community-app .faction-format-tools button { padding:6px 10px;font-size:12px; }
#community-app .faction-format-tools input { flex:1;min-width:170px; }
#community-app .faction-format-tools select { width:auto; }
#community-app .faction-format-preview { background:#e6dcc2;color:#30372f;padding:18px;margin-top:10px; }
#community-app .faction-card-back .faction-prose { display:block; }
#community-app .faction-card-back .faction-prose::after { content:'';display:block;clear:both; }
#community-app .faction-card-back .card-return { display:inline-flex;align-items:center;justify-content:center;padding:11px 16px;border:1px solid #27382f;border-radius:4px;background:#394940;color:#fff0cc;font:800 14px/1.25 'Segoe UI',sans-serif;text-decoration:none;box-shadow:0 2px 0 #17221c33; }
#community-app .faction-card-back .card-return:hover { background:#506452;color:#fff8e7; }
#community-app .faction-card-back .card-return:focus-visible { outline:3px solid #ad722e;outline-offset:3px; }
/* Admin handbook authoring, separate from the printed reading layout. */
#community-app .handbook-edit-heading { float:right;margin:0 0 0 10px;padding:3px 7px;border:1px solid #8d7959;border-radius:3px;background:#d7c5a1;color:#354038;font:700 11px/1.25 'Segoe UI',sans-serif;text-transform:none;letter-spacing:0;cursor:pointer; }
#community-app .handbook-edit-heading:hover { background:var(--color-accent-default,#ffc45b);color:#251b10; }
.handbook-editor-dialog { width:min(1180px,94vw);max-height:92dvh;box-sizing:border-box;padding:20px;background:#202824;color:#f6ead4;border:1px solid #c59d5c;border-radius:8px;overflow:auto; }
.handbook-editor-dialog::backdrop { background:#080d0bcc; }
.handbook-editor-dialog>header { display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px; }
.handbook-editor-dialog h2 { margin:0;font:800 22px/1.3 'Segoe UI',sans-serif; }.handbook-editor-dialog header p { font-size:12px;color:#c8c4af;margin:5px 0; }
.handbook-editor-dialog button { padding:7px 10px;border:1px solid #998466;border-radius:3px;background:#e7d7b3;color:#29362e;font:700 12px/1.3 'Segoe UI',sans-serif;cursor:pointer; }
.handbook-editor-dialog [data-save] { background:var(--color-accent-default,#ffc45b); }.handbook-editor-dialog button:hover { background:#ffe0a0; }
.handbook-editor-toolbar { display:flex;flex-wrap:wrap;gap:6px;align-items:end;padding:12px;background:#121b17;border:1px solid #596251;position:sticky;top:-20px;z-index:2; }
.handbook-editor-dialog label { display:flex;flex-direction:column;gap:4px;font:700 11px/1.2 'Segoe UI',sans-serif; }
.handbook-editor-dialog :is(input,select) { padding:6px;border:1px solid #93886d;border-radius:3px;background:#f0e5ca;color:#29362e;box-sizing:border-box; }
.handbook-editor-dialog [data-size],.handbook-editor-dialog [data-image-width] { width:70px; }
.handbook-editor-dialog [data-color] { width:44px;height:32px;padding:2px; }
.handbook-editor-dialog [data-theme] { border-bottom-width:4px; }
.handbook-image-tools { padding:12px;border-bottom:1px solid #596251; }.handbook-image-tools>div { display:flex;flex-wrap:wrap;gap:8px;align-items:end;margin-top:10px; }.handbook-image-tools label:first-child { flex:1;min-width:200px; }
.handbook-rich-editor { min-height:350px;margin-top:16px;padding:28px;background:#e7ddc1;color:#29362e;font:15px/1.5 Georgia,serif;outline:none;display:flow-root; }
.handbook-rich-editor:focus { box-shadow:inset 0 0 0 2px #b77c3c; }
.handbook-rich-editor h2 { color:#293e3d;font-size:30px; }.handbook-rich-editor h3 { font:800 17px/1.35 'Segoe UI',sans-serif; }.handbook-rich-editor p { margin:0 0 10px; }
.handbook-rich-editor figure { max-width:100%;margin:14px 0; }.handbook-rich-editor img { max-width:100%;height:auto;max-height:350px;object-fit:contain;cursor:pointer; }.handbook-rich-editor [data-selected-image] { outline:3px solid #b77c3c; }
.handbook-rich-editor figure[style*="left"] { margin-right:18px; }.handbook-rich-editor figure[style*="right"] { margin-left:18px; }
.handbook-editor-message { font-size:13px;color:#ffd48c; }
/* DISPATCH hierarchy: the location path is the page heading and navigation. */
#community-app .dispatch-navigation{display:flex;align-items:center;gap:16px;min-height:68px;margin:0 0 22px;padding:13px 20px;background:rgba(12,29,33,.94);border:1px solid #537b76;border-top:3px solid var(--color-accent-default,#ffc45b);border-radius:5px;box-shadow:0 8px 24px #0004}
#community-app .dispatch-nav-mark{font-size:29px;color:var(--color-accent-default,#ffc45b)}
#community-app .dispatch-navigation ol{display:flex;align-items:center;flex-wrap:wrap;gap:10px;list-style:none;margin:0;padding:0;flex:1}
#community-app .dispatch-navigation li{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:750}
#community-app .dispatch-navigation li+li:before{content:'›';color:#7c9993;font-size:24px;font-weight:400}
#community-app .dispatch-navigation a{color:#b2d6ce;text-decoration:none;padding:6px 8px;border-radius:3px}
#community-app .dispatch-navigation a:hover{background:#294b49;color:#fff;text-decoration:underline}
#community-app .dispatch-navigation [aria-current]{color:#ffe1a1;padding:6px 8px;background:#ffffff09;border-radius:3px}
#community-app .dispatch-navigation button{flex-shrink:0;background:var(--color-accent-default,#ffc45b);color:#241b10;border:1px solid #ffe0a0;font-weight:800;padding:10px 16px}
/* Chapter art is printed above book ornamentation, with varied editorial layouts. */
#community-app .handbook-page-window{position:relative;z-index:2}
#community-app .handbook-prose .handbook-plate{position:relative;z-index:2}
#community-app .handbook-prose[data-chapter=community] .handbook-plate{float:left;width:52%;margin:4px 18px 12px 0}
#community-app .handbook-prose[data-chapter=profile] .handbook-plate{float:right;width:52%;margin:6px 0 12px 18px}
#community-app .handbook-prose[data-chapter=groups] .handbook-plate{width:90%;margin:12px auto 18px}
#community-app .handbook-prose[data-chapter=faq] .handbook-plate{float:none;width:100%;margin:8px 0 18px;isolation:isolate;z-index:3}
#community-app .handbook-prose[data-chapter=faq] .handbook-plate img{mix-blend-mode:normal}
/* Inline formatting must inherit typography, never act as a decorative heading. */
#community-app .handbook-prose :is(b,strong,i,em,u,s,span,font,a),#community-app .forum-rich :is(b,strong,i,em,u,s,span,font,a){font-size:inherit;font-family:inherit;line-height:inherit;color:inherit;letter-spacing:inherit;text-transform:inherit;background:none}
#community-app .handbook-prose :is(b,strong),#community-app .forum-rich :is(b,strong){font-weight:700}
#community-app .handbook-prose :is(i,em),#community-app .forum-rich :is(i,em){font-weight:inherit;font-style:italic}
#community-app .handbook-prose :is(b,strong) :is(i,em),#community-app .handbook-prose :is(i,em) :is(b,strong),#community-app .forum-rich :is(b,strong) :is(i,em),#community-app .forum-rich :is(i,em) :is(b,strong){font-weight:700;font-style:italic}
#community-app .handbook-prose [contenteditable],#community-app .handbook-prose[contenteditable=true]{outline:none}
#community-app .handbook-prose[contenteditable=true]{caret-color:#a94415}
#community-app .handbook-edit-dock{position:fixed;left:220px;right:24px;top:4px;z-index:80;padding:7px 10px;background:#192b2c;color:#f2e5c8;border:1px solid #ad8655;border-radius:5px;box-shadow:0 4px 16px #0008;font:12px/1.25 'Segoe UI',sans-serif}
#community-app .editor-save-row{display:flex;align-items:center;gap:10px;margin-bottom:5px}
#community-app .editor-save-row strong{margin-right:auto;color:#ffe0a0}
#community-app .editor-save-row [role=status]{color:var(--color-accent-default,#ffc45b)}
#community-app .rich-tools{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
#community-app .rich-toolbar label{display:flex;align-items:center;gap:4px;font:11px/1.2 'Segoe UI',sans-serif;margin:0;color:inherit}
#community-app .rich-toolbar button,#community-app .rich-toolbar select,#community-app .rich-toolbar input,#community-app .editor-save-row button{margin:0;min-height:27px;padding:4px 7px;border:1px solid #788d85;border-radius:3px;background:#243b3b;color:#fff1cf;font:600 11px/1.2 'Segoe UI',sans-serif;width:auto;box-shadow:none}
#community-app .rich-toolbar input[type=number]{width:54px}#community-app .rich-toolbar input[type=color]{width:30px;padding:2px}
#community-app .rich-toolbar button[aria-pressed=true]{background:#ffca69;color:#25251b;border-color:#ffe5ab}
#community-app .rich-toolbar details{position:relative}#community-app .rich-toolbar summary{cursor:pointer;border:1px solid #788d85;border-radius:3px;padding:6px 9px}
#community-app .rich-more{position:absolute;right:0;top:32px;width:360px;display:flex;flex-wrap:wrap;gap:8px;padding:14px;background:#192b2c;border:1px solid #b49868;box-shadow:0 6px 18px #0009;z-index:90}
#community-app .rich-more label{width:100%;justify-content:space-between}#community-app .rich-more input:not([type=number]){width:225px}
#community-app .rich-message{display:block;color:var(--color-accent-default,#ffc45b);font-size:12px}
#community-app .forum-rich{font:15px/1.6 Georgia,serif;color:#ede6d5;white-space:normal;overflow-wrap:anywhere;min-height:1em;display:flow-root}
#community-app .forum-rich p{font:inherit;color:inherit;margin:0 0 .85em}
#community-app .forum-rich h2{font:800 24px/1.25 'Segoe UI',sans-serif;color:#ffca69;margin:1em 0 .5em}
#community-app .forum-rich h3{font:750 20px/1.3 'Segoe UI',sans-serif;color:#ffca69;margin:.85em 0 .45em}
#community-app .forum-rich h4{font:700 17px/1.3 'Segoe UI',sans-serif;color:#ffca69}
#community-app .forum-rich blockquote{border-left:3px solid #ffca69;margin:12px 0;padding:8px 16px;background:#ffffff08;font-style:italic}
#community-app .forum-rich blockquote.post-quote cite{display:block;margin-bottom:6px;font-style:normal;font-weight:600;font-size:12px;letter-spacing:.02em;opacity:.85}
#community-app .forum-rich blockquote.post-quote{background:#ffffff10}
#community-app .forum-rich ul,#community-app .forum-rich ol{padding-left:1.7em;margin:8px 0 16px}
#community-app .forum-rich hr{border:0;border-top:1px solid #8a9b92;margin:18px 0}
#community-app .forum-rich[contenteditable=true] hr{cursor:pointer}
#community-app .forum-rich[contenteditable=true] hr:hover{outline:1px dashed #ffca69;outline-offset:4px}
#community-app .forum-rich pre{white-space:pre-wrap;padding:12px;background:#101a1c;font:14px/1.5 Consolas,monospace}
#community-app .forum-rich img{max-width:100%;height:auto}#community-app .forum-rich figure{margin:12px 0;max-width:100%}
#community-app .forum-rich a{text-decoration:underline}
#community-app .forum-composer{margin:14px 0}#community-app .forum-composer .forum-rich{min-height:190px;padding:14px;background:#142325;border:1px solid #7f938a}
#community-app .forum-toolbar-host{position:relative;background:#192b2c;padding:8px;border:1px solid #7f938a;z-index:4}
.composer-template-picker{position:relative;display:inline-block;margin:6px 0;}
.composer-template-picker summary{cursor:pointer;list-style:none;border:1px solid #82653c;background:#30291f;color:#ffe0a5;border-radius:999px;padding:6px 14px;font-weight:700;font-size:12px;}
.composer-template-picker summary::-webkit-details-marker{display:none;}
.composer-template-picker summary::after{content:' ▾';}
.composer-template-picker[open] summary{background:#493820;}
.composer-template-menu{position:absolute;left:0;top:calc(100% + 8px);min-width:220px;max-width:320px;display:grid;gap:10px;padding:10px;background:#1c1c1a;border:1px solid #6b5639;border-radius:9px;box-shadow:0 8px 24px #0008;z-index:5;}
.composer-template-group{display:grid;gap:4px;}
.composer-template-group h4{margin:0 0 2px;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#c4b491;}
.composer-template-item{text-align:left;background:transparent;border:0;color:inherit;padding:5px 6px;border-radius:5px;white-space:normal;font-size:13px;}
.composer-template-item:hover{background:#ffffff12;}
.composer-template-empty{margin:0;font-size:12px;color:#a9a294;}
.composer-template-save,.composer-template-manage{text-align:left;background:transparent;border:1px solid #4a4433;border-radius:5px;padding:6px 8px;font-size:12px;color:#ffe0a5;}
.composer-template-save:hover,.composer-template-manage:hover{background:#ffffff10;}
.template-manage-list{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:6px;max-height:220px;overflow:auto;}
.template-manage-list li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 8px;background:#00000022;border-radius:6px;}
.template-manage-list button{flex:none;}
#community-app .forum-rich[contenteditable=true]{outline:1px dashed #ffca69;outline-offset:3px}
#community-app .dispatch-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 0 20px}
#community-app .dispatch-subtitle:before{display:none}#community-app .dispatch-subtitle em,#community-app .forum-entry-title em{font:italic 13px/1.4 Georgia,serif;color:#c4d1c7}
#community-app .location-row{gap:16px}#community-app .location-row>div{flex:1}
#community-app .location-icon{width:60px;height:60px;object-fit:cover;flex:none;border:1px solid #6b8b80;border-radius:4px}
#community-app .location-icon-empty{display:grid;place-items:center;font-size:28px;color:#e6bd77;background:#173333}
#community-app .thread-people{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0 18px}
#community-app .thread-person{border:1px solid var(--person-color);background:color-mix(in srgb,var(--person-color) 18%,#142326);color:var(--person-color);padding:5px 11px;border-radius:30px;text-decoration:none;font:750 12px/1.3 'Segoe UI',sans-serif}
#community-app .thread-count{color:#c6d0c7;font-size:12px;margin-left:5px}
#community-app .post-controls{display:flex;gap:7px;margin-left:auto}#community-app .post-body>header{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:18px}
#community-app .forum-role-options{border:1px solid #6c827a;padding:12px;margin:14px 0;display:grid;gap:8px}
#community-app .forum-role-options label,#community-app .forum-check{display:flex;align-items:center;gap:8px}
#community-app .forum-role-options input,#community-app .forum-check input{width:auto}
#community-app .forum-role-options small{line-height:1.5;color:#bac5bb}
#community-app .forum-compose-error{color:#ffcc89}#community-app .thread-create{margin-bottom:22px}
/* Reserve heading-control space in both modes so Save cannot change pagination. */
#community-app .handbook-prose :is(h2,h3,h4){position:relative!important;padding-right:58px!important}
#community-app .handbook-prose .handbook-edit-heading{position:absolute;right:0;top:0;float:none;margin:0}
#community-app[data-scene=guidebook] #app-workspace.handbook-edit-workspace{overflow-y:auto;overflow-x:hidden}
#community-app[data-scene=guidebook] .guide-volume.handbook-stacked{grid-auto-rows:var(--book-height);row-gap:28px;padding-bottom:32px}
#community-app .handbook-stacked>.guide-spread{grid-column:1;grid-row:1}
#community-app .handbook-stacked>.book-tabs{grid-column:2;grid-row:1;align-self:start}
#community-app .handbook-pagination.editing-pagination button{visibility:hidden;pointer-events:none}
#community-app .handbook-stacked .handbook-pagination{justify-content:center}
#community-app .handbook-stacked .handbook-pagination span{margin:0!important;color:#ffe1a1}
#community-app .handbook-prose :is(h3,h4){padding-right:0!important}
/* Shared author-created containers: identical in reading and editing views. */
#community-app :is(.handbook-prose,.forum-rich,.welcome-widget-copy) .rich-box{padding:12px;margin:10px 0;box-sizing:border-box;break-inside:avoid;min-width:0}
#community-app :is(.handbook-prose,.forum-rich,.welcome-widget-copy) .rich-box-bordered{border:1px solid currentColor}
#community-app :is(.handbook-prose,.forum-rich,.welcome-widget-copy) .rich-box-plain{border:0;background:none}
#community-app :is(.handbook-prose,.forum-rich,.welcome-widget-copy) .rich-box-callout{border-left:4px solid var(--theme-primary,#bd782f);background:color-mix(in srgb,currentColor 7%,transparent)}
#community-app :is(.handbook-prose,.forum-rich,.welcome-widget-copy) .rich-box-notice{border-block:2px solid currentColor;background:color-mix(in srgb,currentColor 10%,transparent)}
#community-app :is(.handbook-prose,.forum-rich,.welcome-widget-copy) .rich-columns{display:grid;gap:16px;margin:10px 0;break-inside:avoid;min-width:0}
#community-app .rich-cols-1{grid-template-columns:minmax(0,1fr)}
#community-app .rich-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
#community-app .rich-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
#community-app .rich-column{min-width:0;overflow-wrap:anywhere}
#community-app [contenteditable=true] :is(.rich-column,.rich-box-plain){outline:1px dashed #8a897c;outline-offset:2px;min-height:32px}
#community-app .location-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;background:none;border:0;padding:0}
#community-app .location-grid .location-row{position:relative;isolation:isolate;overflow:hidden;min-height:96px;background:rgba(13,23,25,.93);border:1px solid #63706b;padding:12px 18px;display:flex;align-items:center;gap:10px;border-radius:5px}
#community-app .location-banner{position:absolute;inset:0 0 0 auto;width:66.667%;height:100%;object-fit:cover;z-index:-1;opacity:.8}
#community-app .location-copy{width:calc(33.333% - 28px);min-width:0;flex:none}
#community-app .location-row:not(:has(.location-banner)) .location-copy{width:auto;flex:1}
#community-app .location-copy strong{font-size:18px;overflow-wrap:anywhere}
#community-app .location-copy small{display:block;font-size:11px;margin-top:10px}
#community-app .location-row>span:last-child{margin-left:auto}
@media(max-width:1050px){#community-app .location-grid{grid-template-columns:minmax(0,1fr)}}
#community-app .location-copy{width:calc(33.333% - 16px)}
#community-app .location-copy>.location-icon{float:left;width:28px;height:28px;margin:0 8px 6px 0}
#community-app .location-copy small{clear:both}
/* Image geometry is shared by saved content and the live editor. */
#community-app :is(.handbook-prose,.forum-rich,.welcome-widget-copy) figure.rich-image{display:block;max-width:100%;box-sizing:border-box;break-inside:avoid;margin-block:12px;padding:0;position:relative;clear:none}
#community-app :is(.handbook-prose,.forum-rich,.welcome-widget-copy) figure.rich-image img{display:block;width:100%;max-width:100%;height:auto;object-fit:contain;margin:0}
#community-app figure.rich-image[style*="float: left"]{margin-right:16px!important}
#community-app figure.rich-image[style*="float: right"]{margin-left:16px!important}
#community-app [contenteditable=true] img{cursor:pointer}

#community-app .location-banner{mask-image:linear-gradient(to right,transparent 0%,#000 35%);-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 35%)}
#community-app .location-copy small{margin-top:6px}

/* Count stays on the title line over the banner; subtitles remain below. */
#community-app .location-grid .location-row{align-items:flex-start;min-height:76px;padding-block:16px}
/* Personnel corkboard: wood frame, cork grain, and pinned paper records. */
#community-app .hero-roster{border:12px solid #59402c;border-bottom-width:15px;border-radius:3px;outline:1px solid #291e16;padding:22px;margin:8px 12px 16px;transform:rotate(-.25deg);background-color:#a57949;background-image:radial-gradient(ellipse at 30% 20%,#e7bb7355,transparent 65%),url('/assets/roster-cork.svg');background-size:auto,180px 180px;box-shadow:inset 0 0 0 2px #d6ae7070,inset 0 0 22px #3e251755,3px 5px 0 #31261f,9px 15px 24px #0009}
#community-app .hero-roster::before,#community-app .hero-roster::after{content:none}
#community-app .hero-roster .character-directory{align-items:stretch;grid-template-rows:minmax(0,1fr);grid-template-columns:205px minmax(0,1fr);gap:24px}
#community-app .hero-roster .character-results{height:100%;min-height:0}
#community-app .hero-roster #character-count{color:#251d16;font-weight:700;margin-bottom:12px;text-shadow:0 1px #d4ac7455}
#community-app .hero-roster #character-cards{gap:16px 18px;padding:5px 4px;box-sizing:border-box}
#community-app .hero-roster .character-card{position:relative;overflow:visible;grid-template-columns:70px minmax(0,1fr);background:#e9dfc8;border:1px solid #ac9776;border-top:5px solid var(--character-color,#c88c42);border-radius:1px;color:#302c25;transform:rotate(-.65deg);box-shadow:2px 4px 5px #33201166;min-height:0}
#community-app .hero-roster .character-card:nth-child(even){transform:rotate(.6deg)}
#community-app .hero-roster .character-card::before{content:'';position:absolute;z-index:3;left:48%;top:-11px;width:12px;height:12px;border:1px solid #54281c;border-radius:50%;background:radial-gradient(circle at 35% 25%,#eb9a65,#a54126 55%,#5d291e);box-shadow:1px 3px 2px #0006;pointer-events:none}
#community-app .hero-roster .character-card:hover{background:#f4ead5;box-shadow:3px 6px 8px #33201177}
#community-app .hero-roster .character-card-info{padding:10px 12px;min-width:0}
#community-app .hero-roster .character-card h2{font-size:20px;line-height:1.1;margin:3px 0 5px;color:#292a24}
#community-app .hero-roster .character-card h2 a,#community-app .hero-roster .character-card dd a{color:inherit}
#community-app .hero-roster .character-card-tags{font-size:10px;line-height:1.2;gap:5px;margin-bottom:5px;color:#654b32}
#community-app .hero-roster .character-card .character-codename{font-size:13px;margin:0 0 5px;color:#715337}
#community-app .hero-roster .character-card dl{font-size:12px;line-height:1.25;grid-template-columns:58px minmax(0,1fr);gap:3px;margin:5px 0 0}
#community-app .hero-roster .character-card :is(dt,dd){color:#5b5143}
#community-app .hero-roster .character-card-portrait{background:#6c736c;border-right:1px solid #ac9776}
#community-app .hero-roster .character-filters{padding:16px;background:#222b29ed;border:1px solid #131b18;border-radius:2px;box-shadow:2px 4px 6px #34221366}
/* Fill occupied rows and size portraits from their original aspect ratio. */
#community-app .hero-roster{padding:18px;margin:6px 8px 12px}
#community-app .hero-roster .character-card{grid-template-columns:calc(var(--roster-card-height,190px) * var(--portrait-ratio,.55556)) minmax(0,1fr)}
#community-app .hero-roster .character-card-portrait{height:100%;width:100%;min-height:0;display:flex;align-items:center;justify-content:center}
#community-app .hero-roster .character-card-portrait img{display:block;width:100%;height:100%;object-fit:contain;max-width:none}
#community-app .hero-roster .character-card-info{display:flex;flex-direction:column;justify-content:center;padding:12px 16px}
#community-app .hero-roster .character-directory{grid-template-columns:230px minmax(0,1fr)}
#community-app .faction-short-badge{display:inline-block;position:relative;border-radius:999px;background:#e4bd7e;color:#302315;border:1px solid #ffe0aa;font:bold 12px 'Segoe UI',sans-serif;padding:5px 12px;margin:6px 0}

/* Clear, centered filter controls and an anchored reset action. */
#community-app .hero-roster .character-filters{position:relative;padding-bottom:62px}
#community-app .hero-roster #clear-character-filters{position:absolute;right:12px;bottom:12px;display:inline-flex;align-items:center;justify-content:center;width:auto;margin:0;padding:8px 13px;border:1px solid #dfb779;border-radius:999px;background:#49351f;color:#ffe6bc;font:700 12px 'Segoe UI',sans-serif;text-decoration:none;box-shadow:0 2px 4px #0005}
#community-app .hero-roster #clear-character-filters:hover{background:#684823;color:#fff3dc}
#community-app .hero-roster .character-card h2{font-size:22px}
#community-app .hero-roster .character-card .character-codename{font-size:16px;line-height:1.3}

/* Fixed forum-portrait frame: image intrinsic dimensions never size the card. */
#community-app .hero-roster .character-card{grid-template-columns:calc(var(--roster-card-height,156px) * 5 / 9) minmax(0,1fr);min-width:0;max-width:100%;box-sizing:border-box}
#community-app .hero-roster .character-card-portrait{position:relative;display:block;min-width:0;width:100%;height:100%;min-height:0;overflow:hidden}
#community-app .hero-roster .character-card-portrait img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:100%;object-fit:cover;object-position:center top}
#community-app .hero-roster .character-card-portrait>svg{position:absolute;inset:0;width:100%;height:100%;padding:15px;box-sizing:border-box}
#community-app .hero-roster .character-card-info{min-width:0;overflow:hidden}
#community-app .hero-roster .character-card h2,#community-app .hero-roster .character-codename{overflow-wrap:anywhere}
#community-app #profile-views{max-width:1380px;margin-inline:auto}
/* Mount the roster within the illustrated wall, leaving the desk and window visible. */
@media(min-width:1000px){
 #community-app #app-workspace:has(#app-view:not([hidden]) .hero-roster){padding:24px 5% 7vh 23%}
 #community-app #app-view:not([hidden]).hz-heroroster{max-width:1450px;margin:0 auto;width:100%}
 #community-app .hero-roster{margin:10px 0 0;transform:none;border:10px solid #4e3928;border-top-color:#796044;border-left-color:#6c5238;border-bottom-color:#30251c;border-right-color:#392b20;outline:1px solid #231b15;box-shadow:inset 0 0 0 1px #c7a16b80,inset 0 3px 14px #261a194d,1px 3px 2px #100f0de6,4px 6px 7px #100d0a80;background-image:linear-gradient(115deg,#e4b87518,transparent 40%,#18192045),url('/assets/roster-cork.svg');background-color:#947046}
 #community-app .hero-roster::before,#community-app .hero-roster::after{content:'';position:absolute;top:-7px;bottom:auto;width:7px;height:7px;border:1px solid #211b15;border-radius:50%;background:linear-gradient(135deg,#9e927b 43%,#312c26 46%,#312c26 57%,#8d8069 60%);box-shadow:0 1px 1px #0008;pointer-events:none}
 #community-app .hero-roster::before{left:12px;right:auto}
 #community-app .hero-roster::after{right:12px;left:auto}
 #community-app #app-view:not([hidden]).hz-heroroster>.app-heading{margin-bottom:8px}
 #community-app .hero-roster .character-directory{grid-template-columns:210px minmax(0,1fr);gap:18px}
}
#community-app .welcome-discord-button{display:inline-flex;align-items:center;gap:14px;background:#5865f2;color:#fff;border:1px solid #8993ff;border-radius:8px;padding:13px 20px;text-decoration:none;box-shadow:0 3px 8px #0004}
#community-app .welcome-discord-button:hover{background:#4752c4}
#community-app .welcome-discord-button svg{width:32px;height:32px}
#community-app .welcome-discord-button strong{display:block;font-size:18px;letter-spacing:1px}
#community-app .welcome-discord-button small{display:block;margin-top:3px;font-size:12px;color:#fff}
@media(max-width:800px){}
/* SDN office lighting: aged cork and paper, not a brightly lit overlay. */
#community-app[data-theme=dispatch] .hero-roster,
html[data-theme=dispatch] #community-app .hero-roster{background-color:#65503b;background-image:linear-gradient(110deg,#30282040,#151c1a70),url('/assets/roster-cork.svg');border-color:#42372b;border-top-color:#62513c;border-left-color:#524432;border-right-color:#30291f;border-bottom-color:#29241d;outline-color:#211e18;box-shadow:inset 0 0 0 1px #9a805044,inset 0 4px 22px #17191470,1px 2px 2px #0c100dde,3px 5px 7px #0c100d80}
html[data-theme=dispatch] #community-app .hero-roster .character-card{background:#b8ad91;border-color:#796d54;border-top-color:color-mix(in srgb,var(--character-color,var(--color-accent-default,#ffc45b)) 45%,#645944);color:#242821;box-shadow:1px 3px 4px #181a1670}
html[data-theme=dispatch] #community-app .hero-roster .character-card:hover{background:#c4b99e;box-shadow:1px 3px 5px #181a1680}
html[data-theme=dispatch] #community-app .hero-roster .character-card h2{color:#20251f}
html[data-theme=dispatch] #community-app .hero-roster .character-card .character-codename,
html[data-theme=dispatch] #community-app .hero-roster .character-card :is(dt,dd){color:#393e32}
html[data-theme=dispatch] #community-app .hero-roster .character-card-tags{color:#414334}
html[data-theme=dispatch] #community-app .hero-roster .character-card-portrait{background:#4a5147;border-color:#71674f}
html[data-theme=dispatch] #community-app .hero-roster .character-card-portrait img{filter:brightness(.85) saturate(.72)}
html[data-theme=dispatch] #community-app .hero-roster #character-count{color:#eee1c5;text-shadow:0 1px 2px #161b17}
html[data-theme=dispatch] #community-app .hero-roster .character-filters{background:#242a24f2;border-color:#161d16;box-shadow:1px 3px 4px #181a1666}
/* .basic-forum-entry/.index-page-entry (Main Index categories, World's list-view
   fallback) never got a Dispatch renderSlot('forumEntry') implementation — see
   SKIN-ARCHITECTURE.md, registerSkin('dispatch',...) was never written — so they only
   ever had card styling behind neutral-forum.css's [data-presentation=neutral]
   selectors, leaving Dispatch's entries bare (no border, no background, default-size
   watermark image) once neutral-forum.css is correctly scoped instead of skipped
   outright. Give Dispatch its own themed card here, matching the corkboard roster
   above, instead of leaving these unstyled.
*/
html body #community-app[data-presentation=dispatch] :is(.basic-forum-entry,.index-page-entry){position:relative;isolation:isolate;overflow:hidden;border:1px solid var(--theme-border,#85554126);border-top:3px solid var(--theme-cyan,#ffc45b);border-radius:9px;background:linear-gradient(115deg,var(--theme-surface,#1d1a17e8),#100e0c);box-shadow:0 4px 12px #0006;transition:border-color .18s,box-shadow .18s}
html body #community-app[data-presentation=dispatch] :is(.basic-forum-entry,.index-page-entry):hover{border-color:var(--theme-cyan,#ffc45b);box-shadow:0 4px 16px #0008}
html body #community-app[data-presentation=dispatch] :is(.forum-main-index,.neutral-forum-directory) .basic-forum-entry{min-height:150px;height:auto;grid-template-columns:minmax(0,1fr) auto;gap:9px;padding:14px 16px;align-content:space-between}
/* The World page's "Forums" list (map navigation off) renders .basic-forum-list
   outside .forum-main-index, so it never picked up the grid/height rules above —
   the entry fell back to unconstrained block layout and stretched to fill the
   whole content column instead of sitting as a compact list row. */
#community-app .neutral-forum-directory .basic-forum-list{display:grid;gap:14px}
html body #community-app[data-presentation=dispatch] .neutral-forum-directory .basic-forum-entry{display:grid}
html body #community-app[data-presentation=dispatch] :is(.basic-forum-entry,.index-page-entry){padding:12px;gap:12px}
html body #community-app[data-presentation=dispatch] :is(.basic-forum-entry h2,.index-page-entry h3){font:600 24px/1.1 'Bebas Neue','Arial Narrow',sans-serif!important;letter-spacing:.7px;text-transform:uppercase!important;color:var(--theme-text,#f4ebd9)}
html body #community-app[data-presentation=dispatch] :is(.index-page-entry h3 a,.basic-forum-entry h2 a){color:inherit}
html body #community-app[data-presentation=dispatch] :is(.index-category-children,.basic-child-forums,.basic-forum-list,.forum-thread-cards){align-items:stretch;grid-auto-rows:auto}
html body #community-app[data-presentation=dispatch] :is(.index-page-entry,.basic-forum-entry){align-self:stretch;box-sizing:border-box}
html body #community-app[data-presentation=dispatch] #app-view :is(.index-page-entry,.basic-forum-entry){min-height:150px}
/* Neutral skin sizes .forum-last-avatar ([data-presentation=neutral] only); dispatch
   never got an equivalent rule, so the raw <img> rendered at its native photo
   dimensions (700px+) and inflated the whole .basic-forum-entry row's height —
   this was the "turbo fucked" Forums list when map navigation is off. */
html body #community-app[data-presentation=dispatch] .basic-forum-latest:has(.forum-last-avatar){padding-left:48px;position:relative}
html body #community-app[data-presentation=dispatch] .forum-last-avatar{position:absolute;left:10px;top:10px;width:30px;height:34px;overflow:hidden;border-radius:5px}
html body #community-app[data-presentation=dispatch] .forum-last-avatar img{width:100%;height:100%;object-fit:cover}
html body #community-app[data-presentation=dispatch] .forum-entry-portrait{opacity:.5}
html body #community-app[data-presentation=dispatch] [data-entry-layout=banner]>.forum-entry-portrait{width:100%;opacity:.35;mask-image:linear-gradient(0deg,transparent,#000)}
html body #community-app[data-presentation=dispatch] [data-entry-layout=plain]>.forum-entry-portrait{display:none}
html body #community-app[data-presentation=dispatch] :is(.basic-forum-entry,.index-page-entry)[data-entry-layout]{border-top-color:var(--entry-accent,var(--theme-cyan,#ffc45b))}
/* Admin-authored welcome canvas uses desktop-relative horizontal positions. */
#community-app[data-scene=welcome] #app-view{max-width:none;width:100%;margin:0}
#community-app[data-scene=welcome] #app-workspace{padding:24px 5% 40px 32px}
.welcome-builder-actions{position:sticky;top:0;z-index:30;margin-bottom:14px;max-width:1400px}
.welcome-builder-actions:empty{display:none}
.welcome-edit-bar{display:flex;gap:12px;align-items:center;padding:10px;background:#171d1c;border:1px solid #9c784b}
.welcome-format-host .rich-toolbar{background:#171d1c;max-height:220px;overflow-y:auto}
.welcome-canvas{position:relative;width:100%;max-width:1400px;min-height:600px}
#community-app .welcome-widget{position:absolute;box-sizing:border-box;min-width:0;max-width:100%;padding:26px 30px;background:rgba(16,22,24,.92);border:1px solid #77624b;border-radius:6px;overflow:auto;box-shadow:0 4px 12px #0004}
.welcome-widget-copy{overflow-wrap:anywhere;min-height:40px}
#community-app .welcome-widget-copy h1{font-size:clamp(28px,3.3vw,48px);line-height:1.1;margin:12px 0 18px}
#community-app .welcome-widget-copy h2{font-size:26px;margin:10px 0 14px}
#community-app .welcome-widget-copy p{font-size:15px;line-height:1.65;color:#e0d7c9}
.welcome-widget-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.welcome-widget-links a{display:inline-flex;padding:12px 18px;border:1px solid #ffffff55;border-radius:7px;font-weight:800;text-decoration:none}
.welcome-widget-links a:hover{filter:brightness(1.15)}
.welcome-canvas.is-editing .welcome-widget{overflow:visible;padding-top:52px;outline:1px dashed #e1b474}
.welcome-canvas.is-editing .welcome-widget-copy{max-height:calc(100% - 65px);overflow:auto;outline:1px dashed #9c784b55}
.widget-handle{position:absolute;top:0;left:0;right:0;display:flex;gap:5px;padding:6px;background:#30382e;border-bottom:1px solid #a07e51;align-items:center}
.widget-handle button{font-size:11px;padding:5px 8px}
.widget-handle [data-drag]{cursor:move;touch-action:none}
.widget-handle [data-remove]{margin-left:auto}
.widget-resize{position:absolute;touch-action:none;z-index:4}
.widget-resize.east{right:-5px;top:42px;bottom:12px;width:10px;cursor:ew-resize}
.widget-resize.south{bottom:-5px;left:0;right:12px;height:10px;cursor:ns-resize}
.widget-resize.corner{right:-5px;bottom:-5px;width:17px;height:17px;background:#e5b66b;border:2px solid #362a1e;cursor:nwse-resize}
.welcome-link-dialog{width:min(700px,90vw);max-height:85vh;background:#19201e;color:#eee1c7;border:1px solid #ad8149;padding:24px}
.welcome-link-dialog fieldset{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0;padding:16px;border:1px solid #7e7054}
.welcome-link-dialog label{display:flex;flex-direction:column;gap:5px}
.welcome-link-dialog input,.welcome-link-dialog select{padding:9px;background:#101713;color:#fff;border:1px solid #887658;min-width:0}
#community-app .entry-copy-link{position:relative;margin-left:14px;align-self:center;border:1px solid #b08951;border-radius:5px;background:#30291f;color:#ffe2af;padding:8px 12px;font-weight:700}
#community-app .entry-copy-link:hover::after,#community-app .entry-copy-link:focus-visible::after{content:'Copy link';position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);background:#101815;color:#fff;white-space:nowrap;padding:7px 10px;border-radius:4px;font-size:12px}
/* Entire personnel record is the profile target, portrait included. */
#community-app .hero-roster .character-card{cursor:pointer;transition:box-shadow 160ms ease,outline-color 160ms ease;outline:2px solid transparent;outline-offset:1px}
#community-app .hero-roster .character-card:hover,
#community-app .hero-roster .character-card:focus-visible,
#community-app .hero-roster .character-card:focus-within{outline-color:var(--character-color,var(--color-accent-default,#ffc45b));box-shadow:0 0 0 1px var(--character-color,var(--color-accent-default,#ffc45b)),0 0 15px color-mix(in srgb,var(--character-color,var(--color-accent-default,#ffc45b)) 55%,transparent),2px 5px 8px #0006!important}
@media(prefers-reduced-motion:reduce){#community-app .hero-roster .character-card{transition:none}}
/* Desktop Dispatch toolbar: a compact, raised system menu. */
#community-app .dispatch-navigation{display:flex;align-items:center;flex-wrap:wrap;gap:14px;width:100%;box-sizing:border-box;padding:12px 18px;border:2px solid #abb5aa;border-top-color:#eef0db;border-left-color:#eef0db;border-radius:5px;background:linear-gradient(#d9ddce,#b3bfb4);color:#172626;box-shadow:2px 3px 0 #172526,0 7px 20px #0005;font-family:'Segoe UI',sans-serif}
#community-app .dispatch-navigation a,#community-app .dispatch-navigation [aria-current]{color:#172626}
#community-app .dispatch-navigation ol{flex:1;flex-wrap:wrap}
#community-app .dispatch-navigation .dispatch-actions{margin:0;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
#community-app .dispatch-navigation button{background:#eceddb;color:#142222;border:1px solid #667970;border-top-color:white;padding:7px 13px;box-shadow:1px 1px 0 #4f625d;font-weight:700}
#community-app .dispatch-navigation .app-pill{background:#455c55;color:#fff}
#community-app .world-map-caption{display:none}
#community-app .recycle-list article{display:flex;align-items:center;gap:12px;padding:18px;border-bottom:1px solid #77847a}
#community-app .recycle-list article>div{flex:1}
#community-app .recycle-list h2{margin:5px 0;font-size:20px}
#community-app .restore-error{color:#ffb0a2}
#community-app .profile-trash-action{display:block;margin:8px 0 12px auto}
#community-app .faction-short-badge,#community-app .hero-roster .roster-faction-pills>button{background:var(--faction-color,#c4b28d)!important;color:var(--faction-ink,#000)!important;border-color:var(--faction-color,#c4b28d)!important}
#community-app .recycle-folder{padding:12px 16px;border-left:1px solid #65766b;margin:8px 0;background:#16282780}
#community-app .recycle-folder>summary{cursor:pointer;font-weight:800;color:#edd5a3}
#community-app .app-pill svg{vertical-align:middle}
/* Edge-attached 1980s/90s workstation menu; content retains its own inset. */
#community-app[data-scene=world] #app-workspace{padding:0!important}
#community-app[data-scene=world] #app-view{max-width:none;width:100%;margin:0}
#community-app[data-scene=world] #app-view>.dispatch-navigation{position:sticky;top:0;z-index:8;margin:0 0 24px;min-height:58px;width:100%;border-radius:0;border:0;border-top:2px solid #f6f2df;border-bottom:3px double #3d4744;background:#b8bdb5;box-shadow:0 2px 0 #161f20;gap:12px;padding:9px 18px;font-family:'Courier New',monospace}
#community-app[data-scene=world] .dispatch-nav-mark{display:grid;place-items:center;color:#132828;background:#e4e4d4;border:1px solid #59685d;box-shadow:inset 1px 1px #fff,inset -1px -1px #718177;width:36px;height:32px;flex:none;font-size:24px}
#community-app[data-scene=world] .dispatch-navigation li{font-family:'Courier New',monospace;font-size:15px;font-weight:700}
#community-app[data-scene=world] .dispatch-navigation [aria-current]{background:#29433f;color:#fff8de;border-radius:0;padding:7px 10px}
#community-app[data-scene=world] .dispatch-navigation a{color:#182c2b;border-radius:0}
#community-app[data-scene=world] .dispatch-navigation a:hover{background:#29433f;color:#fff8de}
#community-app[data-scene=world] .dispatch-navigation button{border-radius:0;background:#d5d7c9;color:#142626;border:1px solid #56675f;border-top-color:#fff;border-left-color:#fff;box-shadow:1px 1px #233833;font:700 13px 'Courier New',monospace}
#community-app[data-scene=world] #app-view>:not(.dispatch-navigation):not(.dispatch-recycle){margin-left:26px;margin-right:26px}
#community-app .hero-roster .character-card-tags>span:first-child{background:#31453d!important;color:#fff2d4!important;border:1px solid #718475;font-weight:800}
#community-app .roster-origin-filter{margin:0;min-width:0}
#community-app .roster-origin-filter>summary{cursor:pointer;font:800 12px 'Segoe UI',sans-serif;color:#eadac0;padding:7px 0;letter-spacing:1px}
#community-app .roster-category-filter{margin:0;min-width:0}
#community-app .roster-category-filter>summary{cursor:pointer;font:800 12px 'Segoe UI',sans-serif;color:#eadac0;padding:7px 0;letter-spacing:1px}
#community-app[data-scene=archive]{--section-scene:url('/assets/backdrop-archive.svg');--scene-focus-x:40%;--scene-focus-y:50%}
#community-app[data-scene=archive]::after{opacity:1;background-image:linear-gradient(90deg,#10191615,#10191635),var(--section-scene)}
#community-app[data-scene=archive] #app-view{max-width:1000px;margin:0 0 0 auto}
#community-app[data-scene=archive] #app-workspace{padding:28px 4% 40px 34%}
#community-app[data-scene=archive] .app-heading{flex-wrap:wrap;padding:20px;background:#142522ed;border:1px solid #8b927b;box-shadow:4px 5px 0 #101c18}
#community-app[data-scene=archive] .app-heading h1{font-size:32px}
#community-app .archive-filters{display:flex;gap:8px;flex-wrap:wrap}
#community-app .archive-filters button{font-size:13px;padding:8px 12px;background:#263e34;color:#ebdfbc;border:1px solid #7f8a73;border-radius:3px}
#community-app .archive-filters button[aria-pressed=true]{background:#e1bf75;color:#1e2b24}
#community-app .archive-filters span{margin-left:5px;font-weight:800}
#community-app[data-scene=archive] .recycle-list{background:#142522ed;border:1px solid #7b8771;box-shadow:4px 5px 0 #101c18}
#community-app[data-scene=archive] .recycle-list article{flex-wrap:wrap}
@media(max-width:1050px){#community-app[data-scene=archive] #app-workspace{padding:24px 24px 40px 20%}}
#community-app[data-scene=dispatch]{--section-scene:url('/assets/backdrop-events-office.webp')}
#community-app .dispatch-request-desk{background:#192d2beb;border:1px solid #8f9579;padding:26px;box-shadow:6px 7px 0 #0e1a18}
#community-app .dispatch-request-desk>header{display:flex;justify-content:space-between;gap:15px;border-bottom:2px solid #d1b26b;padding-bottom:15px;font:800 14px 'Courier New',monospace;color:#f1dba4}
#community-app .dispatch-request-intro{margin:20px 0;font-size:17px;color:#eee4ca}
#community-app .dispatch-request-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
#community-app .dispatch-request-grid article{padding:24px;background:#dfd8ba;color:#25362e;border-top:6px solid #9b6234;box-shadow:3px 4px #09151166}
#community-app .dispatch-request-grid h2{color:#25362e;margin:14px 0 8px}
#community-app .dispatch-request-grid p{line-height:1.65;margin-top:16px}
#community-app .dispatch-request-stamp{font:800 12px 'Courier New',monospace;color:#804c28}
#community-app .dispatch-request-grid a{display:inline-block;padding:10px 12px;background:#284d43;color:#fff0c9;border:1px solid #183e32;text-decoration:none;font-weight:700}
#community-app .dispatch-request-desk>footer{margin-top:20px;color:#d6d9be;font:12px 'Courier New',monospace}
/* Expose the room artwork equally above and below the full-height sheet. */
#community-app #app-workspace:has(#profile-views:not([hidden])){padding-block:32px}
#community-app #profile-views{background:transparent}
#community-app #profile-views iframe{background:transparent;min-height:0}

.thread-tag-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;border:1px solid #827253;padding:12px;margin:14px 0}.thread-tag-fields legend{font-weight:800;padding:0 6px}.thread-tag-select{min-width:0;border:1px solid #827253;border-radius:5px;background:#192222;color:#f4ead6}.thread-tag-select summary{cursor:pointer;padding:10px;font-weight:800}.thread-tag-select summary span{font-size:11px;font-weight:400;float:right;margin-left:8px}.thread-tag-select>div{max-height:190px;overflow:auto;padding:4px 10px 10px}.thread-tag-select label{display:flex!important;align-items:center;gap:9px;padding:6px 0;margin:0!important;color:#f4ead6}.thread-tag-select input[type=checkbox]{width:16px!important;height:16px;flex:0 0 16px;margin:0!important;accent-color:var(--color-accent-default,#ffc45b)}.thread-tags{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.thread-tags:empty{display:none}.thread-tags .app-pill{background:#283434;color:#ffe3a6;border:1px solid #8e7850;font-weight:700}

/* Completed articles carry a red rubber stamp across the newspaper. */
.news-teaser,.newspaper-story{position:relative;isolation:isolate}
.event-status.is-complete{position:absolute;z-index:2;top:150px;left:50%;transform:translateX(-50%) rotate(-13deg);box-sizing:border-box;max-width:88%;padding:8px 16px;background:transparent;color:#a12a23;border:4px double currentColor;border-radius:5px;font:900 clamp(24px,2.7vw,42px)/1.05 'Segoe UI',sans-serif;letter-spacing:.12em;white-space:nowrap;opacity:.88;box-shadow:inset 0 0 0 1px #a12a2340;mix-blend-mode:multiply;pointer-events:none;text-shadow:1px 0 #791a1640}
.newspaper-story .event-status.is-complete{top:190px;font-size:clamp(32px,4vw,58px);padding:10px 24px}

/* Event prose has one canvas; columns are explicitly authored with the post tools. */
#community-app .news-body.forum-rich{column-count:1;column-rule:0;white-space:normal;font:17px/1.65 Georgia,serif;color:#302f29}
#community-app .event-article-editor .forum-rich{background:#ded9c5;min-height:320px;padding:20px;border:1px solid #827b65}
#community-app .news-body.forum-rich :is(h2,h3,h4){color:inherit}
#community-app .news-body.forum-rich h2{font:800 24px/1.25 'Segoe UI',sans-serif;margin:1em 0 .5em}
#community-app .news-body.forum-rich h3{font:750 20px/1.3 'Segoe UI',sans-serif;margin:.85em 0 .45em}
#community-app .news-body.forum-rich h4{font:700 17px/1.3 'Segoe UI',sans-serif;margin:.85em 0 .45em}
#community-app .news-body.forum-rich blockquote{border-color:#827b65;background:#302f2908}

.event-linked-threads{border-top:3px double #77715b;margin:12px 24px 24px;padding-top:20px}
#community-app .event-linked-threads>h3{color:#302f29;font:800 22px/1.2 Georgia,serif;margin:0 0 18px}.event-linked-threads>h3 span{font-size:14px;margin-left:8px}
.event-thread-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.event-thread-card{min-width:0;padding:15px;border:1px solid #827b6566;background:#c8c1a733;color:#302f29;overflow-wrap:anywhere}
#community-app .event-thread-title{display:block;color:#302f29;font:700 19px/1.25 Georgia,serif;text-decoration:underline;text-underline-offset:3px}
#community-app .event-thread-card>p{font:italic 13px/1.4 Georgia,serif;color:#514c3d;margin:8px 0}.event-thread-card>small{font:12px/1.4 'Segoe UI',sans-serif}.event-thread-card .thread-people{flex-wrap:wrap;margin-top:12px}.event-thread-card .thread-count{color:#514c3d}

/* The sheet scrolls in the app, with real transparent space after its footer. */
#community-app #app-workspace:has(#profile-views:not([hidden])){display:block;overflow-y:auto;overflow-x:hidden;padding:32px 30px 0}
#community-app #profile-views:not([hidden])::after{content:"";display:block;height:32px;pointer-events:none}

/* Forum index cards: last responder panel, compact activity and readable titles. */
.forum-thread-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.dispatch-thread-card{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(180px,1fr);grid-template-rows:1fr auto;min-height:195px;border:1px solid #8d95834d;border-radius:10px;background:linear-gradient(120deg,#293331ed,#17201ee8);overflow:hidden;box-shadow:0 5px 15px #0003;color:#eee9d9}
.thread-card-main{padding:16px;min-width:0}
#community-app .thread-card-title{display:block;font:800 italic 20px/1.2 'Segoe UI',sans-serif;text-transform:uppercase;color:#fff4d8;overflow-wrap:anywhere;margin-bottom:10px}
#community-app .thread-started{font:12px/1.4 'Segoe UI',sans-serif;margin:0 0 3px;color:#d0d0bf}.thread-started a{color:var(--thread-accent)}
/* Replaces the old per-poster alias-pill row (.thread-card-people) that used to sit
   on top of the latest-poster portrait - fine with one reply, unreadable once a
   thread has four different people posting in it. One line naming just the
   thread's original poster, by alias where they have one. */
#community-app .thread-started-by{display:block;margin:0 0 6px;font:600 12px/1.4 'Segoe UI',sans-serif;color:#c9cabd}
#community-app .thread-started-by span{color:var(--thread-accent);font-weight:700}
.thread-card-main>time,.thread-latest time{font:11px/1.4 'Segoe UI',sans-serif;color:#dbdfd3}
#community-app .thread-card-subtitle{font:italic 12px/1.5 Georgia,serif;margin:10px 0 0;color:#c4cbbd}
.thread-latest{position:relative;min-width:0;margin:7px 7px 7px 0;border-radius:7px;overflow:hidden;background:#111a18;isolation:isolate}
.thread-latest>img{position:absolute;inset:0 0 0 auto;width:68%;height:100%;object-fit:cover;object-position:50% 22%;z-index:-2}
.thread-latest::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#111a18 12%,#111a18db 40%,#111a1810 100%);z-index:-1}
.thread-latest-copy{padding:14px 9px 10px;display:flex;flex-direction:column;align-items:flex-start;gap:2px}.thread-latest-copy small{font:800 9px/1.2 'Segoe UI',sans-serif;letter-spacing:1px;color:var(--thread-accent)}
/* Named class (the old .latest-author rule above it was dead - the markup uses
   .thread-last-author and was inheriting no color at all). Alias when the last poster
   has one, otherwise their name (see threadListingCard's alias() helper). */
#community-app .thread-last-author{font:800 11px/1.4 'Segoe UI',sans-serif;color:#fff;text-shadow:0 1px 3px #000}
.thread-card-footer{grid-column:1/-1;display:flex;align-items:center;flex-wrap:wrap;gap:7px;padding:7px 12px;border-top:1px solid #a5ad9140;background:#10171566}
.thread-card-status,.thread-card-counts span{border-radius:4px;background:#070d0b66;padding:3px 7px;font:700 10px/1.4 'Segoe UI',sans-serif;color:#d9dece}.thread-card-status{font-style:italic}.thread-card-counts{display:flex;gap:5px;margin-left:auto}.thread-card-footer .thread-tags{margin:0;gap:4px}.thread-card-footer .thread-tags .app-pill{font-size:10px;padding:2px 6px}
.dispatch-thread-card.hv-title{border-color:var(--thread-accent)}
@media(max-width:1050px){.forum-thread-cards{grid-template-columns:1fr}}
/* Once cards drop to one per row, a narrow column (e.g. next to the locations sidebar,
   or on a narrow viewport) still forced the card's own internal two-column layout
   (title block + latest-post panel), squashing it into a stiff near-square tile instead
   of reading as a list row. A container query tracks the card's actual width — not the
   viewport — and stacks it into a compact single-column row once it gets tight. */
#community-app .forum-thread-cards{container-type:inline-size;container-name:thread-cards}
@container thread-cards (max-width:460px){
 #community-app .dispatch-thread-card{grid-template-columns:minmax(0,1fr);min-height:0}
 #community-app .dispatch-thread-card .thread-latest{margin:0 10px 10px;min-height:0}
 #community-app .dispatch-thread-card .thread-latest>img{position:static;width:100%;height:110px}
 #community-app .dispatch-thread-card .thread-latest::before{display:none}
}

/* A thread inherits both colors from its most recent posting character. */
.dispatch-thread-card{border-color:color-mix(in srgb,var(--thread-accent) 38%,#202322);background:linear-gradient(115deg,color-mix(in srgb,var(--thread-secondary) 40%,#171b1d),color-mix(in srgb,var(--thread-accent) 10%,#171b1d))}
#community-app .dispatch-thread-card .thread-card-title{color:var(--thread-accent)}
.dispatch-thread-card .thread-latest{background:color-mix(in srgb,var(--thread-secondary) 35%,#101617)}
.dispatch-thread-card .thread-latest::before{background:linear-gradient(90deg,color-mix(in srgb,var(--thread-secondary) 35%,#101617) 12%,color-mix(in srgb,var(--thread-secondary) 30%,#101617dd) 40%,transparent)}
.dispatch-thread-card .thread-card-footer{background:color-mix(in srgb,var(--thread-secondary) 25%,#111819);border-color:color-mix(in srgb,var(--thread-accent) 25%,transparent)}

/* Character-owned surfaces inherit their own palette, never the menu palette. */
html[data-theme] #community-app .hero-roster .character-card{background:color-mix(in srgb,var(--character-secondary,var(--color-accent-secondary,#713219)) 26%,#191f21);border-color:color-mix(in srgb,var(--character-color) 45%,#252b2c);border-top-color:var(--character-color);color:#e6ece9}
html[data-theme] #community-app .hero-roster .character-card:hover{background:color-mix(in srgb,var(--character-secondary,var(--color-accent-secondary,#713219)) 36%,#191f21)}
html[data-theme] #community-app .hero-roster .character-card :is(h2,.character-codename){color:var(--character-color)}
html[data-theme] #community-app .hero-roster .character-card :is(dt,dd,.app-muted){color:#d1dbd5}
html[data-theme] #community-app .hero-roster .character-card-portrait{background:#151d1f;border-color:color-mix(in srgb,var(--character-color) 35%,transparent)}
html[data-theme] #community-app .forum-post{background:color-mix(in srgb,var(--character-secondary,var(--color-accent-secondary,#713219)) 12%,#151c1e);border-color:color-mix(in srgb,var(--character-color) 35%,#242c2e);color:#edf0ee}
html[data-theme] #community-app .forum-post .post-author{background:linear-gradient(160deg,color-mix(in srgb,var(--character-secondary,var(--color-accent-secondary,#713219)) 38%,#172022),#151c1e);border-color:color-mix(in srgb,var(--character-color) 30%,transparent)}
html[data-theme] #community-app .forum-post :is(.post-author h3,.post-author h3 a,.post-ranks strong,.forum-rich h2,.forum-rich h3,.forum-rich h4){color:var(--character-color)}
html[data-theme] #community-app .forum-post .post-body>header{background:color-mix(in srgb,var(--character-secondary,var(--color-accent-secondary,#713219)) 24%,#172022);border-color:color-mix(in srgb,var(--character-color) 30%,transparent);color:#d3dbd7}
html[data-theme] #community-app .forum-post :is(.post-controls button,.post-ranks span){background:color-mix(in srgb,var(--character-secondary,var(--color-accent-secondary,#713219)) 40%,#172022);border-color:var(--character-color);color:#edf0ee}
html[data-theme] #community-app .forum-post .forum-rich blockquote{border-color:var(--character-color)}

/* Reference-inspired editorial hierarchy for forum cards. */
#community-app .dispatch-thread-card .thread-card-title{font:italic 400 29px/1.08 'Bebas Neue','Arial Narrow',sans-serif;letter-spacing:.65px;color:#f1f0e8;margin:0 0 10px;text-shadow:0 1px 2px #0004}
#community-app .dispatch-thread-card .thread-card-title:hover{color:var(--thread-accent);text-decoration:none}
#community-app .dispatch-thread-card .thread-started{font:500 11px/1.5 Consolas,'Courier New',monospace;letter-spacing:.7px;text-transform:lowercase;color:#c6ceca;margin-bottom:3px}
#community-app .dispatch-thread-card .thread-started a{font-weight:700;color:var(--thread-accent)}
.dispatch-thread-card .thread-card-main>time{display:block;font:600 10px/1.45 Consolas,'Courier New',monospace;text-transform:uppercase;letter-spacing:.6px;color:#b7c2bd}
#community-app .dispatch-thread-card .thread-card-subtitle{font:italic 12px/1.5 'Segoe UI',sans-serif;color:var(--thread-accent);margin-top:12px}
.dispatch-thread-card .thread-latest{display:flex;flex-direction:column;min-height:150px}
.dispatch-thread-card .thread-latest-copy{margin-top:auto;gap:2px;padding:10px}
.dispatch-thread-card .thread-latest-copy small{font:700 9px/1.3 Consolas,'Courier New',monospace;letter-spacing:1px;color:var(--thread-accent)}
.dispatch-thread-card .thread-latest time{font:600 10px/1.4 Consolas,'Courier New',monospace;letter-spacing:.3px;color:#dbe1de}
.dispatch-thread-card .thread-card-people .thread-person{font:600 9px/1.2 Consolas,'Courier New',monospace;letter-spacing:.25px;border-radius:3px;padding:3px 5px;color:var(--person-color);background:#18201dd9;border:1px solid color-mix(in srgb,var(--person-color) 35%,transparent)}
.dispatch-thread-card .thread-card-counts span{font:500 9px/1.4 Consolas,'Courier New',monospace;text-transform:uppercase;letter-spacing:.5px;color:#c8d0cc}
.dispatch-thread-card .thread-card-status{font:700 italic 10px/1.3 Consolas,'Courier New',monospace;letter-spacing:.7px}

#community-app .app-header .app-back-control{flex:0 0 auto;display:inline-flex;align-items:center;padding:9px 15px;border:1px solid #c7a062;border-radius:7px;background:#302b22;color:#ffe0a4;font:800 13px/1.2 'Segoe UI',sans-serif;cursor:pointer;transition:background 150ms ease,box-shadow 150ms ease}
#community-app .app-header .app-back-control:is(:hover,:focus-visible){background:#594127;box-shadow:0 0 10px #ffc45b40;outline:2px solid var(--color-accent-default,#ffc45b);outline-offset:2px}
#community-app .app-header .app-back-control:disabled{opacity:.35;cursor:default;box-shadow:none;outline:none}

/* Formatting palettes live in the browser top layer, beyond clipping and stacking contexts. */
#community-app .rich-more.rich-floating-panel{position:fixed;inset:auto;margin:0;width:min(360px,calc(100vw - 20px));max-height:calc(100dvh - 20px);overflow:auto;box-sizing:border-box;transform:none;border-radius:8px;z-index:2147483647;color:#f0e8d4;background:#192525;box-shadow:0 12px 36px #000a;padding:12px;gap:9px}
#community-app .rich-floating-panel:not(:popover-open){display:none}
#community-app .rich-panel-handle{display:flex;align-items:center;justify-content:space-between;flex:0 0 100%;box-sizing:border-box;cursor:move;touch-action:none;user-select:none;border-bottom:1px solid #b4986866;padding:0 0 8px;margin-bottom:3px}
#community-app .rich-panel-handle strong{font:800 14px 'Segoe UI',sans-serif;color:#ffcf80}
#community-app .rich-panel-handle button{font:700 21px/1 'Segoe UI',sans-serif;padding:3px 8px;min-width:30px;cursor:pointer}
#community-app .rich-floating-panel label{min-width:0;flex-wrap:wrap;gap:6px}
#community-app .rich-floating-panel input:not([type=number]),#community-app .rich-floating-panel select{max-width:100%;box-sizing:border-box}

#community-app[data-scene=world][data-world-location=overview] #app-view{max-width:none;height:100%;display:flex;flex-direction:column}
.world-region polygon{fill:transparent;stroke:transparent;stroke-width:2;transition:fill 140ms,stroke 140ms}
.world-region rect{fill:#13252ee8;stroke:#83a8a6;stroke-width:1.5}
.world-region text{fill:#e5efde;font:700 19px 'Segoe UI',sans-serif;pointer-events:none}
.world-region:is(:hover,:focus) polygon{fill:#ffc45b33;stroke:var(--color-accent-default,#ffc45b)}
.world-region:is(:hover,:focus) rect{fill:#594127;stroke:var(--color-accent-default,#ffc45b);stroke-width:3}

/* Keep forum threads in a bounded reading area beneath the full-width navigation. */
#community-app .forum-thread-cards{width:calc(100% - 48px);max-width:1180px;margin:0 auto 32px;box-sizing:border-box;gap:16px}
#community-app .dispatch-thread-heading{width:calc(100% - 48px);max-width:1180px;margin:24px auto 14px;box-sizing:border-box}
@media(max-width:650px){#community-app .forum-thread-cards,#community-app .dispatch-thread-heading{width:calc(100% - 24px)}}

.world-local-map{position:absolute;inset:0;background-color:#102b2c;background-size:cover;background-position:center;opacity:0;transition:opacity 700ms ease;pointer-events:none}
#community-app[data-scene=world][data-local-map-ready]:not([data-local-map-ready=""]) .world-local-map{opacity:1}
#community-app[data-local-map-ready]:not([data-local-map-ready=""]) .world-location-pin{visibility:hidden}
@media(prefers-reduced-motion:reduce){.world-local-map{transition:none}}

#community-app .dispatch-thread-heading.thread-list-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;scroll-margin-top:14px}
#community-app .thread-list-heading h2{margin:0;flex:0 0 auto}
#community-app .thread-list-heading .collection-pages{margin:0 0 0 auto;padding:0;border:0;justify-content:flex-end;gap:10px;flex-wrap:wrap}

/* World menu chrome follows the user's site palette, independent of characters. */
#community-app[data-scene=world] #app-view>.dispatch-navigation{background:linear-gradient(180deg,color-mix(in srgb,var(--theme-cyan,var(--color-accent-default,#ffc45b)) 82%,#fff4d9),var(--theme-cyan,var(--color-accent-default,#ffc45b)));color:#241a10;border-top-color:color-mix(in srgb,var(--theme-cyan,var(--color-accent-default,#ffc45b)) 40%,white);border-bottom-color:var(--theme-crimson,var(--color-accent-secondary,#713219));box-shadow:0 2px 0 color-mix(in srgb,var(--theme-crimson,var(--color-accent-secondary,#713219)) 65%,#151515)}
#community-app[data-scene=world] .dispatch-navigation :is(a,li+li:before){color:#241a10}
#community-app[data-scene=world] .dispatch-navigation :is([aria-current],a:hover){background:var(--theme-crimson,var(--color-accent-secondary,#713219));color:#fff3dd}
#community-app[data-scene=world] .dispatch-navigation button{background:color-mix(in srgb,var(--theme-cyan,var(--color-accent-default,#ffc45b)) 32%,#fff1d6);color:#241a10;border-color:var(--theme-crimson,var(--color-accent-secondary,#713219));border-top-color:#fff4dc;border-left-color:#fff4dc;box-shadow:1px 1px var(--theme-crimson,var(--color-accent-secondary,#713219))}
#community-app[data-scene=world] .dispatch-navigation button:is(:hover,:focus-visible){background:#fff4de;outline:2px solid var(--theme-crimson,var(--color-accent-secondary,#713219));outline-offset:2px}
#community-app[data-scene=world] .dispatch-navigation .app-pill{background:var(--theme-crimson,var(--color-accent-secondary,#713219));color:#fff3dd}
#community-app[data-scene=world] .dispatch-navigation svg{color:#241a10}

.app-history-controls{display:flex;align-items:center;gap:7px;flex:0 0 auto}
.world-region:is(:hover,:focus) .region-land{fill:#ffc45b22;stroke:#bca064}
.world-region:is(:hover,:focus) .region-flow{opacity:1;animation:region-border-flow 5s linear infinite}
@keyframes region-border-flow{to{stroke-dashoffset:-60}}
@media(prefers-reduced-motion:reduce){.world-region:is(:hover,:focus) .region-flow{animation:none}}
.world-region:is(:hover,:focus) .region-flow{animation:none;opacity:.85}
.world-region:is(:hover,:focus) .region-land{fill:#83c5bc14;stroke:transparent}
.world-region rect{fill:#13252edb;stroke:#83a8a65c;stroke-width:1}
.world-region:is(:hover,:focus) rect{fill:#203c42;stroke:#a9ddd5;stroke-width:1.5}

/* Scene artwork is one image, never tiled to fill a wider desktop. */
#community-app::after{background-repeat:no-repeat,no-repeat;}
.world-local-map{background-repeat:no-repeat;background-size:cover;}
/* The overview already owns a complete geographic image. Do not expose a
   second, differently scaled map through its margins on wide screens. */
#community-app[data-scene=world][data-world-location=overview] .world-backdrop{visibility:hidden;}
#community-app[data-scene=world][data-world-location=overview] #app-workspace{background:#142a35;}

/* Desktop stage: stop growing at 2560px (1440p); the outer gutters are not scenery. */
body.hz-ca{background:#090b0d;}
body.hz-ca::before{display:none;}
#community-app{
 --site-max-width:2560px;
 width:min(100%,var(--site-max-width));
 margin-inline:auto;
 contain:layout;
 isolation:isolate;
 box-shadow:0 0 0 100vmax #090b0d;
}

/* Quiet hierarchy bar; reserve the strong accent for the active location. */
#community-app[data-scene=world] #app-view>.dispatch-navigation{
 background:#1c1c1a;color:#e3d9c9;border:0;border-bottom:1px solid #494035;
 box-shadow:0 2px 8px #0003;font-family:'Segoe UI',sans-serif;
}
#community-app[data-scene=world] .dispatch-navigation li{font:600 14px/1.4 'Segoe UI',sans-serif;}
#community-app[data-scene=world] .dispatch-navigation a{color:#c6bfb3;border-radius:6px;}
#community-app[data-scene=world] .dispatch-navigation li+li:before{color:#796e5e;}
#community-app[data-scene=world] .dispatch-navigation a:hover{background:#ffffff0c;color:#fff3dd;text-decoration:none;}
#community-app[data-scene=world] .dispatch-navigation [aria-current]{
 display:inline-flex;align-items:center;border-radius:999px;padding:7px 15px;
 background:var(--theme-cyan,var(--color-accent-default,#ffc45b));color:#21180d;font-weight:750;
}
#community-app[data-scene=world] .dispatch-nav-mark{background:transparent;border:0;box-shadow:none;color:var(--theme-cyan,var(--color-accent-default,#ffc45b));}
#community-app[data-scene=world] .dispatch-navigation svg{color:inherit;}
#community-app[data-scene=world] .dispatch-navigation button{
 background:#292823;color:#ded5c5;border:1px solid #504637;border-radius:6px;
 box-shadow:none;font:600 13px/1.4 'Segoe UI',sans-serif;
}
#community-app[data-scene=world] .dispatch-navigation button:is(:hover,:focus-visible){background:#373127;color:#ffe4b1;outline:1px solid var(--theme-cyan,var(--color-accent-default,#ffc45b));outline-offset:1px;}
#community-app[data-scene=world] .dispatch-navigation .app-pill{background:transparent;color:#a69c8c;border:0;}

/* Location edit-controls: a single pencil-icon <details>/<summary> popover replacing the
   separate "Add subforum" / "Edit" buttons that used to crowd the header actions row. */
#community-app .location-edit-controls{position:relative;}
#community-app .location-edit-controls .icon-button{
 display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;
 border-radius:6px;font-size:15px;line-height:1;cursor:pointer;list-style:none;
}
#community-app .location-edit-controls .icon-button::-webkit-details-marker{display:none;}
#community-app .location-edit-controls[open] .icon-button{background:#373127;color:#ffe4b1;outline:1px solid var(--theme-cyan,var(--color-accent-default,#ffc45b));outline-offset:1px;}
#community-app .location-edit-menu{
 position:absolute;top:calc(100% + 6px);right:0;z-index:20;display:flex;flex-direction:column;gap:2px;
 min-width:180px;padding:6px;background:#1c1c1a;border:1px solid #504637;border-radius:8px;box-shadow:0 10px 26px #0006;
}
#community-app .location-edit-menu button{
 text-align:left;background:transparent;border:0;border-radius:5px;padding:8px 10px;
 color:#ded5c5;font:600 13px/1.4 'Segoe UI',sans-serif;white-space:nowrap;
}
#community-app .location-edit-menu button:is(:hover,:focus-visible){background:#292823;color:#ffe4b1;outline:none;}
#community-app[data-scene=world] .location-edit-controls .icon-button{background:#292823;color:#ded5c5;border:1px solid #504637;box-shadow:none;}
#community-app[data-scene=world] .location-edit-controls .icon-button:is(:hover,:focus-visible){background:#373127;color:#ffe4b1;outline:1px solid var(--theme-cyan,var(--color-accent-default,#ffc45b));outline-offset:1px;}

/* When narrow enough that everything in the header would form one column anyway, use two
   rows instead — the location trail on top, the sort/thread/edit actions below — with the
   computer icon spanning both rows on the left rather than repeating per row. */
@media(max-width:650px){
 #community-app[data-scene=world] #app-view>.dispatch-navigation{
  display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;align-items:center;gap:6px 12px;
 }
 #community-app[data-scene=world] #app-view>.dispatch-navigation .dispatch-nav-mark{grid-column:1;grid-row:1/3}
 #community-app[data-scene=world] #app-view>.dispatch-navigation>ol{grid-column:2;grid-row:1;min-width:0}
 #community-app[data-scene=world] #app-view>.dispatch-navigation .dispatch-actions{grid-column:2;grid-row:2;margin:0}
}

/* Keep the reading column bounded on the left, and leave real room on the right
   (see the matching :has() rule below, which is what actually governs this layout
   whenever the browser supports :has() - this is only the fallback for one that
   doesn't). */
#community-app[data-scene=world] #app-view>.thread-reading-area:not(.dispatch-navigation){
 width:calc(100% - 26px - var(--thread-right-reserve));max-width:2100px;margin:0 auto 32px 26px;
 min-width:0;
}

.thread-morph-snapshot{position:absolute;z-index:40;overflow:hidden;pointer-events:none;transform-origin:0 0;border-radius:10px;}

.dispatch-thread-card[data-thread-path]{cursor:pointer;transition:border-color 160ms ease,box-shadow 160ms ease;}
.dispatch-thread-card[data-thread-path]:is(:hover,:focus-visible){border-color:var(--thread-accent);box-shadow:0 0 14px color-mix(in srgb,var(--thread-accent) 24%,transparent);}

/* Tied to the thread's own accent (--thread-frame-accent, set on `view` in thread()
   from the latest poster's color) instead of a flat gray box, so the header reads as
   part of the same thread as the posts below it rather than generic chrome. */
.thread-view-heading{
 display:flex;align-items:center;justify-content:space-between;gap:20px;
 margin:0 0 18px;padding:16px 22px 16px 20px;
 position:relative;z-index:3;
 background:linear-gradient(120deg,color-mix(in srgb,var(--thread-frame-accent,#b58549) 16%,#141a1c),#12181aee 65%);
 border:1px solid color-mix(in srgb,var(--thread-frame-accent,#b58549) 30%,#ffffff14);
 border-left:4px solid var(--thread-frame-accent,#b58549);
 border-radius:4px 10px 10px 4px;
 box-shadow:0 4px 16px #0007;
}
.thread-view-heading>div{min-width:0;}
#community-app .thread-view-heading h1{
 margin:0;font:400 clamp(24px,2.1vw,34px)/1.1 'Bebas Neue','Arial Narrow',sans-serif;
 letter-spacing:.6px;text-transform:uppercase;color:#f5efe3;overflow-wrap:anywhere;
 text-shadow:0 1px 3px #00000066;
}
#community-app .thread-view-subtitle{margin:7px 0 0;color:#c5baaa;font-style:italic;font-size:13px;}
.thread-manage{position:relative;flex:none;}
.thread-manage summary{
 cursor:pointer;list-style:none;
 border:1px solid color-mix(in srgb,var(--thread-frame-accent,#b58549) 55%,#ffffff20);
 background:color-mix(in srgb,var(--thread-frame-accent,#b58549) 20%,#20231f);
 color:#fff3de;border-radius:999px;padding:8px 16px;font-weight:700;font-size:12.5px;
 transition:background 160ms ease;
}
.thread-manage summary:hover{background:color-mix(in srgb,var(--thread-frame-accent,#b58549) 32%,#20231f);}
.thread-manage summary::-webkit-details-marker{display:none;}
.thread-manage summary::after{content:' ▾';}
.thread-manage[open] summary{background:color-mix(in srgb,var(--thread-frame-accent,#b58549) 40%,#20231f);}
.thread-manage-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:170px;display:grid;gap:5px;padding:8px;background:#1c1c1a;border:1px solid #6b5639;border-radius:9px;box-shadow:0 8px 24px #0008;}
#community-app .thread-manage-menu button{text-align:left;background:transparent;border:0;white-space:nowrap;}
#community-app .thread-manage-menu button:hover{background:#ffffff10;}
#community-app .thread-manage-menu #trash-thread{color:#ffaaaa;}

.thread-title-line{display:flex;align-items:center;flex-wrap:wrap;gap:12px;}
/* A small pill instead of bare colored text sitting inline with the title - reads as
   metadata about the thread rather than a second, competing headline. */
.thread-total-posts{
 flex:none;font:800 11px/1.3 'Segoe UI',sans-serif;letter-spacing:.4px;text-transform:uppercase;
 color:#171b1d;background:var(--thread-frame-accent,#ffc45b);
 padding:4px 10px 3px;border-radius:999px;white-space:nowrap;
}

.thread-reply-toggle{margin:24px 0 32px;}
.thread-reply-toggle>summary{display:inline-flex;align-items:center;gap:8px;cursor:pointer;list-style:none;padding:10px 20px;border:1px solid #947244;border-radius:999px;background:#30291f;color:#ffe0a5;font-weight:750;}
.thread-reply-toggle>summary::before{content:'+';font-size:20px;line-height:1;}
.thread-reply-toggle[open]>summary::before{content:'−';}
.thread-reply-toggle>summary::-webkit-details-marker{display:none;}
#community-app .thread-reply-toggle .reply-box{margin-top:14px;}
#community-app .forum-post{grid-template-columns:224px minmax(0,1fr);}
#community-app .forum-post .post-author{padding:14px;display:flex;flex-direction:column;gap:10px;}
#community-app .forum-post .post-author img{margin:0;aspect-ratio:5/6;object-fit:cover;object-position:top;border-radius:5px;}
#community-app .forum-post .post-author h3{margin:0;font-size:16px;line-height:1.25;}
#community-app .forum-post .post-author p{margin:0;font-size:12px;line-height:1.5;}
#community-app .forum-post .post-ranks{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;margin-top:2px;padding-top:10px;border-top:1px solid color-mix(in srgb,var(--character-color) 25%,transparent);}
#community-app .forum-post .post-ranks span{padding:4px 1px;text-align:center;border-radius:4px;font:700 9px/1.3 'Segoe UI',sans-serif;}
#community-app .forum-post .post-ranks strong{font-size:15px;margin-top:3px;}

.post-portrait-reveal{position:relative;display:block;aspect-ratio:5/6;overflow:hidden;border-radius:5px;background:color-mix(in srgb,var(--character-secondary) 30%,#101719);}
#community-app .forum-post .post-portrait-reveal>img{width:100%;height:100%;transition:opacity 240ms ease;}
.post-portrait-facts{position:absolute;inset:0;margin:0;padding:15px;display:flex;flex-direction:column;justify-content:center;gap:10px;opacity:0;transition:opacity 240ms ease;overflow:auto;}
.post-portrait-facts dt{font:700 9px/1.2 'Segoe UI',sans-serif;text-transform:uppercase;letter-spacing:1px;color:var(--character-color);}
.post-portrait-facts dd{margin:3px 0 0;font:600 12px/1.3 'Segoe UI',sans-serif;color:#f3eee5;overflow-wrap:anywhere;}
.post-profile-link{font:700 10px/1.3 'Segoe UI',sans-serif;color:var(--character-color);margin-top:3px;}
.post-portrait-demographics{color:#e7e3d8;font:600 12px/1.5 'Segoe UI',sans-serif;text-align:center;}
.post-portrait-reveal:is(:hover,:focus-visible)>img{opacity:.08;}
.post-portrait-reveal:is(:hover,:focus-visible) .post-portrait-facts{opacity:1;}
.post-identity{padding:3px 0 10px;border-bottom:2px solid color-mix(in srgb,var(--character-color) 55%,transparent);}
#community-app .forum-post .post-author .post-identity h3{font:400 25px/1.05 'Bebas Neue','Arial Narrow',sans-serif;letter-spacing:.7px;text-transform:uppercase;color:#f4eee2;}
#community-app .forum-post .post-author .post-identity h3 a{color:inherit;}
#community-app .forum-post .post-author .post-codename{margin-top:7px;font:800 italic 17px/1.2 'Segoe UI',sans-serif;color:var(--character-color);overflow-wrap:anywhere;}
.post-codename>span{font:500 10px 'Segoe UI',sans-serif;color:#b6b4aa;}
@media(prefers-reduced-motion:reduce){.post-portrait-facts,#community-app .forum-post .post-portrait-reveal>img{transition:none;}}

/* Leave the writing unobstructed; post utilities belong below the content. */
#community-app .forum-post .post-body{display:flex;flex-direction:column;gap:24px;}
/* forum-rich used to flex:1 and the footer used margin-top:auto to pin itself to the
   bottom of the row - which is exactly as tall as the portrait sidebar next to it. That
   left a big empty void between short post text and the footer, since the text no longer
   determined the footer's position. Sizing forum-rich to its own content and letting the
   footer follow directly after it keeps the post looking full regardless of length; any
   leftover height (from a tall portrait next to a short post) now falls below the footer,
   where it reads as ordinary background instead of a gap inside the post. */
#community-app .forum-post .post-body>.forum-rich{flex:none;min-width:0;}
#community-app .forum-post .post-meta-footer{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:0;padding:12px 0 0;background:transparent;border:0;border-top:1px solid #ffffff12;color:#a8aaa5;font:11px/1.4 'Segoe UI',sans-serif;}
html[data-theme] #community-app .forum-post .post-meta-footer .post-controls button{background:transparent;border:1px solid #ffffff20;color:#d7d9d2;padding:5px 10px;font-size:11px;border-radius:5px;}
html[data-theme] #community-app .forum-post .post-meta-footer .post-controls button:hover{color:var(--character-color);border-color:var(--character-color);}

.post-stat-radar{display:block;width:100%;height:auto;flex:none;overflow:visible;--stat-cutout:#172022;color:var(--character-color);}
.post-radar-base,.post-radar-icon circle{fill:#172022;stroke:var(--character-color);stroke-width:1;}
.post-radar-ring{fill:none;stroke:var(--character-color);stroke-opacity:.3;stroke-width:.8;}
.post-radar-value{fill:color-mix(in srgb,var(--character-color) 28%,transparent);stroke:var(--character-color);stroke-width:1.5;}
.post-radar-icon:hover,.post-radar-icon:focus{filter:drop-shadow(0 0 3px var(--character-color));outline:none;}

/* The author panel must fit its portrait, identity, and full radar chart. */
#community-app .forum-post .post-author{min-height:460px;align-self:stretch;}
#community-app .forum-post .post-author .post-portrait-reveal,
#community-app .forum-post .post-author .post-identity,
#community-app .forum-post .post-author .post-stat-radar{flex-shrink:0;}
#community-app .forum-post .post-author .post-stat-radar{margin-top:auto;}

/* Match the uploaded 600 × 900 (2:3) forum portrait instead of the compact crop. */
#community-app .forum-post .post-author .post-portrait-reveal{aspect-ratio:2/3;}
#community-app .forum-post .post-author .post-portrait-reveal>img{aspect-ratio:2/3;object-fit:cover;object-position:center;}
#community-app .forum-post .post-author{min-height:560px;}

/* Portrait hover holds the radar; identity and memberships remain readable. */
#community-app .forum-post .post-author{min-height:0;justify-content:flex-start;}
.post-portrait-stats{padding:10px;gap:12px;align-items:center;}
.post-portrait-stats .post-stat-radar{width:100%;margin:0;}
.post-portrait-reveal:focus-within>img{opacity:.08;}
.post-portrait-reveal:focus-within .post-portrait-facts{opacity:1;}
.post-demographics{color:#d2cfc7;font:600 12px/1.5 'Segoe UI',sans-serif;}
.post-memberships{display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
#community-app .post-memberships :is(.post-group-pill,.faction-short-badge){display:inline-flex;align-items:center;justify-content:center;max-width:100%;border-radius:999px;padding:5px 11px;font:750 12px/1.3 'Segoe UI',sans-serif;text-align:center;overflow-wrap:anywhere;}
.post-group-pill{background:var(--character-color);color:#151919;border:1px solid color-mix(in srgb,var(--character-color) 65%,white);}

/* Larger portrait radar, with utilities outside the text's layout area. */
.post-portrait-stats{padding:2px;gap:8px;overflow:visible;}
.post-portrait-stats .post-stat-radar{width:100%;transform:none;}
#community-app .forum-post .post-author .post-identity h3 a:hover,
#community-app .forum-post .post-author .post-identity h3 a:focus-visible{color:#fff;text-shadow:0 0 10px #ffffff66;}
#community-app .forum-post .post-body{position:relative;display:flex;flex-direction:column;gap:20px;}
#community-app .forum-post .post-body>.post-controls{align-self:flex-end;flex:none;margin:0;position:relative;z-index:2;}
html[data-theme] #community-app .forum-post .post-body>.post-controls button{background:transparent;border:1px solid #ffffff20;color:#d7d9d2;padding:5px 10px;font-size:11px;border-radius:5px;}
html[data-theme] #community-app .forum-post .post-body>.post-controls button:hover{color:var(--character-color);border-color:var(--character-color);}
#community-app .forum-post .post-meta-footer{align-self:stretch;justify-content:flex-end;flex:none;text-align:right;border:0;padding:8px 0 0;margin-top:0;}
#community-app .forum-post .post-body>.forum-rich{display:flow-root;overflow-wrap:anywhere;}

/* Compact corner utilities without a separate toolbar row. */
#community-app .forum-post .post-body{padding-top:30px;}
#community-app .forum-post .post-body>.post-controls{position:absolute;top:5px;right:10px;gap:5px;margin:0;}
html[data-theme] #community-app .forum-post .post-body>.post-controls button{padding:2px 7px;font-size:10px;line-height:1.3;border-color:transparent;border-radius:4px;}

/* Full-size actions float above the text rather than occupying a toolbar row. */
#community-app .forum-post .post-body>.post-controls{position:absolute;top:5px;right:10px;gap:7px;z-index:2;}
html[data-theme] #community-app .forum-post .post-body>.post-controls button{padding:5px 10px;font-size:11px;line-height:1.4;border:1px solid #ffffff20;border-radius:5px;}
#community-app .forum-post .post-body{padding-top:40px;}

/* Blend the latest poster's portrait into the card on its left edge. */
#community-app .dispatch-thread-card .thread-latest>img{
 -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 48%,#000 100%);
 mask-image:linear-gradient(to right,transparent 0%,#000 48%,#000 100%);
 -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
}

#community-app .thread-reply-toggle>summary{display:flex;width:max-content;max-width:100%;margin-left:auto;}

.thread-heading-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;flex:0 1 auto;}
#community-app .thread-heading-actions .thread-tags{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;margin:0;}
#community-app .thread-heading-actions .thread-tags .app-pill{font-size:11px;padding:5px 10px;}

/* Alternate author placement in chronological post order, starting on the left. */
#community-app .forum-post.post-profile-right{grid-template-columns:minmax(0,1fr) 180px;}
#community-app .forum-post.post-profile-right>.post-author{grid-column:2;grid-row:1;border-right:0;border-left:1px solid color-mix(in srgb,var(--character-color) 30%,transparent);}
#community-app .forum-post.post-profile-right>.post-body{grid-column:1;grid-row:1;}

.sidebar-hover-label{position:fixed;inset:auto;margin:0;padding:8px 12px;border:1px solid #80613c;border-radius:6px;background:#1c1c1a;color:#ffe2b0;box-shadow:0 5px 16px #0007;font:600 13px/1.4 'Segoe UI',sans-serif;white-space:nowrap;pointer-events:none;}
.sidebar-hover-label:not(:popover-open){display:none;}

/* Compact shared writing toolbar with task-based advanced menus. */
#community-app .rich-tools{gap:6px;align-items:center;padding:8px;}
#community-app .rich-tools>label{display:flex;align-items:center;gap:6px;font-size:11px;}
#community-app .rich-tools>button,#community-app .rich-tools>details>summary{min-height:32px;padding:6px 10px;font-size:12px;line-height:1.3;}
#community-app .rich-tools>details>summary{cursor:pointer;border:1px solid #86724e;border-radius:5px;}
.rich-history-group{display:flex;gap:4px;margin-left:auto;padding-left:8px;border-left:1px solid #ffffff25;}
#community-app .rich-history-group button{font-size:19px;padding:3px 9px;line-height:1.3;}
#community-app .rich-tools>[data-cmd=bold]{font-weight:900;}
#community-app .rich-tools>[data-cmd=italic]{font-style:italic;}
#community-app .rich-tools>[data-cmd=underline]{text-decoration:underline;}

/* World entry: a responsive operations terminal, not a fitted geographic image. */
.world-terminal{flex:1;min-height:480px;margin:24px 16px 30px;padding:12px 12px 0;border:2px solid #55564e;border-radius:22px;background:linear-gradient(120deg,#434741,#222823 55%,#44473e);box-shadow:0 16px 32px #0008,inset 0 2px 2px #a2a39455;display:flex;flex-direction:column}
.world-terminal-screen{position:relative;flex:1;display:flex;flex-direction:column;padding:clamp(24px,4vw,64px);border:4px solid #0c1514;border-radius:12px;background:radial-gradient(ellipse at 25% 0,#28433e,#101f20 75%);box-shadow:inset 0 0 60px #0007;color:#e8e2ce;overflow:hidden}
.world-terminal-welcome{display:flex;align-items:center;gap:28px;padding:12px 0 42px;border-bottom:1px solid #b2beab33;flex-wrap:wrap}.terminal-brand{font-size:clamp(42px,5vw,80px);font-weight:950;font-style:italic;color:#eab66b;letter-spacing:-5px}.world-terminal-welcome p{font-size:11px;letter-spacing:3px;color:#d5b67e;margin:0 0 10px}.world-terminal-welcome h1{font-size:clamp(26px,3vw,42px);margin:0 0 12px;color:#efe9d8}.world-terminal-welcome div>span{color:#b5c3b7;font-size:15px}.terminal-status{margin-left:auto;font:11px monospace;letter-spacing:1px;color:#a7c8ae}.terminal-directory-label{margin:32px 0 16px;font:12px monospace;letter-spacing:2px;color:#c7b48e}.terminal-location-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.terminal-location-grid .location-row{position:relative;min-height:135px;margin:0;overflow:hidden;border:1px solid #80988c66;background:#132520;border-radius:6px}.terminal-location-grid .location-copy{position:relative;z-index:1}.terminal-session{display:flex;justify-content:space-between;gap:16px;padding-top:50px;margin-top:auto;font:10px monospace;letter-spacing:2px;color:#81978c}.terminal-bezel{height:30px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;font:9px monospace;letter-spacing:2px;color:#b3b5a5}.terminal-bezel i{width:6px;height:6px;border-radius:50%;background:#b0da93;box-shadow:0 0 8px #b0da93}
@media(min-width:1600px){.terminal-location-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.terminal-location-grid{grid-template-columns:1fr}.world-terminal{margin:16px 0}.terminal-status{margin-left:0}.terminal-session{letter-spacing:1px}}

.world-terminal-screen{padding:clamp(20px,3vw,42px);overflow:auto}.world-terminal-welcome{padding:0 0 24px;gap:22px}.world-terminal-welcome h1{font-size:clamp(24px,2.5vw,36px)}.terminal-directory-label{margin:22px 0 14px}.terminal-session{padding-top:24px}.terminal-location-grid{flex-shrink:0}#community-app .terminal-location-grid .location-banner{z-index:0}

.event-badge-wrap{position:relative;display:inline-flex}.event-badge-tooltip{display:none;position:absolute;bottom:100%;right:0;width:230px;padding:12px;background:#111d20;color:#f4e6ce;border:1px solid #c89a55;border-radius:6px;box-shadow:0 8px 24px #0009;z-index:100}.event-badge-wrap:hover .event-badge-tooltip,.event-badge-wrap:focus-within .event-badge-tooltip{display:grid;gap:6px}.event-badge-tooltip small{font-size:9px;letter-spacing:2px;color:#cfb589}.event-badge-tooltip a{font-size:14px!important;font-weight:700;color:#fff!important}
.rich-image-selection{position:fixed;margin:0;padding:0;border:2px solid #e1ae60;background:transparent;overflow:visible;pointer-events:none;box-sizing:border-box}.rich-image-selection:popover-open{display:block}.image-attached-tools{position:absolute;pointer-events:auto;display:grid;grid-template-columns:1fr auto;gap:8px;width:265px;padding:12px;border:1px solid #ac8853;border-radius:8px;background:#152321;color:#f4e4c8;box-shadow:0 8px 25px #0008;font:12px 'Segoe UI',sans-serif}.image-attached-tools label,.image-attached-tools small{grid-column:1/-1;display:grid;gap:4px}.image-attached-tools input,.image-attached-tools select{min-width:0;width:100%;box-sizing:border-box;padding:6px;background:#efe3c8;color:#192723;border:1px solid #a99977;border-radius:3px}.image-attached-tools button{background:#e3c18b;color:#172321;border:0;border-radius:3px;padding:5px 9px;cursor:pointer}.image-size-handle{position:absolute;pointer-events:auto;width:12px;height:12px;padding:0;border:2px solid #fff;background:#c48b40;transform:translate(-50%,-50%);touch-action:none}.handle-n{left:50%;top:0;cursor:ns-resize}.handle-s{left:50%;top:100%;cursor:ns-resize}.handle-w{left:0;top:50%;cursor:ew-resize}.handle-e{left:100%;top:50%;cursor:ew-resize}.handle-ne{left:100%;top:0;cursor:nesw-resize}.handle-se{left:100%;top:100%;cursor:nwse-resize}.handle-sw{left:0;top:100%;cursor:nesw-resize}.handle-nw{left:0;top:0;cursor:nwse-resize}

.event-badge-wrap .event-badge-tooltip{display:none!important}.event-link-popover{position:fixed;inset:auto;margin:0;width:245px;padding:12px;background:#14211f;color:#f9ead4;border:1px solid #c89a55;border-radius:7px;box-shadow:0 8px 24px #0009}.event-link-popover:popover-open{display:grid;gap:7px}.event-link-popover small{font:10px monospace;letter-spacing:2px;color:#d0ae77}.event-link-popover a{font:700 15px 'Segoe UI',sans-serif;color:#fff;text-decoration:none}

/* One black physical monitor surrounds every World screen, including threads. */
.world-monitor-frame{display:none;position:absolute;z-index:45;pointer-events:none;box-sizing:border-box;border:12px solid #080a0b;border-radius:14px;box-shadow:inset 0 0 0 1px #414548,0 0 0 1px #151719;background:transparent}.world-monitor-frame>span{position:absolute;bottom:-11px;left:18px;font:700 8px monospace;letter-spacing:3px;color:#777}.world-monitor-frame>i{position:absolute;bottom:-9px;right:20px;width:4px;height:4px;border-radius:50%;background:#b8c7a2}#community-app[data-scene=world] .world-monitor-frame{display:block}#community-app[data-scene=world] #app-workspace{border:12px solid transparent;box-sizing:border-box;background:transparent}#community-app[data-scene=world][data-world-location=overview] #app-workspace{background:#080c0e}#community-app[data-scene=world] .world-backdrop{border-radius:3px;overflow:hidden}#community-app[data-scene=world] .world-terminal{margin:0;padding:0;border:0;border-radius:0;box-shadow:none;background:#080c0e;min-height:0}#community-app[data-scene=world] .world-terminal-screen{border:0;border-radius:0;background:radial-gradient(ellipse at 30% 0,#202629,#090d10 80%);box-shadow:none;padding:clamp(24px,4vw,64px)}.terminal-bezel{display:none}.location-morph-card{position:absolute!important;z-index:40!important;transform-origin:0 0;pointer-events:none;margin:0!important;max-width:none!important;overflow:hidden;border-radius:6px;background:#101619!important}.location-morph-card .location-banner{z-index:0!important}.location-morph-card .location-copy{position:relative;z-index:1}

#community-app .terminal-location-grid .territory-card{display:block;padding:20px 24px;min-height:140px}.terminal-location-grid .territory-card .location-copy{width:100%;max-width:none}.territory-title{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.territory-title>a{font-size:18px;color:#f4ead5;text-decoration:none}.territory-title>a:hover{color:#fff;text-shadow:0 0 10px #d4b477}.territory-child{display:inline-flex;align-items:center;padding:6px 10px;border:1px solid #8d998877;border-radius:5px;background:#15201ff0;color:#eee4cf!important;font-size:12px;font-weight:650;text-decoration:none}.territory-child:hover,.territory-child:focus-visible{background:#dbc28e;color:#14211f!important;border-color:#ead3a6;box-shadow:0 0 12px #dcc49944}

/* Recessed CRT glass; all highlights stay inside the monitor footprint. */
#community-app[data-scene=world] #app-workspace{border-width:20px}
.world-monitor-frame{border:20px solid #101113;border-radius:0;box-shadow:none;overflow:hidden}
.world-monitor-frame::before{content:'';position:absolute;inset:0;border-radius:30px / 24px;box-shadow:0 0 0 28px #101113,inset 0 0 0 2px #565e5c,inset 0 0 10px 2px #abc9b62b,inset 0 0 36px 8px #000b;background:linear-gradient(135deg,#dcebe409,transparent 23%,transparent 78%,#0002);pointer-events:none}
.world-monitor-frame::after{content:'';position:absolute;inset:-19px;border:1px solid #464849;border-radius:5px;box-shadow:inset 2px 2px 3px #ffffff13,inset -3px -3px 4px #000;pointer-events:none}
.world-monitor-frame>span{bottom:-16px;left:20px;font-size:9px;letter-spacing:4px;color:#8a8b86;z-index:1}.world-monitor-frame>i{bottom:-13px;right:24px;width:5px;height:5px;background:#b2c6a1;box-shadow:0 0 6px #b2c6a166;z-index:1}
#community-app[data-scene=world] .world-backdrop{border-radius:28px / 22px}
#community-app[data-scene=world] #app-view>.dispatch-navigation{padding-left:28px;padding-right:28px}

#community-app .terminal-location-grid .territory-card .location-copy{width:100%;max-width:none;flex:1;position:relative;z-index:1}#community-app .terminal-location-grid .territory-title{display:flex;flex-direction:row;align-items:center;gap:12px}#community-app .terminal-location-grid .territory-title>a{white-space:nowrap}.world-terminal-screen{min-height:0}#community-app[data-scene=world] .world-terminal-screen{padding-block:30px}.terminal-session{padding-top:22px}

/* Sub-location badges span the territory card, above its banner. */
#community-app .territory-card .territory-children{position:relative;z-index:2;display:flex;flex-wrap:wrap;width:100%;max-width:none;gap:7px;box-sizing:border-box}
#community-app .territory-card .territory-child{flex:1 1 auto;justify-content:center;text-align:center;white-space:nowrap;background:#15201ff5;box-shadow:0 2px 5px #0004}
#community-app .territory-card .territory-child:hover,#community-app .territory-card .territory-child:focus-visible{background:#dbc28e;color:#14211f!important}

/* Compact territory badges and content-sized directory cards. */
#community-app .terminal-location-grid{align-items:start}
#community-app .terminal-location-grid .territory-card{min-height:0;height:auto;padding:18px 24px 16px;align-self:start}
#community-app .territory-card .territory-child{flex:0 0 auto;padding:5px 9px;line-height:1.2}

/* Locations share the restrained thread-card proportions and typography. */
#community-app .territory-card .territory-child{font-size:7pt}
#community-app .location-grid{width:calc(100% - 52px);max-width:1180px;gap:14px;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
#community-app .location-grid .location-row{min-height:122px;box-sizing:border-box;padding:18px 18px 42px;align-items:flex-start;border:1px solid #8d95834d;border-radius:10px;background:linear-gradient(120deg,#293331f5,#17201ef2);box-shadow:0 5px 15px #0003;transition:border-color .18s,box-shadow .18s;text-decoration:none}
#community-app .location-grid .location-copy{position:relative;width:70%;max-width:none;z-index:1}
#community-app .location-grid .location-copy strong{display:block;font:800 italic 20px/1.2 'Segoe UI',sans-serif;text-transform:uppercase;color:#fff4d8;text-shadow:0 1px 4px #000}
#community-app .location-grid .location-copy em{font:italic 12px/1.5 Georgia,serif;color:#d0d5c9;margin-top:8px}
#community-app .location-grid .location-banner{width:58%;opacity:.7;mask-image:linear-gradient(to right,transparent,#000 75%);-webkit-mask-image:linear-gradient(to right,transparent,#000 75%)}
#community-app .location-grid .location-row::after{content:'';position:absolute;inset:auto 0 0;height:30px;background:#10171599;border-top:1px solid #a5ad912b;z-index:0}
#community-app .location-grid .location-row:hover,#community-app .location-grid .location-row:focus-visible{border-color:#d2b47a;box-shadow:0 0 14px #c5a26130}
@media(max-width:900px){#community-app .location-grid{grid-template-columns:1fr}}

/* Separate location navigation from the narrower conversation directory. */
#community-app .location-grid{width:calc(100% - 52px);max-width:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding-bottom:22px;margin-bottom:24px;border-bottom:1px solid #a5ad9140;border-radius:0}
#community-app .location-grid .location-row{min-height:96px;padding:16px 18px 34px}
#community-app .location-grid .location-copy strong{font-style:normal;font-size:19px;line-height:1.2}
#community-app .location-grid .location-row::after{height:26px}
#community-app .location-grid .location-banner{width:66.667%}
@media(min-width:1500px){#community-app .location-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){#community-app .location-grid{grid-template-columns:1fr}}

/* Personnel directory projected onto the briefing-room wall. */
#community-app[data-scene=characters]{--section-scene:url('/assets/backdrop-projected-directory.svg');--scene-focus-x:50%;--scene-focus-y:50%}
html[data-theme] #community-app .hero-roster{border:1px solid #e4efce24;border-radius:2px;outline:0;transform:none;background:radial-gradient(ellipse at 48% 35%,#c6dec325,#bacdb314 65%,#8599850a);background-image:radial-gradient(ellipse at 48% 35%,#c6dec325,#bacdb314 65%,#8599850a);box-shadow:0 0 35px #d9edbb12,inset 0 0 45px #dce9c815;padding:22px;margin:10px 0 0}
html[data-theme] #community-app .hero-roster::before,html[data-theme] #community-app .hero-roster::after,html[data-theme] #community-app .hero-roster .character-card::before{content:none!important;display:none!important}
html[data-theme] #community-app .hero-roster .character-card{transform:none;box-shadow:0 0 5px color-mix(in srgb,var(--character-color) 12%,transparent)}
#community-app #app-workspace:has(#app-view:not([hidden]) .hero-roster){padding:40px 5% 6vh}
html[data-theme] #community-app .hero-roster .character-filters{background:#172421c9;border:1px solid #cfdfbf30;box-shadow:none}

/* Let the illustrated projection supply the surface, light and room context. */
html[data-theme] #community-app .hero-roster{background:transparent;background-image:none;border:0;outline:0;box-shadow:none;padding:14px 18px;margin:0;transform:none}
#community-app #app-workspace:has(#app-view:not([hidden]) .hero-roster){padding:34px 5% 7vh 15%}
html[data-theme] #community-app .hero-roster .character-card{box-shadow:0 0 6px color-mix(in srgb,var(--character-color) 15%,transparent);border-radius:4px}

#community-app[data-scene=characters]{--section-scene:url('/assets/backdrop-projector-office.webp');--scene-focus-x:50%;--scene-focus-y:50%}

#community-app #app-workspace:has(#app-view:not([hidden]) .hero-roster){padding:28px 4% 9vh 26%}#community-app[data-scene=characters]::after{opacity:1;background-image:linear-gradient(#080e1418,#080e1418),var(--section-scene)}

.rich-image-drop-marker{position:fixed;inset:auto;margin:0;padding:0;height:3px;background:#ffd587;border:0;box-shadow:0 0 8px #ffc361;pointer-events:none;overflow:visible}.rich-image-drop-marker::before{content:'';position:absolute;left:-4px;top:-3px;width:9px;height:9px;border-radius:50%;background:#ffd587}
[contenteditable=true] img{cursor:grab;touch-action:none}[contenteditable=true] img:active{cursor:grabbing}

#community-app #app-workspace:has(#app-view:not([hidden]) .hero-roster){position:relative;padding:0;overflow:hidden}
#community-app #app-view:not([hidden]).hz-heroroster{position:absolute;left:var(--projection-left,30%);top:var(--projection-top,20px);width:var(--projection-width,65%);height:var(--projection-height,75%);max-width:none;margin:0;display:flex;flex-direction:column;min-height:0}
#community-app #app-view.hz-heroroster>.app-heading{flex-shrink:0;margin:0 0 14px;padding-inline:12px}
#community-app #app-view.hz-heroroster>.app-heading h1{font-size:clamp(22px,2vw,32px)}
html[data-theme] #community-app .hero-roster{flex:1;min-height:0;width:auto;padding:0 12px;margin:0}

[contenteditable="true"] img{-webkit-user-drag:none;user-select:none;touch-action:none;cursor:grab}

/* Pagination belongs directly on the projected wall, without an extra panel. */
#community-app .hero-roster .roster-pages{background:transparent;border:0;box-shadow:none;border-radius:0;padding:5px 0}

#community-app[data-scene=characters]{--section-scene:url('/assets/backdrop-projector-office-v2.webp')}

.projector-ignition-shade{position:absolute;inset:84px 0 32px 204px;pointer-events:none;z-index:12;background:#080d10}.sidebar-collapsed .projector-ignition-shade{left:64px}

#community-app[data-scene=characters]{--section-scene:url('/assets/backdrop-personnel-briefing.webp');--scene-focus-x:50%;--scene-focus-y:50%}
#community-app #app-view.hz-heroroster>.app-heading h1{color:#243331;text-shadow:0 0 2px #f1f4df80}
html[data-theme] #community-app .hero-roster #character-count{color:#293b36;text-shadow:none}

/* Directory-origin sheets occupy the actual projected slide, with internal scrolling. */
#community-app #app-workspace:has(#profile-views.projected-character-view:not([hidden])){position:relative;padding:0!important;overflow:hidden!important}
#community-app #profile-views.projected-character-view:not([hidden]){position:absolute;left:var(--projection-left);top:var(--projection-top);width:var(--projection-width);height:var(--projection-height);max-width:none!important;margin:0!important;padding:0!important;overflow:hidden;border-radius:2px;background:#151d21}
#community-app #profile-views.projected-character-view iframe:not([hidden]){display:block;width:100%;height:100%!important;min-height:0!important;border:0;margin:0}

#community-app #profile-views.projected-character-view:not([hidden]){background:#f4f3eb;border-radius:0;box-shadow:0 0 15px #f7f7e966}
#community-app #profile-views.projected-character-view::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:3;box-shadow:inset 0 0 18px 6px #fff9}

#community-app[data-scene=characters]{--section-scene:url('/assets/backdrop-personnel-briefing-small-projector.webp')}

#community-app #profile-views.projected-character-view:not([hidden]){box-shadow:none}
#community-app #profile-views.projected-character-view::after{box-shadow:none;background:none}
.projection-room-foreground{position:absolute;inset:0;z-index:10;pointer-events:none;background:linear-gradient(#080e1418,#080e1418),url('/assets/backdrop-personnel-briefing-small-projector.webp') center/cover no-repeat}
.projection-room-foreground[hidden]{display:none}

/* Directory identity badges share a readable, compact pill treatment. */
#community-app .hero-roster .character-card-tags{gap:6px;line-height:1.3;margin-bottom:8px}
#community-app .hero-roster .character-card-tags>span{display:inline-flex;align-items:center;justify-content:center;max-width:100%;box-sizing:border-box;border-radius:999px;padding:4px 10px;margin:0;font:750 11px/1.3 'Segoe UI',sans-serif;letter-spacing:.15px;text-align:center;white-space:normal;overflow-wrap:anywhere;border:1px solid color-mix(in srgb,var(--character-color) 65%,transparent);background:color-mix(in srgb,var(--character-color) 16%,#172122);color:#f5f3ea}
#community-app .hero-roster .character-card-tags>.faction-short-badge{border-color:var(--faction-color)!important}

.projection-sheet-back{position:absolute;z-index:11;border:1px solid #f2f0dc80!important;border-radius:999px!important;background:#192322dc!important;color:#faf6e8!important;padding:8px 14px!important;box-shadow:0 3px 12px #0005;font-weight:750;cursor:pointer}
.projection-sheet-back:hover{background:#364440!important;box-shadow:0 0 12px #f5f3d945}
.projection-sheet-back[hidden]{display:none}

#community-app #profile-views.projected-character-view iframe{border-radius:0!important}

/* Exposed sheet space shows the same painted screen as its surrounding edges. */
#community-app #profile-views.projected-character-view:not([hidden]){background:transparent!important}
#community-app #profile-views.projected-character-view iframe{background:transparent!important}

#community-app #profile-views.projected-character-view iframe{color-scheme:light!important}

#community-app .projection-sheet-back{background:color-mix(in srgb,var(--back-secondary,#364440) 65%,#15201e)!important;color:var(--back-accent,#faf6e8)!important;border:1px solid var(--back-accent,#faf6e8)!important;padding:10px 18px!important;border-radius:6px!important;letter-spacing:.5px}
#community-app .projection-sheet-back:hover{box-shadow:0 0 14px color-mix(in srgb,var(--back-accent) 45%,transparent);filter:brightness(1.2)}
#community-app #app-workspace:has(#profile-views.projected-character-view:not([hidden])){cursor:pointer}
#community-app #profile-views.projected-character-view{cursor:auto;transform-origin:center;will-change:transform,opacity}

/* Leave the screen visible under the directory filters; use the site palette. */
html[data-theme] #community-app .hero-roster .character-filters{margin-bottom:18px;min-height:0;background:color-mix(in srgb,var(--sdn-4d2030,#4d2919) 78%,transparent);border:1px solid var(--sdn-743047,#9b6235);box-shadow:none}
#community-app #app-view.hz-heroroster>.app-heading h1{margin-left:12px}
html[data-theme] #community-app .hero-roster .roster-filter-fields>label,
html[data-theme] #community-app .hero-roster :is(.roster-category-filter,.roster-origin-filter)>summary{color:var(--sdn-eee6ea,#ffe4ba)}
html[data-theme] #community-app .hero-roster .character-filters :is(input,select){background:var(--sdn-14151b,#241b16);border-color:var(--sdn-6d3547,#8b5b32);color:var(--sdn-eee6ea,#ffe4ba)}

#community-app .app-heading #new-character{margin-right:14px;background:linear-gradient(180deg,#eaa23e,#c77a25);color:#241b12;border:1px solid #f6bc63;border-radius:7px;font-weight:800;box-shadow:inset 0 1px 0 #ffe0a459,0 2px 5px #20140930}
#community-app .app-heading #new-character:hover{background:linear-gradient(180deg,#f3b454,#d88a30);border-color:#ffce7c;box-shadow:0 0 10px #e99b3940}
#community-app .app-heading #new-character:focus-visible{outline:2px solid #fff0cf;outline-offset:3px}

/* The projected dossier uses the same enclosing frame as its roster card. */
#community-app #profile-views.projected-character-view:not([hidden]){box-sizing:border-box;border:3px solid var(--sheet-accent);border-top:5px solid var(--sheet-accent);border-radius:4px;background:color-mix(in srgb,var(--sheet-secondary,var(--color-accent-secondary,#713219)) 26%,#191f21)!important;box-shadow:0 0 6px color-mix(in srgb,var(--sheet-accent) 15%,transparent)}

.projection-return-hint{display:none}
#community-app #profile-views.projected-character-view>.projection-return-hint{display:flex;position:absolute;inset:0;z-index:6;align-items:center;justify-content:center;pointer-events:none;background:#080c1059;color:#fff7e7;font:750 18px/1.4 'Segoe UI',sans-serif;text-shadow:0 2px 6px #000;opacity:0;transition:opacity 160ms ease}
#community-app #profile-views.projected-character-view.projection-return-hover>.projection-return-hint{opacity:1}
@media(prefers-reduced-motion:reduce){#community-app #profile-views.projected-character-view>.projection-return-hint{transition:none}}

.projected-travel-portrait{position:fixed;z-index:10001;pointer-events:none;object-fit:cover;transform-origin:top left;will-change:transform;display:block}

.projected-travel-label{position:fixed;z-index:10002;pointer-events:none;white-space:nowrap;box-sizing:border-box;display:block;text-decoration:none}
.projected-travel-portrait{will-change:left,top,width,height;object-fit:cover}

/* Shared dossier typography and identity-pill palette. */
html[data-theme] #community-app .hero-roster .character-card h2{font:400 20px/1.1 'Bebas Neue','Arial Narrow',sans-serif;letter-spacing:1px;color:#e8e6e1;text-transform:lowercase}
html[data-theme] #community-app .hero-roster .character-card .character-codename{font:400 28px/1.3 'Clarity City','Overpass','Segoe UI',sans-serif;letter-spacing:1px;color:var(--character-color);text-transform:uppercase}
#community-app .hero-roster .character-codename .codename-prefix{font:500 12px/1.3 'Segoe UI',sans-serif;letter-spacing:0;text-transform:lowercase}

/* Character identity: white name, personal accent on the alias only. */
html[data-theme] #community-app .hero-roster .character-card h2,
html[data-theme] #community-app .hero-roster .character-card h2 a{color:#e8e6e1!important}
html[data-theme] #community-app .hero-roster .character-card .character-codename{color:var(--character-color)!important}

#community-app .hero-roster .character-card-name-row{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;min-width:0;margin:3px 0 5px}
#community-app .hero-roster .character-card .character-card-name-row h2,
#community-app .hero-roster .character-card .character-card-name-row .character-codename{margin:0;min-width:0}

/* Keep words intact when character-card text wraps. */
#community-app .hero-roster .character-card,
#community-app .hero-roster .character-card :is(h2,a,p,span,dt,dd){overflow-wrap:normal!important;word-break:normal!important;hyphens:none!important}
#community-app .hero-roster .character-card-info{overflow:visible;min-width:0}
#community-app .hero-roster .character-card-name-row{flex-shrink:0}

.application-desk{max-width:1060px;margin:30px auto 60px;background:#e6dfcc;color:#292c29;border:1px solid #aaa18a;border-radius:5px;box-shadow:0 18px 50px #0008;padding:32px 40px;font-family:Georgia,serif}
.application-letterhead{display:flex;justify-content:space-between;gap:16px;border-bottom:3px double #796c50;padding-bottom:18px;font:800 12px 'Segoe UI',sans-serif;letter-spacing:1.5px}
.application-intro{padding:30px 0;border-bottom:1px solid #afa48c}.application-intro small{letter-spacing:2px;color:#78532c}.application-intro h1{font-size:42px;margin:8px 0}.application-intro p{line-height:1.5}
#community-app .application-desk button{background:#b46728;color:#fff4de;border:1px solid #75401a;border-radius:5px;padding:13px 19px;font-weight:800;font-size:15px}
.application-files h2{font-size:23px}.application-files h2 span{font:700 14px 'Segoe UI';margin-left:10px}.application-file{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;border-top:1px solid #b9ae96}.application-file h3{font-size:25px;margin:7px 0}#community-app .application-file a{color:#67431e;text-decoration:underline}.application-desk footer{border-top:3px double #796c50;margin-top:28px;padding-top:18px;font:700 11px/1.7 'Segoe UI';letter-spacing:1px}.application-desk footer small{font-weight:400;letter-spacing:0}

.application-desk{max-width:1300px}.application-columns{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:38px}.application-intro{border:0}.application-files{padding-top:25px}.application-character{display:flex;gap:12px;min-height:150px;margin:14px 0;padding:12px;border:1px solid var(--character-color);border-top:4px solid var(--character-color);border-radius:6px;background:color-mix(in srgb,var(--character-secondary) 26%,#191f21);color:#e8e6e1;cursor:pointer}.application-character .character-card-portrait{width:75px;flex:none}.application-character .character-card-portrait img{width:100%;height:135px;object-fit:cover;border-radius:4px}.application-character h2{margin:8px 0;font-family:'Bebas Neue',sans-serif}#community-app .application-character h2 a{color:#e8e6e1}.application-character .character-codename{color:var(--character-color);font-family:'Clarity City','Overpass','Segoe UI',sans-serif}.application-character .character-card-tags{display:flex;flex-wrap:wrap;gap:5px;font-size:10px}.application-character .character-card-tags>span{border:1px solid var(--character-color);border-radius:20px;padding:3px 6px}.application-character .character-card-info{min-width:0}.application-character:hover{box-shadow:0 0 12px color-mix(in srgb,var(--character-color) 35%,transparent)}

#community-app[data-scene=application]{--section-scene:url('/assets/backdrop-application-classifieds.webp');--scene-focus-x:50%;--scene-focus-y:50%}
#community-app[data-scene=application] .application-desk{background:transparent;border:0;box-shadow:none;padding:0;max-width:1180px;margin:70px auto 60px}
#community-app[data-scene=application] .application-letterhead{background:#ded7c3;padding:14px 24px;border:1px solid #aaa18a;border-bottom:3px double #6d624e;color:#34352f}
.application-columns{gap:22px;align-items:start}
#community-app .application-intro{padding:28px 32px;background:linear-gradient(95deg,#ded8c6,#eee7d5 45%,#ded7c3);box-shadow:2px 8px 18px #0006;border:1px solid #b9af96;margin-top:8px}
#community-app .application-intro h1{font:bold 43px/.98 Georgia,serif;letter-spacing:-1.5px;color:#292a26;border-top:5px solid #34352f;border-bottom:1px solid #77715f;padding:18px 0;margin:14px 0}
#community-app .application-intro h2{font:bold 18px Georgia,serif;text-transform:uppercase;letter-spacing:.6px;border-top:1px solid #a69b81;padding-top:16px;color:#32342c}
#community-app .application-intro p,#community-app .application-intro li{color:#34352f;font:16px/1.55 Georgia,serif}
#community-app .application-intro a{color:#73491d;text-decoration:underline}
#community-app .application-files{margin-top:22px;padding:18px;background:#b8a078;border:1px solid #6d5837;border-radius:0 7px 7px 7px;box-shadow:3px 8px 18px #0007;position:relative}
.application-files:before{content:'APPLICANT FILES';position:absolute;top:-22px;left:-1px;background:#b8a078;border:1px solid #6d5837;border-bottom:0;border-radius:6px 6px 0 0;padding:5px 14px;font:800 11px 'Segoe UI',sans-serif;letter-spacing:1px}
#community-app .application-files>h2{color:#302a20;font:800 17px 'Segoe UI',sans-serif;margin:4px 0 16px}
#community-app .application-desk>footer{background:#ded7c3;padding:14px 24px;border:1px solid #aaa18a;margin-top:18px;color:#34352f}

.history-destination-tooltip{position:fixed;z-index:2147483647;pointer-events:none;max-width:min(360px,calc(100vw - 16px));padding:9px 13px;border:1px solid #c7a062;border-radius:6px;background:#211c17;color:#ffe0a4;box-shadow:0 5px 16px #0007;font:700 13px/1.4 'Segoe UI',sans-serif;overflow-wrap:break-word}
.history-destination-tooltip[hidden]{display:none}

.projection-cursor-hint{position:fixed;z-index:2147483647;pointer-events:none;padding:7px 10px;border:1px solid #c7a062;border-radius:5px;background:#211c17;color:#ffe0a4;font:700 12px 'Segoe UI',sans-serif;box-shadow:0 3px 12px #0006}
.projection-cursor-hint[hidden]{display:none}

/* Interview clipboard: live copy sits directly on the paper, inside a board rim. */
#community-app[data-scene=application] .application-desk{margin-top:100px;max-width:1120px}
#community-app .application-intro.interview-clipboard{position:relative;isolation:isolate;margin:0;padding:46px 30px 26px;border:18px solid #64503a;border-top-width:26px;border-bottom-width:24px;border-radius:13px;background:repeating-linear-gradient(0deg,#6d614406 0 1px,transparent 1px 3px),linear-gradient(100deg,#d5cdb9,#e9e3d2 25%,#e1dac7 90%,#cfc6ae);box-shadow:inset 0 0 0 1px #fff8,inset 5px 0 9px #37281824,0 3px 0 #33291f,9px 16px 22px #0009;}
.interview-clipboard:before{content:'';position:absolute;z-index:2;left:50%;top:-34px;transform:translateX(-50%);width:150px;height:49px;border:2px solid #353b39;border-radius:9px 9px 5px 5px;background:linear-gradient(180deg,#939b95,#535d59 17%,#bac1b7 22%,#64716b 50%,#a1aaa0 70%,#454e49 86%,#303a35);box-shadow:0 7px 6px #0005,inset 0 1px 1px #e0e5d7}
.interview-clipboard:after{content:'';position:absolute;z-index:3;width:42px;height:12px;left:50%;top:-30px;transform:translateX(-50%);border:3px solid #333c37;border-radius:7px;background:#192420;box-shadow:0 1px 1px #ccd0c2}
#community-app[data-scene=application] .interview-clipboard .application-letterhead{padding:0 0 12px;margin:0 0 22px;background:transparent;border:0;border-bottom:2px solid #655f4e;font-size:10px;letter-spacing:1px}
#community-app .interview-clipboard h1{border-top:0;font-size:38px;margin-top:8px;padding-top:0}
#community-app .interview-clipboard h2{font-size:15px}
#community-app .interview-clipboard p,#community-app .interview-clipboard li{font-size:15px;line-height:1.5}
#community-app .interview-clipboard .clipboard-footer{font-size:10px;background:transparent;margin-top:25px;padding-top:14px;color:#625d4f}
#community-app .application-files{margin-top:45px}

#community-app #profile-views{position:relative}
#community-app #profile-views.projected-character-view:not([hidden]){border-top-width:15px;overflow:visible}
.sheet-window-bar{position:absolute;right:3px;top:-15px;height:14px;display:flex;gap:3px;z-index:60;align-items:center}
#community-app .sheet-window-bar button{display:grid;place-items:center;width:24px;height:14px;min-height:0;margin:0;padding:0;border:0;border-radius:2px;background:#10171945;color:#101719;font:bold 16px/1 'Segoe UI';cursor:pointer}
#community-app .sheet-window-bar button:hover{background:#fff9}
#community-app .sheet-window-bar button:last-child:hover{background:#a82f36;color:white}
#community-app #profile-views:not(.projected-character-view){border-top:15px solid var(--sheet-accent,var(--color-accent-default,#ffc45b))}
.minimized-character-file{position:absolute;bottom:38px;left:50%;transform:translateX(-50%);z-index:10050;display:flex;max-width:360px;border:1px solid var(--sheet-accent,var(--color-accent-default,#ffc45b));border-top:4px solid var(--sheet-accent,var(--color-accent-default,#ffc45b));border-radius:5px 5px 0 0;background:#202627;box-shadow:0 -4px 18px #0006}
.minimized-character-file[hidden]{display:none}
#community-app .minimized-character-file button{background:transparent;color:#eee9dc;border:0;border-radius:0;padding:10px 14px;font-weight:700;cursor:pointer}
#community-app .minimized-character-file button:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#community-app .minimized-character-file button:hover{background:#ffffff18}
#community-app .minimized-character-file button:last-child:hover{background:#a82f36}

#community-app .minimized-character-file .minimized-file-drag{flex:none;cursor:grab;touch-action:none;user-select:none;padding:10px;font-size:17px;color:var(--sheet-accent,var(--color-accent-default,#ffc45b));border-right:1px solid #ffffff20}
#community-app .minimized-character-file .minimized-file-drag.dragging{cursor:grabbing}
#community-app .minimized-character-file button:nth-child(2){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Taller sheet window chrome, within the existing outer sheet bounds. */
#community-app #profile-views.projected-character-view:not([hidden]){border-top-width:22.5px}
#community-app #profile-views:not(.projected-character-view){border-top-width:22.5px}
.sheet-window-bar{top:-22.5px;height:21px}
#community-app .sheet-window-bar button{height:21px;font-size:20px}

.sheet-window-bar{left:0;right:0;justify-content:flex-end;padding:0 4px;box-sizing:border-box}
#community-app .sheet-window-bar button{width:32px;padding:2px 7px;height:21px;line-height:17px;flex:none}
#community-app #profile-views.floating-character-window{position:fixed!important;left:15%;top:15%;width:min(1050px,80vw)!important;height:70vh!important;max-width:none;margin:0!important;z-index:10040;box-sizing:border-box;border:3px solid var(--sheet-accent);border-top:22.5px solid var(--sheet-accent);border-radius:5px;background:#1b2022;box-shadow:0 16px 60px #0009;overflow:visible}
#community-app #profile-views.floating-character-window iframe{height:100%!important;min-height:0;border-radius:0!important}
.floating-character-window .sheet-window-bar{cursor:grab;touch-action:none}
.floating-character-window .sheet-window-bar:active{cursor:grabbing}

#community-app #profile-views.floating-character-window{width:var(--floating-width,min(1050px,80vw))!important;height:var(--floating-height,70vh)!important}
.sheet-resize-handle{display:none}
.floating-character-window .sheet-resize-handle{display:block;position:absolute;z-index:65;touch-action:none}
.floating-character-window .resize-n{top:-26px;left:8px;right:8px;height:6px;cursor:ns-resize}
.floating-character-window .resize-s{bottom:-4px;left:8px;right:8px;height:8px;cursor:ns-resize}
.floating-character-window .resize-e{right:-4px;top:0;bottom:8px;width:8px;cursor:ew-resize}
.floating-character-window .resize-w{left:-4px;top:0;bottom:8px;width:8px;cursor:ew-resize}
.floating-character-window :is(.resize-ne,.resize-nw,.resize-se,.resize-sw){width:12px;height:12px}
.floating-character-window .resize-ne{top:-26px;right:-4px;cursor:nesw-resize}
.floating-character-window .resize-nw{top:-26px;left:-4px;cursor:nwse-resize}
.floating-character-window .resize-se{bottom:-4px;right:-4px;cursor:nwse-resize}
.floating-character-window .resize-sw{bottom:-4px;left:-4px;cursor:nesw-resize}
.sheet-window-resizing iframe{pointer-events:none}

/* Bounds apply to dragging, restored dimensions, and viewport changes alike. */
#community-app #profile-views.floating-character-window{
 min-width:min(540px,80vw)!important;max-width:min(1050px,80vw)!important;
 min-height:min(320px,70vh)!important;max-height:70vh!important;
}

/* All sheet presentations share window manipulation; the directory stays behind. */
#community-app #profile-views.projected-character-view{z-index:10040!important}
#community-app #profile-views.projected-character-view.sheet-window-positioned{position:fixed!important;margin:0!important;width:var(--floating-width,var(--projection-width))!important;height:var(--floating-height,var(--projection-height))!important;max-width:var(--floating-max-width,min(1050px,80vw))!important;max-height:var(--floating-max-height,70vh)!important;min-width:min(540px,80vw)!important;min-height:min(320px,70vh)!important}
.projected-character-view .sheet-window-bar{cursor:grab;touch-action:none}
.projected-character-view .sheet-window-bar:active{cursor:grabbing}
.projected-character-view .sheet-resize-handle{display:block;position:absolute;z-index:65;touch-action:none}
.projected-character-view .resize-n{top:-26px;left:8px;right:8px;height:6px;cursor:ns-resize}
.projected-character-view .resize-s{bottom:-4px;left:8px;right:8px;height:8px;cursor:ns-resize}
.projected-character-view .resize-e{right:-4px;top:0;bottom:8px;width:8px;cursor:ew-resize}
.projected-character-view .resize-w{left:-4px;top:0;bottom:8px;width:8px;cursor:ew-resize}
.projected-character-view :is(.resize-ne,.resize-nw,.resize-se,.resize-sw){width:12px;height:12px}
.projected-character-view .resize-ne{top:-26px;right:-4px;cursor:nesw-resize}
.projected-character-view .resize-nw{top:-26px;left:-4px;cursor:nwse-resize}
.projected-character-view .resize-se{bottom:-4px;right:-4px;cursor:nwse-resize}
.projected-character-view .resize-sw{bottom:-4px;left:-4px;cursor:nesw-resize}

/* Floating sheets keep the same projected size limits and sit above the scene.
   (This must target .floating-character-window, not .projected-character-view —
   re-capping the projected selector here overrode line 2190's own max-width/
   max-height with the small pre-maximize --projection-width/height, which is
   why Maximize looked like it did nothing for a projected sheet.) */
#community-app #profile-views.projected-character-view{overflow:visible!important}
#community-app #profile-views.floating-character-window.sheet-window-positioned{max-width:var(--projection-width)!important;max-height:var(--projection-height)!important}
.projected-travel-portrait{z-index:10061!important}
.projected-travel-label{z-index:10062!important}

/* Compact, precisely centered window controls, independent of font metrics. */
#community-app .sheet-window-bar{gap:8px;padding:0 9px;align-items:center}
#community-app .sheet-window-bar .sheet-traffic-control{position:relative;display:block;flex:0 0 14px;width:14px;height:14px;min-width:14px;padding:0;border:1px solid #0003;border-radius:50%;box-shadow:inset 0 1px 1px #ffffff50;background:#ffbd44;color:#49320b}
#community-app .sheet-window-bar .sheet-close-control{background:#ff6058;color:#61130f}
#community-app .sheet-traffic-control::before,#community-app .sheet-close-control::after{content:'';position:absolute;left:50%;top:50%;width:7px;height:1.5px;border-radius:1px;background:currentColor;transform:translate(-50%,-50%);opacity:0;transition:opacity .15s}
#community-app .sheet-close-control::before{transform:translate(-50%,-50%) rotate(45deg)}
#community-app .sheet-close-control::after{transform:translate(-50%,-50%) rotate(-45deg)}
#community-app .sheet-maximize-control.is-maximized::after{opacity:0;transition:opacity .15s}
#community-app .sheet-window-bar:hover .sheet-traffic-control::before,#community-app .sheet-window-bar:hover .sheet-close-control::after,#community-app .sheet-window-bar:hover .sheet-maximize-control.is-maximized::after,#community-app .sheet-traffic-control:focus-visible::before,#community-app .sheet-close-control:focus-visible::after,#community-app .sheet-maximize-control.is-maximized:focus-visible::after{opacity:1}
#community-app .sheet-window-bar .sheet-traffic-control:hover{filter:brightness(1.12)}
#community-app .sheet-window-bar .sheet-submit-application{width:auto;height:19px;min-height:0;margin-right:auto;padding:1px 12px;border:1px solid var(--sheet-accent);border-radius:10px;background:#1b2022;color:var(--sheet-accent);font:700 11px/15px 'Segoe UI',sans-serif;letter-spacing:.025em;white-space:nowrap}
#community-app .sheet-window-bar .sheet-submit-application:hover{background:color-mix(in srgb,var(--sheet-accent) 22%,#1b2022);box-shadow:0 0 8px color-mix(in srgb,var(--sheet-accent) 45%,transparent)}
#community-app .sheet-window-bar .sheet-submit-application:disabled{opacity:.7;cursor:default}
#community-app .sheet-submit-feedback{position:absolute;top:8px;left:10px;right:10px;z-index:80;padding:10px 14px;border:1px solid var(--sheet-accent);border-radius:5px;background:#202326;color:#fff;box-shadow:0 4px 15px #0008}
#community-app .sheet-window-bar [hidden],#community-app .sheet-submit-feedback[hidden]{display:none!important}

/* Guidebook navigation follows the POI top-right pagination layout. */
#community-app .handbook-pagination{order:-1;align-self:flex-end;width:auto;max-width:100%;display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:12px;min-height:0;margin:0 0 12px auto;padding:7px 10px;border:1px solid var(--sdn-743047,#9b6235);border-radius:7px;background:color-mix(in srgb,var(--sdn-4d2030,#4d2919) 78%,transparent);color:#ffe4ba;box-shadow:none}
#community-app .handbook-pagination span{margin:0;color:#ffe4ba;font:800 13px/1.3 'Segoe UI',sans-serif;white-space:nowrap}
#community-app .handbook-pagination button{min-height:0;padding:8px 13px;border:1px solid #dfb779;border-radius:999px;background:#49351f;color:#ffe6bc;font:700 12px/1.3 'Segoe UI',sans-serif;letter-spacing:normal;text-transform:none;box-shadow:0 2px 4px #0005}
#community-app .handbook-pagination button:hover:not(:disabled){background:#684823;color:#fff3dc;border-color:#dfb779}
#community-app .handbook-pagination button:disabled{background:#49351f;color:#ffe6bc;border-color:#dfb779;opacity:.5;box-shadow:none}
/* handbook-pagination.js docks the page controls directly under the active side tab
   (.book-tabs a[aria-current=page]) instead of floating them above the book. Reset the
   free-floating "order:-1/align-self:flex-end" styling above (meant for .book-chapter's
   own flex flow) and style it as a continuation of that cream active-tab pill instead. */
/* One row: prev arrow, page number, next arrow — button text is shortened to bare
   arrows for this docked spot (handbook-pagination.js), so all three fit side by side
   instead of stacking (their full "Previous (Chapter)" labels stay on the buttons'
   aria-label/title for accessibility). */
#community-app .book-tabs .book-tabs-pagination{order:0;align-self:stretch;flex-direction:row;align-items:center;justify-content:space-between;width:auto;max-width:none;min-height:0;margin:-8px 0 0;padding:6px 8px;border:1px solid #332a2355;border-radius:0 0 5px 5px;background:#e4d7b9;color:#37382e;box-shadow:3px 4px 4px #0006;gap:4px}
#community-app .book-tabs .book-tabs-pagination span{order:0;flex:1;color:#37382e;font:700 11px/1.2 Consolas,monospace;text-align:center;margin:0;white-space:nowrap}
#community-app .book-tabs .book-tabs-pagination button{flex:none;background:transparent;border:1px solid #37382e55;border-radius:3px;color:#37382e;font:700 12px/1 'Segoe UI',sans-serif;letter-spacing:0;text-transform:none;padding:6px 8px;min-height:0;box-shadow:none;white-space:nowrap;line-height:1}
#community-app .book-tabs .book-tabs-pagination button:hover:not(:disabled){background:#37382e18}
#community-app .book-tabs .book-tabs-pagination button:disabled{opacity:.35}

/* Larger sheet window controls, with room inside the existing outer bounds. */
#community-app #profile-views.projected-character-view,
#community-app #profile-views.floating-character-window{border-top-width:38px!important}
#community-app .sheet-window-bar{top:-38px;height:37px;gap:10px}
#community-app .sheet-window-bar .sheet-traffic-control{flex-basis:28px;width:28px;height:28px;min-width:28px}
#community-app .sheet-traffic-control::before,
#community-app .sheet-close-control::after{width:14px;height:3px}
#community-app #profile-views .resize-n,
#community-app #profile-views .resize-ne,
#community-app #profile-views .resize-nw{top:-42px}

/* Navigation stays in front of dragged character windows and travelling labels. */
#community-app #app-sidebar{position:fixed;z-index:10100}
#community-app #profile-views.sheet-window-positioned{transition:none!important;box-sizing:border-box}

/* Reduce window controls by 35%, retaining their centered alignment. */
#community-app .sheet-window-bar .sheet-traffic-control{flex-basis:18.2px;width:18.2px;height:18.2px;min-width:18.2px}
#community-app .sheet-traffic-control::before,
#community-app .sheet-close-control::after{width:9.1px;height:1.95px}

#community-app .sheet-window-title{flex:1;min-width:0;padding:0 8px;color:#182024;font:700 13px/1.3 'Segoe UI',sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none;user-select:none}
#community-app .sheet-window-bar .sheet-submit-application{margin-right:8px;flex-shrink:0}

/* Rounded-square window controls. */
#community-app .sheet-window-bar .sheet-traffic-control{border-radius:5px}

#community-app .sheet-window-bar .sheet-maximize-control{background:#30c85a;color:#0b4820}
#community-app .sheet-maximize-control::before{width:8px;height:8px;border:1.5px solid currentColor;background:transparent;box-sizing:border-box;border-radius:1px;transition:opacity .1s}
/* Restore icon (two overlapping squares) swaps in once the sheet is actually
   maximized, so the button visibly reflects which action it will perform next
   instead of always showing the same "maximize" glyph. */
#community-app .sheet-maximize-control.is-maximized::before{width:6px;height:6px;top:calc(50% - 2px);left:calc(50% - 2px)}
#community-app .sheet-maximize-control.is-maximized::after{content:'';position:absolute;left:calc(50% + 2px);top:calc(50% + 2px);width:6px;height:6px;border:1.5px solid currentColor;background:#30c85a;box-sizing:border-box;border-radius:1px;transform:none}

/* Clicking the scene tucks overlapping sheet edges behind site navigation. */
#community-app #profile-views.sheet-window-backgrounded{clip-path:inset(var(--sheet-menu-clip-top,0px) 0px 0px var(--sheet-menu-clip-left,0px));}
#community-app .app-header{position:sticky;top:0;z-index:10101;flex-shrink:0}

/* Focused sheets float above navigation (including the header) at every viewport
   width; only outside clicks (sheet-window-backgrounded) recede them behind nav. */
#community-app #profile-views:not(.sheet-window-backgrounded){z-index:10200!important}
#community-app #profile-views.sheet-window-backgrounded{z-index:10040!important}
.projected-travel-portrait{z-index:10261!important}
.projected-travel-label{z-index:10262!important}

#community-app .sheet-window-bar.controls-on-left{justify-content:flex-start}

/* The persistent bottom bar shares the navigation focus layer on every screen, but must stay below the sidebar (and its dim backdrop) so an expanded sidebar always layers on top of it. */
#community-app .app-footer{position:relative;z-index:10090}
#community-app #profile-views.sheet-window-backgrounded{clip-path:inset(var(--sheet-menu-clip-top,0px) 0px var(--sheet-menu-clip-bottom,0px) var(--sheet-menu-clip-left,0px))}

/* Inactive sheets are visibly dimmed; minimized files stay above that layer. */
#community-app #profile-views::after{content:'';position:absolute;inset:-38px 0 0;z-index:90;border-radius:4px;background:rgba(5,9,12,.32);opacity:0;pointer-events:none;transition:opacity 180ms ease}
#community-app #profile-views.sheet-window-backgrounded::after{opacity:1}
#community-app .minimized-character-file{z-index:10150}
@media(prefers-reduced-motion:reduce){#community-app #profile-views::after{transition:none}}

/* Minimized sheets form a horizontal dock at the sidebar/footer junction. */
#community-app .minimized-sheet-dock{position:absolute;right:0;z-index:10150;display:flex;align-items:flex-end;gap:6px;overflow-x:auto;pointer-events:none}
#community-app .minimized-sheet-dock .minimized-character-file{position:relative;left:auto!important;bottom:auto;transform:none!important;flex:0 0 auto;max-width:280px;pointer-events:auto}
#community-app .minimized-sheet-dock .minimized-file-drag{display:none}

#community-app .minimized-character-restore::before{content:'';display:inline-block;width:14px;height:16px;margin-right:8px;vertical-align:-3px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 18'%3E%3Ccircle cx='8' cy='4.5' r='3.5'/%3E%3Cpath d='M1 18v-3a7 7 0 0 1 14 0v3z'/%3E%3C/svg%3E") center/contain no-repeat}

#community-app .minimized-sheet-dock .minimized-file-drag{display:block;cursor:grab;touch-action:none}
#community-app .minimized-sheet-dock .dock-dragging{outline:2px solid var(--sheet-accent);outline-offset:-2px;filter:brightness(1.2)}
#community-app .minimized-sheet-dock .dock-dragging .minimized-file-drag{cursor:grabbing}

/* A real overlay avoids older projected-sheet pseudo-element overrides. */
#community-app #profile-views::after{display:none!important}
#community-app #profile-views>.sheet-inactive-shade{position:absolute;inset:0;z-index:85;background:rgba(4,8,12,.42);opacity:0;pointer-events:none;transition:opacity 180ms ease}
#community-app #profile-views.sheet-window-backgrounded>.sheet-inactive-shade{opacity:1}
#community-app .sheet-window-title{display:none}
#community-app .sheet-window-backgrounded .sheet-window-title{display:block;text-align:left}
#community-app .sheet-window-title::before{content:'';display:inline-block;width:14px;height:16px;margin-right:8px;vertical-align:-3px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 18'%3E%3Ccircle cx='8' cy='4.5' r='3.5'/%3E%3Cpath d='M1 18v-3a7 7 0 0 1 14 0v3z'/%3E%3C/svg%3E") center/contain no-repeat}
@media(prefers-reduced-motion:reduce){#community-app #profile-views>.sheet-inactive-shade{transition:none}}

/* Generous external resize targets preserve the title-bar and scrollbar space. */
#community-app #profile-views .resize-n{top:-50px;left:12px;right:12px;height:16px}
#community-app #profile-views .resize-s{bottom:-12px;left:12px;right:12px;height:16px}
#community-app #profile-views .resize-e{right:-12px;top:0;bottom:12px;width:16px}
#community-app #profile-views .resize-w{left:-12px;top:0;bottom:12px;width:16px}
#community-app #profile-views :is(.resize-ne,.resize-nw,.resize-se,.resize-sw){width:24px;height:24px;z-index:66}
#community-app #profile-views :is(.resize-ne,.resize-nw){top:-54px}
#community-app #profile-views :is(.resize-se,.resize-sw){bottom:-16px}
#community-app #profile-views :is(.resize-ne,.resize-se){right:-16px}
#community-app #profile-views :is(.resize-nw,.resize-sw){left:-16px}

/* Halve title-bar vertical breathing room around the 18.2px controls. */
#community-app #profile-views.projected-character-view,
#community-app #profile-views.floating-character-window{border-top-width:28px!important}
#community-app .sheet-window-bar{top:-28px;height:27px}
#community-app #profile-views .resize-n{top:-40px}
#community-app #profile-views :is(.resize-ne,.resize-nw){top:-44px}

/* The directory remains a persistent lower layer while a sheet is open. */
#community-app[data-scene=characters] #app-view.hz-heroroster{visibility:visible!important;opacity:1!important;z-index:1}
#community-app[data-scene=characters] #app-view.hz-heroroster .hero-roster{visibility:visible!important;opacity:1!important}

/* Keep the inactive title from pushing flipped controls back to the right. */
#community-app .sheet-window-bar.controls-on-left .sheet-window-title{order:2;margin-left:8px}

/* Keep an inactive sheet's identity inside the visible area beside navigation. */
#community-app .sheet-window-backgrounded .sheet-window-title{padding-left:calc(8px + var(--inactive-title-inset,0px));box-sizing:border-box}

/* Center the inactive title and silhouette as one row. */
#community-app .sheet-window-backgrounded .sheet-window-title{display:flex;align-items:center;align-self:stretch;line-height:1;margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0}
#community-app .sheet-window-title::before{flex:0 0 14px;vertical-align:initial}

/* A thread's subtitle is a short description, not a tag or status — it reads as plain
   italic text under the title, the same way a subtitle relates to any heading, instead
   of a bordered pill (which made it look like a category/status badge). */
#community-app :is(.thread-card-subtitle,.thread-view-subtitle){display:block;max-width:100%;box-sizing:border-box;padding:0;border:0;background:none;color:#d8d2c3;font-style:italic;line-height:1.4;text-shadow:0 1px 3px #000a}
#community-app .dispatch-thread-card .thread-card-subtitle{color:#e9e3d4}
/* Camera transforms size the raster; responsive media rules must not squeeze it. */
#community-app .world-map-texture{max-width:none!important;max-height:none!important;aspect-ratio:auto;object-fit:fill}

/* Thread metadata uses one compact pill treatment, including event links. */
#community-app .dispatch-thread-card .thread-card-status,
#community-app .thread-tags .event-badge-wrap>button.app-pill{display:inline-flex;align-items:center;justify-content:center;min-height:0;width:auto;margin:0;padding:3px 7px;border:0;border-radius:4px;background:#070d0b66;color:#d9dece;box-shadow:none;font:700 italic 12px/1.3 Consolas,'Courier New',monospace;letter-spacing:.7px;text-transform:none;vertical-align:middle}
#community-app .thread-tags .event-badge-wrap>button.app-pill:hover{background:color-mix(in srgb,var(--thread-accent,#e4a34d) 22%,#101715);color:#fff}
#community-app .dispatch-thread-card .thread-card-counts span{font-size:11px;padding:3px 7px}

#community-app .event-article-window{position:absolute;left:50%;top:8%;transform:translateX(-50%);width:min(960px,85%);height:80%;min-width:340px;min-height:260px;max-width:100%;max-height:92%;display:flex;flex-direction:column;z-index:10220;border:1px solid #c49b58;border-radius:6px;background:#202321;box-shadow:0 18px 60px #0009;resize:both;overflow:hidden}
#community-app .event-window-bar{display:flex;align-items:center;gap:14px;flex:none;padding:5px 10px;background:#bd914e;color:#191d1d;cursor:grab;touch-action:none;font:700 13px/1.3 'Segoe UI',sans-serif}
#community-app .event-window-bar span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#community-app .event-window-bar button{margin:0;padding:0;width:22px;height:22px;min-height:0;border:0;border-radius:5px;background:#ff6058;color:#461915;font:700 20px/22px sans-serif}
#community-app .event-window-scroll{flex:1;min-height:0;overflow:auto;background:#dfd6be}
#community-app .event-article-window .event-newspaper{width:100%;max-width:none;margin:0;box-sizing:border-box;transform:none;min-height:100%;box-shadow:none}

/* Event badge previews reuse the front-page story treatment. */
#community-app .event-article-window{width:min(440px,90%);height:auto;max-height:80%;min-height:0;top:12%;resize:none}
#community-app .event-article-window .event-newspaper{padding:26px 30px;min-height:0}
#community-app .event-window-teaser{display:block;border:0;padding:0;background:transparent;color:#242b26}
#community-app .event-window-teaser h3{font:700 32px/1.08 Georgia,serif;color:#1b2929;text-transform:none;letter-spacing:-.5px;margin:16px 0;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
#community-app .event-window-teaser p{font:16px/1.5 Georgia,serif;color:#283128;margin:16px 0 22px}
#community-app .event-window-teaser>img{width:100%;height:auto;max-height:200px;object-fit:cover}
#community-app .event-window-teaser .news-continue{display:inline-block;color:#283128;font:700 11px/1.4 Consolas,monospace;letter-spacing:1px}

/* A loose newspaper clipping, with controls printed into the same paper. */
#community-app .event-article-window{border:0;border-radius:1px;background:repeating-linear-gradient(0deg,#55482e05 0px,#55482e05 1px,transparent 1px,transparent 3px),linear-gradient(105deg,#d6cbb0,#ede5cf 43%,#dfd5bc);box-shadow:2px 4px 5px #0005,7px 16px 30px #0007;overflow:visible;isolation:isolate}
#community-app .event-article-window::before{content:'';position:absolute;inset:-2px -2px -4px;z-index:-1;background:#dfd5bc;clip-path:polygon(0 1%,8% 0,18% .5%,31% 0,45% .4%,59% 0,74% .6%,89% 0,100% .5%,99.6% 23%,100% 48%,99.5% 72%,100% 99%,88% 100%,73% 99.4%,59% 100%,43% 99.5%,27% 100%,12% 99.5%,0 100%,.4% 77%,0 55%,.5% 29%)}
#community-app .event-article-window .event-window-bar{background:transparent;color:#625b49;padding:9px 15px 5px 24px;min-height:24px;border:0;box-shadow:none;font:700 10px/1.3 Consolas,monospace;letter-spacing:1.5px;text-transform:uppercase}
#community-app .event-article-window .event-window-bar>span{opacity:.65}
#community-app .event-article-window .event-window-bar button{background:transparent;color:#5b5547;border:1px solid transparent;border-radius:2px;font:400 23px/22px Georgia,serif;box-shadow:none}
#community-app .event-article-window .event-window-bar button:hover{background:#51442b14;border-color:#66583b44;color:#231e16}
#community-app .event-article-window .event-window-bar button:focus-visible{outline:2px solid #625239;outline-offset:2px}
#community-app .event-article-window .event-window-scroll{background:transparent;border-radius:0;scrollbar-color:#a89b7d transparent}
#community-app .event-article-window .event-newspaper{background:transparent;border:0;border-radius:0;box-shadow:none;padding:9px 30px 30px}
#community-app .event-article-window .event-newspaper::before,#community-app .event-article-window .event-newspaper::after{display:none}

#community-app .event-window-teaser .news-continue:is(:hover,:focus-visible){color:#111b18;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}

#community-app .thread-status-control{display:grid;gap:6px;padding:8px;font:700 12px 'Segoe UI',sans-serif;color:#ecd4ac;border-bottom:1px solid #a8864d55}
#community-app .thread-status-control select{width:100%;padding:7px;background:#1a211f;color:#ffe4b8;border:1px solid #a8864d;border-radius:4px}

/* Calmer CRT map treatment: clearer geography, restrained screen texture. */
#community-app[data-scene=world] .world-backdrop{background:#10232b}
#community-app .world-map-texture{opacity:1;image-rendering:auto}
#community-app .world-backdrop::after{pointer-events:none;background:radial-gradient(ellipse at 48% 42%,transparent 48%,#030b1240 100%),repeating-linear-gradient(0deg,transparent 0 4px,#020a0e08 4px 5px);box-shadow:inset 0 0 28px #02080c66}
#community-app .world-local-map{background-color:#10232b;background-position:center;background-size:cover;filter:saturate(.82) contrast(1.06);transition:opacity 950ms cubic-bezier(.22,.61,.36,1)}
#community-app .world-location-pin{width:10px;height:10px;margin:-5px;border:2px solid #ffe0a3;background:#d69c4c;box-shadow:0 0 0 5px #d69c4c20,0 0 12px #eab86850}
@media(prefers-reduced-motion:reduce){#community-app .world-local-map{transition:none}}

#community-app .thread-card-location{display:inline-flex;align-items:center;padding:3px 7px;border-radius:4px;background:#101819b8;color:#e7e3d9;font:600 11px/1.4 Consolas,monospace}

/* Finished threads carry an ink stamp rather than a status pill. */
#community-app .dispatch-thread-card{position:relative}
#community-app .thread-status-stamp{position:absolute;left:42%;top:48%;transform:translate(-50%,-50%) rotate(-9deg);z-index:3;pointer-events:none;white-space:nowrap;padding:5px 13px;border:3px double currentColor;border-radius:3px;font:900 clamp(17px,1.4vw,25px)/1.1 Consolas,monospace;letter-spacing:2px;opacity:.86;text-shadow:0 1px 0 #ffffff20}
#community-app .thread-status-stamp.stamp-complete{color:#244a34;background:#e2eadbc9}
#community-app .thread-status-stamp.stamp-incomplete{color:#861f28;background:#e6d8c9d9}

/* Oversized rubber-stamp ink: transparent paper, uneven coverage, double rim. */
#community-app .thread-status-stamp{left:46%;top:48%;max-width:86%;box-sizing:border-box;padding:9px 19px;border:5px solid currentColor;border-radius:7px;outline:2px solid currentColor;outline-offset:-10px;font:900 clamp(27px,2.3vw,43px)/1.15 'Bebas Neue','Arial Narrow',Impact,sans-serif;letter-spacing:4px;opacity:.88;text-shadow:1px 0 currentColor;transform:translate(-50%,-50%) rotate(-11deg);box-shadow:none;mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='90'%3E%3Cfilter id='ink'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' seed='8'/%3E%3CfeColorMatrix type='luminanceToAlpha'/%3E%3CfeComponentTransfer%3E%3CfeFuncA type='discrete' tableValues='0 .65 1 1 1'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23ink)'/%3E%3C/svg%3E");mask-size:200px 90px;mask-repeat:repeat}
#community-app .thread-status-stamp.stamp-complete{background:transparent;color:#245437}
#community-app .thread-status-stamp.stamp-incomplete{background:transparent;color:#ae3940;text-shadow:1px 0 currentColor,0 0 1px #f7c8b9}

/* Apply the halo outside the distressed mask so it remains visible. */
#community-app .thread-card-footer:has(.thread-status-stamp){filter:none}
#community-app .thread-status-stamp{filter:drop-shadow(1px 0 0 #fff) drop-shadow(-1px 0 0 #fff) drop-shadow(0 1px 0 #fff) drop-shadow(0 -1px 0 #fff) drop-shadow(0 0 4px #ffffffb3);mask-image:none}

/* Location navigation tiles: exposed banners and a solid terminal label strip. */
#community-app .location-grid.app-surface.app-panel{background:transparent;background-image:none;border:0;border-bottom:1px solid #ad905e55;box-shadow:none;backdrop-filter:none;padding:0 0 20px;margin:18px 26px 24px;width:calc(100% - 52px);gap:14px;align-items:start}
#community-app .location-grid .location-row{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:112px;padding:64px 0 0;overflow:hidden;border:1px solid #8d78534d;border-radius:4px;background:#172422;box-shadow:0 3px 9px #0003;transform:none}
#community-app .location-grid .location-banner{position:absolute;inset:0 0 auto;width:100%;height:72px;object-fit:cover;object-position:center;opacity:.9;mask-image:none;-webkit-mask-image:none;filter:saturate(.8);transition:filter .2s,opacity .2s}
#community-app .location-grid .location-row::after{display:none}
#community-app .location-grid .location-copy{position:relative;width:100%;max-width:none;box-sizing:border-box;padding:11px 13px;background:#151d1d;border-top:1px solid #ad905e55;z-index:1}
#community-app .location-grid .location-copy strong{flex:1;min-width:0;font:750 16px/1.25 'Segoe UI',sans-serif;font-style:normal;letter-spacing:.5px;text-transform:uppercase;color:#f1e7d3;text-shadow:none;overflow-wrap:normal;word-break:normal}
#community-app .location-grid .location-copy em{display:block;margin:5px 0 0;color:#bab9aa;font:italic 12px/1.4 Georgia,serif}
#community-app .location-grid .location-row:hover .location-banner{filter:saturate(1);opacity:1}
#community-app .location-grid .location-row:focus-visible{outline:2px solid #e2af64;outline-offset:3px}

/* Side-mounted thread paging, with the counter retained above the results. */
#community-app .thread-grid-pagination{display:grid;grid-template-columns:36px minmax(0,1fr) 36px;gap:10px;align-items:center;width:calc(100% - 20px);max-width:1272px;margin:0 auto 32px}
#community-app .thread-grid-pagination .forum-thread-cards{width:100%;max-width:1180px;margin:0;min-width:0}
#community-app .thread-grid-pagination .thread-page-arrow{display:grid;place-items:center;width:36px;min-height:62px;margin:0;padding:0;border:1px solid #d8a25c;border-radius:7px;background:#49351f;color:#ffe6bc;font:700 25px/1 sans-serif;box-shadow:0 3px 9px #0005;cursor:pointer}
#community-app .thread-grid-pagination .thread-page-arrow:hover:not(:disabled){background:#684823;border-color:#ffcf87;box-shadow:0 0 12px #e3a64a45}
#community-app .thread-grid-pagination .thread-page-arrow:disabled{opacity:.35;cursor:default}
#community-app .thread-list-heading{justify-content:flex-end}
#community-app .thread-page-number{margin-left:auto;font:700 12px/1.4 Consolas,monospace;color:#ffe0ad;padding:5px 10px;background:#211b16d9;border:1px solid #9b7547;border-radius:5px}
@media(max-width:650px){#community-app .thread-grid-pagination{grid-template-columns:28px minmax(0,1fr) 28px;gap:5px;width:100%}#community-app .thread-grid-pagination .thread-page-arrow{width:28px}}
#community-app .world-directory-map{position:relative;overflow:hidden;background:#10232b;border:1px solid #81998e44;border-radius:5px;min-height:450px;align-self:stretch}
/* No will-change:transform here on purpose: this plane is an SVG scaled up to 4-5x
   when zooming into a location, and will-change promotes it to a layer that Chrome
   rasterizes once at its pre-zoom backing size — the zoom then just bitmap-scales
   that raster, which is what was pixelating. Letting it re-rasterize at each size
   keeps it crisp; the transition is still smooth without the compositor hint. */
/* Was shortened to 620ms with a front-loaded curve (.3,.7,.3,1) to minimize how long
   the scaled image reads as blurry before it re-rasterizes sharp (see the will-change
   note above). That traded too far the other way: a front-loaded curve reaches most of
   its motion in the first third, so the pan/zoom read as an abrupt snap. Slower and
   with a standard deceleration curve (most motion in the middle, not the front) —
   smoother, at the cost of a little more time looking soft mid-transition. */
#community-app .world-directory-map-plane{position:absolute;width:100%;aspect-ratio:2;top:50%;margin-top:-25%;transition:transform 900ms cubic-bezier(.4,0,.2,1)}
#community-app .world-directory-map-plane>img{display:block;width:100%;height:auto;max-width:none}
#community-app .world-directory-marker{position:absolute;width:18px;height:18px;border:2px solid #ffd58c;border-radius:50%;background:#efb35c50;box-shadow:0 0 0 8px #e9b35825,0 0 16px #e9b35880;transform:translate(-50%,-50%) scale(calc(1 / var(--preview-scale,1)));pointer-events:none}
#community-app .world-directory-marker:not([style]){display:none}
#community-app .world-directory-map-label{position:absolute;left:18px;bottom:18px;padding:8px 12px;background:#111a1de8;border-left:3px solid #dbaa64;color:#e9c68e;font:700 12px Consolas,monospace;letter-spacing:1px}
#community-app .world-directory-list{min-width:0}#community-app .world-directory-list h1{font-size:26px;margin:0 0 16px}
#community-app .world-directory-entry:is(:hover,:focus-visible){border-color:#efbc72;box-shadow:0 0 12px #dfaa4933;outline:none}
@media(max-width:850px){}
@media(prefers-reduced-motion:reduce){#community-app .world-directory-map-plane{transition:none}}

/* Keep the terminal header above a narrower directory column, wider map. */
#community-app .terminal-territory-layout{display:grid;grid-template-columns:minmax(210px,.8fr) minmax(0,2.3fr);gap:24px;align-items:start}
#community-app .terminal-territory-layout .terminal-location-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;min-width:0}
#community-app .terminal-territory-layout .territory-title{flex-wrap:wrap}
#community-app .terminal-territory-layout .terminal-territory-map{min-height:380px;height:clamp(380px,58vh,680px);width:100%;box-sizing:border-box}
#community-app .terminal-territory-map .world-directory-map-plane{top:50%;margin-top:0;translate:var(--map-pan-x,0) -50%}
/* Idle "scanning" pan on the global map: a slow side-to-side drift on the .translate
   axis (independent of the .transform JS uses for the location-preview zoom, so the
   two never fight), paused while a territory card is previewed or the map is hovered
   directly — hovering instead drives --map-pan-x to follow the cursor. */
@keyframes territory-map-scan{0%,100%{translate:-2.2% -50%}50%{translate:2.2% -50%}}
/* will-change:translate (not transform) — scoped to the idle/unzoomed state only,
   where map-idle-scan is the class present. This promotes a compositor layer for the
   pan animation's translate property specifically, so the 24s scan and the pointermove
   hover-pan run smoothly on the compositor instead of repainting the whole SVG plane on
   the main thread every frame. It does NOT hint the transform property, so it doesn't
   reintroduce the pre-zoom rasterization/pixelation that will-change:transform caused —
   and the class is removed whenever a location is actually zoomed in (transform scale),
   so this hint is never active at the same time as that scale transition anyway. */
#community-app .terminal-territory-map.map-idle-scan .world-directory-map-plane{animation:territory-map-scan 24s ease-in-out infinite;will-change:translate}
#community-app .terminal-territory-map.map-idle-scan:hover .world-directory-map-plane{animation-play-state:paused;translate:var(--map-pan-x,0) -50%}
@media(prefers-reduced-motion:reduce){#community-app .terminal-territory-map.map-idle-scan .world-directory-map-plane{animation:none}}
@media(max-width:750px){#community-app .terminal-territory-layout{grid-template-columns:minmax(0,1fr);gap:16px}#community-app .terminal-territory-layout .terminal-territory-map{height:340px;min-height:280px}}

#community-app .territory-child-cards{display:grid;gap:9px}
#community-app .territory-child-card{position:relative;overflow:hidden;border:1px solid #9d86504d;border-radius:4px;background:#151e20;min-width:0}
#community-app .territory-child-banner{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.32;mask-image:linear-gradient(90deg,transparent,#000)}
#community-app .territory-child-content{position:relative;padding:10px 12px;background:linear-gradient(90deg,#151e20eb,#151e2070)}
#community-app .territory-child-heading{display:flex;align-items:center;gap:8px;justify-content:space-between}
#community-app .territory-child-heading>a{font:750 14px/1.3 'Segoe UI',sans-serif;color:#f5e9d0;text-decoration:none}
#community-app .territory-child-heading>span{flex:none;font:700 10px/1.4 Consolas,monospace;color:#e6bd7e;background:#101718dd;padding:2px 6px;border-radius:10px}
#community-app .territory-last-post{display:grid;gap:3px;margin-top:8px;font:11px/1.4 'Segoe UI',sans-serif;color:#d3d2c7}
#community-app .territory-last-post small{font:700 9px Consolas,monospace;letter-spacing:1px;color:#c5a875}
#community-app .territory-last-post>a{color:#f1dfbf;font-weight:650;text-decoration:none}
#community-app .territory-last-post span a{color:#dfbd83}
#community-app .territory-child-card a:hover{text-decoration:underline;color:white}
#community-app .territory-child-card:has(a:focus-visible),#community-app .territory-child-card:hover{border-color:#dbac67}

#community-app .territory-child-heading{justify-content:flex-start;flex-wrap:wrap;gap:8px}
#community-app .location-grid .location-copy strong{flex:0 1 auto}
#community-app .territory-child-banner{opacity:.58;mask-image:linear-gradient(90deg,transparent 12%,#000 72%)}
#community-app .territory-child-content{background:linear-gradient(90deg,#151e20f2,#151e2090 65%,#151e2030)}

/* Latest activity is informational and occupies the right side of each location. */
#community-app .territory-child-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-items:center;gap:12px}
#community-app .territory-child-heading{align-content:center;align-items:center}
#community-app .territory-last-post{margin:0;text-align:right;justify-items:end;min-width:0}
#community-app .territory-last-title{font:650 11px/1.35 'Segoe UI',sans-serif;color:#f1dfbf;overflow-wrap:break-word}
#community-app .territory-last-post>span{overflow-wrap:break-word}

#community-app .territory-title .territory-expand{flex:none;display:grid;place-items:center;width:25px;height:25px;min-height:0;margin:0;padding:0;background:#142020c9;border:1px solid #b9915555;border-radius:4px;color:#ebc58a;font:20px/1 sans-serif;cursor:pointer}
#community-app .territory-title .territory-expand:hover{background:#413321;border-color:#e2b46d}
#community-app .territory-child-cards[hidden]{display:none!important}
/* The expand arrow shouldn't wrap onto its own line above/under the title when the
   narrow sidebar-width location column gets tight — keep the arrow pinned to the left
   and the title to its right on one row (the .terminal-territory-layout-scoped rule
   above this one also sets flex-wrap:wrap and outranks a plain ".territory-title"
   override on specificity, so this repeats that same scope to actually win). If the
   title text itself is too long, let IT wrap onto a second line rather than wrapping
   the whole row — the arrow stays put and the text stays left-aligned under itself,
   not full width or centered. */
#community-app .terminal-territory-layout .territory-title,
#community-app .territory-title{flex-wrap:nowrap;align-items:flex-start}
#community-app .territory-container-title{min-width:0;flex:1;text-align:left;overflow-wrap:break-word;white-space:normal}
#community-app .territory-title .territory-expand{margin-top:1px}
#community-app .territory-child-heading{flex-wrap:nowrap}
#community-app .territory-child-heading>a{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Hide the "last post" block once a card is too narrow to show it without wrapping
   and growing the card; a container query tracks the card's own width, not the
   viewport, since these cards can be cramped even on a wide screen (narrow sidebar
   column) or roomy even on a narrow one (single-column layout). */
#community-app .territory-child-cards{container-type:inline-size;container-name:territory-cards}
@container territory-cards (max-width:280px){
 #community-app .territory-last-post{display:none}
 #community-app .territory-child-content{grid-template-columns:minmax(0,1fr)}
}
/* Authoritative version of the rule above: community-app.js measures whether a
   location/sublocation title actually overflows (which can happen above 280px
   for a long name, or not happen below it for a short one) and toggles this
   class per-card, so the title is never ellipsized/compressed — the "last
   post" block is dropped instead of the title ever being cut. */
#community-app .territory-child-card.hide-last-post .territory-last-post{display:none}
#community-app .territory-child-card.hide-last-post .territory-child-content{grid-template-columns:minmax(0,1fr)}

#community-app .territory-last-heading{display:flex;align-items:baseline;justify-content:flex-end;gap:6px;width:100%;min-width:0;white-space:nowrap}
#community-app .territory-last-heading small{flex:none}
#community-app .territory-last-heading .territory-last-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Navigation expands above a permanently collapsed-width content gutter. */
#community-app{--navigation-gutter:64px}
/* app-body is exactly viewport-tall (100vh minus the header), so it never overflows to give a sticky child room to move within it; pin app-body itself so the sidebar (and content pane) hold still while only the footer scrolls into view below. */
#community-app .app-body{position:sticky;top:var(--header-height,64px)}
/* .app-body's own sticky positioning makes IT the stacking context that everything
   inside it (including the character sheet window, z-index:10200) is compared against
   when stacking against the header — not the sheet's own z-index. Since app-body itself
   has no z-index, it sits at the bottom of that comparison (auto) and always loses to
   the header's z-index:10101, trapping the sheet behind the header no matter how high
   the sheet's internal z-index is set. Bump app-body itself above the header, but only
   while a sheet is actually open, so normal scrolling content still sits under the header. */
#community-app.hz-proj .app-body{z-index:10199}
#community-app #app-sidebar{position:fixed;top:var(--header-height,64px);left:0;height:calc(100vh - var(--header-height,64px));overflow-y:auto;box-sizing:border-box;width:204px;z-index:10100}
#community-app.sidebar-collapsed #app-sidebar{width:var(--navigation-gutter)}
#community-app .app-content{margin-left:var(--navigation-gutter)}
#community-app :is(.dispatch-office,.entrance-door-wipe,.menu-ink-wipe,.projector-ignition-shade){left:var(--navigation-gutter)}
#community-app .world-backdrop{left:var(--navigation-gutter)}
#community-app .dispatch-ambience{left:calc(var(--navigation-gutter) + 21px)}
/* The sidebar is position:fixed, so the gutter these all reserve on the left HAS to
   match its real width or the sidebar just covers what's underneath it. The gutter was
   pinned to the collapsed width (64px) even while the sidebar was expanded to its full
   204px, so opening the sidebar silently hid the left 140px of every page - the portrait
   column of every post, the left edge of every card. Track the sidebar's actual width
   instead, and transition it on the same curve the sidebar itself uses so the content
   slides with it rather than snapping. Narrow screens keep the old behavior on purpose:
   there the sidebar is a drawer that's meant to overlay the page. */
@media(min-width:651px){
 #community-app{--navigation-gutter:204px}
 #community-app.sidebar-collapsed{--navigation-gutter:64px}
 #community-app .app-content{transition:margin-left .28s cubic-bezier(.2,.7,.2,1)}
 #community-app :is(.dispatch-office,.entrance-door-wipe,.menu-ink-wipe,.projector-ignition-shade,.world-backdrop,.dispatch-ambience){transition:left .28s cubic-bezier(.2,.7,.2,1)}
}
@media(prefers-reduced-motion:reduce){
 #community-app .app-content,
 #community-app :is(.dispatch-office,.entrance-door-wipe,.menu-ink-wipe,.projector-ignition-shade,.world-backdrop,.dispatch-ambience){transition:none}
}
@media(max-width:650px){#community-app{--navigation-gutter:56px}#community-app.has-sidebar .app-content{margin-left:var(--navigation-gutter)}}

#community-app [data-location-path]{cursor:pointer}
#community-app [data-location-path]:focus-visible{outline:2px solid #e8b76a;outline-offset:3px}

/* Plain treatment matching the rest of the sidebar — no bordered pill, no oversized hit area.
   The direction cue is the arrow icon itself (rotates with collapsed state), not a decorative border. */
#community-app #sidebar-toggle:hover{background:var(--sdn-ffffff08, #ffffff08);color:#b9eaf0}
#community-app #sidebar-toggle:focus-visible{outline:2px solid var(--sdn-75e3eb, var(--color-accent,#75e3eb));outline-offset:2px}
#sidebar-toggle-icon{transition:transform .15s ease}
#community-app.sidebar-collapsed #sidebar-toggle-icon{transform:rotate(180deg)}

#community-app .world-local-map{transition:opacity 450ms ease-out}
@media(prefers-reduced-motion:reduce){#community-app .world-local-map{transition:none}}

/* The city surface joins the final camera movement instead of starting afterward. */
#community-app .world-local-map{opacity:0;transform:scale(1.065);transform-origin:center;filter:saturate(.82) contrast(1.06) blur(2px);transition:opacity 750ms cubic-bezier(.22,.61,.36,1),transform 900ms cubic-bezier(.22,.61,.36,1),filter 750ms ease-out;will-change:opacity,transform}
#community-app[data-scene=world][data-local-map-ready]:not([data-local-map-ready=""]) .world-local-map{opacity:1;transform:scale(1);filter:saturate(.82) contrast(1.06) blur(0)}
@media(prefers-reduced-motion:reduce){#community-app .world-local-map{transition:none;transform:none;filter:none}}

/* Keep results hidden until the camera and pixel handoff have both completed. The
   locations/landmarks panel is included here (it used to be left out, so it popped
   in immediately while the cards it sits beside were still waiting to fade in). */
#community-app[data-map-transition] .dispatch-thread-card,
#community-app[data-map-transition] .thread-list-heading,
#community-app[data-map-transition] .thread-page-arrow,
#community-app[data-map-transition] .location-side-directory {visibility:hidden!important;pointer-events:none!important}

/* Location results sit on the right; opened conversations sit on the left. */
#community-app[data-scene=world] #app-view .thread-grid-pagination:not(.dispatch-navigation):not(.dispatch-recycle) {width:calc(100% - 52px);max-width:1272px;margin-left:auto;margin-right:26px;box-sizing:border-box}
#community-app[data-scene=world] #app-view>.thread-list-heading:not(.dispatch-navigation):not(.dispatch-recycle) {width:calc(100% - 52px);margin-left:auto;margin-right:26px;max-width:1272px;box-sizing:border-box}
#community-app[data-scene=world] #app-view>.thread-reading-area:not(.dispatch-navigation){margin-left:26px;margin-right:auto}

#community-app .world-directory-map-plane>.world-country-glow{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity 350ms ease}
#community-app .preview-us .world-country-glow{opacity:1}

/* Preserve geographic art proportions independently of surrounding image rules. */
#community-app .world-directory-map-plane>img:not(.world-country-glow){width:100%;height:auto;aspect-ratio:2/1;max-height:none;object-fit:contain}
#community-app .world-map-texture{min-width:0;min-height:0;max-width:none!important;max-height:none!important;box-sizing:content-box;padding:0;border:0}

/* Compact location results without clipping card text. */
#community-app .forum-thread-cards{gap:10px}
#community-app .forum-thread-cards .dispatch-thread-card{min-height:130px}
#community-app .forum-thread-cards .thread-card-main{padding:10px 12px}
#community-app .forum-thread-cards .thread-card-title{font-size:22px;line-height:1.15;margin-bottom:5px}
#community-app .forum-thread-cards .thread-card-subtitle{margin-top:5px;padding:2px 7px;line-height:1.25}
#community-app .forum-thread-cards .thread-latest{margin:5px 5px 5px 0}
#community-app .forum-thread-cards .thread-latest-copy{padding:5px 8px}
#community-app .forum-thread-cards .thread-card-people{padding:5px;gap:3px}
#community-app .forum-thread-cards .thread-card-footer{padding:4px 9px;gap:5px}

#community-app .thread-grid-pagination>.thread-list-heading{grid-column:2;grid-row:2;width:auto;max-width:none;margin:0;padding:0;min-height:0;justify-content:flex-start}
#community-app .thread-grid-pagination>.thread-page-next{grid-column:3;grid-row:1}
#community-app .thread-grid-pagination>.thread-page-previous{grid-column:1;grid-row:1}
#community-app .thread-grid-pagination>.forum-thread-cards{grid-column:2;grid-row:1}
#community-app .territory-container-title{font-size:18px;color:#f4ead5}
#community-app .territory-card:not([data-location-path]){cursor:default}

#community-app .world-directory-marker{width:8px;height:8px;border:0;background:#ffd184;box-shadow:0 0 5px #efb35c66;animation:directory-dot-pulse 2s ease-in-out infinite}
@keyframes directory-dot-pulse{0%,100%{opacity:1;box-shadow:0 0 3px #efb35c55}50%{opacity:.65;box-shadow:0 0 8px #efb35c99}}
#community-app .preview-us .world-country-glow{opacity:.4}
@media(prefers-reduced-motion:reduce){#community-app .world-directory-marker{animation:none}}

#community-app .forum-thread-cards .thread-latest{min-height:135px}
#community-app .thread-grid-pagination{grid-template-columns:minmax(0,1fr);gap:8px}
#community-app .thread-grid-pagination>.forum-thread-cards{grid-column:1;grid-row:1}
#community-app .thread-grid-pagination>.thread-list-heading{grid-column:1;grid-row:2;display:flex;align-items:center;justify-content:flex-start;gap:8px}
#community-app .thread-grid-pagination .thread-list-heading .thread-page-arrow{width:32px;min-height:30px;height:30px;font-size:19px}

/* Narrower cards, wider column gutter, anchored at the right content edge. */
#community-app[data-scene=world] #app-view .thread-grid-pagination:not(.dispatch-navigation):not(.dispatch-recycle){width:calc(100% - 38px);max-width:1082px;margin-left:auto;margin-right:12px}
#community-app .thread-grid-pagination>.forum-thread-cards{max-width:none;column-gap:20px;row-gap:10px}
@media(max-width:650px){#community-app[data-scene=world] #app-view .thread-grid-pagination:not(.dispatch-navigation):not(.dispatch-recycle){width:calc(100% - 24px);margin-right:12px}}

/* The conversation scrolls on its own; the title header above it is its own grid row
   so it never moves as part of that scroll. (The context rail that used to share this
   grid cell behind the reading area has been removed entirely.) */
#community-app[data-scene=world] #app-workspace:has(.thread-reading-area){overflow:hidden;min-height:0}
#community-app[data-scene=world] #app-view.hz-thread{height:100%;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);overflow:hidden}
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation{grid-column:1;grid-row:1}
/* Reserve real breathing room on the right instead of running the reading column to
   the workspace edge - on a wide window "calc(100% - 52px)" left almost no margin at
   all (52px split across BOTH sides), so posting view read as edge-to-edge. This caps
   the column at a comfortable reading width and guarantees a real right-hand gutter
   (260px) no matter how wide the window gets. */
#community-app[data-scene=world] #app-view.hz-thread>.thread-view-heading{grid-column:1;grid-row:2;margin:0 0 12px 26px;min-width:0;position:relative;z-index:2;max-width:min(calc(100% - 26px - var(--thread-right-reserve)),2100px)}
#community-app[data-scene=world] #app-view.hz-thread>.thread-reading-area:not(.dispatch-navigation){grid-column:1;grid-row:3;width:auto;max-width:min(calc(100% - 26px - var(--thread-right-reserve)),2100px);min-height:0;margin:0 0 12px 26px;padding-right:12px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable both;box-sizing:border-box;scrollbar-width:thin;scrollbar-color:transparent transparent;position:relative;z-index:2}
/* The scrollbar track always reserves its space (scrollbar-gutter) and the scrollbar
   itself always renders at a fixed width — only its COLOR fades in/out on hover, so a
   container never resizes or reflows when a scrollbar appears. */
#community-app[data-scene=world] #app-view.hz-thread>.thread-reading-area:not(.dispatch-navigation).scrollbar-active{scrollbar-color:var(--thread-frame-accent,#b58549) #141b1e}

.location-map-editor{border:1px solid #a77b43;border-radius:8px;padding:14px;margin:12px 0}.location-placement-map{position:relative;width:100%;overflow:hidden;background:#10232b;cursor:crosshair}.location-placement-map>img{display:block;width:100%;height:auto;max-height:none;transition:transform 1s ease;pointer-events:none}.location-placement-dot{position:absolute;width:8px;height:8px;background:#ffd184;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}.location-zoom-frame{position:absolute;border:1px dashed #ffd184;transform:translate(-50%,-50%);pointer-events:none;box-sizing:border-box}.location-map-editor button{margin:8px 8px 12px 0}.location-map-editor output{margin-left:8px}
#community-app .world-directory-marker{opacity:0;transition:opacity 350ms ease;animation:none}
#community-app .world-directory-marker.is-visible{opacity:1;animation:directory-dot-soft-pulse 2.4s ease-in-out infinite}
@keyframes directory-dot-soft-pulse{0%,100%{box-shadow:0 0 2px #efb35c44}50%{box-shadow:0 0 8px #efb35c99}}
@media(prefers-reduced-motion:reduce){#community-app .world-directory-marker.is-visible{animation:none;transition:none}.location-placement-map>img{transition:none}}

/* Compact local directory leaves the conversation grid at the right. */
#community-app[data-scene=world] #app-view.hz-locside{position:relative}
#community-app[data-scene=world] #app-view .location-side-directory:not(.dispatch-navigation):not(.dispatch-recycle){position:absolute;top:86px;left:26px;width:260px;max-height:calc(100dvh - 230px);overflow:auto;margin:0;scrollbar-width:thin}
.location-side-directory summary{font:700 12px/1.4 Consolas,monospace;text-transform:uppercase;color:#e8bb78;cursor:pointer;padding:0 0 10px;letter-spacing:1px}
.location-side-items{display:grid;gap:10px}.location-side-card{position:relative;display:flex;align-items:flex-end;min-height:100px;border:1px solid #71978e88;border-radius:6px;overflow:hidden;text-decoration:none;background:#102d33;color:#fff}.location-side-card.landmark-card{min-height:78px}
.location-side-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.8;transition:opacity 180ms}.location-side-card>span{position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;padding:10px;background:linear-gradient(transparent,#0a1219ed);font-size:13px}.location-side-card small{font:10px Consolas,monospace;white-space:nowrap;color:#bdd2ca}.location-side-card:hover{border-color:#ffd184}.location-side-card:hover img{opacity:1}
#community-app[data-scene=world] #app-view.hz-locside .thread-grid-pagination:not(.dispatch-navigation):not(.dispatch-recycle){width:calc(100% - 320px)}
.world-landmark-pin{position:absolute;z-index:4;pointer-events:none;width:8px;height:8px;border-radius:50%;background:#ffd184;transform:translate(-50%,-50%);opacity:0;transition:opacity 350ms}.world-landmark-pin.is-visible{opacity:1;animation:directory-dot-soft-pulse 2.4s ease-in-out infinite}
/* Pixel-block dissolve grid used by world-backdrop.js when switching between two
   local district maps (or revealing one at the end of a zoom): a 16x9 grid of tiles
   that either shows solid color (during a zoom-concurrent reveal, where it stands
   in for the moving canvas underneath) or a background-image slice of the outgoing
   snapshot (world-backdrop.js sets these inline per-cell), then wipes away tile by
   tile in a shuffled order. display is toggled directly by the JS, not by a data
   attribute, since it needs to run independent of data-map-transition's own states.*/
.world-pixel-reveal{position:absolute;inset:0;z-index:5;display:none;grid-template-columns:repeat(16,1fr);grid-template-rows:repeat(9,1fr);pointer-events:none}
.world-pixel-reveal-cell{background-color:#10232b;background-repeat:no-repeat}
@media(prefers-reduced-motion:reduce){.world-pixel-reveal{display:none!important}}
@media(max-width:900px){#community-app[data-scene=world] #app-view .location-side-directory:not(.dispatch-navigation):not(.dispatch-recycle){position:relative;top:auto;left:auto;width:auto;max-height:220px;margin:0 12px 12px}#community-app[data-scene=world] #app-view.hz-locside .thread-grid-pagination:not(.dispatch-navigation):not(.dispatch-recycle){width:calc(100% - 24px)}.location-side-items{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.world-landmark-pin.is-visible{animation:none}}

/* Local navigation: a readable black panel, inset from the map frame. top/left are
   set inline by positionLocationSideDirectory() to actually match the thread cards'
   edges (104px/38px here are just the pre-JS fallback). */
#community-app[data-scene=world] #app-view .location-side-directory:not(.dispatch-navigation):not(.dispatch-recycle){top:104px;left:38px;width:264px;padding:14px;box-sizing:border-box;border:1px solid #ffffff18;border-radius:10px;background:#080a0bef;box-shadow:0 8px 24px #0005;max-height:calc(100dvh - 270px)}
#community-app .location-side-directory summary{padding:2px 0 13px;color:#f2dec0;font:700 12px/1.5 Consolas,monospace;letter-spacing:.65px;text-shadow:none;border-bottom:1px solid #b78c4c55;margin-bottom:12px}
#community-app .location-side-card{background:#070808;border-color:#766c584d;min-height:100px;border-radius:7px}
#community-app .location-side-card.landmark-card{min-height:82px}
#community-app .location-side-card>img{left:auto;right:0;width:85%;opacity:.65;object-position:center;mask-image:linear-gradient(to right,transparent,#000 48%);-webkit-mask-image:linear-gradient(to right,transparent,#000 48%)}
#community-app .location-side-card>span{box-sizing:border-box;min-height:82px;align-items:center;flex-wrap:wrap;align-content:center;gap:6px;padding:12px;background:linear-gradient(90deg,#070808d9,transparent);text-shadow:0 1px 3px #000}
#community-app .location-side-card strong{font:700 13px/1.4 'Segoe UI',sans-serif;color:#f5f0e7;max-width:100%;overflow-wrap:normal;word-break:normal}
#community-app .location-side-card small{color:#d9cbb4;font-size:10px}
#community-app .location-side-card:hover{background:#10100e;border-color:#cba76b}
@media(max-width:900px){#community-app[data-scene=world] #app-view .location-side-directory:not(.dispatch-navigation):not(.dispatch-recycle){position:relative;top:auto;left:auto;width:auto;margin:0 12px 16px;max-height:250px}}

/* Very narrow: the locations directory no longer has room to sit above the thread cards
   without pushing them far down, so it collapses into a small auto-rotating carousel
   overlaid on top of the cards instead — one location card showing at a time, cycling on
   its own and pausing while hovered/focused (JS: updateLocationCarousel()). */
@media(max-width:560px){
 #community-app[data-scene=world] #app-view.hz-locside .location-content-panel{position:relative}
 #community-app[data-scene=world] #app-view .location-side-directory.location-carousel:not(.dispatch-navigation):not(.dispatch-recycle){
  position:absolute;top:0;left:0;right:0;width:auto;margin:0;max-height:none;overflow:visible;z-index:6;
  padding:10px;box-sizing:border-box;border-radius:0 0 10px 10px;box-shadow:0 10px 24px #0007;
 }
 #community-app .location-carousel summary{display:none}
 #community-app .location-carousel .location-side-items{display:block;position:relative;min-height:82px}
 #community-app .location-carousel .location-side-card{display:none}
}
@media(prefers-reduced-motion:reduce){#community-app .location-carousel .location-side-card{transition:none}}

/* Movable location directory and independent conversation/sidebar scrolling. */
.location-side-directory summary{list-style:none}
.location-side-directory summary::-webkit-details-marker{display:none}
#community-app[data-scene=world] #app-view.hz-thread{position:absolute;inset:0;height:auto;padding-bottom:0;box-sizing:border-box}
/* Scrollbar width/gutter is set once, unconditionally, further up (with the rest of
   .thread-reading-area's grid placement) — always reserved, never toggled, so no
   layout shift; only its color fades with .scrollbar-active (JS toggles that class on
   pointerenter/leave, with a short delay on the way out). */
/* The scrollbar track's width is always reserved (12px, every state) so hovering
   never shifts the content beside it — only the thumb/track color fades in and out. */
.thread-reading-area::-webkit-scrollbar{width:12px}
.thread-reading-area::-webkit-scrollbar-thumb{background:transparent;border:3px solid transparent;border-radius:8px;background-clip:padding-box;transition:background 200ms ease}
.thread-reading-area::-webkit-scrollbar-track{background:transparent;transition:background 200ms ease}
.thread-reading-area.scrollbar-active::-webkit-scrollbar-thumb{background:var(--thread-frame-accent,#b58549);border:3px solid #141b1e;background-clip:padding-box}
.thread-reading-area.scrollbar-active::-webkit-scrollbar-track{background:#141b1e}
/* Was left on the site's default button look (a maroon fill, unrelated to the
   thread) - matches the Watch/Manage Thread pills beside it now. */
#community-app .thread-go-back{
 white-space:nowrap;padding:8px 16px;border-radius:999px;font-size:12.5px;font-weight:700;
 border:1px solid color-mix(in srgb,var(--thread-frame-accent,#b58549) 45%,#ffffff20);
 background:color-mix(in srgb,var(--thread-frame-accent,#b58549) 10%,#171b1d);
 color:#f0ece2;
}
#community-app .thread-go-back:hover{background:color-mix(in srgb,var(--thread-frame-accent,#b58549) 22%,#171b1d);}

/* Sticky top/bottom scroll hints on the reading area. This used to be a full-width
   gradient band in a fixed navy hex (#0c1012ee) - opaque enough, and different enough
   from whatever post color sat underneath it (the per-thread accent tint, a post's own
   --character-color), that it read as a flat mismatched stripe rather than a fade.
   A small floating pill instead: color-mix keeps it a genuine translucency over
   whatever's beneath (not a fixed color trying to approximate one), backdrop-filter
   blurs that content further so the chevron stays legible without needing more
   opacity, and being narrow instead of edge-to-edge keeps it reading as a control
   rather than a bar cutting across the post. */
.thread-scroll-hint{position:sticky;left:0;right:0;height:0;z-index:6;opacity:0;pointer-events:none;transition:opacity 220ms ease}
.thread-scroll-hint.is-visible{opacity:1}
.thread-scroll-hint-top{top:0}
.thread-scroll-hint-bottom{bottom:0}
.thread-scroll-hint>button{
 position:absolute;left:50%;translate:-50% 0;display:flex;align-items:center;justify-content:center;
 width:42px;height:26px;border-radius:999px;
 border:1px solid #ffffff22;
 background:color-mix(in srgb,#0c1012 50%,transparent);
 backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
 color:#ffe6bcd9;font-size:12px;line-height:1;padding:0;cursor:pointer;pointer-events:auto;
 box-shadow:0 3px 10px #00000055;
 transition:background 160ms ease,color 160ms ease,border-color 160ms ease;
}
.thread-scroll-hint-top>button{top:8px}
.thread-scroll-hint-bottom>button{bottom:8px}
.thread-scroll-hint>button:hover,.thread-scroll-hint>button:focus-visible{background:color-mix(in srgb,#0c1012 72%,transparent);border-color:#ffffff40;color:#fff}
@supports not (backdrop-filter:blur(1px)){.thread-scroll-hint>button{background:#0c1012b3}}


/* Keep pagination a single compact control group, including its left arrow. */
#community-app .thread-grid-pagination .thread-page-number{margin:0;flex:0 0 auto}
#community-app .thread-grid-pagination>.thread-list-heading{width:max-content;justify-content:flex-start;gap:8px}
#community-app .dispatch-thread-card.location-empty-threads{grid-column:1/-1;justify-self:end;width:calc((100% - 20px)/2);box-sizing:border-box;grid-template-columns:minmax(0,1fr);padding:0}
#community-app .location-empty-threads p{margin:8px 0;color:#d4cabb;font-size:13px;line-height:1.5}
#community-app .location-empty-threads button{border:1px solid #b5854966;background:#211b1699;color:#ffe6bc;border-radius:5px;padding:5px 10px;font-size:12px}
@media(max-width:1050px){#community-app .dispatch-thread-card.location-empty-threads{width:100%}}
#community-app .thread-results-empty .forum-thread-cards{display:grid;grid-template-columns:1fr;min-height:0}

/* Anchor thread scrolling inside the monitor's inner edge, not the outer workspace. */
#community-app[data-scene=world] #app-workspace:has(.thread-reading-area){position:relative}

/* At the local/district level (the isometric city backdrop), suppress the pulsing
   yellow directory/landmark pin dots entirely — they're wayfinding aids for the
   zoomed-out globe/region levels and just read as random floating dots once you're
   already this close in. */
#community-app[data-scene=world][data-local-map-ready]:not([data-local-map-ready=""]) .world-directory-marker,
#community-app[data-scene=world][data-local-map-ready]:not([data-local-map-ready=""]) .world-landmark-pin{display:none}

/* A slow, constant horizontal pan across the local backdrop instead of sitting
   static: the image tiles (background-repeat) and the pan travels exactly one tile
   WIDTH per loop, so it resets invisibly instead of jumping. Kept to a single axis on
   purpose — guessing a vertical tile height here too (background-size's height is
   "auto", i.e. whatever the art's natural aspect ratio computes to) would very likely
   not match the real rendered tile height, and panning the wrong distance on that
   axis is exactly what made this look fast/jumpy rather than slow and seamless. Swap
   the background-size width below to match the source art's natural tile width if it
   isn't currently seamless. */
#community-app[data-scene=world][data-local-map-ready]:not([data-local-map-ready=""]) .world-local-map{
 background-repeat:repeat-x;background-size:2400px auto;
 animation:local-map-pan 220s linear infinite;
}
@keyframes local-map-pan{from{background-position:0 0}to{background-position:-2400px 0}}
@media(prefers-reduced-motion:reduce){
 #community-app[data-scene=world][data-local-map-ready]:not([data-local-map-ready=""]) .world-local-map{animation:none}
}
/* This pan animates background-position, which is not a composited property - every
   frame repaints the full ~1450x675 backdrop, and it runs forever. That's fine as the
   ambient motion behind the world map itself, but the thread reading column covers
   almost all of it, so while a thread is open we were paying a continuous full-area
   repaint for motion nobody can see. (It's a 220s loop - about 11px/sec - so pausing it
   is imperceptible even where it IS visible.) */
#community-app #app-view.hz-thread ~ * .world-local-map,
#community-app.hz-thread .world-local-map{animation-play-state:paused}
/* The route-loading overlay keeps its dot animation running forever behind
   aria-hidden, long after loading finished. Stop the clock while it's inert. */
.route-loading-overlay[aria-hidden="true"] *{animation:none!important}

/* Post identities: white names, character-colored aliases across site themes. */
html[data-theme] #community-app .forum-post .post-author .post-identity h3,
html[data-theme] #community-app .forum-post .post-author .post-identity h3 a{color:#fff}
html[data-theme] #community-app .forum-post .post-author .post-codename{color:var(--character-color)}

.rich-page-break { break-after:column;column-break-after:always;height:0;line-height:0;margin:0;padding:0; }
[contenteditable=true] .rich-page-break { height:12px;border-top:1px dashed currentColor;opacity:.55; }

/* Forum topic browse controls: per-forum and global search sort/date/query form. */
#community-app .forum-browse-controls{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px;margin:16px 0;padding:16px 20px;}
#community-app .forum-browse-controls label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--sdn-a4c7ce,#a4c7ce);min-width:120px;}
#community-app .forum-browse-controls label:has(input[type=search]){flex:1 1 220px;min-width:180px;}
#community-app .forum-browse-controls input,#community-app .forum-browse-controls select{padding:7px 9px;border-radius:6px;border:1px solid var(--sdn-85415840,#85415840);background:var(--sdn-14151b,#14151b);color:inherit;font-size:13px;}
#community-app .forum-browse-controls .app-actions{margin:0;display:flex;gap:8px;align-items:center;}

/* Unread thread markers and watch-thread control. */
#community-app .dispatch-thread-card.thread-unread{border-color:color-mix(in srgb,var(--color-accent,#75e3eb) 55%,#202322);box-shadow:0 5px 15px #0003,0 0 0 1px #75e3eb33;}
#community-app .thread-unread-badge{display:inline-block;margin-left:8px;padding:2px 7px;border-radius:4px;background:var(--color-accent,#75e3eb);color:#0d2426;font:700 10px/1.4 Consolas,monospace;letter-spacing:.04em;vertical-align:middle;}
/* Same pill language as the Manage Thread trigger and Go Back button next to it
   (see .thread-manage summary / .thread-go-back) - these three used to be three
   different button styles (a plain outline, an amber pill, and the site's default
   maroon button) sitting in the same row. */
#community-app #toggle-watch-thread{
 padding:8px 16px;border-radius:999px;font-size:12.5px;font-weight:700;cursor:pointer;
 border:1px solid color-mix(in srgb,var(--thread-frame-accent,#b58549) 45%,#ffffff20);
 background:color-mix(in srgb,var(--thread-frame-accent,#b58549) 10%,#171b1d);
 color:#f0ece2;transition:background 160ms ease,color 160ms ease;
}
#community-app #toggle-watch-thread:hover{background:color-mix(in srgb,var(--thread-frame-accent,#b58549) 22%,#171b1d);}
#community-app #toggle-watch-thread[aria-pressed=true]{background:var(--thread-frame-accent,#b58549);border-color:var(--thread-frame-accent,#b58549);color:#171b1d;}
#community-app .watching-list .app-heading button{padding:7px 14px;border-radius:6px;border:1px solid #ffffff30;background:transparent;color:inherit;font-size:12px;cursor:pointer;}

/* Post edit history disclosure. */
#community-app .post-edit-history{margin-top:8px;font-size:11px;color:#c9cdc4;}
#community-app .post-edit-history summary{cursor:pointer;color:#a4c7ce;}
#community-app .post-edit-version{margin:10px 0 0;padding:10px 12px;border-left:2px solid #ffffff20;background:#ffffff08;border-radius:4px;}
#community-app .post-edit-version time{display:block;margin-bottom:6px;font:11px Consolas,monospace;color:#9fa4ad;}
#community-app .post-edit-version .forum-rich.post-edit-old{opacity:.8;font-size:13px;}
/* Per-page office-scene backdrop photo removed on request — the desk/office image behind
   every page (driven by --section-scene / #community-app::after, set per [data-scene]
   throughout this file). World's own map background and its zoom/pan transitions are a
   separate system (::before and .world-backdrop) and are untouched by this. */
html body #community-app[data-presentation=dispatch]::after{display:none!important}
/* Same request, second layer: the "projected onto a monitor in a 3D room" backdrop
   around the Characters/Application projection view (.projection-room-foreground,
   a fixed office-projector-room photo) is a separate per-page scene image from the one
   above. Remove it too, leaving the projection's own clip-path/positioning logic (set in
   JS, unaffected by this) and World's map system untouched. */
html body #community-app[data-presentation=dispatch] .projection-room-foreground{display:none!important}
/* Footer container removed on request — it wasn't carrying any real functionality
   (OS Ver/System State/Discord status strings), just extra scroll below the sticky
   .app-body (see the --navigation-gutter block above for how that sticky pin works). */
#community-app .app-footer{display:none!important}

/* ============================================================================
   HEADER REWORK + SHARED PAGE FRAME
   ----------------------------------------------------------------------------
   The header used to be: brand, Back, Forward, a 46px <h1> page title, a nav that
   is hidden whenever the sidebar exists, a wide "Bookmark" button, My Profile.
   That h1 alone was 53px tall and only ever repeated what the breadcrumb already
   said, which is what made the whole bar 104px tall and feel unbalanced.

   Now: brand | breadcrumb flow (the current page is the highlighted last crumb,
   with the bookmark control beside it) | My Profile. Everything on one row,
   vertically centred. Back/Forward move out entirely - they live in the page
   frame's own bar, the way the World page carries its controls.
   ============================================================================ */
#community-app .app-header{
 align-items:center;
 gap:18px;
 padding:0 22px;
 min-height:58px;
}
/* Kept in the DOM, not on screen: it's the focus target on every route change and
   the accessible name for the page, so it stays available to screen readers while
   the breadcrumb does the visible work. */
#community-app #app-page-title{
 position:absolute;width:1px;height:1px;margin:-1px;padding:0;
 overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;
}
#community-app .app-brand{flex:0 0 auto;line-height:1.05}
#community-app .app-brand span{font-size:19px;letter-spacing:3px}
#community-app .app-brand small{font-size:8px;letter-spacing:2px;margin-top:3px}

/* The breadcrumb the header trail already computed but never showed (it was
   display:none with no styling of its own). This is the "Home > The World > X"
   flow, mirroring the trail inside the World page. */
/* Specificity here has to beat "#community-app.has-sidebar .app-header nav{display:none}",
   which hides the main nav whenever the sidebar exists - the trail is a <nav> inside the
   header too, so that rule was swallowing it. */
#community-app .app-header nav.header-forum-trail,
#community-app.has-sidebar .app-header nav.header-forum-trail{display:flex;align-items:center;min-width:0;flex:1}
#community-app .header-forum-trail ol{
 display:flex;align-items:center;flex-wrap:nowrap;gap:0;
 margin:0;padding:0;list-style:none;min-width:0;overflow:hidden;
}
#community-app .header-forum-trail li{display:flex;align-items:center;min-width:0}
#community-app .header-forum-trail li+li::before{
 content:'›';margin:0 9px;color:#ffffff40;font-size:13px;line-height:1;flex:none;
}
#community-app .header-forum-trail a{
 font:600 12px/1.2 'Segoe UI',sans-serif;letter-spacing:.3px;color:#9fb0b6;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
 padding:3px 2px;border-radius:4px;transition:color 140ms ease;
}
#community-app .header-forum-trail a:is(:hover,:focus-visible){color:#ffe0a4}
/* The current page - this is the header's title now, so it reads as one. */
#community-app .header-forum-trail [aria-current=page]{
 font:800 15px/1.2 'Segoe UI',sans-serif;letter-spacing:.4px;color:#f5efe3;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;
}
@media(max-width:900px){
 #community-app .header-forum-trail li:not(:last-child){display:none}
 #community-app .header-forum-trail li+li::before{display:none}
}

/* Bookmark rides directly beside the current crumb instead of being a wide labelled
   button floating near the account link. */
#community-app .page-bookmark{
 flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;
 padding:5px 9px;font:700 11px/1 'Segoe UI',sans-serif;
 border:1px solid #ffffff1f;border-radius:6px;background:transparent;color:#c8cfd2;
 transition:color 140ms ease,border-color 140ms ease,background 140ms ease;
}
#community-app .page-bookmark:is(:hover,:focus-visible){color:#ffe0a4;border-color:#ffc45b66;background:#ffc45b14}
#community-app .account-link{flex:0 0 auto;margin-left:auto;font-size:12px;align-self:center}

/* ---------------------------------------------------------------------------
   The shared frame. Previously only the World page sat in a panel (its
   .world-monitor-frame); every other page floated loose on the background.
   #app-frame gives every page that same treatment - the panel and its inner
   screen, without the branded bezel strip - and carries the page bar that now
   holds Back/Forward.
   --------------------------------------------------------------------------- */
/* #app-workspace is the scroll container the app's own JS reads and restores
   (work.scrollTop), so the frame must NOT take that job over - it grows with its
   content and lets the workspace keep scrolling, while still filling the height
   when a page is short. flex-basis stays auto for exactly that reason: "flex:1"
   (basis 0) collapsed the frame to the height of its bar. */
#community-app #app-workspace{display:flex;flex-direction:column}
#community-app #app-frame{
 display:flex;flex-direction:column;min-height:0;flex:1 1 auto;
 margin:0;padding:0;
 border:10px solid #080a0b;border-radius:14px;
 background:radial-gradient(ellipse at 30% 0,#1c2225,#0b0f12 80%);
 box-shadow:inset 0 0 0 1px #414548,0 0 0 1px #151719,0 18px 38px #0009;
 overflow:hidden;
}
/* Even padding on every side so page content sits centred in the frame. */
#community-app #app-frame>#app-view{flex:1 1 auto;min-height:0;margin:0;padding:20px;max-width:none}
#community-app .app-history-controls{display:flex;align-items:center;gap:6px;flex:0 0 auto}
/* Compact icon buttons - they were two 92px labelled pills eating the header's
   width; the destination still reads out through their aria-label/tooltip. */
#community-app .app-history-controls .app-back-control,
#community-app[data-scene] .dispatch-navigation .app-history-controls .app-back-control{
 flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
 width:28px;height:28px;padding:0;
 border:1px solid #ffffff20;border-radius:7px;background:#ffffff08;
 color:#d7dbdc;font:700 14px/1 'Segoe UI',sans-serif;cursor:pointer;
 transition:background 150ms ease,color 150ms ease,border-color 150ms ease;
}
#community-app .app-history-controls .app-back-control:is(:hover,:focus-visible):not(:disabled),
#community-app[data-scene] .dispatch-navigation .app-history-controls .app-back-control:is(:hover,:focus-visible):not(:disabled){
 background:#ffc45b1f;border-color:#ffc45b66;color:#ffe0a4;
}
#community-app .app-history-controls .app-back-control:disabled,
#community-app[data-scene] .dispatch-navigation .app-history-controls .app-back-control:disabled{opacity:.3;cursor:default}

/* The World page brought its own monitor frame; #app-frame is that frame now, so
   the old one would just draw a second border inside the first. */
#community-app .world-monitor-frame{display:none!important}
#community-app[data-scene=world] #app-workspace{border:0}
/* Some scenes pin #app-view absolutely to fill its container (thread reading view:
   inset:0). Inside the frame that meant it covered the page bar entirely. Anchor it
   below the bar instead. */
#community-app #app-frame{position:relative;--page-bar-h:0px}
#community-app[data-scene=world] #app-frame>#app-view.hz-thread{top:var(--page-bar-h)}
/* The World's frame was only ever a ring over its map - the interior was see-through
   so the city backdrop showed behind the content. Keep that on World pages (threads
   included) rather than painting over the map. */
#community-app[data-scene=world] #app-frame{background:transparent}

/* Pages with their own top strip (World locations, threads) fold Back/Forward into it
   and drop the frame's page bar, so there's one bar across the top - not two. The
   strip's breadcrumb goes: the header's breadcrumb now says exactly the same thing
   one line above it. What stays is Back/Forward plus that page's own actions. */
#community-app #app-frame #app-view>.dispatch-navigation{
 display:flex;align-items:center;gap:10px;flex-wrap:nowrap;
 min-height:45px;margin:0 0 18px;padding:8px 12px;
}
#community-app #app-frame #app-view>.dispatch-navigation>ol,
#community-app #app-frame #app-view>.dispatch-navigation>.dispatch-nav-mark{display:none}
#community-app #app-frame #app-view>.dispatch-navigation .dispatch-actions{margin:0 0 0 auto}

/* ============================================================================
   THREAD VIEW CLEANUP
   ============================================================================ */
/* One tidy row: title, post count, and the event tag together on the left; the
   actions as a compact icon cluster on the right. */
#community-app .thread-view-heading{align-items:center;gap:16px;padding:12px 14px 12px 18px}
#community-app .thread-view-heading .thread-title-line{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
#community-app .thread-view-heading .thread-title-line .thread-tags{display:inline-flex;align-items:center;gap:6px;margin:0}
#community-app .thread-view-heading .thread-view-subtitle{margin:4px 0 0}
#community-app .thread-view-heading .thread-heading-actions{display:flex;align-items:center;gap:6px;flex-wrap:nowrap;margin-left:auto}

/* Icon buttons: Watch (eye), Manage (pencil), Back. Hover text via title. */
#community-app .thread-view-heading .thread-icon-button,
#community-app .thread-view-heading .thread-manage>summary.thread-icon-button{
 display:inline-flex;align-items:center;justify-content:center;
 width:34px;height:34px;padding:0;margin:0;
 border:1px solid color-mix(in srgb,var(--thread-frame-accent,#b58549) 45%,#ffffff20);
 border-radius:9px;
 background:color-mix(in srgb,var(--thread-frame-accent,#b58549) 10%,#171b1d);
 color:#e6e2d8;cursor:pointer;list-style:none;
 transition:background 150ms ease,color 150ms ease,border-color 150ms ease;
}
#community-app .thread-view-heading .thread-manage>summary.thread-icon-button::-webkit-details-marker{display:none}
#community-app .thread-view-heading .thread-manage>summary.thread-icon-button::after{content:none}
#community-app .thread-view-heading .thread-icon-button:is(:hover,:focus-visible),
#community-app .thread-view-heading .thread-manage[open]>summary.thread-icon-button{
 background:color-mix(in srgb,var(--thread-frame-accent,#b58549) 26%,#171b1d);
 border-color:var(--thread-frame-accent,#b58549);color:#fff;
}
/* Watching: the eye reads as "on". */
#community-app .thread-view-heading #toggle-watch-thread[aria-pressed=true]{
 background:var(--thread-frame-accent,#b58549);border-color:var(--thread-frame-accent,#b58549);color:#15110b;
}

/* Post header row: Quote / Edit, then the timestamp inline to their right, instead of
   the timestamp sitting alone in a footer under the post. */
#community-app .forum-post .post-body>.post-controls{display:flex;align-items:center;gap:6px}
#community-app .forum-post .post-controls .post-timestamp{
 margin-left:6px;font:11px/1.3 'Segoe UI',sans-serif;color:#9b9e98;white-space:nowrap;
}
#community-app .forum-post .post-delete-in-edit{margin-left:auto;border-color:#b3434380!important;color:#f0a2a2!important;background:transparent!important}
#community-app .forum-post .post-delete-in-edit:hover{background:#b3434322!important;color:#ffc9c9!important}

/* Scroll hints are gone; the scrollbar is simply always visible instead, tinted to the
   thread's accent so it reads as part of the page rather than browser chrome. */
#community-app[data-scene=world] #app-view.hz-thread>.thread-reading-area:not(.dispatch-navigation){
 scrollbar-color:color-mix(in srgb,var(--thread-frame-accent,#b58549) 60%,#3a3f41) transparent;
}
#community-app .thread-reading-area::-webkit-scrollbar{width:10px}
#community-app .thread-reading-area::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--thread-frame-accent,#b58549) 60%,#3a3f41);border-radius:6px;border:2px solid transparent;background-clip:padding-box}
#community-app .thread-reading-area::-webkit-scrollbar-track{background:transparent}

/* The room held back on the right of the posting column used to be a flat 260px no
   matter the window size - generous on a wide screen, but on a narrow one it squeezed
   the posts while still reserving the same slab of empty map. It now scales with the
   available width: roughly a fifth of it on a large window, tapering to almost nothing
   as the window narrows, so the posts get wider exactly when they need to. */
#community-app #app-view{--thread-right-reserve:clamp(12px, 20% - 60px, 420px)}

/* World welcome: SYSTEM ONLINE pinned to the top-right corner of the header block
   with a blinking status light, instead of wrapping onto a line of its own. */
#community-app .world-terminal-welcome{position:relative;padding-right:150px}
#community-app .world-terminal-welcome .terminal-status{
 position:absolute;top:0;right:0;margin:0;
 display:inline-flex;align-items:center;gap:8px;
 font:11px/1 monospace;letter-spacing:1.5px;color:#a7c8ae;white-space:nowrap;
}
#community-app .terminal-status-dot{
 width:8px;height:8px;border-radius:50%;background:#7fe08f;
 box-shadow:0 0 8px #7fe08fcc;animation:terminal-status-blink 1.6s ease-in-out infinite;
}
@keyframes terminal-status-blink{0%,55%{opacity:1}75%,90%{opacity:.15}100%{opacity:1}}
@media(prefers-reduced-motion:reduce){#community-app .terminal-status-dot{animation:none}}
@media(max-width:600px){#community-app .world-terminal-welcome{padding-right:0;padding-top:24px}}
/* Territory cards are clickable as a whole now. */
#community-app .terminal-location-grid .territory-card:has(.territory-expand){cursor:pointer}
/* The older "#toggle-watch-thread" pill rule (id-level specificity, 16px side padding)
   was still winning on padding, which squeezed the icon to zero width inside the 34px
   button. Match its specificity so the icon button's own sizing applies. */
#community-app .thread-view-heading #toggle-watch-thread.thread-icon-button{padding:0;width:34px;height:34px;font-size:0}
#community-app .thread-view-heading .thread-icon-button>svg{flex:none}

/* ============================================================================
   GUIDEBOOK - tabbed guide layout
   ----------------------------------------------------------------------------
   Title badge overlapping one large glass reading panel; chapter tabs in a
   sticky column on the right. The chapter scrolls inside the panel, whose
   height is fixed to the available space, so switching chapters never shifts
   the page. Everything is scoped to .guide-layout at a specificity that beats
   the old paper-book rules (paper gradients, two-column prose, brown ink,
   multiply-blended plates), which are still in this file for the old markup.
   ============================================================================ */
#community-app[data-scene] .guide-volume.guide-layout{
 --gb1:233 179 90;   /* amber - titles, borders, active tab */
 --gb2:111 194 184;  /* teal - secondary subheads, emphasis */
 --gb-glass:rgba(12,16,18,.66);
 display:block;max-width:none;width:100%;margin:0;padding:0;transform:none;
 grid-template-columns:none;grid-template-rows:none;
 color:#d6d2c8;font:400 15px/1.75 'Segoe UI',sans-serif;
}

/* ---- body: reading panel (left) + chapter tab column (right) ---- */
#community-app[data-scene] .guide-layout .guide-body{
 display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:20px;align-items:stretch;
 /* Fill the frame: viewport minus header (58), workspace padding (60), frame border (20)
    and the view's own padding (40). */
 height:max(480px,calc(100dvh - 58px - 60px - 20px - 40px));
}
#community-app[data-scene] .guide-layout .guide-panel-col{position:relative;min-width:0}
#community-app[data-scene] .guide-layout .guide-panel{
 position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden;
 padding:16px 6px 16px 0;border:2px solid rgb(var(--gb1));border-radius:18px;background:transparent;
}
/* Glass that's solid through the middle and feathers out toward the edges. */
#community-app[data-scene] .guide-layout .guide-panel::before{
 content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;pointer-events:none;
 background:var(--gb-glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
 -webkit-mask-image:radial-gradient(ellipse 128% 128% at 50% 42%,#000 56%,transparent 100%);
 mask-image:radial-gradient(ellipse 128% 128% at 50% 42%,#000 56%,transparent 100%);
}
/* The scroll viewport, inset off the rounded corners. */
#community-app[data-scene] .guide-layout .guide-panes{
 position:relative;z-index:1;flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;
 padding:26px 32px 22px 36px;scrollbar-gutter:stable;scrollbar-width:thin;
 scrollbar-color:rgb(var(--gb1) / .4) transparent;
}
#community-app[data-scene] .guide-layout .guide-panes::-webkit-scrollbar{width:14px}
#community-app[data-scene] .guide-layout .guide-panes::-webkit-scrollbar-track{background:transparent}
#community-app[data-scene] .guide-layout .guide-panes::-webkit-scrollbar-thumb{min-height:48px;border-radius:99px;border:4px solid transparent;background:rgb(var(--gb1) / .35);background-clip:padding-box}
#community-app[data-scene] .guide-layout .guide-panes:hover::-webkit-scrollbar-thumb{background:rgb(var(--gb1) / .6);background-clip:padding-box}

/* Strip the paper-book treatment off the article and prose. */
#community-app[data-scene] .guide-layout .handbook-article{
 display:block;height:auto;min-height:0;margin:0;padding:0;border:0;border-radius:0;
 background:none;box-shadow:none;transform:none;color:inherit;
}
#community-app[data-scene] .guide-layout .handbook-prose{
 column-count:auto;columns:auto;column-gap:normal;height:auto;overflow:visible;transform:none;
 max-width:none;color:#d6d2c8;font:400 15px/1.75 'Segoe UI',sans-serif;
}
#community-app[data-scene] .guide-layout .guide-pane{animation:none} /* chapter changes use the page slide (slideSwap) as their only motion */
@keyframes guide-pane-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){#community-app[data-scene] .guide-layout .guide-pane{animation:none}}

/* ---- typography ---- */
#community-app[data-scene] .guide-layout .handbook-prose .chapter-opener{margin:0 0 20px;padding:0;border:0}
#community-app[data-scene] .guide-layout .handbook-prose .chapter-opener h2{
 margin:0;padding:0;border:0;background:none;
 font:400 clamp(1.7rem,3.4vw,2.3rem)/1.1 'Clarity City','Overpass','Segoe UI',sans-serif;
 text-transform:none;letter-spacing:0;color:rgb(var(--gb1));
}
#community-app[data-scene] .guide-layout .handbook-prose h3,
#community-app[data-scene] .guide-layout .handbook-prose h3:not(.welcome-slogan){
 margin:28px 0 12px;padding:0 0 6px;
 font:400 clamp(1.3rem,2.4vw,1.7rem)/1.2 'Bebas Neue','Arial Narrow',sans-serif;
 text-transform:uppercase;letter-spacing:2px;color:rgb(var(--gb1));
 border:0;border-bottom:1px solid rgb(var(--gb1) / .2);background:none;
}
#community-app[data-scene] .guide-layout .handbook-prose h4{
 margin:22px 0 10px;font:400 clamp(1.1rem,2vw,1.4rem)/1.2 'Bebas Neue','Arial Narrow',sans-serif;
 text-transform:uppercase;letter-spacing:1.5px;color:rgb(var(--gb2));
}
#community-app[data-scene] .guide-layout .handbook-prose .welcome-slogan{margin-top:0}
#community-app[data-scene] .guide-layout .handbook-prose .welcome-lead{font-size:16px;color:#ebe5d8}
#community-app[data-scene] .guide-layout .handbook-prose p{margin:0 0 14px;color:#d6d2c8;font-size:15px;line-height:1.75}
#community-app[data-scene] .guide-layout .handbook-prose :is(b,strong){color:rgb(var(--gb1));font-weight:600}
#community-app[data-scene] .guide-layout .handbook-prose :is(i,em){color:rgb(var(--gb2))}
#community-app[data-scene] .guide-layout .handbook-prose a{color:rgb(var(--gb1));text-decoration:underline;text-decoration-color:rgb(var(--gb1) / .35);text-underline-offset:2px}
#community-app[data-scene] .guide-layout .handbook-prose a:hover{text-decoration-color:rgb(var(--gb1))}
#community-app[data-scene] .guide-layout .handbook-prose ul{list-style:none;margin:6px 0 14px;padding:0}
#community-app[data-scene] .guide-layout .handbook-prose ul>li{position:relative;display:block;margin:0 0 10px;padding-left:22px}
#community-app[data-scene] .guide-layout .handbook-prose ul>li::before{
 content:"";position:absolute;left:2px;top:.62em;width:8px;height:8px;border-radius:50%;
 background:rgb(var(--gb1));box-shadow:0 0 0 3px rgb(var(--gb1) / .18);
}
#community-app[data-scene] .guide-layout .handbook-prose ol{margin:6px 0 14px;padding-left:1.6em}
#community-app[data-scene] .guide-layout .handbook-prose ol>li::marker{color:rgb(var(--gb1));font-weight:700}
#community-app[data-scene] .guide-layout .handbook-prose blockquote{
 margin:18px 0;padding:12px 18px;border:0;border-left:3px solid rgb(var(--gb2));
 border-radius:0 10px 10px 0;background:rgb(var(--gb2) / .08);color:#e2ddd2;font-style:normal;
}
#community-app[data-scene] .guide-layout .handbook-prose hr{border:0;border-top:1px solid rgb(var(--gb1) / .2);margin:18px 0}
/* Plates: framed images, no paper multiply-blend (which would muddy them on dark glass). */
#community-app[data-scene] .guide-layout .handbook-prose .handbook-plate{margin:14px 0 20px}
#community-app[data-scene] .guide-layout .handbook-plate img{
 mix-blend-mode:normal;max-height:360px;border-radius:12px;
 border:1px solid rgb(var(--gb1) / .35);box-shadow:0 8px 22px #0007;object-fit:cover;
}
#community-app[data-scene] .guide-layout .handbook-plate figcaption{margin-top:8px;font:italic 12px/1.4 'Segoe UI',sans-serif;color:#9fa4a0}

/* ---- chapter tabs ---- */
#community-app[data-scene] .guide-layout .guide-side{min-height:0;overflow-y:auto;scrollbar-width:none}
#community-app[data-scene] .guide-layout .guide-side::-webkit-scrollbar{display:none}
#community-app[data-scene] .guide-layout .guide-tabs{display:flex;flex-direction:column;gap:7px}
#community-app[data-scene] .guide-layout .guide-tab{
 display:block;width:100%;box-sizing:border-box;text-align:left;padding:10px 16px;
 font:400 clamp(1.05rem,1.4vw,1.25rem)/1 'Bebas Neue','Arial Narrow',sans-serif;
 text-transform:uppercase;letter-spacing:1.5px;color:#d6d2c8;text-decoration:none;
 background:var(--gb-glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
 border:2px solid rgb(var(--gb1));border-radius:10px;
 transition:background .2s ease,color .2s ease,padding .15s ease;
}
#community-app[data-scene] .guide-layout .guide-tab:is(:hover,:focus-visible){
 background:rgb(var(--gb1) / .28);color:#fff;padding-left:20px;outline:none;
}
#community-app[data-scene] .guide-layout .guide-tab:focus-visible{box-shadow:0 0 0 2px rgb(var(--gb1) / .55)}
#community-app[data-scene] .guide-layout .guide-tab.is-active{
 /* Deeper stops than the accent itself so white text holds its contrast across the whole bar. */
 background:linear-gradient(90deg,rgb(196 138 44),rgb(46 118 190));border-color:transparent;
 color:#fff;text-shadow:0 1px 2px #0009,0 0 1px #000a;padding-left:20px;
}

/* ---- narrow: tabs wrap into a row above the panel; the panel grows with its content ---- */
@media(max-width:900px){
 #community-app[data-scene] .guide-layout .guide-body{grid-template-columns:1fr;height:auto;gap:18px}
 #community-app[data-scene] .guide-layout .guide-side{order:1;overflow:visible}
 #community-app[data-scene] .guide-layout .guide-panel-col{order:2}
 #community-app[data-scene] .guide-layout .guide-tabs{flex-direction:row;flex-wrap:wrap}
 #community-app[data-scene] .guide-layout .guide-tab{width:auto;flex:1 1 auto;text-align:center;padding:8px 12px}
 #community-app[data-scene] .guide-layout .guide-tab:is(:hover,:focus-visible),
 #community-app[data-scene] .guide-layout .guide-tab.is-active{padding-left:12px}
 #community-app[data-scene] .guide-layout .guide-panel{position:static;display:block;padding:0}
 #community-app[data-scene] .guide-layout .guide-panes{overflow:visible;padding:26px 22px}
}

/* ============================================================================
   CHARACTERS DIRECTORY
   Filter sidebar + scrolling card grid, filling the page frame.
   ============================================================================ */
#community-app .cast-directory{
 display:grid;grid-template-columns:250px minmax(0,1fr);
 height:max(480px,calc(100dvh - 58px - 60px - 20px - 40px));
 border:1px solid #ffffff14;border-radius:14px;overflow:hidden;
 background:rgba(12,15,17,.55);
}
/* ---- sidebar ---- */
#community-app .cast-sidebar{
 display:flex;flex-direction:column;gap:12px;padding:15px;overflow-y:auto;min-height:0;
 background:#0e1214;border-right:1px solid #ffffff14;scrollbar-width:thin;
}
#community-app .cast-search{display:flex;flex-direction:column;gap:6px}
#community-app .cast-search-hint{font:600 9px/1 Consolas,monospace;text-transform:uppercase;letter-spacing:1px;color:#8e959a;text-align:center}
#community-app .cast-search-row{display:flex;align-items:center;gap:6px;padding:0 10px;background:#161b1e;border:1px solid #ffffff1c;border-radius:10px;color:#8e959a}
#community-app .cast-search-row:focus-within{border-color:#ffc45b88}
#community-app .cast-search-row input{flex:1;min-width:0;border:0;background:none;padding:9px 0;margin:0;font:400 13px/1 'Segoe UI',sans-serif;color:#e6e2d8;outline:none}
#community-app .cast-status{margin:0;font:400 10px/1 Consolas,monospace;letter-spacing:.5px;color:#8e959a;text-align:center}
#community-app .cast-filter-section{display:flex;flex-direction:column;gap:5px}
#community-app .cast-filter-label{font:700 9px/1 Consolas,monospace;text-transform:uppercase;letter-spacing:1.5px;color:#e9b35a;padding:4px 0;border-bottom:1px solid #ffffff14;margin-bottom:2px}
#community-app .cast-filter-pills{display:flex;flex-wrap:wrap;gap:4px;justify-content:center}
#community-app .cast-sort-row{display:flex;gap:4px;width:100%}
#community-app :is(.cast-pill,.cast-sort-btn){
 font:600 10px/1 Consolas,monospace;text-transform:lowercase;letter-spacing:.3px;color:#d6d2c8;
 border:1px solid #ffffff1f;background:#161b1e;padding:5px 9px;border-radius:12px;cursor:pointer;
 transition:background .15s ease,border-color .15s ease,color .15s ease;
}
#community-app .cast-sort-btn{flex:1;border-radius:8px;padding:6px 4px;text-align:center}
#community-app :is(.cast-pill,.cast-sort-btn):hover{border-color:#e9b35a66;background:#e9b35a1a}
#community-app :is(.cast-pill,.cast-sort-btn)[aria-pressed=true]{background:#e9b35a40;color:#ffd48a;border-color:#e9b35a88}
#community-app .cast-reset{margin-top:auto;align-self:center;background:none;border:0;padding:6px;font:600 10px/1 Consolas,monospace;text-transform:uppercase;letter-spacing:1px;color:#8e959a;cursor:pointer}
#community-app .cast-reset:hover{color:#ffd48a}

/* ---- results ---- */
#community-app .cast-results{min-height:0;overflow-y:auto;padding:14px;scrollbar-width:thin;scrollbar-color:#e9b35a66 transparent}
#community-app .cast-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:16px;align-content:start}

/* ---- card ---- */
#community-app .cast-directory .cast-card{
 position:relative;display:flex;flex-direction:column;overflow:hidden;cursor:pointer;
 border-radius:16px;border:1px solid color-mix(in srgb,var(--character-color) 30%,#3c3c3c80);
 background:linear-gradient(color-mix(in srgb,var(--character-color) 10%,transparent),color-mix(in srgb,var(--character-color) 10%,transparent)),rgba(24,26,28,.85);
 transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
#community-app .cast-directory .cast-card:is(:hover,:focus-visible){border-color:var(--character-color);transform:translateY(-2px);box-shadow:0 8px 22px #0007;outline:none}
/* Top: name + alias, then the descriptor pills. */
#community-app .cast-directory .cast-card-head{
 padding:14px 18px;border-bottom:1px solid #ffffff14;
 background:linear-gradient(135deg,color-mix(in srgb,var(--character-color) 25%,transparent),color-mix(in srgb,var(--character-secondary,var(--character-color)) 15%,transparent));
}
/* aka sits on the same centre line as the name and the alias, not the baseline. */
#community-app .cast-directory .character-card-name-row{display:flex;align-items:center;flex-wrap:wrap;gap:4px 9px;margin:0;min-width:0}
#community-app .cast-directory .character-card-name-row h2{margin:0;font:400 24px/1.05 'Bebas Neue','Arial Narrow',sans-serif;letter-spacing:.6px;text-transform:uppercase;color:#f4eee2}
#community-app .cast-directory .character-card-name-row h2 a{color:inherit}
#community-app .cast-directory .cast-aka{font:italic 600 11px/1 'Segoe UI',sans-serif;color:color-mix(in srgb,var(--character-color) 75%,#fff);opacity:.85}
#community-app .cast-directory .character-codename{margin:0;padding:0;font:400 22px/1 'Clarity City','Overpass','Segoe UI',sans-serif;color:var(--character-color);filter:drop-shadow(0 1px 1px #000c)}
/* Pills styled like the reference's group tags - small, squared, tinted in the
   character's own colour. */
#community-app .cast-directory .cast-tags{display:flex;flex-wrap:wrap;gap:6px;margin:9px 0 0;padding:0}
#community-app .cast-directory .cast-tag{
 display:inline-block;padding:4px 8px;border-radius:4px;
 font:600 10px/1 Consolas,monospace;text-transform:lowercase;letter-spacing:.2px;
 color:color-mix(in srgb,var(--character-color) 80%,#fff);
 background:color-mix(in srgb,var(--character-color) 20%,transparent);
 border:1px solid color-mix(in srgb,var(--character-color) 35%,transparent);
}
#community-app .cast-directory .cast-tag-soft{background:color-mix(in srgb,var(--character-color) 9%,transparent);color:#d6d2c8}
#community-app .cast-directory .cast-tag-muted{background:#ffffff0d;border-color:#ffffff1f;color:#a6aaa6}
/* Second section: a deeper shade of the same theme colour. */
#community-app .cast-directory .cast-card-body{
 flex:1;display:flex;gap:12px;padding:12px;
 background:color-mix(in srgb,var(--character-color) 6%,#0c0f11cc);
}
#community-app .cast-directory .character-card-portrait{
 flex:none;width:90px;height:120px;display:grid;place-items:center;overflow:hidden;
 border-radius:10px;border:1px solid color-mix(in srgb,var(--character-color) 30%,#ffffff14);background:#161b1e;
}
#community-app .cast-directory .character-card-portrait img{width:100%;height:100%;object-fit:cover;object-position:top}
#community-app .cast-directory .character-card-portrait svg{width:44px;fill:none;stroke:#5c6266;stroke-width:2}
#community-app .cast-directory .cast-details{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}
#community-app .cast-directory .cast-meta{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:0}
#community-app .cast-directory .cast-meta-item{display:flex;flex-direction:column;gap:3px;padding:6px 9px;background:#0b0e10;border:1px solid #ffffff14;border-radius:6px;min-width:0}
#community-app .cast-directory .cast-meta-item dt{margin:0;font:700 9px/1 Consolas,monospace;text-transform:uppercase;letter-spacing:1px;color:var(--character-color)}
#community-app .cast-directory .cast-meta-item dd{margin:0;font:400 12px/1.3 Consolas,monospace;color:#e6e2d8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#community-app .cast-directory .cast-meta-item dd a{color:inherit;text-decoration:underline;text-decoration-color:#ffffff33;text-underline-offset:2px}
#community-app .cast-directory .cast-placeholder{color:#8e959a;font-style:italic}
/* Thread count pinned to the bottom-right corner of the card. */
#community-app .cast-directory .cast-threads{margin-top:auto;align-self:flex-end;font:700 10px/1 Consolas,monospace;letter-spacing:.3px;color:#9ba0a0}

@media(max-width:900px){
 #community-app .cast-directory{grid-template-columns:1fr;height:auto}
 #community-app .cast-sidebar{border-right:0;border-bottom:1px solid #ffffff14;overflow:visible}
 #community-app .cast-results{overflow:visible}
 #community-app .cast-grid{grid-template-columns:1fr}
}

/* The sidebar's "tap outside to close" scrim only makes sense where the sidebar
   overlays the page. On wider screens the content now slides over beside the expanded
   sidebar (see --navigation-gutter), so the scrim was just dimming every page and
   eating the first click anywhere on it. Keep it for the narrow drawer layout only. */
@media(min-width:651px){#community-app #sidebar-dismiss{display:none!important}}

/* With Back/Forward gone, a page's own top strip only carries that page's actions
   (the breadcrumb in it is hidden - the header already shows it). Pages with no
   actions there, like a thread, drop the strip altogether. */
#community-app #app-frame #app-view>.dispatch-navigation:not(:has(.dispatch-actions>*)){display:none}

/* ---- Characters directory, round 2 ---- */
/* The portrait is a full-height left column spanning both halves of the card. */
#community-app .cast-directory .cast-card{
 display:grid;grid-template-columns:118px minmax(0,1fr);grid-template-rows:auto 1fr;
}
#community-app .cast-directory .cast-card>.character-card-portrait{
 grid-column:1;grid-row:1/3;width:auto;height:auto;min-height:170px;
 border:0;border-right:1px solid color-mix(in srgb,var(--character-color) 35%,#ffffff14);border-radius:0;
}
#community-app .cast-directory .cast-card>.cast-card-head{grid-column:2;grid-row:1}
#community-app .cast-directory .cast-card>.cast-card-body{grid-column:2;grid-row:2}

/* Pills: white, bold text on the tinted chip (was tinted text on a tinted chip). */
#community-app .cast-directory .cast-tag,
#community-app .cast-directory .cast-tag-soft{
 color:#fff;font:700 11px/1 Consolas,monospace;letter-spacing:.3px;padding:4px 9px;
 text-shadow:0 1px 1px #0008;
}
#community-app .cast-directory .cast-tag{background:color-mix(in srgb,var(--character-color) 45%,#10141680);border-color:color-mix(in srgb,var(--character-color) 70%,transparent)}
#community-app .cast-directory .cast-tag-soft{background:color-mix(in srgb,var(--character-color) 22%,#10141680)}
#community-app .cast-directory .cast-tag-muted{color:#e6e2d8}
#community-app .cast-directory .cast-meta-item dt{font-size:10px}
#community-app .cast-directory .cast-meta-item dd{font-size:13px}
#community-app .cast-directory .cast-threads{font-size:11px;color:#c3c7c4}

/* Sidebar: everything a size up and bolder. */
#community-app .cast-sidebar{gap:14px;padding:16px}
#community-app .cast-search-hint{font:700 10px/1.2 Consolas,monospace;color:#b4babd}
#community-app .cast-search-row input{font:600 14px/1 'Segoe UI',sans-serif}
#community-app .cast-status{font:700 11px/1 Consolas,monospace;color:#b4babd}
#community-app .cast-filter-label{font:800 11px/1 Consolas,monospace;letter-spacing:1.5px;padding:5px 0}
#community-app :is(.cast-pill,.cast-sort-btn){font:700 12px/1 Consolas,monospace;color:#ece8de;padding:6px 10px}
#community-app .cast-sort-btn{padding:7px 4px}
#community-app .cast-reset{font:800 11px/1 Consolas,monospace;color:#b4babd}

/* Room for a permanent scrollbar so cards never sit under it or shift when it appears. */
#community-app .cast-results{scrollbar-gutter:stable;padding:16px 10px 16px 16px}
/* With the page <h1> hidden, a heading() that had nothing else in it (no subtitle,
   no action button) still left an empty box with a 22px bottom margin at the top of
   the page, pushing content off-centre vertically. Collapse it when it's empty. */
#community-app .app-heading:not(:has(>:nth-child(2))):not(:has(p)){display:none}
/* World pages used to add their own 26px side margin to every block, because nothing
   else inset them. The frame's 20px padding does that now, so the two stacked into an
   uneven 46px on the left. The frame's padding is the only inset. */
#community-app #app-frame #app-view>:not(.dispatch-navigation):not(.dispatch-recycle){margin-left:0;margin-right:0}
#community-app #app-frame #app-view.hz-thread>:is(.thread-view-heading,.thread-reading-area){margin-left:0}
/* Opening or closing a custom window (the character sheet pop-out) must not touch the
   page behind it. Older rules re-padded #app-workspace whenever #profile-views was
   open (to 32px 30px 0, or to 0 for the projected window), which moved and resized the
   whole page frame underneath - enough to reflow the Characters grid. The workspace
   keeps one fixed padding regardless of what windows are open. */
/* Doubled ids on purpose: the pop-out's own rule is
   "#community-app #app-workspace:has(#profile-views.projected-character-view...)" with
   padding:0 !important, which outranks a plain two-id rule even with !important. The
   gutter is reserved permanently too - that rule also hides the workspace scrollbar
   while a sheet is open, which would otherwise widen a long page underneath it. */
@media(min-width:651px){#community-app#community-app #app-workspace#app-workspace{padding:30px!important;display:flex!important;flex-direction:column!important;scrollbar-gutter:stable}}
/* World overview: the terminal fills the common container box; its actions sit in a
   slim row across the top inside it. */
#community-app #app-frame .world-terminal{margin:0;height:100%;min-height:0;box-sizing:border-box}
#community-app .world-terminal-screen>.terminal-action-strip>:is(ol,.dispatch-nav-mark){display:none}
/* Older rules float the strip's contents out of flow, which collapsed the row to zero
   height and drew "Map navigation" on top of SYSTEM ONLINE. Keep it a real row. */
#community-app .world-terminal-screen>.terminal-action-strip{min-height:32px}

/* ---- Page settings: gear on the frame's top-right corner + its popout ---- */
#community-app #page-settings-toggle{
 position:fixed;z-index:10060;width:34px;height:34px;padding:0;
 display:inline-flex;align-items:center;justify-content:center;
 border-radius:50%;border:1px solid #ffffff2e;background:#151a1dee;color:#d6d2c8;
 box-shadow:0 3px 12px #0009;cursor:pointer;
 transition:color .15s ease,border-color .15s ease,background .15s ease,transform .25s ease;
}
#community-app #page-settings-toggle[hidden]{display:none}
#community-app #page-settings-toggle:is(:hover,:focus-visible){color:#ffd48a;border-color:#e9b35a99;background:#1d2326}
#community-app #page-settings-toggle[aria-expanded=true]{color:#ffd48a;border-color:#e9b35a;transform:rotate(45deg)}
#community-app #page-settings-panel{
 position:fixed;z-index:10061;min-width:240px;max-width:340px;
 border:1px solid #e9b35a55;border-radius:12px;background:#12171aF2;
 -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 12px 32px #000a;overflow:hidden;
}
#community-app #page-settings-panel .page-settings-head{padding:10px 14px;font:800 10px/1 Consolas,monospace;letter-spacing:1.5px;text-transform:uppercase;color:#e9b35a;border-bottom:1px solid #ffffff14}
#community-app #page-settings-panel .page-settings-body{display:flex;flex-direction:column;gap:8px;padding:12px 14px}
#community-app #page-settings-panel .page-settings-body>button{
 width:100%;text-align:left;padding:8px 12px;border-radius:8px;border:1px solid #ffffff1f;
 background:#1a2023;color:#ece8de;font:600 13px/1.2 'Segoe UI',sans-serif;cursor:pointer;
}
#community-app #page-settings-panel .page-settings-body>button:hover{border-color:#e9b35a88;background:#e9b35a1a}
#community-app #page-settings-panel .page-settings-body label{display:flex;align-items:center;gap:8px;color:#ece8de;font:600 13px/1.2 'Segoe UI',sans-serif;cursor:pointer}
#community-app #page-settings-panel .page-settings-empty{margin:0;color:#9aa0a3;font:italic 12px/1.4 'Segoe UI',sans-serif}

/* Guidebook active tab: the tab keeps a (transparent) 2px border, and the gradient was
   anchored inside it, so it tiled into that border strip - blue down the left edge and
   gold down the right. Anchor it to the border box so the fill is one clean gradient. */
#community-app[data-scene] .guide-layout .guide-tab.is-active{background-origin:border-box}

/* Header: the breadcrumb starts where the expanded sidebar ends (204px), with a divider
   continuing the sidebar's edge, instead of hugging the site title. */
@media(min-width:651px){
 #community-app .app-header{gap:0}
 #community-app .app-brand{flex:0 0 calc(204px - 22px);box-sizing:border-box}
 #community-app .app-header nav.header-forum-trail,
 #community-app.has-sidebar .app-header nav.header-forum-trail{align-self:stretch;padding-left:20px;border-left:1px solid #ffffff14}
 #community-app .page-bookmark{margin-left:12px}
 #community-app .account-link{margin-left:auto;padding-left:16px}
}

/* ---- Window layering ----
   bottom → top:  header / sidebar (10100-10101)  →  backgrounded window (10150)
               →  page frame (10160)  →  page-settings gear/popout (10170)
               →  active window (10200).
   A backgrounded window is hidden behind the page view but still sits above the header
   and sidebar, so whatever part of it hangs over them stays visible (it used to be
   clipped away underneath them instead). */
#community-app #app-frame{z-index:10160}
#community-app #profile-views.sheet-window-backgrounded{z-index:10150!important;clip-path:none!important}
#community-app #profile-views.sheet-window-backgrounded>.sheet-inactive-shade{pointer-events:auto;cursor:pointer}
#community-app #page-settings-toggle{z-index:10170}
#community-app #page-settings-panel{z-index:10171}
/* Windows can be resized to the whole viewport; the old cap was the projector-room
   backdrop's screen area, which no longer exists. */
#community-app #profile-views.floating-character-window.sheet-window-positioned{max-width:100vw!important;max-height:100vh!important}
#community-app #profile-views.projected-character-view.sheet-window-positioned{max-width:100vw!important;max-height:100vh!important}

/* ============================================================================
   WINDOWS, DOCK, THEMED HOVER TEXT
   Stacking (inside .app-body), bottom -> top:
     sidebar 10100 -> background windows 10110-10158 (newest in front)
     -> page frame 10160 -> page-settings gear 10170 -> dock 10180
     -> focused window 10200.
   ============================================================================ */

/* Themed hover text: the site's gold-on-dark tooltip, with a short fade in and out. */
.themed-tooltip{
 position:fixed;z-index:2147483647;pointer-events:none;left:0;top:0;
 max-width:min(320px,calc(100vw - 16px));padding:7px 11px;border:1px solid #c7a062;border-radius:6px;
 background:#211c17;color:#ffe0a4;box-shadow:0 5px 16px #0007;font:700 12px/1.35 'Segoe UI',sans-serif;
 opacity:0;visibility:hidden;translate:0 3px;
 transition:opacity .16s ease,translate .16s ease,visibility 0s linear .16s;
}
.themed-tooltip.is-visible{opacity:1;visibility:visible;translate:0 0;transition:opacity .16s ease,translate .16s ease,visibility 0s}
@media(prefers-reduced-motion:reduce){.themed-tooltip{transition:none}}

/* Page settings gear: a little bigger, fades in/out with the frame. */
#community-app #page-settings-toggle{width:40px;height:40px;opacity:1;visibility:visible;transition:opacity .2s ease,visibility 0s,color .15s ease,border-color .15s ease,background .15s ease,transform .25s ease}
#community-app #page-settings-toggle svg{width:21px;height:21px}
#community-app #page-settings-toggle.is-hidden{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s ease,visibility 0s linear .2s}

/* The page layer has to rise above the header whenever any window is open - focused
   or in the background - so windows can overlap the header. */
#community-app.hz-ghost .app-body,
#community-app.hz-prof .app-body{z-index:10199}

/* Background windows: same frame, title strip and accent as the live window, dimmed. */
#community-app .sheet-ghost-window{
 position:fixed;box-sizing:border-box;display:flex;flex-direction:column;overflow:hidden;
 border:3px solid var(--sheet-accent,#ffc45b);border-radius:6px;background:#1b2022;
 box-shadow:0 12px 40px #0009;
}
#community-app .sheet-ghost-bar{flex:none;height:27px;display:flex;align-items:center;padding:0 10px;background:color-mix(in srgb,var(--sheet-accent,#ffc45b) 35%,#1b2022);color:#edf1f7;font:700 13px/1 'Segoe UI',sans-serif;white-space:nowrap;overflow:hidden}
#community-app .sheet-ghost-body{position:relative;flex:1;min-height:0}
#community-app .sheet-ghost-body>iframe{display:block;width:100%;height:100%;border:0}
#community-app .sheet-ghost-shade{position:absolute;inset:0;z-index:2;margin:0;padding:0;border:0;border-radius:0;background:#0b0e1066;cursor:pointer;transition:background .18s ease}
#community-app .sheet-ghost-shade:hover{background:#0b0e1033}

/* ---- Dock ---- */
#community-app .minimized-sheet-dock{position:fixed;right:0;bottom:0;z-index:10180;padding:0 8px 6px;transition:z-index 0s}
/* While a window is minimizing, the dock starts out behind the page view... */
#community-app .minimized-sheet-dock.dock-arriving{z-index:10155}
#community-app .minimized-sheet-dock.dock-arriving .minimized-character-file:not([hidden]):not(.dock-open-window){animation:dock-entry-rise .42s cubic-bezier(.2,.7,.2,1) both}
@keyframes dock-entry-rise{from{translate:0 70%;opacity:.4}to{translate:0 0;opacity:1}}
/* ...then comes forward (z-index back to 10180) once the window has landed. */

/* Entries: shorter, with 1px borders like the sidebar and header lines. */
#community-app .minimized-sheet-dock .minimized-character-file{
 border:1px solid var(--sheet-accent,#ffc45b);border-radius:6px 6px 0 0;border-bottom:0;
 background:#161b1dee;box-shadow:0 -2px 10px #0006;transition:opacity .18s ease,background .15s ease;
}
#community-app .minimized-sheet-dock .minimized-character-file button{padding:5px 11px;font-size:12px;line-height:1.2}
#community-app .minimized-sheet-dock .minimized-file-drag{display:flex;align-items:center;justify-content:center;padding:5px 8px;border-right:1px solid color-mix(in srgb,var(--sheet-accent,#ffc45b) 45%,transparent)}
#community-app .minimized-sheet-dock .dock-close{padding:5px 9px}
/* The focused window's entry is semi-transparent. */
#community-app .minimized-sheet-dock .minimized-character-file[data-state=focused]{opacity:.5}
#community-app .minimized-sheet-dock .minimized-character-file[data-state=focused]:hover{opacity:.9}
/* Icon: what the window is; on hover, what a click will do. */
#community-app .minimized-sheet-dock .dock-icon{display:none;line-height:0;color:var(--sheet-accent,#ffc45b)}
#community-app .minimized-sheet-dock .dock-icon-type{display:block}
#community-app .minimized-sheet-dock .minimized-character-file:hover .dock-icon-type{display:none}
#community-app .minimized-sheet-dock .minimized-character-file:hover .dock-icon-action{display:none}
#community-app .minimized-sheet-dock .minimized-character-file[data-state=minimized]:hover .dock-icon-action[data-action=minimized],
#community-app .minimized-sheet-dock .minimized-character-file[data-state=focused]:hover .dock-icon-action[data-action=focused],
#community-app .minimized-sheet-dock .minimized-character-file[data-state=background]:hover .dock-icon-action[data-action=background]{display:block;color:#fff}

/* Dock drag-to-reorder: the grabbing hand while an entry is held, and a lifted look on
   the entry being moved. */
html.dock-grabbing,html.dock-grabbing *{cursor:grabbing!important;user-select:none!important}
#community-app .minimized-sheet-dock .minimized-character-file.dock-dragging{translate:0 -3px;box-shadow:0 -4px 16px #000a;filter:brightness(1.15);outline:none;z-index:1}
#community-app .minimized-sheet-dock .minimized-character-file{position:relative;transition:opacity .18s ease,background .15s ease,translate .12s ease,box-shadow .12s ease}
/* Hover labels: a slightly softer fade-in. */
.themed-tooltip{transition:opacity .2s ease,translate .2s ease,visibility 0s linear .2s}
.themed-tooltip.is-visible{transition:opacity .2s ease,translate .2s ease,visibility 0s}

/* ============================================================================
   The guidebook's theme-coloured outline, on every other main page too (no tabs).
   It sits at the same 20px inset as the guidebook panel. Characters and the World
   overview already fill that box, so it traces their edges exactly; every other
   page gets an extra 20px of inner space so its content sits inside the outline.
   The thread reading view keeps its own framing.
   ============================================================================ */
#community-app #app-frame>#app-view{--page-outline:rgb(233 179 90)}
#community-app #app-frame>#app-view:not(.hz-anyguide):not(.hz-thread)::before{
 content:"";position:absolute;inset:20px;border:2px solid var(--page-outline);border-radius:18px;pointer-events:none;
}
#community-app #app-frame>#app-view:not(.hz-gcw):not(.hz-thread){padding:40px}
/* Containers that fill the outlined box take its rounded corners so nothing pokes out. */
#community-app .cast-directory{border:0;border-radius:18px}
#community-app #app-frame .world-terminal,#community-app #app-frame .world-terminal-screen{border-radius:18px}

/* ---- Locations & landmarks strip (top of the thread column) ---- */
#community-app[data-scene=world] #app-view .location-side-directory.location-strip:not(.dispatch-navigation):not(.dispatch-recycle){
 position:relative;top:auto!important;left:auto!important;width:auto;max-height:none;overflow:visible;
 margin:0 0 14px;padding:10px 12px 12px;box-sizing:border-box;
}
#community-app .location-strip summary{pointer-events:none;padding:0 0 8px;margin-bottom:10px}
#community-app .location-strip .location-side-items{
 display:flex;gap:10px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;
}
#community-app .location-strip .location-side-items::-webkit-scrollbar{display:none}
#community-app .location-strip .location-side-card{flex:0 0 230px;min-height:78px}
#community-app .location-strip .location-side-card>span{min-height:78px}
/* Fade the edges when it scrolls, so cards slide in and out rather than being cut off. */
#community-app .location-strip.is-overflowing .location-side-items{
 -webkit-mask-image:linear-gradient(90deg,transparent,#000 36px,#000 calc(100% - 36px),transparent);
 mask-image:linear-gradient(90deg,transparent,#000 36px,#000 calc(100% - 36px),transparent);
}
#community-app .location-strip .location-strip-arrow{
 display:none;position:absolute;z-index:2;top:calc(50% + 12px);translate:0 -50%;
 width:30px;height:30px;padding:0;align-items:center;justify-content:center;
 border:1px solid #ffffff2a;border-radius:50%;background:#0c0f10e6;color:#f2dec0;cursor:pointer;
 box-shadow:0 2px 10px #0009;transition:background .15s ease,border-color .15s ease,color .15s ease;
}
#community-app .location-strip.is-overflowing .location-strip-arrow{display:inline-flex}
#community-app .location-strip .location-strip-prev{left:4px}
#community-app .location-strip .location-strip-next{right:4px}
#community-app .location-strip .location-strip-arrow:is(:hover,:focus-visible){background:#1c1a15;border-color:#cba76b;color:#fff}

/* Locations strip sits above the thread cards. */
#community-app .thread-grid-pagination:has(>.location-strip)>.location-strip{grid-column:1/-1;grid-row:1}
#community-app .thread-grid-pagination:has(>.location-strip)>.forum-thread-cards{grid-row:2}
#community-app .thread-grid-pagination:has(>.location-strip)>.thread-list-heading{grid-row:3}

/* World pages: map / terminal share the page outline's rectangle; the 20px gutter between
   outline and frame gets the same dark fill as every other page, and the outline sits on top. */
#community-app[data-scene=world] #app-frame>#app-view:not(.hz-thread)::before{z-index:6}
/* Ring of normal page background between the frame and the outline (the frame itself stays
   transparent on world pages so the map, which lives far below, shows through the hole).
   Inset 1px so the frame's light inner edge line stays visible, same as other pages. */
#community-app .world-frame-ring{display:none;position:absolute;inset:1px;border-radius:3px;pointer-events:none;background:radial-gradient(at 30% 0,#1c2225,#0b0f12 80%)}
#community-app[data-scene=world] #app-frame:not(:has(>#app-view>.thread-reading-area))>.world-frame-ring{display:block}

/* Landmarks strip: larger, readable labels. */
#community-app .location-strip summary{font-size:15px!important;letter-spacing:1.5px;font-weight:700}
#community-app .location-strip .location-side-card strong{font-size:16px!important;line-height:1.2}
#community-app .location-strip .location-side-card small{font-size:12px!important}

/* Location pages: the action bar (Sort, + Thread) lines up with the landmarks / thread-card
   column below it and uses the same panel styling, instead of a full-width strip. */
#community-app[data-scene=world] #app-view.hz-locpag>.dispatch-navigation{
 width:calc(100% - 38px)!important;max-width:1082px!important;margin:0 12px 14px auto!important;box-sizing:border-box;
 min-height:0!important;padding:8px 12px!important;border:1px solid rgb(255 255 255 / .094)!important;border-radius:10px!important;
 background:rgb(8 10 11 / .937)!important;box-shadow:none!important;justify-content:flex-end;
}
#community-app[data-scene=world] #app-view.hz-locpag>.dispatch-navigation .dispatch-actions{margin:0 0 0 auto;align-items:center;gap:8px}
#community-app[data-scene=world] #app-view.hz-locpag>.dispatch-navigation .dispatch-actions>*{height:32px;box-sizing:border-box;display:inline-flex;align-items:center}
/* Thread cards: the hover glow must win over the unread-state border/shadow. */
#community-app .dispatch-thread-card[data-thread-path]:is(:hover,:focus-visible){border-color:var(--thread-accent);box-shadow:0 0 14px color-mix(in srgb,var(--thread-accent) 24%,transparent)}
#community-app .dispatch-thread-card[data-thread-path]:is(:hover,:focus-visible) .thread-card-title{color:var(--thread-accent)}

/* Ambient city pan, moved onto the compositor: animating background-position repainted the
   whole (filtered) map every frame, which is most of the lag on location pages. The map
   element keeps its background-image only so this layer can inherit it (size 0 = not drawn
   itself); the layer is one tile wider than the map and slides by exactly one tile. */
#community-app[data-scene=world][data-local-map-ready]:not([data-local-map-ready=""]) .world-local-map{animation:none;background-size:0 0}
#community-app .world-local-map::before{content:"";position:absolute;top:0;left:0;width:calc(100% + 2400px);height:100%;background-image:inherit;background-repeat:repeat-x;background-size:2400px auto;background-position:0 0;pointer-events:none;display:none}
#community-app[data-scene=world][data-local-map-ready]:not([data-local-map-ready=""]) .world-local-map::before{display:block;animation:local-map-pan-layer 220s linear infinite;will-change:transform}
@keyframes local-map-pan-layer{to{transform:translateX(-2400px)}}
#community-app.hz-thread .world-local-map::before{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){#community-app .world-local-map::before{animation:none!important}}

/* Territory directory: the top-level territory card gets the same accent border glow as its
   sublocation cards, and both fade their hover state in and out gently. */
#community-app .territory-card,#community-app .territory-child-card{transition:border-color 280ms ease,box-shadow 280ms ease}
#community-app .territory-card:is(:hover,:focus-within){border-color:rgb(219 172 103);box-shadow:0 0 12px rgb(219 172 103 / .22)}
#community-app .territory-child-card:is(:hover,:has(a:focus-visible)){box-shadow:0 0 12px rgb(219 172 103 / .22)}
/* Directory map: move to a hovered location with a slow ease-in / ease-out glide (origin
   and scale travel together so it reads as the map repositioning, not a jump), then the
   location pulses slowly in the accent colour. */
#community-app .world-directory-map-plane{transition:transform 1500ms cubic-bezier(.65,0,.35,1),transform-origin 1500ms cubic-bezier(.65,0,.35,1),translate 1500ms cubic-bezier(.65,0,.35,1)}
#community-app .terminal-territory-map.map-idle-scan:hover .world-directory-map-plane{transition:translate 400ms ease-out}
#community-app .world-directory-marker.is-visible{animation:directory-location-pulse 2.6s ease-in-out infinite}
@keyframes directory-location-pulse{0%,100%{background:#ffd184;box-shadow:0 0 0 0 rgb(233 179 90 / .55),0 0 4px rgb(233 179 90 / .5)}50%{background:#ffe2a6;box-shadow:0 0 0 7px rgb(233 179 90 / 0),0 0 14px rgb(233 179 90 / .9)}}
#community-app .preview-us .world-country-glow{animation:directory-country-pulse 2.6s ease-in-out infinite}
@keyframes directory-country-pulse{0%,100%{opacity:.3}50%{opacity:.75}}
@media(prefers-reduced-motion:reduce){#community-app .world-directory-marker.is-visible,#community-app .preview-us .world-country-glow{animation:none}#community-app .world-directory-map-plane{transition:none}}

/* Operations overview: the directory + map row fills the terminal down to its footer. The
   directory column scrolls on its own (scrollbar sits in the gutter beside the map); the map
   never scrolls and cover-fits its full height (sizeTerritoryMapPlane), so no top/bottom gaps. */
#community-app .world-terminal-screen>.terminal-territory-layout{flex:1 1 0;min-height:0;height:auto!important;grid-template-rows:minmax(0,1fr);align-items:stretch!important}
#community-app .terminal-territory-layout>.terminal-location-grid{height:auto!important;max-height:none;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable;padding-right:10px;margin-right:-12px;align-content:start;scrollbar-width:thin;scrollbar-color:rgb(219 172 103 / .45) transparent}
#community-app .terminal-territory-layout>.terminal-territory-map{height:auto!important;min-height:0;align-self:stretch}
#community-app .world-terminal-screen>.terminal-session{margin-top:24px}

/* Directory map: the previewed state glows along its border and pulses with a soft
   gradient tint (never a flat fill). The generic dot marker stands down while it shows. */
#community-app .world-directory-map-plane>.world-state-glow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;opacity:0;transition:opacity 500ms ease}
#community-app .world-directory-map-plane>.world-state-glow path{filter:drop-shadow(0 0 1.2px #ffd58c) drop-shadow(0 0 2.5px rgb(233 179 90 / .7))}
#community-app .world-directory-map-plane>.world-state-glow.is-visible{opacity:1;animation:directory-state-pulse 2.8s ease-in-out infinite}
@keyframes directory-state-pulse{0%,100%{opacity:.55}50%{opacity:1}}
#community-app .world-directory-map:has(.world-state-glow.is-visible) .world-directory-marker{opacity:0!important}
@media(prefers-reduced-motion:reduce){#community-app .world-directory-map-plane>.world-state-glow.is-visible{animation:none}}

/* Location pages: "POSTING OPTIONS" header bar and one semi-opaque panel that runs down
   behind the landmarks strip and the thread cards, with a little padding all round. */
#community-app[data-scene=world] #app-view.hz-locpag>.dispatch-navigation{border-radius:12px 12px 0 0!important;margin-bottom:0!important;border-bottom-color:rgb(255 255 255 / .06)!important;background:rgb(8 10 11 / .82)!important;padding:10px 16px!important}
#community-app[data-scene=world] #app-view.hz-locpag>.dispatch-navigation::before{content:"POSTING OPTIONS";margin-right:auto;font:700 13px/1 'Segoe UI',sans-serif;letter-spacing:2px;color:#d9c7a3}
#community-app[data-scene=world] #app-view .location-content-panel>.thread-grid-pagination:not(.dispatch-navigation):not(.dispatch-recycle){box-sizing:border-box;padding:14px 16px 12px;background:rgb(8 10 11 / .62);border:1px solid rgb(255 255 255 / .094);border-top:0;border-radius:0 0 12px 12px}
#community-app[data-scene=world] #app-view .location-content-panel>.thread-grid-pagination .location-strip{background:rgb(0 0 0 / .35)!important}

/* Header: bookmark is an icon beside the current crumb; everything up there a size larger. */
#community-app .header-forum-trail li:last-child{gap:10px}
#community-app .header-forum-trail .page-bookmark.trail-bookmark{padding:4px 6px;margin:0}
#community-app .header-forum-trail .page-bookmark.trail-bookmark>span{display:none}
#community-app .header-forum-trail .page-bookmark.trail-bookmark svg{width:16px;height:16px}
#community-app .header-forum-trail a{font-size:15px}
#community-app .header-forum-trail [aria-current=page]{font-size:18px}
#community-app .header-forum-trail li+li::before{font-size:16px;margin:0 11px}
#community-app .app-brand span{font-size:22px}
#community-app .app-brand small{font-size:10px}
#community-app .account-link{font-size:14px}

/* Sidebar labels fade in and out like the other hover text. */
.sidebar-hover-label{opacity:1;transition:opacity 200ms ease,display 200ms allow-discrete,overlay 200ms allow-discrete}
.sidebar-hover-label:not(:popover-open){opacity:0}
@starting-style{.sidebar-hover-label:popover-open{opacity:0}}

/* Landmarks strip: a solid, clearly separate inset panel. */
#community-app[data-scene=world] #app-view .location-content-panel>.thread-grid-pagination .location-strip{background:rgb(9 10 11 / .94)!important;border:1px solid rgb(233 179 90 / .22)!important;box-shadow:inset 0 1px 0 rgb(255 255 255 / .04)}

/* Console telemetry readout beside the title; drops out when the bar gets tight. */
#community-app[data-scene=world] #app-view>.dispatch-navigation .dispatch-actions{flex:1 1 auto;min-width:0}
#community-app .dispatch-navigation .location-telemetry{margin:0 auto 0 18px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 12px/1 'Share Tech Mono',Consolas,monospace;letter-spacing:1.2px;color:color-mix(in srgb,var(--theme-cyan,#9fbce4) 70%,#fff 10%);opacity:.8}
@container (max-width:720px){#community-app .dispatch-navigation .location-telemetry{display:none}}

/* Ambient location-map panning is off for now: no location art is authored as a seamless
   looping tile yet. The map shows static, cover-fitted. (Re-enable by removing this block.) */
#community-app[data-scene=world][data-local-map-ready]:not([data-local-map-ready=""]) .world-local-map{animation:none!important;background-size:cover!important;background-repeat:no-repeat!important;background-position:center!important}
#community-app .world-local-map::before{display:none!important;animation:none!important}

/* Thin divider under the POSTING OPTIONS bar, fading out toward both ends. */
#community-app[data-scene=world] #app-view.hz-locpag>.dispatch-navigation::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--theme-cyan,#9fbce4) 75%,#fff) 50%,transparent);opacity:.55}

/* Back / forward: upper-left corner of location + sub-location pages, inside the gold outline. */
#community-app #app-frame>.app-history-controls{display:none;position:absolute;top:34px;left:34px;z-index:8;gap:8px}
#community-app[data-scene=world] #app-frame:has(>#app-view>.location-content-panel):not(:has(>#app-view>.thread-reading-area))>.app-history-controls{display:flex}
#community-app #app-frame>.app-history-controls .app-back-control{width:38px;height:38px;border-radius:50%;background:rgb(8 10 11 / .82);border:1px solid color-mix(in srgb,var(--theme-cyan,#9fbce4) 45%,transparent);color:color-mix(in srgb,var(--theme-cyan,#9fbce4) 70%,#fff);box-shadow:0 3px 10px #0008;transition:background 200ms ease,border-color 200ms ease,color 200ms ease,box-shadow 200ms ease}
#community-app #app-frame>.app-history-controls .app-back-control:is(:hover,:focus-visible):not(:disabled){background:color-mix(in srgb,var(--theme-cyan,#9fbce4) 22%,#0b0f14);border-color:var(--theme-cyan,#9fbce4);color:#fff;box-shadow:0 0 12px color-mix(in srgb,var(--theme-cyan,#9fbce4) 40%,transparent)}
#community-app #app-frame>.app-history-controls .app-back-control:disabled{opacity:.35}

/* Posting options panel (final): translucent throughout. The header bar stays dark; the
   theme's BLUE (--theme-cyan) fades in just under it, where the locations strip and thread
   cards begin, then eases back to dark across the panel's full height (percent stops, so it
   scales with the container). */
#community-app[data-scene=world] #app-view.hz-locpag>.dispatch-navigation{
 background:linear-gradient(180deg,rgb(7 9 12 / .80),color-mix(in srgb,var(--theme-cyan,#9fbce4) 8%,rgb(7 9 12 / .80)))!important;
 border:1px solid color-mix(in srgb,var(--theme-cyan,#9fbce4) 35%,transparent)!important;border-bottom:0!important;container-type:inline-size;
}
#community-app[data-scene=world] #app-view.hz-locpag>.dispatch-navigation::before{color:color-mix(in srgb,var(--theme-cyan,#9fbce4) 75%,#fff)}
#community-app[data-scene=world] #app-view.hz-locpag .location-content-panel>.thread-grid-pagination:not(.dispatch-navigation):not(.dispatch-recycle){
 background:linear-gradient(180deg,color-mix(in srgb,var(--theme-cyan,#9fbce4) 8%,rgb(7 9 12 / .80)) 0%,color-mix(in srgb,var(--theme-cyan,#9fbce4) 26%,rgb(7 9 12 / .66)) 6%,color-mix(in srgb,var(--theme-cyan,#9fbce4) 12%,rgb(7 9 12 / .70)) 40%,rgb(7 9 12 / .74) 100%)!important;
 border:1px solid color-mix(in srgb,var(--theme-cyan,#9fbce4) 35%,transparent)!important;border-top:0!important;
}
#community-app[data-scene=world] #app-view .location-content-panel>.thread-grid-pagination>.thread-list-heading{margin-top:12px!important}

/* Sort & filter popout: top-level movable window, fades in and out. */
#community-app>.browse-popout{position:fixed;z-index:10300;width:360px;max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);overflow:auto;box-sizing:border-box;margin:0;padding:0;
 background:rgb(10 13 17 / .96);border:1px solid color-mix(in srgb,var(--theme-cyan,#9fbce4) 40%,transparent);border-radius:12px;box-shadow:0 14px 40px #000a,0 0 0 1px #0006;
 opacity:1;transition:opacity 200ms ease,translate 200ms ease,display 200ms allow-discrete;translate:0 0}
#community-app>.browse-popout[hidden]{display:none;opacity:0;translate:0 -6px}
@starting-style{#community-app>.browse-popout:not([hidden]){opacity:0;translate:0 -6px}}
#community-app>.browse-popout.is-dragging{transition:none;user-select:none}
#community-app>.browse-popout .browse-popout-bar{display:flex;align-items:center;gap:8px;padding:8px 8px 8px 14px;border-bottom:1px solid rgb(255 255 255 / .07)}
#community-app>.browse-popout .browse-popout-grip{flex:1;text-align:left;background:transparent;border:0;padding:4px 0;cursor:grab;font:700 12px/1 'Segoe UI',sans-serif;letter-spacing:1.6px;text-transform:uppercase;color:color-mix(in srgb,var(--theme-cyan,#9fbce4) 80%,#fff)}
#community-app>.browse-popout.is-dragging .browse-popout-grip{cursor:grabbing}
#community-app>.browse-popout .browse-popout-close{flex:none;width:28px;height:28px;display:grid;place-items:center;background:transparent;border:0;border-radius:6px;color:#9aa7b8;font-size:14px;cursor:pointer;transition:background 150ms ease,color 150ms ease}
#community-app>.browse-popout .browse-popout-close:hover{background:#ffffff12;color:#fff}
#community-app>.browse-popout .forum-browse-controls{display:grid;grid-template-columns:1fr 1fr;gap:12px 12px;margin:0;padding:14px;border:0;background:none;box-shadow:none}
#community-app>.browse-popout .forum-browse-controls label{display:flex;flex-direction:column;gap:5px;min-width:0;font:600 11px/1.2 'Segoe UI',sans-serif;letter-spacing:.6px;text-transform:uppercase;color:#a9b6c6}
#community-app>.browse-popout .forum-browse-controls :is(input,select){width:100%;box-sizing:border-box;padding:7px 9px;border-radius:7px;border:1px solid rgb(255 255 255 / .12);background:#0d1116;color:#e8edf2;font:500 13px 'Segoe UI',sans-serif;text-transform:none;letter-spacing:0}
#community-app>.browse-popout .forum-browse-controls :is(input,select):focus-visible{outline:2px solid color-mix(in srgb,var(--theme-cyan,#9fbce4) 70%,transparent);outline-offset:1px}
#community-app>.browse-popout .forum-browse-controls .app-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:8px;margin:4px 0 0;padding-top:12px;border-top:1px solid rgb(255 255 255 / .07)}
#community-app>.browse-popout .forum-browse-controls .app-actions button{padding:7px 14px;border-radius:7px}
#community-app>.browse-popout .forum-browse-controls .app-actions button[type=submit]{background:color-mix(in srgb,var(--theme-cyan,#9fbce4) 30%,#0d1116);border:1px solid color-mix(in srgb,var(--theme-cyan,#9fbce4) 60%,transparent);color:#fff}
#community-app .location-strip .location-side-items>*{translate:var(--strip-sub,0px) 0;will-change:translate}

/* Panel header: the location's own name, in the theme accent and the DISPATCH brand face. */
#community-app[data-scene=world] #app-view.hz-locpag>.dispatch-navigation::before{content:attr(data-location-title);font:800 18px/1 Consolas,monospace;letter-spacing:3px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45%}

/* Locations carousel: the arrows get their own gutters so they never sit over card text. */
#community-app .location-strip.is-overflowing .location-side-items{margin:0 44px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent);mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent)}
#community-app .location-strip .location-strip-prev{left:9px}
#community-app .location-strip .location-strip-next{right:9px}

/* Posting panel gradient: one continuous darkening from the header down, no light band. */
#community-app[data-scene=world] #app-view.hz-locpag>.dispatch-navigation{background:linear-gradient(180deg,color-mix(in srgb,var(--theme-cyan,#9fbce4) 18%,rgb(7 9 12 / .82)),color-mix(in srgb,var(--theme-cyan,#9fbce4) 15%,rgb(7 9 12 / .82)))!important}
#community-app[data-scene=world] #app-view.hz-locpag .location-content-panel>.thread-grid-pagination:not(.dispatch-navigation):not(.dispatch-recycle){background:linear-gradient(180deg,color-mix(in srgb,var(--theme-cyan,#9fbce4) 15%,rgb(7 9 12 / .82)) 0%,color-mix(in srgb,var(--theme-cyan,#9fbce4) 7%,rgb(7 9 12 / .80)) 45%,rgb(7 9 12 / .80) 100%)!important}
#community-app>.browse-popout .forum-browse-controls .app-actions{flex-wrap:wrap}

/* Posting panel (supersedes the tinted versions above): the site's standard dark page
   background, semi-transparent, deepening toward black at the bottom. It fades in first,
   then the locations strip and page controls follow. */
#community-app[data-scene=world] #app-view.hz-locpag>.dispatch-navigation{
 background:rgb(24 29 32 / .80)!important;border-color:rgb(255 255 255 / .10)!important;
 animation:posting-panel-in 380ms ease-out both;
}
#community-app[data-scene=world] #app-view.hz-locpag .location-content-panel>.thread-grid-pagination:not(.dispatch-navigation):not(.dispatch-recycle){
 position:relative;isolation:isolate;background:none!important;border-color:rgb(255 255 255 / .10)!important;
}
#community-app[data-scene=world] #app-view.hz-locpag .location-content-panel>.thread-grid-pagination:not(.dispatch-navigation):not(.dispatch-recycle)::before{
 content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
 background:linear-gradient(180deg,rgb(24 29 32 / .80) 0%,rgb(14 18 21 / .84) 55%,rgb(5 7 8 / .90) 100%);
 animation:posting-panel-in 380ms ease-out both;
}
#community-app[data-scene=world] #app-view .location-content-panel>.thread-grid-pagination>:is(.location-strip,.thread-list-heading){animation:posting-panel-in 320ms ease-out 180ms both}
@keyframes posting-panel-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){#community-app[data-scene=world] #app-view :is(.dispatch-navigation,.thread-grid-pagination,.thread-grid-pagination::before,.location-strip,.thread-list-heading){animation:none!important}}

/* Thread view on world pages: pinned to the right (same side as the location panel), and
   framed exactly like the posting panel - the heading is the panel header, the posts are
   the panel body, one continuous outlined container. Back/forward sit top-left over the map. */
#community-app[data-scene=world] #app-view.hz-thread>:is(.thread-view-heading,.thread-reading-area:not(.dispatch-navigation)){
 justify-self:end;margin-left:0!important;margin-right:0!important;
 width:min(calc(100% - max(110px, 26px + var(--thread-right-reserve))),2100px)!important;max-width:none!important;box-sizing:border-box;
}
#community-app[data-scene=world] #app-view.hz-thread>.thread-view-heading{
 position:relative;margin-bottom:0!important;border-radius:12px 12px 0 0!important;
 background:rgb(24 29 32 / .80)!important;border:1px solid rgb(255 255 255 / .10)!important;border-bottom:0!important;box-shadow:none!important;
 padding:12px 16px!important;
}
#community-app[data-scene=world] #app-view.hz-thread>.thread-view-heading::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--theme-cyan,#9fbce4) 75%,#fff) 50%,transparent);opacity:.55}
#community-app[data-scene=world] #app-view.hz-thread>.thread-reading-area:not(.dispatch-navigation){
 border-radius:0 0 12px 12px!important;border:1px solid rgb(255 255 255 / .10)!important;border-top:0!important;
 background:linear-gradient(180deg,rgb(24 29 32 / .80) 0%,rgb(14 18 21 / .84) 55%,rgb(5 7 8 / .90) 100%)!important;
 padding:14px 12px 14px 16px!important;
}
#community-app[data-scene=world] #app-frame:has(>#app-view>.thread-reading-area)>.app-history-controls{display:flex}

/* Thread view keeps the world page's gold outline, map inset and surrounding ring. */
#community-app[data-scene=world] #app-frame>#app-view.hz-thread{padding:40px!important}
#community-app[data-scene=world] #app-frame>#app-view.hz-thread::before{content:"";position:absolute;inset:20px;border:2px solid var(--page-outline,rgb(233 179 90));border-radius:18px;pointer-events:none;z-index:6}
#community-app[data-scene=world] #app-frame:has(>#app-view>.thread-reading-area)>.world-frame-ring{display:block}
#community-app[data-scene=world] #app-frame:has(>#app-view>.thread-reading-area)>.app-history-controls{top:34px;left:34px}
#community-app[data-scene=world] #app-view.hz-thread>:is(.thread-view-heading,.thread-reading-area:not(.dispatch-navigation)){margin-right:12px!important}

/* Thread controls (watch / manage / back, and the post pager) use the site theme,
   not the thread's own accent colour. */
#community-app .thread-view-heading .thread-heading-actions,
#community-app .thread-reading-area .thread-post-pager{--thread-frame-accent:var(--theme-cyan,#9fbce4);--thread-accent:var(--theme-cyan,#9fbce4)}
#community-app .thread-reading-area .thread-post-pager :is(button,a){--thread-frame-accent:var(--theme-cyan,#9fbce4)}

/* Post controls: Edit before Quote. */
#community-app .post-controls [data-edit-post]{order:-1}
/* More room between a thread's title and its post count. */
#community-app .thread-view-heading .thread-title-line>h1{margin-right:14px}

/* Accent colour (gold in the default theme) for: back/forward, the DISPATCH wordmark,
   the current crumb in the header trail, and the active sidebar entry. */
#community-app{--ui-accent:var(--color-accent-default,#ffc45b)}
#community-app .app-brand span{color:var(--ui-accent)!important}
#community-app .header-forum-trail [aria-current=page]{color:var(--ui-accent)!important}
#community-app #app-sidebar a[aria-current=page]{color:var(--ui-accent)!important;background:color-mix(in srgb,var(--ui-accent) 16%,transparent)!important;border-color:var(--ui-accent)!important;box-shadow:inset 3px 0 0 var(--ui-accent)}
#community-app #app-frame>.app-history-controls .app-back-control{border-color:color-mix(in srgb,var(--ui-accent) 50%,transparent)!important;color:var(--ui-accent)!important}
#community-app #app-frame>.app-history-controls .app-back-control:is(:hover,:focus-visible):not(:disabled){background:color-mix(in srgb,var(--ui-accent) 20%,#0b0f14)!important;border-color:var(--ui-accent)!important;color:#fff3d6!important;box-shadow:0 0 12px color-mix(in srgb,var(--ui-accent) 40%,transparent)!important}
/* Paging between thread-card pages: the panel, header and locations strip stay put. */
#community-app.world-paging[data-scene=world] #app-view :is(.dispatch-navigation,.thread-grid-pagination,.location-strip,.thread-list-heading),
#community-app.world-paging[data-scene=world] #app-view .thread-grid-pagination::before{animation:none!important}

/* Thread header: subtitle fills the space between the title/pills and the buttons, centred,
   a little larger and brighter so it's actually readable. */
#community-app .thread-view-heading>div:first-child{display:contents}
#community-app .thread-view-heading .thread-view-subtitle{flex:1 1 auto;min-width:0;margin:0 16px!important;text-align:center;font-size:15px!important;line-height:1.35;color:#ece6d8!important;text-shadow:0 1px 2px #000c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#community-app .thread-view-heading .thread-heading-actions{margin-left:0!important}

/* Notifications bell + popout. */
#community-app .notify-bell{position:relative;flex:0 0 auto;align-self:center;display:inline-grid;place-items:center;width:34px;height:34px;margin:0 6px 0 auto;padding:0;border:1px solid #ffffff1f;border-radius:8px;background:transparent;color:#c8cfd2;cursor:pointer;transition:color 180ms ease,border-color 180ms ease,background 180ms ease}
#community-app .notify-bell:is(:hover,:focus-visible,[aria-expanded=true]){color:var(--ui-accent,#ffc45b);border-color:color-mix(in srgb,var(--ui-accent,#ffc45b) 45%,transparent);background:color-mix(in srgb,var(--ui-accent,#ffc45b) 10%,transparent)}
#community-app .notify-bell.has-unread{color:var(--ui-accent,#ffc45b)}
#community-app .notify-bell.has-unread svg{animation:notify-ring 3.2s ease-in-out infinite;transform-origin:50% 8%}
@keyframes notify-ring{0%,86%,100%{rotate:0deg}88%{rotate:14deg}91%{rotate:-11deg}94%{rotate:7deg}97%{rotate:-3deg}}
#community-app .notify-count{position:absolute;top:-5px;right:-6px;min-width:17px;height:17px;padding:0 4px;box-sizing:border-box;border-radius:9px;background:#e0544a;color:#fff;font:800 10px/17px 'Segoe UI',sans-serif;text-align:center;box-shadow:0 0 0 2px #0d1114}
#community-app .notify-bell+.account-link{margin-left:0}
#community-app>.notify-popout{position:fixed;z-index:10300;width:360px;max-width:calc(100vw - 16px);max-height:min(520px,calc(100vh - 90px));overflow:auto;box-sizing:border-box;background:rgb(10 13 17 / .97);border:1px solid color-mix(in srgb,var(--ui-accent,#ffc45b) 35%,transparent);border-radius:12px;box-shadow:0 14px 40px #000a;opacity:1;translate:0 0;transition:opacity 200ms ease,translate 200ms ease,display 200ms allow-discrete}
#community-app>.notify-popout[hidden]{display:none;opacity:0;translate:0 -6px}
@starting-style{#community-app>.notify-popout:not([hidden]){opacity:0;translate:0 -6px}}
#community-app>.notify-popout header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px;border-bottom:1px solid #ffffff12;position:sticky;top:0;background:inherit}
#community-app>.notify-popout header strong{font:700 12px/1 'Segoe UI',sans-serif;letter-spacing:1.6px;text-transform:uppercase;color:var(--ui-accent,#ffc45b)}
#community-app>.notify-popout .notify-clear{padding:5px 10px;border-radius:6px;border:1px solid #ffffff22;background:transparent;color:#c8cfd2;font:600 12px 'Segoe UI',sans-serif;cursor:pointer}
#community-app>.notify-popout .notify-clear:hover{color:#fff;border-color:#ffffff44}
#community-app>.notify-popout ol{list-style:none;margin:0;padding:6px}
#community-app>.notify-popout li a{display:grid;gap:3px;padding:9px 10px;border-radius:8px;color:#dfe5ea;text-decoration:none;transition:background 150ms ease}
#community-app>.notify-popout li a:hover{background:#ffffff0d}
#community-app>.notify-popout .notify-line{font:500 13px/1.35 'Segoe UI',sans-serif}
#community-app>.notify-popout .notify-line b{color:#fff}
#community-app>.notify-popout small{font:500 11px 'Segoe UI',sans-serif;color:#8f9aa6}
#community-app>.notify-popout .notify-empty{margin:0;padding:18px 16px;font:500 13px/1.5 'Segoe UI',sans-serif;color:#9aa6b2}
@media(prefers-reduced-motion:reduce){#community-app .notify-bell.has-unread svg{animation:none}}

/* Wider location panel: room for three thread cards per row (4 rows x 3 at most). */
#community-app[data-scene=world] #app-view .thread-grid-pagination:not(.dispatch-navigation):not(.dispatch-recycle),
#community-app[data-scene=world] #app-view.hz-locpag>.dispatch-navigation{max-width:1650px!important}
#community-app[data-scene=world] #app-view .location-content-panel .thread-grid-pagination>.forum-thread-cards{grid-template-columns:repeat(auto-fill,minmax(470px,1fr))}
/* Post count pill in a thread uses the skin accent, not the thread's colour. */
#community-app .thread-view-heading .thread-total-posts{background:color-mix(in srgb,var(--ui-accent,#ffc45b) 18%,transparent)!important;border-color:color-mix(in srgb,var(--ui-accent,#ffc45b) 60%,transparent)!important;color:var(--ui-accent,#ffc45b)!important}

/* ---- Thread panel refinements ---- */
/* Headers (location title bar and thread title bar) are darker / more solid so they stand
   out from the page; the panel body starts at the same tone and deepens toward the bottom. */
#community-app[data-scene=world] #app-view.hz-locpag>.dispatch-navigation,
#community-app[data-scene=world] #app-view.hz-thread>.thread-view-heading{background:rgb(13 16 19 / .93)!important}
#community-app[data-scene=world] #app-view.hz-locpag .location-content-panel>.thread-grid-pagination:not(.dispatch-navigation):not(.dispatch-recycle)::before{background:linear-gradient(180deg,rgb(13 16 19 / .90) 0%,rgb(14 18 21 / .84) 45%,rgb(5 7 8 / .90) 100%)}
/* Thread body: background on its own layer (same grid cell), posts scroll above it and
   fade out at the top and bottom edges; padding doubled all round. */
#community-app .thread-panel-backdrop{display:none}
#community-app[data-scene=world] #app-view.hz-thread>.thread-panel-backdrop{
 display:block;grid-column:1;grid-row:3;justify-self:end;position:relative;z-index:1;pointer-events:none;
 width:min(calc(100% - max(110px, 26px + var(--thread-right-reserve))),2100px);margin:0 12px 12px 0;box-sizing:border-box;
 background:linear-gradient(180deg,rgb(13 16 19 / .90) 0%,rgb(14 18 21 / .84) 45%,rgb(5 7 8 / .90) 100%);
 border:1px solid rgb(255 255 255 / .10);border-top:0;border-radius:0 0 12px 12px;
}
#community-app[data-scene=world] #app-view.hz-thread>.thread-reading-area:not(.dispatch-navigation){
 background:none!important;border-color:transparent!important;z-index:2;
 padding:28px 24px 64px 32px!important;
 -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 24px,#000 calc(100% - 64px),transparent 100%);
 mask-image:linear-gradient(180deg,transparent 0,#000 24px,#000 calc(100% - 64px),transparent 100%);
}
#community-app[data-scene=world] #app-view.hz-thread>.thread-view-heading{padding:22px 32px!important}
/* While the panel expands into place, its real backgrounds stay hidden (the travelling shell
   is drawing them); contents are free to fade in over it. */
#community-app #app-view.thread-morphing>.thread-view-heading{background:transparent!important;border-color:transparent!important}
#community-app #app-view.thread-morphing>.thread-view-heading::after{opacity:0}
#community-app #app-view.thread-morphing>.thread-panel-backdrop{opacity:0}
/* Pagers: top one sits in the header before the watch icon; bottom one is compact, bottom-left. */
#community-app .thread-reading-area>.thread-post-pager{display:flex;justify-content:flex-start;margin:22px 0 0!important}
#community-app .thread-reading-area>.thread-post-pager .collection-pages{display:inline-flex;width:auto;gap:12px;padding:6px 8px!important;border:1px solid rgb(255 255 255 / .10)!important;border-radius:9px!important;background:rgb(13 16 19 / .8)!important}
#community-app .thread-heading-actions>.thread-post-pager.in-heading{margin:0 6px 0 0!important}
#community-app .thread-heading-actions>.thread-post-pager.in-heading .collection-pages{display:inline-flex;gap:8px;margin:0;padding:0!important;border:0!important;background:none!important}
#community-app :is(.thread-heading-actions,.thread-reading-area) .thread-post-pager .collection-pages button{height:34px;padding:0 12px;border-radius:9px;border:1px solid color-mix(in srgb,var(--theme-cyan,#9fbce4) 40%,#ffffff14);background:color-mix(in srgb,var(--theme-cyan,#9fbce4) 10%,#171b1d);color:#e6e2d8;font:600 12px 'Segoe UI',sans-serif;cursor:pointer;transition:background 150ms ease,border-color 150ms ease}
#community-app :is(.thread-heading-actions,.thread-reading-area) .thread-post-pager .collection-pages button:hover:not(:disabled){background:color-mix(in srgb,var(--theme-cyan,#9fbce4) 24%,#171b1d);border-color:var(--theme-cyan,#9fbce4);color:#fff}
#community-app :is(.thread-heading-actions,.thread-reading-area) .thread-post-pager .collection-pages button:disabled{opacity:.35;cursor:default}
#community-app :is(.thread-heading-actions,.thread-reading-area) .thread-post-pager .collection-pages span{font:600 11px Consolas,monospace;letter-spacing:1px;color:#b9c3cc;white-space:nowrap}

/* Characters: cards grow so a row never holds more than four. */
#community-app .cast-grid{grid-template-columns:repeat(auto-fill,minmax(max(360px,calc((100% - 48px) / 4)),1fr))}
/* Thread panel: header and body backdrop share one right edge, and swap their backgrounds
   in and out together (no lagging transition on the header). */
#community-app[data-scene=world] #app-view.hz-thread>.thread-panel-backdrop{margin-right:12px!important;margin-left:0!important}
#community-app[data-scene=world] #app-view.hz-thread>.thread-view-heading{transition:none!important}
/* Location panel while a thread collapses back into it: the travelling shell draws the
   panel, so the real one hides its backgrounds until the shell lands. */
#community-app #app-view.panel-morphing>.dispatch-navigation{background:transparent!important;border-color:transparent!important;animation:none!important}
#community-app #app-view.panel-morphing>.dispatch-navigation::after{opacity:0}
#community-app #app-view.panel-morphing .location-content-panel>.thread-grid-pagination{border-color:transparent!important}
#community-app #app-view.panel-morphing .location-content-panel>.thread-grid-pagination::before{opacity:0;animation:none!important}
#community-app #app-view.panel-morphing .location-content-panel>.thread-grid-pagination>*{animation:none!important}

/* Character cards keep one width regardless of which filters are on (a page layout template
   could centre them at their content width) and never exceed four per row. */
html body #community-app #app-view #character-cards.cast-grid{grid-template-columns:repeat(auto-fill,minmax(max(360px,calc((100% - 48px) / 4)),1fr))!important;justify-items:stretch!important}
/* Back / forward fade in and out with the location pages instead of popping. */
#community-app #app-frame>.app-history-controls{display:flex!important;opacity:0;visibility:hidden;pointer-events:none;transition:opacity 420ms ease,visibility 0s linear 420ms}
#community-app[data-scene=world] #app-frame:has(>#app-view>.location-content-panel)>.app-history-controls,
#community-app[data-scene=world] #app-frame:has(>#app-view>.thread-reading-area)>.app-history-controls{opacity:1;visibility:visible;pointer-events:auto;transition:opacity 420ms ease 150ms,visibility 0s}
/* Carousel arrows vanish at their own end of the strip. */
#community-app .location-strip .location-strip-arrow{transition:opacity 220ms ease,background .15s ease,border-color .15s ease,color .15s ease}
#community-app .location-strip .location-strip-arrow.is-hidden{opacity:0;pointer-events:none}

/* Travelling thread panel: its header band (a copy of the thread header) grows with it. */
#community-app>.thread-morph-snapshot{display:flex;flex-direction:column}
#community-app>.thread-morph-snapshot>.morph-head-band{position:relative;flex:none;overflow:hidden;background:rgb(13 16 19 / .93);border-radius:12px 12px 0 0}
#community-app>.thread-morph-snapshot>.morph-head-band::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--theme-cyan,#9fbce4) 75%,#fff) 50%,transparent);opacity:.55}
#community-app>.thread-morph-snapshot>.morph-head-band>.thread-view-heading{display:flex;align-items:center;gap:16px;box-sizing:border-box;width:100%;height:100%;margin:0;padding:22px 32px;background:none;border:0;box-shadow:none;opacity:1}
/* "Last post" area of a thread card: hovering it says "you'll land on the latest post" -
   it glows, and the rest of the card dims so it reads as the target. */
#community-app .dispatch-thread-card .thread-latest[data-latest-path]{cursor:pointer;transition:box-shadow 220ms ease,filter 220ms ease}
#community-app .dispatch-thread-card .thread-latest[data-latest-path]:is(:hover,:focus-visible){box-shadow:0 0 0 1px var(--thread-accent),0 0 14px color-mix(in srgb,var(--thread-accent) 45%,transparent)}
#community-app .dispatch-thread-card>*{transition:filter 200ms ease}
#community-app .dispatch-thread-card.hv-latest>:not(.thread-latest):not(:has(.thread-latest)){filter:brightness(.6)}
#community-app .dispatch-thread-card.hv-latest .thread-card-title{color:inherit}
#community-app .dispatch-thread-card .thread-latest[data-latest-path]::after{content:"JUMP TO LATEST ›";position:absolute;top:8px;right:9px;z-index:2;padding:3px 7px;border-radius:5px;background:rgb(0 0 0 / .65);color:var(--thread-accent);font:700 9px/1.2 Consolas,monospace;letter-spacing:1px;opacity:0;translate:0 -3px;transition:opacity 200ms ease,translate 200ms ease;pointer-events:none}
#community-app .dispatch-thread-card .thread-latest[data-latest-path]:is(:hover,:focus-visible)::after{opacity:1;translate:0 0}
/* Travelling panel = exact copy of the real panel's look (header band + body). */
#community-app>.thread-morph-snapshot>.morph-head-band{background:rgb(13 16 19 / .93);border:1px solid rgb(255 255 255 / .10);border-bottom:0}
#community-app>.thread-morph-snapshot>.morph-body{flex:1 1 auto;min-height:0;background:linear-gradient(180deg,rgb(13 16 19 / .90) 0%,rgb(14 18 21 / .84) 45%,rgb(5 7 8 / .90) 100%);border:1px solid rgb(255 255 255 / .10);border-top:0;border-radius:0 0 12px 12px}
/* Thread body: less dead space at the bottom; bottom pager hidden on desktop (the header one
   covers it; kept in the markup for a future mobile layout). */
#community-app[data-scene=world] #app-view.hz-thread>.thread-reading-area:not(.dispatch-navigation){padding-bottom:28px!important;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 24px,#000 calc(100% - 36px),transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 24px,#000 calc(100% - 36px),transparent 100%)}
@media(min-width:651px){#community-app .thread-reading-area>.thread-post-pager{display:none!important}}

/* ---- Narrow thread columns: posts collapse sensibly ----
   When the reading column gets narrow, the side profile turns into a compact header strip
   across the top of the post (small portrait, name, affiliations) and the post text gets
   the full width - instead of a tall sidebar squeezing the text to a word per line. */
#community-app .thread-reading-area{container:thread-reading/inline-size}
@container thread-reading (max-width: 900px){
 #community-app .thread-reading-area .forum-post{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto!important}
 #community-app .thread-reading-area .forum-post>.post-author{grid-column:1!important;grid-row:1!important;display:grid!important;grid-template-columns:64px minmax(0,1fr) auto;align-items:center;column-gap:14px;row-gap:4px;padding:12px 16px!important;min-height:0!important;height:auto!important;border:0!important;border-bottom:1px solid rgb(255 255 255 / .08)!important}
 #community-app .thread-reading-area .forum-post>.post-author .post-portrait-reveal{grid-column:1;grid-row:1/3;width:64px!important;height:64px!important;margin:0!important;overflow:hidden;border-radius:8px}
 #community-app .thread-reading-area .forum-post>.post-author .post-portrait-reveal img{width:100%!important;height:100%!important;object-fit:cover;object-position:50% 20%;margin:0!important}
 #community-app .thread-reading-area .forum-post>.post-author .post-identity{grid-column:2;grid-row:1/3;min-width:0;margin:0!important;text-align:left!important}
 #community-app .thread-reading-area .forum-post>.post-author .post-memberships{grid-column:3;grid-row:1/3;margin:0!important;justify-content:flex-end}
 #community-app .thread-reading-area .forum-post>.post-body{grid-column:1!important;grid-row:2!important}
}
@container thread-reading (max-width: 560px){
 #community-app .thread-reading-area .forum-post>.post-author{grid-template-columns:52px minmax(0,1fr)}
 #community-app .thread-reading-area .forum-post>.post-author .post-portrait-reveal{width:52px!important;height:52px!important}
 #community-app .thread-reading-area .forum-post>.post-author .post-memberships{grid-column:2;grid-row:3;justify-content:flex-start}
}

/* ---- Minimum page width (desktop) ----
   Below 1200px the app stops squeezing and the page scrolls sideways instead. */
@media (max-width:1199px) and (min-width:651px){
 html{overflow-x:auto!important;overflow-y:hidden!important}
 body{overflow:visible!important;min-width:1200px;min-height:50vh}
 /* The app stays fixed to the viewport's height; sideways page scroll slides it left. */
 #community-app{position:fixed!important;top:0!important;bottom:0!important;right:auto!important;left:calc(-1 * var(--page-scroll-x,0px))!important;width:1200px!important;min-width:1200px;height:auto!important}
}

/* Post layout, after the reference forum: comfortable reading measure (post text capped
   around 820px and centred in wide posts), the portrait stays in view while reading a long
   post, and the compact header strip gets a slightly larger square portrait. */
#community-app .thread-reading-area .forum-post>.post-body>.forum-rich{max-width:820px;margin-inline:auto}
#community-app .thread-reading-area .forum-post>.post-author .post-portrait-reveal{position:sticky;top:12px;z-index:1}
@container thread-reading (max-width: 900px){
 #community-app .thread-reading-area .forum-post>.post-author{grid-template-columns:84px minmax(0,1fr) auto}
 #community-app .thread-reading-area .forum-post>.post-author .post-portrait-reveal{position:static;width:84px!important;height:84px!important}
}
@container thread-reading (max-width: 560px){
 #community-app .thread-reading-area .forum-post>.post-author{grid-template-columns:60px minmax(0,1fr)}
 #community-app .thread-reading-area .forum-post>.post-author .post-portrait-reveal{width:60px!important;height:60px!important}
}

/* ---- Section changes: frame background and World map cross-fade ---- */
#community-app #app-frame{background:transparent!important}
#community-app #app-frame>.frame-fill{position:absolute;inset:0;border-radius:4px;pointer-events:none;background:radial-gradient(at 30% 0,#1c2225,#0b0f12 80%);opacity:1;transition:opacity 480ms ease}
#community-app[data-scene=world] #app-frame>.frame-fill{opacity:0}
/* The map and its surrounding ring stay rendered just long enough to be covered by the fill
   when leaving the World, instead of vanishing the instant the scene changes. */
#community-app .world-backdrop{display:block!important;visibility:hidden;transition:visibility 0s linear 500ms}
#community-app[data-scene=world] .world-backdrop{visibility:visible;transition:none}
#community-app[data-scene=world][data-world-location=overview] .world-backdrop{visibility:hidden}
#community-app #app-frame>.world-frame-ring{display:block!important;visibility:hidden;transition:visibility 0s linear 500ms}
#community-app[data-scene=world] #app-frame>.world-frame-ring{visibility:visible;transition:none}
@media(prefers-reduced-motion:reduce){#community-app #app-frame>.frame-fill{transition:none}}

/* ================= Bookmarks ================= */
/* Trail button: filled when saved. */
#community-app .page-bookmark[aria-pressed=true]{color:var(--ui-accent,#ffc45b);border-color:color-mix(in srgb,var(--ui-accent,#ffc45b) 45%,transparent)}
#community-app .page-bookmark[aria-pressed=true] svg path{fill:currentColor}
/* Sidebar count badge. */
#community-app #sidebar-links .bookmarks-menu{position:relative}
#community-app #sidebar-links .bookmarks-menu-count{margin-left:auto;min-width:18px;height:18px;padding:0 5px;box-sizing:border-box;border-radius:9px;background:color-mix(in srgb,var(--ui-accent,#ffc45b) 22%,#15181b);color:var(--ui-accent,#ffc45b);font:700 10px/18px 'Segoe UI',sans-serif;text-align:center}
#community-app.sidebar-collapsed #sidebar-links .bookmarks-menu-count{position:absolute;top:4px;right:4px;min-width:14px;height:14px;font-size:8px;line-height:14px;padding:0 3px}
/* Toast. */
#community-app .bookmark-toast{position:fixed;z-index:10400;padding:7px 12px;border-radius:8px;background:rgb(10 13 17 / .96);border:1px solid color-mix(in srgb,var(--ui-accent,#ffc45b) 45%,transparent);color:#f3ead8;font:600 12px 'Segoe UI',sans-serif;box-shadow:0 8px 20px #0009;pointer-events:none;opacity:0;translate:0 -4px;transition:opacity 200ms ease,translate 200ms ease}
#community-app .bookmark-toast.visible{opacity:1;translate:0 0}
/* Panel. */
#community-app .bookmarks-dialog{width:min(760px,calc(100vw - 32px));max-height:min(80vh,820px);padding:0;display:flex;flex-direction:column;overflow:hidden;background:rgb(12 15 18 / .97);color:#ece6da;border:1px solid color-mix(in srgb,var(--ui-accent,#ffc45b) 30%,transparent);border-radius:14px;box-shadow:0 24px 60px #000c;opacity:1;scale:1;transition:opacity 180ms ease,scale 180ms ease}
#community-app .bookmarks-dialog:not([open]){display:none}
@starting-style{#community-app .bookmarks-dialog[open]{opacity:0;scale:.98}}
#community-app .bookmarks-dialog.is-closing{opacity:0;scale:.98}
#community-app .bookmarks-dialog::backdrop{background:rgb(4 6 8 / .6);backdrop-filter:blur(2px)}
#community-app .bookmarks-dialog>header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 22px 12px}
#community-app .bookmarks-dialog h2{margin:0 0 4px;font:800 18px/1.1 Consolas,monospace;letter-spacing:3px;text-transform:uppercase;color:var(--ui-accent,#ffc45b)}
#community-app .bookmarks-dialog header small{color:#9aa4ae;font:500 12px 'Segoe UI',sans-serif}
#community-app .bookmarks-dialog .close-bookmarks{width:32px;height:32px;border-radius:8px;border:1px solid #ffffff1c;background:transparent;color:#cfd6dc;font-size:20px;line-height:1;cursor:pointer}
#community-app .bookmarks-dialog .close-bookmarks:hover{background:#ffffff10;color:#fff}
#community-app .bookmarks-tools{display:flex;flex-direction:column;gap:10px;padding:0 22px 12px;border-bottom:1px solid #ffffff10}
#community-app .bookmarks-search{display:flex;align-items:center;gap:8px;padding:0 10px;border:1px solid #ffffff1c;border-radius:8px;background:#0b0e11;color:#8f9aa6}
#community-app .bookmarks-search input{flex:1;min-width:0;padding:8px 0;border:0;background:none;color:#eef2f5;font:500 13px 'Segoe UI',sans-serif;outline:none}
#community-app .bookmarks-search:focus-within{border-color:color-mix(in srgb,var(--ui-accent,#ffc45b) 60%,transparent)}
#community-app .bookmarks-dialog nav{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;background:none}
#community-app .bookmarks-dialog nav button{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;border:1px solid #ffffff1c;background:transparent;color:#c9d1d8;font:600 12px 'Segoe UI',sans-serif;cursor:pointer;transition:background 150ms ease,color 150ms ease,border-color 150ms ease}
#community-app .bookmarks-dialog nav button span{font-size:10px;opacity:.7}
#community-app .bookmarks-dialog nav button[aria-pressed=true]{background:var(--ui-accent,#ffc45b);border-color:var(--ui-accent,#ffc45b);color:#1b1408}
#community-app .bookmark-list{overflow:auto;padding:8px 22px 20px;scrollbar-width:thin}
#community-app .bookmark-list section{margin-top:12px}
#community-app .bookmark-list h3{display:flex;align-items:center;gap:8px;margin:0 0 6px;font:700 11px/1 'Segoe UI',sans-serif;letter-spacing:1.6px;text-transform:uppercase;color:#8f9aa6}
#community-app .bookmark-list h3 span{font-weight:600;opacity:.7}
#community-app .bookmark-list ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
#community-app .bookmark-card{display:flex;align-items:center;gap:10px;padding:6px 8px 6px 6px;border-radius:10px;border:1px solid #ffffff0e;background:#ffffff05;transition:background 150ms ease,border-color 150ms ease}
#community-app .bookmark-card:hover{background:#ffffff0b;border-color:color-mix(in srgb,var(--bm-color,var(--ui-accent,#ffc45b)) 40%,transparent)}
#community-app .bookmark-open{display:flex;align-items:center;gap:12px;flex:1;min-width:0;color:inherit;text-decoration:none}
#community-app .bookmark-thumb{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:8px;overflow:hidden;background:#0b0e11;color:color-mix(in srgb,var(--bm-color,var(--ui-accent,#ffc45b)) 80%,#fff);border:1px solid color-mix(in srgb,var(--bm-color,#ffffff) 30%,transparent)}
#community-app .bookmark-thumb img{width:100%;height:100%;object-fit:cover;object-position:50% 25%}
#community-app .bookmark-text{display:grid;gap:2px;min-width:0}
#community-app .bookmark-text strong{display:flex;align-items:center;gap:8px;font:700 14px/1.25 'Segoe UI',sans-serif;color:#f4efe5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#community-app .bookmark-text small{font:500 12px 'Segoe UI',sans-serif;color:#b7c0c8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#community-app .bookmark-text em{font:500 11px 'Segoe UI',sans-serif;font-style:normal;color:#8a959f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#community-app .bookmark-new{font:800 9px/1 Consolas,monospace;font-style:normal;letter-spacing:1px;padding:2px 5px;border-radius:4px;background:#e0544a;color:#fff}
#community-app .bookmark-side{display:flex;align-items:center;gap:8px;flex:none;color:#7f8a94;font:500 11px 'Segoe UI',sans-serif}
#community-app .bookmark-side button{width:28px;height:28px;border-radius:7px;border:0;background:transparent;color:#9aa4ae;font-size:18px;cursor:pointer}
#community-app .bookmark-side button:hover{background:#e0544a22;color:#ff8a80}
#community-app .bookmark-owned{font:700 9px/1 Consolas,monospace;letter-spacing:1.2px;padding:3px 6px;border-radius:4px;border:1px solid color-mix(in srgb,var(--ui-accent,#ffc45b) 50%,transparent);color:var(--ui-accent,#ffc45b)}
#community-app .bookmarks-empty{margin:24px 0;color:#9aa4ae;font:500 13px/1.5 'Segoe UI',sans-serif;text-align:center}
/* Card toggles (thread, character and location cards). Hidden until the card is hovered,
   always shown once saved. */
#community-app :is(.dispatch-thread-card,.cast-card,.location-side-card){position:relative}
#community-app .card-bookmark{position:absolute;top:8px;right:8px;z-index:6;display:grid;place-items:center;width:28px;height:28px;padding:0;border-radius:7px;border:1px solid #ffffff26;background:rgb(8 10 12 / .75);color:#dfe5ea;cursor:pointer;opacity:0;transition:opacity 180ms ease,color 150ms ease,background 150ms ease,border-color 150ms ease}
#community-app .card-bookmark svg{width:15px;height:15px}
#community-app :is(.dispatch-thread-card,.cast-card,.location-side-card):is(:hover,:focus-within)>.card-bookmark,#community-app .card-bookmark[aria-pressed=true]{opacity:1}
#community-app .card-bookmark[aria-pressed=true]{color:var(--ui-accent,#ffc45b);border-color:color-mix(in srgb,var(--ui-accent,#ffc45b) 50%,transparent)}
#community-app .card-bookmark[aria-pressed=true] svg path{fill:currentColor}
#community-app .card-bookmark:hover:not(:disabled){background:rgb(8 10 12 / .95);border-color:var(--ui-accent,#ffc45b)}
#community-app .card-bookmark:disabled{cursor:default}
#community-app .location-side-card>.card-bookmark{top:6px;right:6px;width:24px;height:24px}
#community-app .dispatch-thread-card .thread-latest[data-latest-path]::after{right:auto;left:9px}

/* ================= "Post as" character picker ================= */
#community-app .post-as-picker{margin:0 0 14px;padding:0;border:0;min-width:0}
#community-app .post-as-picker legend{margin:0 0 8px;padding:0;font:700 11px/1 'Segoe UI',sans-serif;letter-spacing:1.6px;text-transform:uppercase;color:#9aa6b2}
#community-app .post-as-options{display:flex;flex-wrap:wrap;gap:8px}
#community-app .post-as-option{position:relative;display:flex;align-items:center;gap:10px;min-width:0;padding:6px 14px 6px 6px;border-radius:12px;border:1px solid #ffffff1a;background:#ffffff06;cursor:pointer;transition:border-color 160ms ease,background 160ms ease,box-shadow 160ms ease,opacity 160ms ease}
#community-app .post-as-option input{position:absolute;opacity:0;pointer-events:none}
#community-app .post-as-portrait{flex:none;width:40px;height:40px;border-radius:9px;overflow:hidden;background:color-mix(in srgb,var(--character-color) 25%,#0b0e11);border:2px solid color-mix(in srgb,var(--character-color) 55%,transparent)}
#community-app .post-as-portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
#community-app .post-as-text{display:grid;gap:1px;min-width:0}
#community-app .post-as-text strong{font:700 13px/1.2 'Segoe UI',sans-serif;color:#eef1f3;white-space:nowrap}
#community-app .post-as-text small{font:400 13px/1.1 'Clarity City','Overpass','Segoe UI',sans-serif;color:var(--character-color);white-space:nowrap}
#community-app .post-as-picker:not(.is-single) .post-as-option:not(:has(input:checked)){opacity:.62}
#community-app .post-as-option:hover{opacity:1!important;background:#ffffff0c}
#community-app .post-as-option:has(input:checked){border-color:var(--character-color);background:color-mix(in srgb,var(--character-color) 12%,transparent);box-shadow:0 0 12px color-mix(in srgb,var(--character-color) 30%,transparent)}
#community-app .post-as-option:has(input:focus-visible){outline:2px solid var(--character-color);outline-offset:2px}
#community-app .post-as-picker.is-single .post-as-option{cursor:default}
#community-app .post-as-empty{margin:0 0 12px;color:#c9a27a;font:500 13px 'Segoe UI',sans-serif}

/* Characters: "New character" sits at the top of the filter sidebar; drafts are tagged. */
#community-app .cast-new{display:grid;gap:8px;margin:0 0 18px;padding:0 0 16px;border-bottom:1px solid #ffffff12}
#community-app .cast-new button{padding:10px 14px;border-radius:9px;border:1px solid var(--ui-accent,#ffc45b);background:color-mix(in srgb,var(--ui-accent,#ffc45b) 16%,#14171a);color:#fff1d2;font:700 14px 'Segoe UI',sans-serif;letter-spacing:.4px;cursor:pointer;transition:background 160ms ease,box-shadow 160ms ease}
#community-app .cast-new button:hover{background:color-mix(in srgb,var(--ui-accent,#ffc45b) 28%,#14171a);box-shadow:0 0 12px color-mix(in srgb,var(--ui-accent,#ffc45b) 35%,transparent)}
#community-app .cast-new a{font:600 12px 'Segoe UI',sans-serif;color:#b9c3cc;text-decoration:underline;text-decoration-color:#ffffff33;text-underline-offset:3px}
#community-app .cast-new a:hover{color:#fff}
#community-app .cast-status-tag{justify-self:center;align-self:center;display:inline-block;margin:0 0 6px;padding:3px 9px;border-radius:5px;font:800 10px/1.2 Consolas,monospace;letter-spacing:1.4px;text-transform:uppercase}
#community-app .cast-status-tag.is-draft{border:1px dashed #c9b27a;color:#e8d4a2;background:#c9b27a14}
#community-app .cast-status-tag.is-pending{border:1px solid #7fb1e6;color:#b9d8ff;background:#7fb1e61a}
#community-app .cast-status-tag.is-changes{border:1px solid #e0544a;color:#ff9c93;background:#e0544a1a}
#community-app .cast-card.is-draft{border-style:dashed}
#community-app .cast-card.is-draft .character-card-portrait{filter:saturate(.55)}

/* ================= Site Events newspaper: roomier front page =================
   Wider sheet, a real lead story (two columns wide, two rows tall, big picture) with four
   smaller stories around it, larger type, and more air between columns. */
#community-app .event-newspaper{max-width:1640px;width:calc(100% - 80px);margin:26px auto 40px;padding:40px 52px 28px;box-sizing:border-box}
#community-app .event-newspaper .newspaper-masthead h2{font-size:clamp(46px,5.2vw,86px)}
#community-app .newspaper-grid.event-edition-grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:auto;gap:0;margin-top:26px}
#community-app .event-edition-grid .news-teaser{padding:18px 26px 28px;border-right:1px solid #746f5855;border-bottom:1px solid #746f5855}
#community-app .event-edition-grid .news-teaser:nth-child(n){grid-column:auto}
#community-app .event-edition-grid .news-teaser:first-child{grid-column:1 / span 2;grid-row:span 2}
#community-app .event-edition-grid .news-teaser:nth-child(3),#community-app .event-edition-grid .news-teaser:nth-child(5){border-right:0}
#community-app .event-edition-grid .news-teaser h3{font-size:25px;line-height:1.15;margin:10px 0 14px}
#community-app .event-edition-grid .news-teaser:first-child h3{font-size:clamp(34px,3.2vw,52px);line-height:1.05}
#community-app .event-edition-grid .news-teaser img{height:170px}
#community-app .event-edition-grid .news-teaser:first-child img{height:clamp(260px,24vw,420px)}
#community-app .event-edition-grid .news-teaser p{font:15px/1.65 Georgia,serif}
#community-app .event-edition-grid .news-teaser:first-child p{font-size:18px;line-height:1.7;column-count:2;column-gap:28px}
/* Fewer than five stories: let the lead and the rest share the row sensibly. */
#community-app .event-edition-grid:not(:has(.news-teaser:nth-child(4))) .news-teaser:first-child{grid-row:auto}
#community-app .event-edition-grid:not(:has(.news-teaser:nth-child(2))) .news-teaser:first-child{grid-column:1 / -1}
@media (max-width:1199px){
 #community-app .newspaper-grid.event-edition-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 #community-app .event-edition-grid .news-teaser:first-child{grid-column:1 / -1;grid-row:auto}
 #community-app .event-edition-grid .news-teaser:nth-child(2){border-right:1px solid #746f5855}
 #community-app .event-edition-grid .news-teaser:nth-child(3){border-right:0}
 #community-app .event-edition-grid .news-teaser:first-child p{column-count:1}
}
/* Feature article view gets the same extra room. */
#community-app .event-newspaper.newspaper-open .newspaper-story{padding:12px 40px 40px}
#community-app .event-newspaper.newspaper-open .news-body{font-size:17px;line-height:1.75}
/* Header keeps its desktop order (brand, trail, bell, profile) at every desktop width. */
@media (min-width:651px){#community-app .app-header>nav.header-forum-trail{order:0!important}}

/* Character review (staff) */
#community-app .cast-review-toggle{padding:7px 12px;border-radius:8px;border:1px solid #7fb1e6;background:#7fb1e614;color:#cfe3ff;font:700 12px 'Segoe UI',sans-serif;cursor:pointer;display:flex;align-items:center;justify-content:space-between}
#community-app .cast-review-toggle span{min-width:20px;padding:1px 6px;border-radius:9px;background:#7fb1e6;color:#0c1420;font-size:11px;text-align:center}
#community-app .cast-review-toggle[aria-pressed=true]{background:#7fb1e633;border-color:#b9d8ff}
#community-app .cast-review{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px dashed #7fb1e655}
#community-app .cast-review small{flex:1 1 100%;color:#9fb6cf;font:600 11px 'Segoe UI',sans-serif}
#community-app .cast-review button{flex:1;padding:6px 10px;border-radius:7px;font:700 12px 'Segoe UI',sans-serif;cursor:pointer}
#community-app .cast-review [data-review-approve]{border:1px solid #5fbf7f;background:#5fbf7f22;color:#c8f2d4}
#community-app .cast-review [data-review-approve]:hover{background:#5fbf7f44}
#community-app .cast-review [data-review-changes]{border:1px solid #e0544a;background:#e0544a18;color:#ffc2bc}
#community-app .cast-review [data-review-changes]:hover{background:#e0544a33}
#community-app .cast-review-note{margin-top:10px;padding:8px 10px;border-radius:8px;border:1px solid #e0544a55;background:#e0544a12}
#community-app .cast-review-note strong{display:block;font:700 10px Consolas,monospace;letter-spacing:1.2px;text-transform:uppercase;color:#ff9c93}
#community-app .cast-review-note p{margin:4px 0 0;font:500 12px/1.45 'Segoe UI',sans-serif;color:#f1dcd9}
/* Page settings: role access mapping */
#community-app .permission-map-form{display:grid;gap:12px;min-width:240px}
#community-app .permission-map-form fieldset{margin:0;padding:10px 12px;border:1px solid #ffffff1a;border-radius:8px;display:grid;gap:6px}
#community-app .permission-map-form legend{padding:0 4px;font:700 12px 'Segoe UI',sans-serif;color:var(--ui-accent,#ffc45b)}
#community-app .permission-map-form p{margin:0;font-size:11px}
#community-app .permission-map-form label{display:flex;align-items:center;gap:8px;font:500 13px 'Segoe UI',sans-serif;color:#dfe5ea}

/* ---- Handbook components (hb-*): used by Character Creation, available to any chapter.
   The handbook editor keeps any class starting with hb-. ---- */
#community-app .handbook-prose .hb-lead{font-size:17px!important;line-height:1.7!important;color:#ece6da!important;margin:4px 0 22px!important;max-width:74ch}
#community-app .handbook-prose .hb-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 30px}
#community-app .handbook-prose .hb-fact{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid rgb(var(--gb1) / .22);border-radius:10px;background:linear-gradient(180deg,rgb(var(--gb1) / .08),rgb(var(--gb1) / .02))}
#community-app .handbook-prose .hb-fact-num{flex:0 0 auto;min-width:2.1ch;font:400 38px/1 'Bebas Neue','Arial Narrow',sans-serif!important;color:rgb(var(--gb1))!important;letter-spacing:.02em;text-align:center}
#community-app .handbook-prose .hb-fact-label{font-size:13px;line-height:1.45;color:#cfcabe}
#community-app .handbook-prose .hb-steps{position:relative;display:grid;gap:12px;margin:6px 0 34px;counter-reset:none}
#community-app .handbook-prose .hb-steps::before{content:"";position:absolute;left:25px;top:18px;bottom:18px;width:2px;background:linear-gradient(rgb(var(--gb1) / .45),rgb(var(--gb1) / .08))}
#community-app .handbook-prose .hb-step{position:relative;display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:18px;padding:16px 18px 6px 0;border-radius:12px;transition:background-color .25s ease}
#community-app .handbook-prose .hb-step:hover{background:rgb(255 255 255 / .025)}
#community-app .handbook-prose .hb-step>*:not(.hb-step-num){grid-column:2}
#community-app .handbook-prose .hb-step-num{grid-column:1;grid-row:1 / span 4;position:relative;z-index:1;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#15191c;border:2px solid rgb(var(--gb1) / .7);box-shadow:0 0 0 4px #15191c,0 0 18px rgb(var(--gb1) / .18);font:400 22px/1 'Bebas Neue','Arial Narrow',sans-serif;color:rgb(var(--gb1));letter-spacing:.04em}
#community-app[data-scene] .guide-layout .handbook-prose .hb-step h4{margin:4px 0 8px!important;padding:0!important;font:400 22px/1.15 'Bebas Neue','Arial Narrow',sans-serif!important;letter-spacing:.05em;text-transform:uppercase;color:#f1ebdf!important;border:0}
#community-app[data-scene] .guide-layout .handbook-prose .hb-step p{margin:0 0 10px}
#community-app[data-scene] .guide-layout .handbook-prose .hb-staff{display:inline-block;margin:2px 0 12px!important;padding:7px 12px;border-radius:8px;background:rgb(var(--gb1) / .07);border:1px dashed rgb(var(--gb1) / .3);font-size:13px!important;line-height:1.5!important;color:#d9d3c6!important}
#community-app[data-scene] .guide-layout .handbook-prose .hb-staff strong{color:rgb(var(--gb1));text-transform:uppercase;font-size:11px;letter-spacing:.1em;margin-right:4px}
#community-app .handbook-prose .hb-table{width:100%;border-collapse:separate;border-spacing:0;margin:4px 0 32px;font-size:14px;line-height:1.55;border:1px solid rgb(var(--gb1) / .2);border-radius:10px;overflow:hidden}
#community-app .handbook-prose .hb-table th{text-align:left;padding:11px 14px;background:rgb(var(--gb1) / .12);color:rgb(var(--gb1));font:600 11px/1.2 'Segoe UI',sans-serif;letter-spacing:.12em;text-transform:uppercase;border-bottom:1px solid rgb(var(--gb1) / .25)}
#community-app .handbook-prose .hb-table td{padding:12px 14px;vertical-align:top;color:#d6d2c8;border-top:1px solid rgb(255 255 255 / .06)}
#community-app .handbook-prose .hb-table tbody tr:nth-child(odd) td{background:rgb(255 255 255 / .02)}
#community-app .handbook-prose .hb-table tbody tr:hover td{background:rgb(var(--gb1) / .05)}
#community-app .handbook-prose .hb-table td:first-child{width:17%;white-space:nowrap}
#community-app .handbook-prose .hb-table td:last-child{width:30%;color:#b9b4a8;font-style:italic}
#community-app .handbook-prose .hb-scale{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:6px 0 16px}
#community-app .handbook-prose .hb-band{--k:.2;display:flex;flex-direction:column;gap:4px;padding:14px 12px 13px;border-radius:8px;background:rgb(var(--gb1) / calc(var(--k) * .35));border-top:3px solid rgb(var(--gb1) / calc(.25 + var(--k)))}
#community-app .handbook-prose .hb-band:nth-child(2){--k:.35}#community-app .handbook-prose .hb-band:nth-child(3){--k:.5}#community-app .handbook-prose .hb-band:nth-child(4){--k:.65}#community-app .handbook-prose .hb-band:nth-child(5){--k:.8}
#community-app .handbook-prose .hb-band-range{font:400 28px/1 'Bebas Neue','Arial Narrow',sans-serif;color:rgb(var(--gb1))}
#community-app .handbook-prose .hb-band-name{font:700 12px/1.2 'Segoe UI',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#f1ebdf}
#community-app .handbook-prose .hb-band-desc{font-size:12.5px;line-height:1.45;color:#c9c4b8}
#community-app[data-scene] .guide-layout .handbook-prose .hb-note{margin:0 0 32px;padding:12px 16px;border-radius:0 10px 10px 0;border-left:3px solid rgb(var(--gb1));background:rgb(var(--gb1) / .07);font-size:14px}
#community-app .handbook-prose .hb-columns{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:4px 0 32px}
#community-app .handbook-prose :is(.hb-do,.hb-dont){padding:16px 18px 8px;border-radius:10px;border:1px solid}
#community-app .handbook-prose .hb-do{border-color:rgb(110 190 140 / .35);background:rgb(110 190 140 / .06)}
#community-app .handbook-prose .hb-dont{border-color:rgb(220 110 95 / .35);background:rgb(220 110 95 / .06)}
#community-app[data-scene] .guide-layout .handbook-prose :is(.hb-do,.hb-dont) h4{margin:0 0 10px!important;padding:0!important;font:400 20px/1 'Bebas Neue','Arial Narrow',sans-serif!important;letter-spacing:.08em;border:0}
#community-app[data-scene] .guide-layout .handbook-prose .hb-do h4{color:#8fd4a8!important}
#community-app[data-scene] .guide-layout .handbook-prose .hb-dont h4{color:#ee9a8c!important}
#community-app[data-scene] .guide-layout .handbook-prose :is(.hb-do,.hb-dont) ul{margin:0}
#community-app[data-scene] .guide-layout .handbook-prose :is(.hb-do,.hb-dont) li{font-size:14px;line-height:1.55;padding-left:24px}
#community-app[data-scene] .guide-layout .handbook-prose :is(.hb-do,.hb-dont) li::before{width:auto;height:auto;border-radius:0;box-shadow:none;background:none;top:0;left:0;font:700 14px/1.55 'Segoe UI',sans-serif}
#community-app[data-scene] .guide-layout .handbook-prose .hb-do li::before{content:"✓";color:#8fd4a8}
#community-app[data-scene] .guide-layout .handbook-prose .hb-dont li::before{content:"✕";color:#ee9a8c}
#community-app[data-scene] .guide-layout .handbook-prose .hb-checklist{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin:4px 0 26px}
#community-app[data-scene] .guide-layout .handbook-prose .hb-checklist>li{margin:0;padding:10px 12px 10px 40px;border-radius:8px;background:rgb(255 255 255 / .03);border:1px solid rgb(255 255 255 / .06);font-size:14px;line-height:1.5}
#community-app[data-scene] .guide-layout .handbook-prose .hb-checklist>li::before{left:12px;top:11px;width:16px;height:16px;border-radius:4px;background:transparent;border:2px solid rgb(var(--gb1) / .75);box-shadow:none;box-sizing:border-box}
#community-app[data-scene] .guide-layout .handbook-prose[data-chapter=character-creation] h3{margin-top:38px}#community-app[data-scene] .guide-layout .handbook-prose[data-chapter=character-creation] .hb-facts+h3{margin-top:10px}
/* Competencies chapter: per-competency ladders and example spreads */
#community-app .handbook-prose .hb-comp{margin:0 0 16px;padding:18px 20px 16px;border:1px solid rgb(var(--gb1) / .2);border-radius:12px;background:linear-gradient(180deg,rgb(var(--gb1) / .06),rgb(255 255 255 / .01))}
#community-app[data-scene] .guide-layout .handbook-prose .hb-comp h4{margin:0!important;padding:0!important;font:400 26px/1 'Bebas Neue','Arial Narrow',sans-serif!important;letter-spacing:.06em;text-transform:uppercase;color:rgb(var(--gb1))!important;border:0}
#community-app[data-scene] .guide-layout .handbook-prose .hb-comp-desc{margin:4px 0 12px!important;font-size:14px!important;color:#b9b4a8!important}
#community-app .handbook-prose .hb-ladder{display:grid;gap:4px}
#community-app .handbook-prose .hb-rung{--k:.12;display:grid;grid-template-columns:62px minmax(0,1fr);align-items:center;gap:14px;padding:8px 12px;border-radius:7px;background:rgb(var(--gb1) / var(--k));font-size:14px;line-height:1.5;color:#d6d2c8}
#community-app .handbook-prose .hb-rung:nth-child(1){--k:.03}#community-app .handbook-prose .hb-rung:nth-child(2){--k:.06}#community-app .handbook-prose .hb-rung:nth-child(3){--k:.1}#community-app .handbook-prose .hb-rung:nth-child(4){--k:.15}#community-app .handbook-prose .hb-rung:nth-child(5){--k:.21}
#community-app .handbook-prose .hb-rung-range{font:400 22px/1 'Bebas Neue','Arial Narrow',sans-serif;color:rgb(var(--gb1));letter-spacing:.03em}
#community-app .handbook-prose .hb-samples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:4px 0 30px}
#community-app .handbook-prose .hb-sample{padding:16px 16px 12px;border-radius:12px;border:1px solid rgb(255 255 255 / .08);background:rgb(255 255 255 / .025)}
#community-app[data-scene] .guide-layout .handbook-prose .hb-sample h4{margin:0!important;padding:0!important;font:400 21px/1.1 'Bebas Neue','Arial Narrow',sans-serif!important;letter-spacing:.05em;text-transform:uppercase;color:#f1ebdf!important;border:0}
#community-app[data-scene] .guide-layout .handbook-prose .hb-sample-role{margin:3px 0 12px!important;font-size:12px!important;letter-spacing:.06em;color:rgb(var(--gb1))!important}
#community-app .handbook-prose .hb-meter{display:grid;grid-template-columns:70px minmax(0,1fr) 20px;align-items:center;gap:8px;margin:0 0 6px;font-size:12.5px;color:#cfcabe}
#community-app .handbook-prose .hb-meter-track{display:block;height:7px;border-radius:99px;background:rgb(255 255 255 / .08);overflow:hidden}
#community-app .handbook-prose .hb-meter-fill{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,rgb(var(--gb1) / .55),rgb(var(--gb1)))}
#community-app[data-scene] .guide-layout .handbook-prose .hb-meter strong{color:rgb(var(--gb1));font-weight:700;text-align:right}
#community-app[data-scene] .guide-layout .handbook-prose .hb-sample-note{margin:10px 0 0!important;font-size:13px!important;line-height:1.5!important;color:#b9b4a8!important;font-style:italic}
#community-app[data-scene] .guide-layout .handbook-prose[data-chapter=competencies] h3{margin-top:38px}
#community-app[data-scene] .guide-layout .handbook-prose[data-chapter=competencies] .hb-facts{grid-template-columns:repeat(3,minmax(0,1fr))}
/* ---- Guidebook sections: two-column flow on wide panels, fading dividers between sections ---- */
#community-app[data-scene] .guide-layout .handbook-prose{container:hbprose/inline-size}
#community-app .handbook-prose .hb-section{display:flow-root;min-width:0}
#community-app[data-scene] .guide-layout .handbook-prose .hb-section>h3:first-child{margin-top:0!important}
#community-app[data-scene] .guide-layout .handbook-prose .hb-section>:last-child{margin-bottom:0}
#community-app[data-scene] .guide-layout .handbook-prose hr.hb-divider{border:0;height:1px;margin:30px 0;background:linear-gradient(90deg,transparent,rgb(var(--gb1) / .5) 18%,rgb(var(--gb1) / .5) 82%,transparent)}
#community-app .handbook-prose .hb-row>.hb-section+.hb-section{margin-top:30px}
@container hbprose (min-width:820px){
 #community-app .handbook-prose .hb-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:64px}
 #community-app .handbook-prose .hb-row>.hb-section{position:relative}
 #community-app .handbook-prose .hb-row>.hb-section+.hb-section{margin-top:0}
 #community-app .handbook-prose .hb-row>.hb-section+.hb-section::before{content:"";position:absolute;left:-32px;top:6px;bottom:6px;width:1px;background:linear-gradient(transparent,rgb(var(--gb1) / .3) 20%,rgb(var(--gb1) / .3) 80%,transparent)}
 #community-app .handbook-prose>.hb-section-split{columns:2;column-gap:64px;column-rule:1px solid rgb(var(--gb1) / .14)}
 #community-app .handbook-prose .hb-section-split>:is(h3,figure,.handbook-plate){column-span:all}
 #community-app .handbook-prose .hb-section-split>:is(p,ul,ol,li,blockquote,h4){break-inside:avoid}
 #community-app .handbook-prose .hb-section-split>h4{break-after:avoid}
}
/* ---- Guidebook images scale to their space: never wider than the column, never taller than the view allows ---- */
#community-app[data-scene] .guide-layout .handbook-prose .handbook-plate{display:flex;flex-direction:column;align-items:center;float:none;width:auto;max-width:100%;margin:14px 0 20px}
#community-app[data-scene] .guide-layout .handbook-prose .handbook-plate img{display:block;width:auto!important;height:auto!important;max-width:100%!important;max-height:clamp(200px,48vh,520px)!important;object-fit:contain;border-radius:12px}
#community-app[data-scene] .guide-layout .handbook-prose .handbook-plate figcaption{max-width:100%;text-align:center}
@container hbprose (min-width:820px){
 /* Intros with a picture: text on the left, the picture beside it instead of above. */
 #community-app .handbook-prose .hb-section-intro:has(>.handbook-plate){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);column-gap:36px;align-items:start}
 #community-app .handbook-prose .hb-section-intro:has(>.handbook-plate)>*{grid-column:1}
 #community-app[data-scene] .guide-layout .handbook-prose .hb-section-intro>.handbook-plate{grid-column:2;grid-row:1 / span 12;margin:4px 0 0;align-self:start;position:sticky;top:0}
 #community-app .handbook-prose .hb-section-intro .hb-facts{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))!important;margin-bottom:0}
 #community-app[data-scene] .guide-layout .handbook-prose .hb-section-intro .hb-lead{max-width:none}
 /* Split sections: pictures sit in the column flow at column width. */
 #community-app .handbook-prose .hb-section-split>.handbook-plate{column-span:none;break-inside:avoid}
 /* Competencies: cards two across; an odd last card spans the row with its ladder laid out sideways. */
 #community-app .handbook-prose .hb-section:has(>.hb-comp){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
 #community-app .handbook-prose .hb-section:has(>.hb-comp)>:not(.hb-comp,.hb-radar-demo){grid-column:1 / -1}
 #community-app .handbook-prose .hb-section:has(>.hb-comp)>.hb-comp{margin:0}
 /* Welcome: two columns, then a footer with the picture beside the closing notes. */
 #community-app .handbook-prose .hb-welcome-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:64px;align-items:start}
 #community-app .handbook-prose .hb-welcome-col+.hb-welcome-col{position:relative}
 #community-app .handbook-prose .hb-welcome-col+.hb-welcome-col::before{content:"";position:absolute;left:-32px;top:6px;bottom:6px;width:1px;background:linear-gradient(transparent,rgb(var(--gb1) / .3) 20%,rgb(var(--gb1) / .3) 80%,transparent)}
 #community-app .handbook-prose .hb-welcome-foot{columns:2;column-gap:64px;column-rule:1px solid rgb(var(--gb1) / .14)}
 #community-app .handbook-prose .hb-welcome-foot>*{break-inside:avoid}
}
#community-app[data-scene] .guide-layout .handbook-prose .hb-welcome-col>.first-shift-heading{margin-top:0!important;break-before:auto}
#community-app[data-scene] .guide-layout .handbook-prose .hb-welcome-col>:first-child{margin-top:0!important}
/* Competency icons */
#community-app .handbook-prose .hb-stat-icon{--stat-cutout:#1d2023;display:inline-grid;place-items:center;flex:0 0 auto;color:rgb(var(--gb1))}
#community-app .handbook-prose .hb-stat-icon svg{width:100%;height:100%;display:block}
#community-app[data-scene] .guide-layout .handbook-prose .hb-comp h4{display:flex;align-items:center;gap:12px}
#community-app .handbook-prose .hb-stat-icon-lg{width:34px;height:34px;padding:7px;border-radius:50%;background:rgb(var(--gb1) / .12);border:1px solid rgb(var(--gb1) / .35);box-sizing:content-box}
#community-app .handbook-prose .hb-stat-icon-sm{width:14px;height:14px;margin-right:6px;vertical-align:-2px;color:rgb(var(--gb1) / .85)}
#community-app .handbook-prose .hb-meter{grid-template-columns:92px minmax(0,1fr) 20px}
#community-app .handbook-prose .hb-meter>span:first-child{display:flex;align-items:center;white-space:nowrap}
/* Intro pictures: a compact companion to the text, not a banner. */
@container hbprose (min-width:820px){
 #community-app .handbook-prose .hb-section-intro:has(>.handbook-plate){grid-template-columns:minmax(0,1fr) minmax(240px,min(30%,400px))}
 #community-app[data-scene] .guide-layout .handbook-prose .hb-section-intro>.handbook-plate img{max-height:280px!important}
}

/* Competencies: example pentagon diagram, the sixth card beside Intellect */
#community-app .handbook-prose .hb-radar-demo{--character-color:rgb(var(--gb1));--stat-cutout:#172022;display:flex;flex-direction:column;margin:0;padding:18px 20px 16px;border:1px dashed rgb(var(--gb1) / .3);border-radius:12px;background:radial-gradient(circle at 50% 45%,rgb(var(--gb1) / .08),transparent 65%)}
#community-app[data-scene] .guide-layout .handbook-prose .hb-radar-demo h4{margin:0!important;padding:0!important;font:400 26px/1 'Bebas Neue','Arial Narrow',sans-serif!important;letter-spacing:.06em;text-transform:uppercase;color:rgb(var(--gb1))!important;border:0}
#community-app .handbook-prose .hb-radar-figure{flex:1 1 auto;display:grid;place-items:center;padding:6px 0}
#community-app .handbook-prose .hb-radar-figure .post-stat-radar{width:min(100%,310px);height:auto;color:rgb(var(--gb1));overflow:visible}
#community-app .handbook-prose .hb-radar-figure .post-radar-icon svg{color:rgb(var(--gb1))}
#community-app[data-scene] .guide-layout .handbook-prose .hb-radar-caption{margin:4px 0 0!important;font-size:13px!important;line-height:1.55!important;color:#b9b4a8!important;text-align:center}
/* ---- Guidebook pictures, final sizing: smaller everywhere; a section with a picture puts all its text in one
   column and the picture in the other (instead of flowing text around or under a huge plate). ---- */
#community-app[data-scene] .guide-layout .handbook-prose .handbook-plate img{max-height:clamp(180px,34vh,340px)!important}
@container hbprose (min-width:820px){
 #community-app .handbook-prose>.hb-section:has(>.handbook-plate){columns:auto!important;column-rule:none!important;display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,min(34%,420px));column-gap:40px;align-items:start}
 #community-app .handbook-prose>.hb-section:has(>.handbook-plate)>*{grid-column:1}
 #community-app .handbook-prose>.hb-section:has(>.handbook-plate)>h3:first-child{grid-column:1 / -1}
 #community-app[data-scene] .guide-layout .handbook-prose>.hb-section:has(>.handbook-plate)>.handbook-plate{grid-column:2;grid-row:1 / span 40;position:sticky;top:0;margin:4px 0 0;align-self:start}
 #community-app[data-scene] .guide-layout .handbook-prose>.hb-section:has(>h3:first-child)>.handbook-plate{grid-row:2 / span 40}
 #community-app[data-scene] .guide-layout .handbook-prose>.hb-section>.handbook-plate img{max-height:300px!important}
 /* a paired half-width section keeps its picture above the text, just smaller */
 #community-app[data-scene] .guide-layout .handbook-prose .hb-row .handbook-plate img{max-height:220px!important}
}
/* Character Creation: steps as a grid of detailed cards; image policy cards */
#community-app .handbook-prose .hb-cards{display:grid;grid-template-columns:1fr;gap:12px;margin:4px 0 16px}
#community-app .handbook-prose .hb-card{padding:16px 18px;border-radius:12px;border:1px solid rgb(var(--gb1) / .2);background:linear-gradient(180deg,rgb(var(--gb1) / .06),rgb(255 255 255 / .01))}
#community-app[data-scene] .guide-layout .handbook-prose .hb-card h4{margin:0 0 8px!important;padding:0!important;font:400 21px/1.1 'Bebas Neue','Arial Narrow',sans-serif!important;letter-spacing:.05em;text-transform:uppercase;color:rgb(var(--gb1))!important;border:0}
#community-app[data-scene] .guide-layout .handbook-prose .hb-card p{margin:0!important;font-size:14px;line-height:1.6}
@container hbprose (min-width:820px){
 #community-app .handbook-prose .hb-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
 #community-app .handbook-prose .hb-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
 #community-app .handbook-prose .hb-steps::before{display:none}
 #community-app .handbook-prose .hb-step{grid-template-columns:44px minmax(0,1fr);column-gap:14px;align-content:start;padding:18px 18px 8px 16px;border:1px solid rgb(var(--gb1) / .18);background:linear-gradient(180deg,rgb(var(--gb1) / .06),rgb(255 255 255 / .01));border-radius:12px}
 #community-app .handbook-prose .hb-step:hover{background:linear-gradient(180deg,rgb(var(--gb1) / .1),rgb(255 255 255 / .02))}
 #community-app .handbook-prose .hb-step-num{width:44px;height:44px;font-size:19px;box-shadow:0 0 14px rgb(var(--gb1) / .15)}
 #community-app[data-scene] .guide-layout .handbook-prose .hb-step p{font-size:14px;line-height:1.65}
 #community-app[data-scene] .guide-layout .handbook-prose .hb-step .hb-staff{display:block;margin-top:4px!important}
}
@container hbprose (min-width:1180px){
 #community-app .handbook-prose .hb-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* Hard-rule warning: red on the default skin; amber on crimson-based skins so it still stands out */
#community-app .handbook-prose{--hb-warn:255 92 80}
:root[data-theme="cyberpunk"] #community-app .handbook-prose{--hb-warn:255 184 48}
#community-app[data-scene] .guide-layout .handbook-prose .hb-warning{margin:16px 0 0!important;padding:12px 16px 12px 44px;position:relative;border:1px solid rgb(var(--hb-warn) / .55);border-left:4px solid rgb(var(--hb-warn));border-radius:0 10px 10px 0;background:rgb(var(--hb-warn) / .1);color:rgb(var(--hb-warn))!important;font-size:14.5px!important;line-height:1.55!important;font-weight:500}
#community-app[data-scene] .guide-layout .handbook-prose .hb-warning::before{content:"!";position:absolute;left:14px;top:50%;translate:0 -50%;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:rgb(var(--hb-warn));color:#14100f;font:800 13px/1 'Segoe UI',sans-serif}
#community-app[data-scene] .guide-layout .handbook-prose .hb-warning strong{color:rgb(var(--hb-warn))!important;font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:12.5px;margin-right:4px}
/* Key game terms: bold caps in the accent color, in the body font. Reusable anywhere via .hb-term. */
#community-app .hb-term{font-weight:800!important;text-transform:uppercase!important;letter-spacing:.04em;color:rgb(var(--gb1,233 179 90))!important;font-size:.9em;white-space:nowrap}
#community-app a .hb-term{color:inherit!important}
/* Optional-extras cards */
#community-app .handbook-prose .hb-card-optional{position:relative;border-style:dashed}
#community-app .handbook-prose .hb-optional-tag{position:absolute;top:14px;right:14px;padding:3px 9px;border-radius:99px;border:1px solid rgb(var(--gb1) / .45);color:rgb(var(--gb1));font:700 10px/1.2 'Segoe UI',sans-serif;letter-spacing:.14em;text-transform:uppercase}
/* Guidebook edit dock: inside the reading panel, pinned to the top of the visible area while scrolling */
#community-app[data-scene] .guide-layout .handbook-edit-dock.handbook-edit-dock-panel{position:sticky;top:-26px;left:auto;right:auto;z-index:30;margin:-26px -32px 22px -36px;padding:10px 32px 10px 36px;border:0;border-bottom:1px solid rgb(var(--gb1) / .55);border-radius:0;background:rgb(16 20 23 / .97);backdrop-filter:blur(6px);box-shadow:0 10px 24px -12px #000c}
#community-app[data-scene] .guide-layout .handbook-edit-dock-panel .rich-toolbar{display:flex;flex-wrap:wrap;gap:6px;max-height:none;background:none;border:0;padding:0}
#community-app[data-scene] .guide-layout .handbook-edit-dock-panel .editor-save-row strong{color:rgb(var(--gb1));font:400 18px/1 'Bebas Neue','Arial Narrow',sans-serif;letter-spacing:.06em;text-transform:uppercase}
#community-app[data-scene] .guide-layout .handbook-prose[contenteditable=true]{outline:1px dashed rgb(var(--gb1) / .35);outline-offset:10px;border-radius:4px}

/* The legacy site shell's footer is replaced by the app on app pages (restored after the dead-CSS pass missed the shell template). */
body.hz-ca .bureau-shell-footer{display:none!important}
/* ---- Guidebook: grids of parallel entries (designations, origins, FAQ). One block, no dividers inside. ---- */
#community-app .handbook-prose .hb-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
#community-app .handbook-prose .hb-grid>.hb-section{padding:18px 20px 16px;border-radius:12px;border:1px solid rgb(var(--gb1) / .16);background:linear-gradient(180deg,rgb(var(--gb1) / .05),rgb(255 255 255 / .01))}
#community-app[data-scene] .guide-layout .handbook-prose .hb-grid>.hb-section>h3{margin:0 0 10px!important;padding-bottom:8px;display:flex;align-items:center;gap:12px}
#community-app[data-scene] .guide-layout .handbook-prose .hb-grid>.hb-section>ul{margin-bottom:0}
@container hbprose (min-width:820px){
 #community-app .handbook-prose .hb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 /* a single lone section keeps a comfortable reading width instead of running edge to edge */
 #community-app .handbook-prose>.hb-section-short>:is(p,ul,ol,blockquote),#community-app .handbook-prose>.hb-section-full>:is(p,ul,ol,blockquote){max-width:88ch}
}
@container hbprose (min-width:1180px){
 #community-app .handbook-prose .hb-grid-wide{grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* designation icons: guidebook headings reuse the competency icon badge; directory pills get a small inline icon */
#community-app .designation-icon{--stat-cutout:#1d2023;display:inline-grid;place-items:center;flex:0 0 auto;color:rgb(var(--gb1,233 179 90))}
#community-app .designation-icon svg{width:100%;height:100%;display:block}
#community-app .designation-icon-sm{width:13px;height:13px;margin-right:6px;vertical-align:-2px;color:currentColor;--stat-cutout:#15191c}
#community-app .cast-pill{display:inline-flex;align-items:center}
/* ---- Welcome: reads top to bottom. Text beside a picture, the checklist, then a picture beside text. ---- */
#community-app .handbook-prose .hb-welcome-band{display:block}
#community-app .handbook-prose .welcome-checklist{list-style:none;padding:0}
@container hbprose (min-width:820px){
 #community-app .handbook-prose .hb-welcome-band{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,min(38%,460px));column-gap:44px;align-items:center}
 #community-app .handbook-prose .hb-welcome-band-flip{grid-template-columns:minmax(260px,min(38%,460px)) minmax(0,1fr)}
 #community-app[data-scene] .guide-layout .handbook-prose .hb-welcome-band>.handbook-plate{margin:0}
 #community-app .handbook-prose .hb-welcome-text>:first-child{margin-top:0!important}
 #community-app[data-scene] .guide-layout .handbook-prose .welcome-checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:4px 0 0}
 #community-app[data-scene] .guide-layout .handbook-prose .welcome-checklist>li{margin:0;padding:14px 16px 14px 40px;border-radius:10px;border:1px solid rgb(var(--gb1) / .16);background:rgb(var(--gb1) / .04)}
 #community-app[data-scene] .guide-layout .handbook-prose .welcome-checklist>li::before{left:16px;top:1.35em}
}
@container hbprose (min-width:1180px){
 #community-app[data-scene] .guide-layout .handbook-prose .welcome-checklist{grid-template-columns:repeat(4,minmax(0,1fr))}
}
#community-app[data-scene] .guide-layout .handbook-prose .first-shift-heading{margin-top:0!important}
/* ---- Guidebook colour balance ----------------------------------------------------------------
   Gold (the skin's secondary) is kept for the frame: the outer border, the tabs, the chapter title,
   the Welcome tagline and the key terms (DESIGNATION / ORIGIN). Everything inside the chapter body
   (section headings, cards, badges, bold labels, links, dividers) uses the skin's primary instead,
   by re-pointing --gb1 for the chapter's child blocks. */
#community-app[data-scene] .guide-volume.guide-layout{--gb-gold:233 179 90;--gb3:98 162 228}
:root[data-theme="cyberpunk"] #community-app[data-scene] .guide-volume.guide-layout{--gb3:117 227 235}
#community-app[data-scene] .guide-layout .handbook-prose>:not(.chapter-opener),
#community-app[data-scene] .guide-layout .handbook-prose .handbook-welcome>*{--gb1:var(--gb3)}
#community-app[data-scene] .guide-layout .handbook-prose .hb-term{color:rgb(var(--gb-gold))!important}
#community-app[data-scene] .guide-layout .handbook-prose .welcome-slogan{color:rgb(var(--gb-gold))!important}
#community-app[data-scene] .guide-layout .handbook-prose .hb-grid>.hb-section>h3,
#community-app[data-scene] .guide-layout .handbook-prose .hb-section>h3{border-bottom-color:rgb(var(--gb3) / .35)}
/* Character Creation: in column view the intro runs straight into the path to approval, no divider */
@container hbprose (min-width:820px){
 #community-app .handbook-prose[data-chapter=character-creation]>.hb-section-intro+hr.hb-divider{display:none}
 #community-app .handbook-prose[data-chapter=character-creation]>.hb-section-intro{margin-bottom:26px}
}
/* Page/chapter slide: the outgoing snapshot sits over the frame's content area while it fades out to the right */
#community-app .route-slide-ghost{position:absolute;inset:0;z-index:6;pointer-events:none;overflow:hidden}
#community-app[data-scene] .guide-layout .guide-panel>.route-slide-ghost-guide{position:absolute!important;inset:16px 6px 16px 0;z-index:3;overflow:hidden!important;scrollbar-width:none}
/* Guidebook blocks are separated by space; only dividers an author places are drawn, in the fading style */
#community-app[data-scene] .guide-layout .handbook-prose>:is(.hb-section,.hb-grid,.hb-row)+:is(.hb-section,.hb-grid,.hb-row){margin-top:38px}
#community-app[data-scene] .guide-layout .handbook-prose>hr,#community-app[data-scene] .guide-layout .handbook-prose .handbook-welcome>hr{border:0;height:1px;margin:30px 0;background:linear-gradient(90deg,transparent,rgb(var(--gb3,98 162 228) / .55) 18%,rgb(var(--gb3,98 162 228) / .55) 82%,transparent)}
#community-app .handbook-prose .hb-cards-3{grid-template-columns:1fr}
@container hbprose (min-width:820px){#community-app .handbook-prose .hb-cards-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container hbprose (min-width:1180px){#community-app .handbook-prose .hb-cards-3{grid-template-columns:repeat(3,minmax(0,1fr))}}
#community-app[data-scene] .guide-layout .handbook-prose .hb-rating{margin-bottom:14px}
/* Welcome: the tagline is the page title, in the title lettering but the skin's primary colour */
#community-app[data-scene] .guide-layout .handbook-prose .welcome-opener h2{color:rgb(var(--gb3,98 162 228))!important;font-size:clamp(1.9rem,3.6vw,2.6rem)}
#community-app[data-scene] .guide-layout .handbook-prose .welcome-lead{font-size:17px!important;color:#eef0f2!important;margin-top:0!important}
/* Guidebook headings: section titles and the line under them are gold; inner content stays on the primary colour */
#community-app[data-scene] .guide-layout .handbook-prose h3:not(.welcome-slogan){color:rgb(var(--gb-gold,233 179 90))!important;border-bottom-color:rgb(var(--gb-gold,233 179 90) / .45)!important}
#community-app[data-scene] .guide-layout .handbook-prose .welcome-opener h2{font-weight:700;letter-spacing:.02em;text-shadow:0 0 1px currentColor,0 2px 14px rgb(var(--gb3,98 162 228) / .25)}
/* Welcome intro: text and picture line up at the top */
#community-app .handbook-prose .hb-welcome-band{align-items:start!important}
#community-app[data-scene] .guide-layout .handbook-prose .hb-welcome-text>p{margin-bottom:12px}
/* Quote callouts */
#community-app .handbook-prose .hb-quote{position:relative;margin:16px 0;padding:14px 18px 12px 46px;border-radius:12px;background:rgb(var(--gb3,98 162 228) / .07);border:1px solid rgb(var(--gb3,98 162 228) / .22)}
#community-app .handbook-prose .hb-quote::before{content:"“";position:absolute;left:12px;top:-4px;font:700 54px/1 Georgia,serif;color:rgb(var(--gb3,98 162 228) / .75)}
#community-app[data-scene] .guide-layout .handbook-prose .hb-quote p{margin:0 0 6px!important;font-style:italic;font-size:15.5px;line-height:1.55;color:#eef0f2}
#community-app .handbook-prose .hb-quote-by{display:block;font:600 11px/1.3 'Segoe UI',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:rgb(var(--gb3,98 162 228))}
#community-app .handbook-prose .hb-quote-by::before{content:"— "}
#community-app .handbook-prose .hb-quotes{display:grid;grid-template-columns:1fr;gap:12px}
#community-app .handbook-prose .hb-quotes .hb-quote{margin:0}
@container hbprose (min-width:820px){#community-app .handbook-prose .hb-quotes{grid-template-columns:repeat(3,minmax(0,1fr))}}
#community-app[data-scene] .guide-layout .handbook-prose .handbook-welcome>h3{margin-top:30px!important}
/* Welcome callouts use the standard blockquote style ("Our promise"); the Overheard strip lays three side by side */
#community-app[data-scene] .guide-layout .handbook-prose .hb-quotes>blockquote{margin:0}
#community-app[data-scene] .guide-layout .handbook-prose .hb-welcome-text>blockquote{margin:14px 0}
/* A section can put its picture on the left instead (figure.hb-plate-left): picture | text */
@container hbprose (min-width:820px){
 #community-app .handbook-prose>.hb-section:has(>.hb-plate-left){grid-template-columns:minmax(200px,min(26%,320px)) minmax(0,1fr)!important}
 #community-app .handbook-prose>.hb-section:has(>.hb-plate-left)>*{grid-column:2}
 #community-app .handbook-prose>.hb-section:has(>.hb-plate-left)>h3:first-child{grid-column:2}
 #community-app[data-scene] .guide-layout .handbook-prose>.hb-section:has(>.hb-plate-left)>.hb-plate-left{grid-column:1!important;grid-row:1 / span 40!important}
}
#community-app[data-scene] .guide-layout .handbook-prose .hb-welcome-band-flip{margin-top:40px}
#community-app[data-scene] .guide-layout .handbook-prose .hb-welcome-band+.first-shift-heading{margin-top:34px!important}
/* Left-side section pictures are square crops (top of the image kept) */
#community-app[data-scene] .guide-layout .handbook-prose .hb-plate-left img{aspect-ratio:1/1;width:100%!important;height:auto!important;max-height:none!important;object-fit:cover;object-position:50% 0}
@container hbprose (min-width:820px){#community-app .handbook-prose>.hb-section:has(>.hb-plate-left){grid-template-columns:minmax(180px,min(22%,260px)) minmax(0,1fr)!important}}
/* ---- Origins: a hand of cards ---- */
#community-app .handbook-prose .hb-fan>.hb-fan-card{cursor:pointer;outline:none;background:linear-gradient(180deg,#1a2129,#12171c)!important;transition:transform .38s cubic-bezier(.2,.8,.25,1),box-shadow .38s,filter .38s,max-height .45s ease}
#community-app .handbook-prose .hb-fan>.hb-fan-card:focus-visible{box-shadow:0 0 0 2px rgb(var(--gb3,98 162 228) / .8)}
@container hbprose (min-width:1000px){
 #community-app .handbook-prose .hb-grid.hb-fan{--fan-w:min(360px,30cqi);display:flex!important;justify-content:flex-start;align-items:stretch;gap:0;padding:52px 0 0;grid-template-columns:none}
 /* straight cards, overlapping evenly; left-most at the bottom, right-most (the front card) on top */
 #community-app .handbook-prose .hb-fan>.hb-fan-card{flex:0 0 var(--fan-w);width:var(--fan-w);margin-left:calc((100cqi - var(--fan-w)) / (var(--n) - 1) - var(--fan-w));box-shadow:-12px 0 24px -14px #000e;filter:brightness(.6) saturate(.8);transition:transform .32s cubic-bezier(.2,.8,.25,1),filter .32s,box-shadow .32s}
 #community-app .handbook-prose .hb-fan>.hb-fan-card:first-child{margin-left:0}
 /* every card behind the front one has the same faded, darkened look */
 #community-app .handbook-prose .hb-fan>.hb-fan-card:not(.is-active)>:not(h3){opacity:.28;transition:opacity .32s}
 #community-app .handbook-prose .hb-fan>.hb-fan-card:not(.is-active)>h3{opacity:.78;transition:opacity .32s}
 /* hovering a card behind pokes it up so its full title and first line clear the row */
 #community-app .handbook-prose .hb-fan>.hb-fan-card:not(.is-active):is(:hover,:focus-visible){transform:translateY(-44px);filter:brightness(.88)}
 #community-app .handbook-prose .hb-fan>.hb-fan-card:not(.is-active):is(:hover,:focus-visible)>*{opacity:.9}
 #community-app .handbook-prose .hb-fan>.hb-fan-card.is-active{transform:none;filter:none;cursor:default;box-shadow:-16px 0 30px -12px #000,0 0 0 1px rgb(var(--gb3,98 162 228) / .6)}
 #community-app .handbook-prose .hb-fan>.hb-fan-card.is-active>*{opacity:1}
}
@container hbprose (max-width:999px){
 #community-app .handbook-prose .hb-grid.hb-fan{display:grid!important;grid-template-columns:1fr!important;gap:10px}
 #community-app .handbook-prose .hb-fan>.hb-fan-card{max-height:132px;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent);mask-image:linear-gradient(180deg,#000 55%,transparent)}
 #community-app .handbook-prose .hb-fan>.hb-fan-card.is-active{max-height:640px;-webkit-mask-image:none;mask-image:none}
}
@media (prefers-reduced-motion:reduce){#community-app .handbook-prose .hb-fan>.hb-fan-card{transition:none}}
#community-app[data-scene] .guide-layout .handbook-prose .hb-welcome-band+.welcome-city-heading{margin-top:34px!important}
#community-app[data-scene] .guide-layout .handbook-prose .welcome-city-heading~p{max-width:110ch}
/* Origins deck: intro card (front by default) and the heading above the deck */
#community-app .handbook-prose .hb-fan-intro{display:flex;flex-direction:column;justify-content:center;text-align:center}
#community-app[data-scene] .guide-layout .handbook-prose .hb-fan-intro>h3{justify-content:center;border:0!important;font-size:30px!important}
#community-app[data-scene] .guide-layout .handbook-prose .hb-fan-intro .hb-fan-hint{font-size:12.5px!important;color:#9aa4ae!important;font-style:italic}
@container hbprose (max-width:999px){#community-app .handbook-prose .hb-fan-intro{display:none}}
#community-app[data-scene] .guide-layout .handbook-prose>.hb-section:has(>h3:only-child)+.hb-grid{margin-top:10px}
#community-app[data-scene] .guide-layout .handbook-prose>.hb-section:has(>h3:only-child)>h3{margin-bottom:0!important}
/* ---- Origins: tabbed view (replaces the card deck) ---- */
#community-app .handbook-prose .hb-grid.hb-tabs{display:grid!important;grid-template-columns:1fr!important;gap:14px}
#community-app .handbook-prose .hb-tablist{display:flex;flex-wrap:wrap;gap:8px}
#community-app .handbook-prose .hb-tab{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:10px;border:1px solid rgb(var(--gb3,98 162 228) / .18);background:rgb(255 255 255 / .02);color:#c9ced4;font:400 19px/1 'Bebas Neue','Arial Narrow',sans-serif;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;text-align:left;transition:background .2s,border-color .2s,color .2s}
#community-app .handbook-prose .hb-tab:hover{background:rgb(var(--gb3,98 162 228) / .08);color:#fff}
#community-app .handbook-prose .hb-tab:focus-visible{outline:2px solid rgb(var(--gb3,98 162 228));outline-offset:2px}
#community-app .handbook-prose .hb-tab[aria-selected=true]{background:rgb(var(--gb3,98 162 228) / .14);border-color:rgb(var(--gb3,98 162 228) / .6);color:rgb(var(--gb-gold,233 179 90))}
#community-app .handbook-prose .hb-tab-icon{width:26px;height:26px;padding:5px;border-radius:50%;background:rgb(var(--gb3,98 162 228) / .12);border:1px solid rgb(var(--gb3,98 162 228) / .35);color:rgb(var(--gb3,98 162 228));--stat-cutout:#1d2023}
#community-app .handbook-prose .hb-tabs>.hb-tabpanel{animation:hb-tab-in .28s ease both}
@keyframes hb-tab-in{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:none}}
@container hbprose (min-width:820px){
 #community-app .handbook-prose .hb-grid.hb-tabs{grid-template-columns:minmax(210px,260px) minmax(0,1fr)!important;align-items:start;gap:0 22px}
 #community-app .handbook-prose .hb-tablist{flex-direction:column;flex-wrap:nowrap;gap:6px;position:sticky;top:0}
 #community-app .handbook-prose .hb-tab{width:100%}
 #community-app .handbook-prose .hb-tab[aria-selected=true]{box-shadow:inset 3px 0 0 rgb(var(--gb-gold,233 179 90))}
 #community-app .handbook-prose .hb-tabs>.hb-tabpanel{grid-column:2;grid-row:1;min-height:100%}
}
#community-app .handbook-prose .hb-tabs>.hb-tabpanel[hidden]{display:none!important}
/* Origins tabs: one container holds both the tab list and the selected entry; the entry drops its own title */
#community-app .handbook-prose .hb-grid.hb-tabs{padding:26px 28px;border-radius:14px;border:1px solid rgb(var(--gb3,98 162 228) / .22);background:linear-gradient(180deg,rgb(var(--gb3,98 162 228) / .06),rgb(255 255 255 / .01))}
#community-app .handbook-prose .hb-grid.hb-tabs>.hb-tabpanel{padding:4px 6px 4px 8px;border:0;background:none;border-radius:0}
#community-app[data-scene] .guide-layout .handbook-prose .hb-tabs>.hb-tabpanel>h3{display:none!important}
#community-app[data-scene] .guide-layout .handbook-prose .hb-tabs>.hb-tabpanel>p:first-of-type{margin-top:2px!important}
@container hbprose (min-width:820px){
 #community-app .handbook-prose .hb-grid.hb-tabs{gap:0 34px}
 #community-app .handbook-prose .hb-grid.hb-tabs>.hb-tabpanel{padding-left:34px;border-left:1px solid rgb(var(--gb3,98 162 228) / .2)}
}
/* Active items: the secondary skin colour outlines the whole item, not just its left edge */
#community-app #app-sidebar a[aria-current=page]{box-shadow:inset 0 0 0 1.5px var(--ui-accent)!important}
#community-app .handbook-prose .hb-tab[aria-selected=true]{border-color:rgb(var(--gb-gold,233 179 90))!important;box-shadow:none!important}

/* Split sections only split when they stand alone; inside a grid of cards they stay one column */
#community-app .handbook-prose .hb-grid>.hb-section-split{columns:auto}
/* Sidebar: no count on the Bookmarks entry */
#community-app .bookmarks-menu-count{display:none!important}
/* Designations: tabs run across the top (the entries are short), the selected one fills the width below */
@container hbprose (min-width:820px){
 #community-app .handbook-prose .hb-grid.hb-tabs.hb-tabs-row{grid-template-columns:1fr!important;gap:18px}
 #community-app .handbook-prose .hb-tabs-row>.hb-tablist{flex-direction:row;position:static;gap:8px}
 #community-app .handbook-prose .hb-tabs-row>.hb-tablist>.hb-tab{flex:1 1 0;justify-content:center}
 #community-app .handbook-prose .hb-grid.hb-tabs.hb-tabs-row>.hb-tabpanel{grid-column:1;grid-row:auto;padding:6px 8px 2px;border-left:0;border-top:1px solid rgb(var(--gb3,98 162 228) / .2);padding-top:18px}
 #community-app .handbook-prose .hb-tabs-row>.hb-tabpanel>ul{columns:3;column-gap:32px}
 #community-app .handbook-prose .hb-tabs-row>.hb-tabpanel>ul>li{break-inside:avoid}
}

/* Tips sit beside their control: they slide in from that control's side. */
.themed-tooltip[data-side=right]{translate:-4px 0}.themed-tooltip[data-side=left]{translate:4px 0}
.themed-tooltip[data-side=above]{translate:0 -3px}
.themed-tooltip.is-visible[data-side]{translate:0 0}

/* No visible dividers in the Guidebook: an authored <hr> only ends a layout block. Headings and their underline separate sections. */
#community-app .handbook-prose hr,#community-app[data-scene] .guide-layout .handbook-prose>hr,#community-app[data-scene] .guide-layout .handbook-prose hr.hb-divider{border:0!important;background:none!important;height:0!important;margin:0!important}
/* Sections that sit side by side get the same card treatment as grid entries, so every entry on a page looks alike. */
#community-app .handbook-prose .hb-row>.hb-section{padding:18px 20px 16px;border-radius:12px;border:1px solid rgb(var(--gb3,98 162 228) / .16);background:linear-gradient(180deg,rgb(var(--gb3,98 162 228) / .05),rgb(255 255 255 / .01))}
#community-app .handbook-prose .hb-row>.hb-section+.hb-section::before{display:none}
@container hbprose (min-width:820px){#community-app .handbook-prose .hb-row{column-gap:14px}}
#community-app[data-scene] .guide-layout .handbook-prose .hb-row>.hb-section>h3{margin:0 0 10px!important;padding-bottom:8px}
#community-app[data-scene] .guide-layout .handbook-prose .hb-row>.hb-section>:last-child{margin-bottom:0}
/* Timeline: a boxed track of milestones; authored entries first, then live site events. */
#community-app .handbook-prose .hb-section-wide:has(>.hb-timeline){padding:20px 22px 22px;border-radius:12px;border:1px solid rgb(var(--gb3,98 162 228) / .16);background:linear-gradient(180deg,rgb(var(--gb3,98 162 228) / .05),rgb(255 255 255 / .01))}
#community-app[data-scene] .guide-layout .handbook-prose .hb-section-wide:has(>.hb-timeline)>h3{margin-top:0!important}
#community-app .handbook-prose .hb-timeline{display:grid;grid-template-columns:1fr;gap:0;margin:16px 0 0;padding:0;list-style:none}
#community-app .handbook-prose .hb-tl-live{display:contents}
#community-app .handbook-prose .hb-tl-item{position:relative;display:flex;flex-direction:column;gap:4px;padding:0 0 18px 26px;color:inherit;text-decoration:none}
#community-app .handbook-prose .hb-tl-item::before{content:"";position:absolute;left:5px;top:6px;bottom:-6px;width:2px;background:rgb(var(--gb3,98 162 228) / .35)}
#community-app .handbook-prose .hb-tl-item:last-child::before{display:none}
#community-app .handbook-prose .hb-tl-item::after{content:"";position:absolute;left:0;top:3px;width:12px;height:12px;border-radius:50%;border:2px solid rgb(var(--gb3,98 162 228));background:#11151c;box-sizing:border-box}
#community-app .handbook-prose .hb-tl-item.is-now::after{background:rgb(var(--gb3,98 162 228));box-shadow:0 0 0 4px rgb(var(--gb3,98 162 228) / .22)}
#community-app .handbook-prose .hb-tl-item.is-done::after{background:rgb(var(--gb3,98 162 228) / .55)}
#community-app .handbook-prose .hb-tl-when{font:700 11px/1.2 'Segoe UI',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:rgb(var(--gb3,98 162 228))}
#community-app .handbook-prose .hb-tl-item>strong{font-size:1.02em;line-height:1.3}
#community-app .handbook-prose .hb-tl-item>span:last-child{opacity:.82;font-size:.94em;line-height:1.5}
#community-app .handbook-prose a.hb-tl-item:hover>strong{text-decoration:underline;text-underline-offset:3px}
@container hbprose (min-width:820px){
 #community-app .handbook-prose .hb-timeline{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0 18px}
 #community-app .handbook-prose .hb-tl-item{padding:26px 0 8px 0}
 #community-app .handbook-prose .hb-tl-item::before{left:0;right:-18px;top:8px;bottom:auto;width:auto;height:2px}
 #community-app .handbook-prose .hb-tl-item:last-child::before{display:block;right:0}
 #community-app .handbook-prose .hb-tl-item::after{top:3px}
}

/* Events chapter: live event cards. */
#community-app .handbook-prose .hb-section-wide:has(>.hb-events-live){padding:20px 22px 22px;border-radius:12px;border:1px solid rgb(var(--gb3,98 162 228) / .16);background:linear-gradient(180deg,rgb(var(--gb3,98 162 228) / .05),rgb(255 255 255 / .01))}
#community-app[data-scene] .guide-layout .handbook-prose .hb-section-wide:has(>.hb-events-live)>h3{margin-top:0!important}
#community-app .handbook-prose .hb-events-live{display:grid;grid-template-columns:1fr;gap:12px;margin-top:14px}
#community-app .handbook-prose .hb-ev-card{display:grid;grid-template-columns:120px minmax(0,1fr);gap:14px;align-items:start;padding:10px;border-radius:10px;border:1px solid rgb(var(--gb3,98 162 228) / .18);background:rgb(0 0 0 / .18);color:inherit;text-decoration:none;transition:border-color .15s,background .15s}
#community-app .handbook-prose .hb-ev-card:hover{border-color:rgb(var(--gb3,98 162 228) / .6);background:rgb(var(--gb3,98 162 228) / .08)}
#community-app .handbook-prose .hb-ev-card>img{width:120px;aspect-ratio:4/3;object-fit:cover;border-radius:7px;display:block;margin:0}
#community-app .handbook-prose .hb-ev-body{display:flex;flex-direction:column;gap:4px}
#community-app .handbook-prose .hb-ev-body>strong{line-height:1.3}
#community-app .handbook-prose .hb-ev-body>span:last-child{opacity:.82;font-size:.94em;line-height:1.5}
#community-app .handbook-prose .hb-ev-all{justify-self:end;font-weight:700;font-size:.92em}
#community-app .handbook-prose .hb-ev-empty{margin:0;opacity:.8}
@container hbprose (min-width:820px){#community-app .handbook-prose .hb-events-live{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}#community-app .handbook-prose .hb-ev-all{grid-column:1 / -1}}
#community-app .handbook-prose .hb-events-live{display:flex!important;flex-wrap:wrap;gap:12px}
#community-app .handbook-prose .hb-ev-card{flex:1 1 320px}
#community-app .handbook-prose .hb-ev-all,#community-app .handbook-prose .hb-ev-empty{flex:1 0 100%;text-align:right}
#community-app .handbook-prose .hb-ev-empty{text-align:left}
#community-app[data-scene] .guide-layout .handbook-prose a.hb-ev-card,#community-app[data-scene] .guide-layout .handbook-prose a.hb-tl-item{color:inherit!important;text-decoration:none!important}
#community-app[data-scene] .guide-layout .handbook-prose a.hb-ev-card:hover strong,#community-app[data-scene] .guide-layout .handbook-prose a.hb-tl-item:hover strong{text-decoration:underline;text-underline-offset:3px}

/* Welcome title in the skin's secondary colour. */
#community-app[data-scene] .guide-layout .handbook-prose .welcome-opener h2{color:rgb(var(--gb-gold,233 179 90))!important;text-shadow:0 0 1px currentColor,0 2px 14px rgb(var(--gb-gold,233 179 90) / .25)}
#community-app[data-scene] .guide-layout .handbook-prose .welcome-city-heading~p{max-width:none!important}

/* Designations: a line of radio chatter above each entry. */
#community-app[data-scene] .guide-layout .handbook-prose .hb-flavor{font-style:italic;color:rgb(var(--gb3,98 162 228));padding-left:12px;border-left:2px solid rgb(var(--gb3,98 162 228) / .5);margin-bottom:12px}

/* Origins: a poster in a third column beside the selected origin, to balance the panel on wide screens. */
#community-app .handbook-prose .hb-tabs-figure{display:none;margin:0}
@container hbprose (min-width:1180px){
 #community-app .handbook-prose .hb-grid.hb-tabs.hb-tabs-art{grid-template-columns:minmax(210px,260px) minmax(0,1fr) minmax(180px,240px)!important}
 #community-app .handbook-prose .hb-tabs-art>.hb-tabs-figure{display:block;grid-column:3;grid-row:1;align-self:start;position:sticky;top:0}
 #community-app .handbook-prose .hb-tabs-figure img{display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:cover;border-radius:10px;border:1px solid rgb(var(--gb3,98 162 228) / .25);box-shadow:0 8px 22px #0007}
}
@container hbprose (min-width:1180px){#community-app .handbook-prose .hb-section:has(>.hb-comp){grid-template-columns:repeat(3,minmax(0,1fr))}#community-app .handbook-prose .hb-rung{grid-template-columns:44px minmax(0,1fr);gap:10px}}

@container hbprose (min-width:1000px){#community-app .handbook-prose .hb-row.hb-row-3{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) minmax(0,1fr)}}
@container hbprose (min-width:820px) and (max-width:999px){#community-app .handbook-prose .hb-row.hb-row-3>.hb-section:first-child{grid-column:1 / -1}#community-app .handbook-prose .hb-row.hb-row-3{row-gap:14px}}
/* Five competency cards: three on the first row, two wider ones on the second, so none sits alone. */
@container hbprose (min-width:1180px){#community-app .handbook-prose .hb-section:has(>.hb-comp){grid-template-columns:repeat(6,minmax(0,1fr))}#community-app .handbook-prose .hb-section:has(>.hb-comp)>.hb-comp{grid-column:span 2}#community-app .handbook-prose .hb-section:has(>.hb-comp)>.hb-comp:nth-of-type(n+4){grid-column:span 3}}
/* Example spreads: the number sits between the label and its bar. */
#community-app .handbook-prose .hb-meter{grid-template-columns:92px 20px minmax(0,1fr)!important}
#community-app .handbook-prose .hb-meter>strong{grid-column:2;grid-row:1}
#community-app .handbook-prose .hb-meter>.hb-meter-track{grid-column:3;grid-row:1}
#community-app[data-scene] .guide-layout .handbook-prose .hb-meter strong{text-align:center}

/* Window names are always shown, and slide right to stay clear of the sidebar / left screen edge. */
#community-app .sheet-window-bar .sheet-window-title{display:flex!important;align-items:center;align-self:stretch;text-align:left;padding-left:calc(8px + var(--sheet-title-inset,0px))!important;box-sizing:border-box;color:#182024}
#community-app .sheet-ghost-bar{padding-left:calc(10px + var(--sheet-title-inset,0px))!important}
/* Compact "New character" button (same size as the Review queue control below it). */
#community-app .cast-new #cast-new-character{padding:6px 12px;border-radius:7px;font-size:12.5px;letter-spacing:.3px}
/* Character sheet windows never grow past SHEET_MAX_WIDTH (see community-app.js). */
#community-app #profile-views#profile-views{max-width:1551px!important}
#community-app .sheet-ghost-window{max-width:1551px}
/* Post portrait hover: competency bars instead of the pentagon. */
#community-app .post-stat-bars{display:grid;gap:clamp(4px,6%,9px);width:100%;padding:0 4%;box-sizing:border-box;--stat-cutout:#15191c}
#community-app .post-stat-bar{display:grid;grid-template-columns:clamp(14px,18%,22px) minmax(0,1fr) clamp(12px,14%,18px);align-items:center;gap:clamp(4px,5%,8px);color:var(--character-color)}
#community-app .post-stat-bar-icon{display:grid;place-items:center;aspect-ratio:1}
#community-app .post-stat-bar-icon svg{width:100%;height:auto}
#community-app .post-stat-bar-track{display:block;height:6px;border-radius:99px;background:rgb(255 255 255 / .12);overflow:hidden}
#community-app .post-stat-bar-fill{display:block;height:100%;border-radius:inherit;background:var(--character-color)}
#community-app .post-stat-bar>b{font:700 11px/1 'Segoe UI',sans-serif;color:#f1ede4;text-align:right}
/* Wide screens: the gutters beside the 2560px site are the skin's own background colour, not black. */
body.hz-ca{background:var(--sdn-12161b,#141b25)!important}
#community-app{box-shadow:0 0 0 100vmax var(--sdn-12161b,#141b25)!important}
/* Wide screens: windows dragged into the navy side gutters stay visible instead of being clipped at the site's 2560px edge. */
@media (min-width:2561px){
 body.hz-ca{overflow:hidden}
 #community-app{overflow:visible!important}
}
/* Background windows keep the live window's full-height title bar (it sits above the frame, not inside it). */
#community-app .sheet-ghost-window{border-top-width:0}
#community-app .sheet-ghost-bar{height:var(--ghost-bar-height,27px)}

/* =====================================================================
   Main-page polish pass (Events, Main Index, Factions, Profile).
   ===================================================================== */

/* ---- Shared: page descriptions, empty states, one-page pagination ---- */
html body #community-app #app-view>.app-heading p.app-muted{margin:0;font:500 15px/1.5 'Segoe UI',sans-serif;color:#b9c3cf;letter-spacing:.1px}
html body #community-app .collection-pages:has(button[data-page="-1"]:disabled):has(button[data-page="1"]:disabled){display:none!important}
html body #community-app .app-surface.app-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:240px;padding:48px 24px;text-align:center;
 font:500 15px/1.5 'Segoe UI',sans-serif;color:#aeb8c4;background:radial-gradient(ellipse at 50% 0,#ffc45b12,transparent 70%),#0d1116cc;border:1px dashed #ffc45b55;border-radius:10px}
html body #community-app .app-surface.app-empty::before{content:'';width:46px;height:46px;border-radius:50%;margin-bottom:6px;
 background:#ffc45b1f url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffc45b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 21V4'/%3E%3Cpath d='M5 4h11l-2 4 2 4H5'/%3E%3C/svg%3E") center/24px no-repeat;box-shadow:0 0 0 1px #ffc45b44}

/* ---- Events: flat, crisp front page that fits its frame ---- */
html body #community-app #app-view.hz-newsany>.app-heading{margin-bottom:0}
html body #community-app .event-newspaper{transform:none!important;margin:14px auto 28px!important;width:calc(100% - 40px)!important;padding:30px 44px 26px!important;
 box-shadow:0 1px 0 #bcb59b,0 3px 0 #d1cbb5,0 6px 0 #c7c0a8,0 18px 40px #000a!important}
html body #community-app .event-newspaper .newspaper-masthead h2{font-size:clamp(44px,4.6vw,74px)!important;letter-spacing:-2px!important;margin:10px 0 12px!important}
html body #community-app .event-newspaper.newspaper-open .newspaper-masthead h2{font-size:clamp(30px,2.6vw,42px)!important;margin:6px 0 8px!important}
/* 12-column front page: lead story left, next two stacked on the right, the rest in rows of three. */
html body #community-app .newspaper-grid.event-edition-grid{grid-template-columns:repeat(12,minmax(0,1fr))!important;margin-top:18px!important}
html body #community-app .event-edition-grid .news-teaser{grid-column:span 4!important;grid-row:auto!important;padding:18px 24px 22px!important;border-right:1px solid #746f5855!important}
html body #community-app .event-edition-grid .news-teaser:first-child{grid-column:1 / span 7!important;grid-row:span 2!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2){grid-column:8 / span 5!important;border-right:0!important;
 display:grid!important;grid-template-columns:44% 1fr;grid-template-areas:"meta meta" "title title" "img text" "img more";column-gap:16px;align-content:start}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>.news-meta{grid-area:meta}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>h3{grid-area:title;font-size:24px!important;margin:8px 0 12px!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>img{grid-area:img;height:150px!important;margin:0!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>p{grid-area:text;font-size:14px!important;line-height:1.55!important;margin:0 0 8px!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>.news-continue{grid-area:more;align-self:end}
html body #community-app .event-edition-grid .news-teaser.news-slot-2{border-bottom:0!important}
html body #community-app .event-edition-grid .news-teaser:nth-child(n+4):nth-child(3n+3){border-right:0!important}
html body #community-app .event-edition-grid .news-teaser:first-child h3{font-size:clamp(34px,3vw,50px)!important}
html body #community-app .event-edition-grid .news-teaser:first-child img{height:clamp(240px,21vw,360px)!important}
html body #community-app .event-edition-grid .news-teaser:first-child p{column-count:1!important;font-size:18px!important;line-height:1.7!important;max-width:62ch}
html body #community-app .event-edition-grid .news-teaser:first-child p::first-letter{float:left;font:900 64px/.82 Georgia,serif;margin:6px 10px 0 0;color:#242923}
/* A lone story or two stories still fill the width. */
html body #community-app .event-edition-grid:not(:has(.news-slot-1)) .news-teaser:first-child{grid-column:1 / -1!important}
html body #community-app .event-edition-grid:not(:has(.news-slot-2)) .news-teaser:first-child{grid-row:auto!important}
/* Kickers stay on one line; the COMPLETE stamp sits inside its own story. */
html body #community-app .event-edition-grid .news-meta{display:flex;align-items:center;gap:10px;min-width:0}
html body #community-app .event-edition-grid .news-category{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
html body #community-app .event-edition-grid .event-status.is-complete{top:14px!important;left:auto!important;right:14px!important;transform:rotate(-9deg)!important;
 font-size:18px!important;padding:5px 12px!important;border-width:3px!important;max-width:none!important;background:#ded9c5cc!important}
@media(max-width:1199px){
 html body #community-app .newspaper-grid.event-edition-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 html body #community-app .event-edition-grid .news-teaser,html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2){grid-column:auto!important;display:block!important}
 html body #community-app .event-edition-grid .news-teaser:first-child{grid-column:1 / -1!important;grid-row:auto!important}
 html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>img{height:170px!important;margin-bottom:12px!important}
}

/* ---- Main Index: slimmer category bars, tidier cards ---- */
html body #community-app .forum-index-section>header{padding:12px 18px!important;min-height:0!important}
html body #community-app .forum-index-section>header h2{font:700 13px/1.2 'Segoe UI',sans-serif!important;letter-spacing:.22em!important;text-transform:uppercase!important;display:flex;align-items:center;gap:12px}
html body #community-app .forum-index-section>header h2 a{color:#ffc45b!important}
html body #community-app .forum-index-section>header h2::before{content:'';width:4px;height:16px;border-radius:2px;background:var(--name-icon-color,#ffc45b)}
html body #community-app .forum-index-section>header>button{padding:5px 12px!important;font-size:12px!important;background:transparent!important;border-color:#ffffff24!important;color:#aab4c0!important;opacity:.55;transition:opacity .15s}
html body #community-app .forum-index-section:hover>header>button,html body #community-app .forum-index-section>header>button:focus-visible{opacity:1}
html body #community-app .basic-forum-counts{display:flex!important;gap:6px;align-items:center;flex-wrap:wrap}
html body #community-app .basic-forum-counts strong{font-weight:700}
html body #community-app .index-page-entry:has(a[href="#/guidebook"]) .forum-entry-label h3::after{content:'Setting, rules & getting started';display:block;margin-top:8px;font:400 14px/1.4 'Segoe UI',sans-serif;letter-spacing:0;text-transform:none;color:#b9c3cf}
/* Last-post avatars that fail to load become initials (see community-app.js). */
html body #community-app .forum-last-avatar.is-initials{display:grid;place-items:center;background:color-mix(in srgb,var(--entry-accent,#9fbce4) 35%,#141a22);color:#eef2f7;font:700 12px/1 'Segoe UI',sans-serif;letter-spacing:.04em}

/* ---- Profile: settings and characters side by side ---- */
html body #community-app[data-scene=player] #app-view>.app-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:36px;align-items:start;padding:28px 30px}
html body #community-app[data-scene=player] #app-view>.app-panel>*{grid-column:1}
html body #community-app[data-scene=player] #app-view>.app-panel>.player-field{grid-column:2;grid-row:1 / span 9;margin:0;padding:18px 20px;background:#0c1015;border:1px solid #ffffff14;border-radius:10px}
html body #community-app[data-scene=player] #app-view>.app-panel>.app-actions{grid-column:2;grid-row:10;justify-content:flex-end;margin-top:14px}
html body #community-app[data-scene=player] #app-view>.app-panel>h2{margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid #ffc45b33;font:700 13px/1.2 'Segoe UI',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#ffc45b}
html body #community-app[data-scene=player] #app-view>.app-panel>h2:not(:first-child){margin-top:26px}
html body #community-app[data-scene=player] #app-view>.app-panel>label{display:flex;align-items:center;gap:14px;font-weight:600}
html body #community-app[data-scene=player] .player-field h3{display:flex;align-items:center;gap:10px;margin:0 0 10px;font:700 13px/1.2 'Segoe UI',sans-serif;letter-spacing:.2em;color:#ffc45b}
html body #community-app[data-scene=player] .player-field>a{display:flex;align-items:center;justify-content:space-between;padding:11px 12px;border-radius:7px;border-bottom:0;color:#e6ebf1;font-weight:600;transition:background .15s}
html body #community-app[data-scene=player] .player-field>a+a{border-top:1px solid #ffffff0d}
html body #community-app[data-scene=player] .player-field>a::after{content:'›';color:#ffc45b;font-size:20px;line-height:1;opacity:.5;transition:opacity .15s,transform .15s}
html body #community-app[data-scene=player] .player-field>a:hover{background:#ffc45b12}
html body #community-app[data-scene=player] .player-field>a:hover::after{opacity:1;transform:translateX(3px)}
@media(max-width:900px){html body #community-app[data-scene=player] #app-view>.app-panel{display:block}}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2){align-self:start}
html body #community-app .event-edition-grid .news-teaser.news-slot-1{border-bottom:0!important}
html body #community-app .event-edition-grid .news-teaser.news-slot-2{border-top:1px solid #746f5855}
html body #community-app .event-edition-grid .event-status.is-complete{top:auto!important;bottom:22px!important;right:18px!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2) .event-status.is-complete{right:auto!important;left:40px!important;bottom:70px!important}
html body #community-app .newspaper-grid.event-edition-grid:has(.news-slot-2){grid-template-rows:auto 1fr}
html body #community-app .event-edition-grid .news-teaser.news-slot-1{grid-row:1!important}
html body #community-app .event-edition-grid .news-teaser.news-slot-2{grid-row:2!important}
html body #community-app .event-edition-grid .news-teaser:first-child{grid-row:1 / 3!important}
html body #community-app .event-edition-grid:not(:has(.news-slot-2)) .news-teaser:first-child{grid-row:auto!important}
html body #community-app .event-edition-grid .event-status.is-complete{background:#e4dfcaee!important;opacity:1!important;mix-blend-mode:normal!important}

/* =====================================================================
   Events as a digital news desk (replaces the printed-newspaper look).
   ===================================================================== */
html body #community-app .event-newspaper{--news-ink:#e9edf2;--news-soft:#aeb8c4;--news-line:#ffffff17;--news-accent:var(--color-accent-default,#ffc45b);
 color:var(--news-ink)!important;background:linear-gradient(180deg,#141b24,#0e1319)!important;border:1px solid #ffffff14!important;border-radius:12px!important;
 box-shadow:0 18px 40px #0009,inset 0 1px 0 #ffffff0d!important;padding:0 0 22px!important;overflow:hidden}
html body #community-app .event-newspaper::before,html body #community-app .event-newspaper::after{display:none!important}
/* Masthead: a site header bar, not a broadsheet nameplate. */
html body #community-app .event-newspaper .newspaper-masthead{display:grid;grid-template-columns:1fr auto;align-items:end;gap:6px 24px;padding:22px 32px 18px;
 background:linear-gradient(90deg,color-mix(in srgb,var(--news-accent) 16%,transparent),transparent 60%),#10161e;border-bottom:1px solid var(--news-line)}
html body #community-app .event-newspaper .newspaper-edition{grid-column:1 / -1;border:0!important;padding:0!important;font:700 11px/1.2 'Segoe UI',sans-serif!important;letter-spacing:.22em!important;color:var(--news-accent)!important}
html body #community-app .event-newspaper .newspaper-edition span:last-child{color:var(--news-soft)}
html body #community-app .event-newspaper .newspaper-masthead h2{grid-column:1;text-align:left!important;margin:0!important;color:#fff!important;
 font:700 clamp(30px,2.8vw,44px)/1.05 'Oswald','Segoe UI',sans-serif!important;letter-spacing:.02em!important;text-transform:uppercase}
html body #community-app .event-newspaper .newspaper-rule{grid-column:2;align-self:end;border:0!important;padding:0!important;gap:10px!important;font:600 11px/1 'Segoe UI',sans-serif!important;letter-spacing:.14em!important;color:var(--news-soft)!important}
html body #community-app .event-newspaper .newspaper-rule span{padding:6px 10px;border:1px solid var(--news-line);border-radius:999px;background:#ffffff08}
html body #community-app .event-newspaper .newspaper-rule span:first-child::before{content:'';display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:#e2493b;box-shadow:0 0 8px #e2493b;vertical-align:1px;animation:news-live 1.6s ease-in-out infinite}
@keyframes news-live{50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){html body #community-app .event-newspaper .newspaper-rule span:first-child::before{animation:none}}
/* Story grid: cards on a dark surface. */
html body #community-app .newspaper-grid.event-edition-grid{gap:18px!important;padding:22px 26px 0;margin-top:0!important}
html body #community-app .event-edition-grid .news-teaser{padding:0 0 18px!important;border:1px solid var(--news-line)!important;border-radius:10px;background:#0b1015;overflow:hidden;color:var(--news-ink)!important;
 transition:border-color .18s,transform .18s,box-shadow .18s}
html body #community-app .event-edition-grid .news-teaser:hover{border-color:color-mix(in srgb,var(--news-accent) 55%,transparent)!important;box-shadow:0 10px 26px #0008;transform:translateY(-2px)}
html body #community-app .event-edition-grid .news-teaser>*{margin-inline:20px!important}
html body #community-app .event-edition-grid .news-teaser>img{margin-inline:0!important;width:100%;filter:none!important;border-radius:0;display:block}
html body #community-app .event-edition-grid .news-teaser .news-meta{margin-top:16px!important}
html body #community-app .event-edition-grid .news-teaser h3{color:#fff!important;font-family:'Segoe UI',sans-serif!important;font-weight:700!important;letter-spacing:-.01em!important}
html body #community-app .event-edition-grid .news-teaser:hover h3{text-decoration:none!important;color:var(--news-accent)!important}
html body #community-app .event-edition-grid .news-teaser p{color:var(--news-soft)!important;font-family:'Segoe UI',sans-serif!important}
html body #community-app .event-edition-grid .news-teaser:first-child p::first-letter{float:none;font:inherit;margin:0;color:inherit}
html body #community-app .event-edition-grid .news-continue{color:var(--news-accent)!important;font:700 11px/1 'Segoe UI',sans-serif!important;letter-spacing:.16em!important}
/* Lead story: image on top, full-bleed. */
html body #community-app .event-edition-grid .news-teaser:first-child{display:flex!important;flex-direction:column}
html body #community-app .event-edition-grid .news-teaser:first-child>img{order:-1;height:clamp(240px,22vw,380px)!important;margin:0!important}
html body #community-app .event-edition-grid .news-teaser:first-child h3{font-size:clamp(28px,2.4vw,40px)!important;line-height:1.12!important;margin-top:10px!important}
html body #community-app .event-edition-grid .news-teaser:first-child p{font-size:17px!important;line-height:1.65!important}
/* Side stories: thumbnail + text. */
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2){padding:16px 18px!important;grid-template-columns:38% 1fr!important;column-gap:16px!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>*{margin-inline:0!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2) .news-meta{margin-top:0!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>h3{font-size:20px!important;line-height:1.25!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>img{height:130px!important;border-radius:7px!important}
html body #community-app .event-edition-grid .news-teaser.news-slot-2{border-top:1px solid var(--news-line)!important}
/* Kickers and status chips. */
html body #community-app .event-newspaper .news-category{color:var(--news-soft)!important;font:600 11px/1 'Segoe UI',sans-serif!important;letter-spacing:.14em!important;text-transform:uppercase}
html body #community-app .event-newspaper .event-status{position:static!important;transform:none!important;display:inline-flex;align-items:center;gap:6px;padding:4px 9px!important;border-radius:999px!important;border:1px solid!important;
 font:700 10.5px/1 'Segoe UI',sans-serif!important;letter-spacing:.14em!important;max-width:none!important;background:transparent!important}
html body #community-app .event-newspaper .event-status.is-active{color:#ff8f6b!important;border-color:#ff8f6b66!important;background:#ff8f6b14!important}
html body #community-app .event-newspaper .event-status.is-active::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
html body #community-app .event-newspaper .event-status.is-complete{color:#7fd6a4!important;border-color:#7fd6a466!important;background:#7fd6a414!important}
html body #community-app .event-newspaper .event-status.is-complete::before{content:'✓';font-size:11px}
/* Pagination and buttons in site style. */
html body #community-app .event-newspaper .collection-pages{margin:18px 26px 0;border-top:1px solid var(--news-line)!important;color:var(--news-soft)}
html body #community-app .event-newspaper button{border-radius:7px!important;border-color:var(--news-line)!important;color:var(--news-ink)!important}
html body #community-app .event-newspaper button:hover{background:#ffffff0f!important}
/* Article page. */
html body #community-app .event-newspaper .newspaper-return{display:inline-block;margin:18px 32px 0;color:var(--news-accent)!important;font:600 13px/1 'Segoe UI',sans-serif!important;letter-spacing:.04em;text-decoration:none!important}
html body #community-app .event-newspaper.newspaper-open .newspaper-story{max-width:880px;margin:0 auto;padding:18px 32px 30px!important}
html body #community-app .event-newspaper .newspaper-story h2{color:#fff!important;font:700 clamp(30px,3vw,46px)/1.12 'Segoe UI',sans-serif!important;letter-spacing:-.01em!important}
html body #community-app .event-newspaper .news-deck{color:#c9d2dc!important;font:400 19px/1.6 'Segoe UI',sans-serif!important;font-style:normal!important;border-color:var(--news-line)!important}
html body #community-app .event-newspaper .newspaper-story>img{filter:none!important;border-radius:10px;max-height:420px}
html body #community-app .event-newspaper .news-body{color:#d6dde5!important;font-family:'Segoe UI',sans-serif!important;column-count:1!important}
html body #community-app .event-newspaper .news-body p{margin:0 0 18px}
html body #community-app .event-newspaper .event-linked-threads{margin:0 32px;padding-top:22px;border-top:1px solid var(--news-line);color:var(--news-ink)}
html body #community-app .event-newspaper .event-linked-threads h3{color:var(--news-accent)!important;font:700 13px/1 'Segoe UI',sans-serif!important;letter-spacing:.18em!important;text-transform:uppercase}
html body #community-app .event-newspaper .event-thread-card{background:#0b1015!important;border:1px solid var(--news-line)!important;border-radius:9px!important;color:var(--news-soft)!important;box-shadow:none!important}
html body #community-app .event-newspaper .event-thread-card .event-thread-title{color:#fff!important}
html body #community-app .event-newspaper .event-edition-grid .news-teaser .event-status.is-complete{position:static!important;transform:none!important;font-size:10.5px!important;padding:4px 9px!important;border-width:1px!important;background:#7fd6a414!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important}
html body #community-app .event-newspaper .news-body p::first-line{color:var(--news-accent);font-weight:700;letter-spacing:.14em;font-size:13px}
html body #community-app .event-newspaper .event-thread-card .event-thread-title{font:700 17px/1.3 'Segoe UI',sans-serif!important;text-decoration:none!important}
html body #community-app .event-newspaper .event-thread-card:hover .event-thread-title{color:var(--news-accent)!important}
html body #community-app .event-newspaper .event-thread-card p{font:400 13.5px/1.5 'Segoe UI',sans-serif!important;font-style:normal!important;color:#b9c3cf!important;opacity:1!important}
html body #community-app .event-newspaper .event-thread-card small{color:#8d98a5!important}
/* Bottom edge: the two side stories share the lead story's height, so both columns end on one line. */
html body #community-app .newspaper-grid.event-edition-grid:has(.news-slot-2){grid-template-rows:1fr 1fr!important;padding-bottom:0}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2){align-self:stretch!important;grid-template-rows:auto auto 1fr auto;grid-template-areas:"meta meta" "title title" "img text" "img more"!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>img{align-self:start}
html body #community-app .event-edition-grid .news-teaser:first-child>.news-continue{margin-top:auto!important;padding-top:6px}
html body #community-app .event-newspaper:not(.newspaper-open){padding-bottom:26px!important}
html body #community-app .event-newspaper:not(.newspaper-open){margin-bottom:10px!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>img{align-self:stretch!important;height:100%!important;min-height:130px}
/* Stories 4 and 5 (a full page holds five): a row of two wide cards under the lead block, thumbnail beside text.
   A fourth story on its own spans the full width. More than five go to the next page. */
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-3,.news-slot-4){grid-column:span 6!important;display:grid!important;grid-template-columns:38% 1fr;grid-template-rows:auto auto 1fr auto;
 grid-template-areas:"img meta" "img title" "img text" "img more";column-gap:18px;padding:0 18px 0 0!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-3,.news-slot-4)>*{margin-inline:0!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-3,.news-slot-4)>.news-meta{grid-area:meta;margin-top:16px!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-3,.news-slot-4)>h3{grid-area:title;font-size:20px!important;line-height:1.25!important;margin:10px 0 8px!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-3,.news-slot-4)>img{grid-area:img;height:100%!important;min-height:170px;margin:0!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-3,.news-slot-4)>p{grid-area:text;font-size:14px!important;line-height:1.55!important;margin:0 0 10px!important}
html body #community-app .event-edition-grid .news-teaser:is(.news-slot-3,.news-slot-4)>.news-continue{grid-area:more;margin-bottom:16px!important}
html body #community-app .event-edition-grid:not(:has(.news-slot-4)) .news-teaser.news-slot-3{grid-column:1 / -1!important;grid-template-columns:28% 1fr}
/* Two stories: lead and one side card of equal height. */
html body #community-app .event-edition-grid:has(.news-slot-1):not(:has(.news-slot-2)) .news-teaser.news-slot-1{grid-row:1!important;align-self:stretch!important;grid-template-rows:auto auto 1fr auto}
/* Two stories: the second is a stacked card (image on top) rather than a stretched thumbnail. */
html body #community-app .event-edition-grid:has(.news-slot-1):not(:has(.news-slot-2)) .news-teaser.news-slot-1{display:flex!important;flex-direction:column;padding:0 0 18px!important}
html body #community-app .event-edition-grid:has(.news-slot-1):not(:has(.news-slot-2)) .news-teaser.news-slot-1>*{margin-inline:20px!important}
html body #community-app .event-edition-grid:has(.news-slot-1):not(:has(.news-slot-2)) .news-teaser.news-slot-1>img{order:-1;margin:0!important;height:clamp(200px,16vw,280px)!important;min-height:0;border-radius:0!important}
html body #community-app .event-edition-grid:has(.news-slot-1):not(:has(.news-slot-2)) .news-teaser.news-slot-1>.news-meta{margin-top:16px!important}
html body #community-app .event-edition-grid:has(.news-slot-1):not(:has(.news-slot-2)) .news-teaser.news-slot-1>.news-continue{margin-top:auto!important}
/* One story: image beside the text, so it doesn't become a cropped banner. */
html body #community-app .event-edition-grid:not(:has(.news-slot-1)) .news-teaser:first-child{display:grid!important;grid-template-columns:55% 1fr;grid-template-rows:auto auto 1fr auto;grid-template-areas:"img meta" "img title" "img text" "img more";column-gap:28px;padding:0 28px 0 0!important}
html body #community-app .event-edition-grid:not(:has(.news-slot-1)) .news-teaser:first-child>*{margin-inline:0!important}
html body #community-app .event-edition-grid:not(:has(.news-slot-1)) .news-teaser:first-child>img{grid-area:img;height:100%!important;min-height:340px}
html body #community-app .event-edition-grid:not(:has(.news-slot-1)) .news-teaser:first-child>.news-meta{grid-area:meta;margin-top:28px!important}
html body #community-app .event-edition-grid:not(:has(.news-slot-1)) .news-teaser:first-child>h3{grid-area:title}
html body #community-app .event-edition-grid:not(:has(.news-slot-1)) .news-teaser:first-child>p{grid-area:text}
html body #community-app .event-edition-grid:not(:has(.news-slot-1)) .news-teaser:first-child>.news-continue{grid-area:more;margin-bottom:28px!important}
html body #community-app .event-edition-grid .news-teaser>.news-continue{align-self:flex-start;justify-self:start}
@media(max-width:1199px){html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2){display:flex!important;flex-direction:column;padding:0 0 18px!important}
 html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>*{margin-inline:20px!important}
 html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>img{order:-1;margin:0!important;height:200px!important;min-height:0;border-radius:0!important}
 html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>.news-meta{margin-top:16px!important}
 html body #community-app .newspaper-grid.event-edition-grid:has(.news-slot-2){grid-template-rows:auto!important}
 html body #community-app .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2){grid-row:auto!important}}
/* Event threads reuse the World's thread cards; they just sit in the article's width. */
html body #community-app .event-newspaper .event-thread-cards{width:100%!important;max-width:none!important;margin:14px 0 8px!important;color:initial}
html body #community-app .event-newspaper .event-threads-empty{color:var(--news-soft)}
html body #community-app .event-newspaper .event-edition-grid .news-teaser>.news-continue{align-self:flex-start!important;justify-self:start!important}
@media(max-width:1199px){html body #community-app .event-newspaper .event-edition-grid .news-teaser:is(.news-slot-1,.news-slot-2)>:not(img){margin-left:20px!important;margin-right:20px!important}}
/* Events and the Main Index were taller than the page frame, which clips (overflow:hidden) and never scrolled.
   The content under the page heading is now its own scroll area, inside the gold frame, with a visible scrollbar. */
html body #community-app:is([data-scene=events],[data-scene=welcome],[data-scene=index]) #app-view.hz-newsidx{display:flex!important;flex-direction:column;min-height:0}
html body #community-app:is([data-scene=events],[data-scene=welcome],[data-scene=index]) #app-view>.app-heading{flex:none}
html body #community-app:is([data-scene=events],[data-scene=welcome],[data-scene=index]) #app-view>:is(.event-newspaper,.forum-main-index){flex:1 1 auto;min-height:0;overflow-y:auto!important;overscroll-behavior:contain;
 scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 70%,transparent) transparent;scrollbar-gutter:stable}
html body #community-app[data-scene=events] #app-view>.event-newspaper{margin-bottom:0!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index{padding-right:6px}
html body #community-app:is([data-scene=events],[data-scene=welcome],[data-scene=index]) #app-view>:is(.event-newspaper,.forum-main-index)::-webkit-scrollbar{width:8px}
html body #community-app:is([data-scene=events],[data-scene=welcome],[data-scene=index]) #app-view>:is(.event-newspaper,.forum-main-index)::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent);border-radius:8px}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index>*{flex-shrink:0!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index{grid-template-rows:none!important;grid-auto-rows:max-content!important;align-content:start!important}

/* ---- Events: use the whole frame. No separate button row, no side gutters, no narrow article column. ---- */
html body #community-app[data-scene=events] #app-view{position:relative}
html body #community-app[data-scene=events] #app-view>.app-heading{position:absolute!important;z-index:3;top:62px;right:72px;margin:0!important;pointer-events:none}
html body #community-app[data-scene=events] #app-view>.app-heading button{pointer-events:auto}
html body #community-app .event-newspaper{width:100%!important;max-width:none!important;margin:0!important}
html body #community-app .event-newspaper .newspaper-edition span:last-child{display:none}
html body #community-app .event-newspaper .newspaper-masthead{padding:20px 28px 18px!important}
html body #community-app .event-newspaper .newspaper-rule{margin-right:0}
html body #community-app .newspaper-grid.event-edition-grid{padding:20px 28px 0!important;gap:16px!important}
html body #community-app .event-edition-grid .news-teaser:first-child p{max-width:none!important}
html body #community-app .event-newspaper:not(.newspaper-open){padding-bottom:20px!important}
/* Article: story on the left at full width, event threads in a column on the right. */
html body #community-app .event-newspaper.newspaper-open{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(360px,32%);grid-template-rows:auto auto 1fr;column-gap:28px;align-content:start;padding:0 28px 28px!important}
html body #community-app .event-newspaper.newspaper-open>.newspaper-masthead{grid-column:1 / -1;margin:0 -28px!important}
html body #community-app .event-newspaper.newspaper-open>.newspaper-return{grid-column:1 / -1;margin:18px 0 0!important;justify-self:start}
html body #community-app .event-newspaper.newspaper-open>.newspaper-story{grid-column:1;max-width:none!important;margin:0!important;padding:14px 0 0!important}
html body #community-app .event-newspaper.newspaper-open .newspaper-story>img{width:100%;max-height:460px}
html body #community-app .event-newspaper.newspaper-open .news-body{max-width:none}
html body #community-app .event-newspaper.newspaper-open>.event-linked-threads{grid-column:2;grid-row:3;align-self:start;position:sticky;top:0;margin:14px 0 0!important;padding:18px!important;border:1px solid var(--news-line)!important;border-radius:10px;background:#0b1015}
html body #community-app .event-newspaper.newspaper-open>.event-linked-threads h3{margin:0 0 4px}
html body #community-app .event-newspaper.newspaper-open .event-thread-cards{grid-template-columns:1fr!important;margin:12px 0 0!important}
@media(max-width:1199px){
 html body #community-app .event-newspaper.newspaper-open{grid-template-columns:1fr}
 html body #community-app .event-newspaper.newspaper-open>.event-linked-threads{grid-column:1;grid-row:auto;position:static}
 html body #community-app .event-newspaper.newspaper-open .event-thread-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
/* Button sits in the masthead row, beside the pills (not on top of them). */
html body #community-app[data-scene=events] #app-view>.app-heading{top:auto;right:auto;inset:calc(40px + 1px + 20px + 38px - 22px) calc(40px + 28px) auto auto!important;transform:none}
html body #community-app .event-newspaper .newspaper-masthead{padding-right:calc(28px + 150px)!important}
html body #community-app[data-scene=events] #app-view>.event-newspaper{scrollbar-gutter:auto!important}
/* Article: headline full width; image and body side by side; threads full width below in the World's two-column grid. */
html body #community-app .event-newspaper.newspaper-open{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:none!important}
html body #community-app .event-newspaper.newspaper-open>.newspaper-story{display:grid!important;grid-template-columns:minmax(0,42%) minmax(0,1fr);grid-template-areas:"meta meta" "title title" "deck deck" "img body";column-gap:32px;align-items:start}
html body #community-app .event-newspaper.newspaper-open>.newspaper-story>.news-meta{grid-area:meta}
html body #community-app .event-newspaper.newspaper-open>.newspaper-story>h2{grid-area:title}
html body #community-app .event-newspaper.newspaper-open>.newspaper-story>.news-deck{grid-area:deck;max-width:none}
html body #community-app .event-newspaper.newspaper-open>.newspaper-story>img{grid-area:img;position:sticky;top:16px;margin:4px 0 0!important;max-height:none!important;height:auto;aspect-ratio:4/3;object-fit:cover}
html body #community-app .event-newspaper.newspaper-open>.newspaper-story>.news-body{grid-area:body}
html body #community-app .event-newspaper.newspaper-open>.newspaper-story>:not(.news-meta,h2,.news-deck,img,.news-body){grid-column:1 / -1}
html body #community-app .event-newspaper.newspaper-open>.event-linked-threads{grid-column:1!important;grid-row:auto!important;position:static!important;padding:22px 0 0!important;border:0!important;border-top:1px solid var(--news-line)!important;border-radius:0;background:transparent;margin:22px 0 0!important}
html body #community-app .event-newspaper.newspaper-open .event-thread-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}
@media(max-width:1199px){html body #community-app .event-newspaper.newspaper-open>.newspaper-story{grid-template-columns:1fr;grid-template-areas:"meta" "title" "deck" "img" "body"}
 html body #community-app .event-newspaper.newspaper-open>.newspaper-story>img{position:static;aspect-ratio:16/9;margin-bottom:20px!important}
 html body #community-app .event-newspaper.newspaper-open .event-thread-cards{grid-template-columns:1fr!important}}
/* Event threads: simple rows (title, one-line summary, place, starter / replies, last activity). */
html body #community-app .event-newspaper .event-thread-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
html body #community-app .event-newspaper .event-thread-row{display:flex;align-items:center;gap:16px;padding:14px 16px 14px 18px;border:1px solid var(--news-line);border-left:3px solid var(--thread-accent,#ffc45b);border-radius:8px;background:#0b1015;cursor:pointer;transition:background .15s,border-color .15s}
html body #community-app .event-newspaper .event-thread-row:hover,html body #community-app .event-newspaper .event-thread-row:focus-visible{background:#121922;border-color:color-mix(in srgb,var(--thread-accent,#ffc45b) 45%,transparent);border-left-color:var(--thread-accent,#ffc45b)}
html body #community-app .event-newspaper .etr-main{flex:1;min-width:0}
html body #community-app .event-newspaper .etr-title{font:700 16px/1.3 'Segoe UI',sans-serif;color:#fff!important;text-decoration:none!important}
html body #community-app .event-newspaper .event-thread-row:hover .etr-title{color:var(--news-accent)!important}
html body #community-app .event-newspaper :is(.etr-new,.etr-done){display:inline-block;margin-left:8px;padding:2px 6px;border-radius:4px;font:700 9.5px/1.3 'Segoe UI',sans-serif;letter-spacing:.1em;vertical-align:2px}
html body #community-app .event-newspaper .etr-new{background:#5ad1e0;color:#0b1015}
html body #community-app .event-newspaper .etr-done{color:#7fd6a4;border:1px solid #7fd6a466;text-transform:uppercase}
html body #community-app .event-newspaper .etr-sub{margin:4px 0 0;font:400 13.5px/1.45 'Segoe UI',sans-serif;color:var(--news-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app .event-newspaper .etr-meta{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:6px;font:500 12px/1.3 'Segoe UI',sans-serif;color:#8d98a5}
html body #community-app .event-newspaper .etr-meta b{font-weight:600;color:var(--thread-accent,#c9d2dc)}
html body #community-app .event-newspaper .etr-stats{flex:none;display:grid;justify-items:end;gap:1px;padding-left:16px;border-left:1px solid var(--news-line);text-align:right}
html body #community-app .event-newspaper .etr-stats strong{font:700 20px/1 'Segoe UI',sans-serif;color:#fff}
html body #community-app .event-newspaper .etr-stats small{font:600 10px/1.2 'Segoe UI',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#8d98a5}
html body #community-app .event-newspaper .etr-stats span{margin-top:6px;font:500 11.5px/1.2 'Segoe UI',sans-serif;color:#8d98a5;white-space:nowrap}
@media(max-width:1199px){html body #community-app .event-newspaper .event-thread-list{grid-template-columns:1fr}}

/* =====================================================================
   Event article: feature layout (hero banner, at-a-glance box, magazine body).
   ===================================================================== */
html body #community-app .event-newspaper.newspaper-open>.newspaper-story.news-feature{display:block!important;padding:16px 0 0!important}
/* Hero: the image as a wide banner with the headline set on it. */
html body #community-app .news-feature .news-hero{position:relative;display:grid;min-height:clamp(300px,30vw,460px);border-radius:12px;overflow:hidden;background:linear-gradient(135deg,#1b2430,#0d1117);isolation:isolate}
html body #community-app .news-feature .news-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;margin:0!important;max-height:none!important;border-radius:0!important;filter:none!important}
html body #community-app .news-feature .news-hero::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 30%,#0b0f14d9 72%,#0b0f14 100%),linear-gradient(90deg,#0b0f14b3,transparent 65%)}
html body #community-app .news-feature .news-hero.no-image{min-height:0}
html body #community-app .news-feature .news-hero.no-image::after{display:none}
html body #community-app .news-feature .news-hero-text{align-self:end;padding:28px 32px 26px;max-width:min(980px,100%)}
html body #community-app .news-feature .news-hero-text h2{margin:12px 0 10px!important;font-size:clamp(32px,3.4vw,54px)!important;line-height:1.05!important;text-shadow:0 2px 18px #000a}
html body #community-app .news-feature .news-hero-text .news-deck{margin:0!important;padding:0!important;border:0!important;color:#dfe5ec!important;font-size:18px!important;text-shadow:0 1px 10px #000c}
html body #community-app .news-feature .news-hero .news-category{color:#e7ecf2!important}
/* Body: full width, text wraps around floated images; the at-a-glance box floats top-right. */
html body #community-app .news-feature .news-feature-body{display:flow-root;margin-top:26px}
html body #community-app .news-feature .news-facts{float:right;width:clamp(230px,22%,290px);margin:4px 0 20px 32px;padding:18px 20px;border:1px solid var(--news-line);border-top:3px solid var(--news-accent);border-radius:10px;background:#0b1015}
html body #community-app .news-feature .news-facts h4{margin:0 0 12px;font:700 11px/1 'Segoe UI',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--news-accent)}
html body #community-app .news-feature .news-facts dl{margin:0;display:grid;gap:10px}
html body #community-app .news-feature .news-facts dl>div{display:flex;justify-content:space-between;gap:12px;padding-bottom:10px;border-bottom:1px solid var(--news-line)}
html body #community-app .news-feature .news-facts dl>div:last-child{border-bottom:0;padding-bottom:0}
html body #community-app .news-feature .news-facts dt{font:600 12px/1.3 'Segoe UI',sans-serif;color:#8d98a5}
html body #community-app .news-feature .news-facts dd{margin:0;font:700 13px/1.3 'Segoe UI',sans-serif;color:#fff;text-align:right}
html body #community-app .news-feature .news-body{display:block;font-size:17px!important;line-height:1.75!important}
html body #community-app .news-feature .news-body>p:first-child::first-letter{float:left;margin:6px 12px 0 0;font:800 64px/.8 'Oswald','Segoe UI',sans-serif;color:var(--news-accent)}
/* Plain-text bodies: each paragraph's first line is its section label. Rich bodies use real headings instead. */
html body #community-app .news-feature .news-body.is-rich p::first-line{color:inherit;font:inherit;letter-spacing:normal}
html body #community-app .news-feature .news-body.is-plain>p:first-child::first-letter{float:none;font:inherit;margin:0;color:inherit}
html body #community-app .news-feature .news-body h3{clear:none;margin:28px 0 8px;font:700 13px/1.2 'Segoe UI',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--news-accent)}
html body #community-app .news-feature .news-body h3::before{content:'';display:inline-block;width:18px;height:2px;margin:0 10px 4px 0;background:currentColor;vertical-align:middle}
/* Images: wrap left / right with a caption; centred ones sit in the flow. */
html body #community-app .news-feature .news-body figure{margin:6px 0 18px;max-width:100%}
html body #community-app .news-feature .news-body figure[style*="float: right"],html body #community-app .news-feature .news-body figure[style*="float:right"]{margin:6px 0 18px 28px!important}
html body #community-app .news-feature .news-body figure[style*="float: left"],html body #community-app .news-feature .news-body figure[style*="float:left"]{margin:6px 28px 18px 0!important}
html body #community-app .news-feature .news-body figure img{display:block;width:100%;height:auto;border-radius:10px;box-shadow:0 10px 24px #0008}
html body #community-app .news-feature .news-body figcaption{margin-top:8px;padding-left:10px;border-left:2px solid var(--news-accent);font:500 13px/1.45 'Segoe UI',sans-serif;color:#9aa5b2}
/* Pull quote. */
html body #community-app .news-feature .news-body blockquote{clear:none;margin:26px 0;padding:6px 0 6px 26px;border:0;border-left:4px solid var(--news-accent);background:none}
html body #community-app .news-feature .news-body blockquote p:first-child{margin:0 0 8px;font:600 clamp(20px,1.7vw,26px)/1.4 'Segoe UI',sans-serif;color:#fff}
html body #community-app .news-feature .news-body blockquote p+p{margin:0;font:600 12px/1.3 'Segoe UI',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#8d98a5}
/* Callout / notice boxes and columns from the editor. */
html body #community-app .news-feature .news-body .rich-box{clear:both;margin:24px 0;padding:16px 20px;border-radius:10px;border:1px solid var(--news-line);background:#0b1015}
html body #community-app .news-feature .news-body .rich-box-callout{border-color:color-mix(in srgb,var(--news-accent) 45%,transparent);background:color-mix(in srgb,var(--news-accent) 8%,#0b1015)}
html body #community-app .news-feature .news-body .rich-box-notice{border-color:#ff8f6b66;background:#ff8f6b0f}
html body #community-app .news-feature .news-body .rich-box p:last-child{margin-bottom:0}
html body #community-app .news-feature .news-body .rich-columns{display:grid;gap:24px;clear:both;margin:20px 0}
html body #community-app .news-feature .news-body .rich-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
html body #community-app .news-feature .news-body .rich-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:900px){
 html body #community-app .news-feature .news-facts{float:none;width:auto;margin:0 0 20px}
 html body #community-app .news-feature .news-body figure{float:none!important;width:100%!important;margin:10px 0 18px!important}
 html body #community-app .news-feature .news-body .rich-columns{grid-template-columns:1fr}
}
/* Let the body flow under the at-a-glance box once it ends (a multi-column container can't wrap floats). */
html body #community-app .news-feature .news-body{columns:auto!important;column-count:auto!important;overflow:visible!important}
html body #community-app .news-feature .news-hero>img{object-position:center 30%}
/* Masthead: neutral dark (the gold wash read as muddy brown), a thin accent rule underneath. */
html body #community-app .event-newspaper .newspaper-masthead{background:linear-gradient(180deg,#161e28,#111820)!important;border-bottom:1px solid var(--news-line)!important;box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--news-accent) 55%,transparent)}
/* Add event / Edit article: compact, one line. */
html body #community-app[data-scene=events] #app-view>.app-heading button{padding:7px 12px!important;font-size:13px!important;line-height:1.2!important;white-space:nowrap!important;border-radius:7px!important}
html body #community-app[data-scene=events] #app-view>.app-heading{inset:calc(40px + 1px + 20px + 38px - 16px) calc(40px + 28px) auto auto!important}
html body #community-app .event-newspaper .newspaper-masthead{padding-right:calc(28px + 130px)!important}
html body #community-app[data-scene=events] #app-view>.app-heading{inset:calc(40px + 1px + 20px + 38px - 3px) calc(40px + 28px) auto auto!important}
/* No action button on Events any more (it moved to the page-settings gear), so the masthead needs no room for it. */
html body #community-app .event-newspaper .newspaper-masthead{padding-right:28px!important}
html body #community-app[data-scene=events] #app-view>.app-heading{display:none!important}

/* ---- Pinned threads: pin badge on the card, divider spanning the whole grid after the last pinned one ---- */
html body #community-app :is(.forum-thread-cards,.event-thread-list)>hr.pinned-thread-divider{display:flex!important;grid-column:1 / -1!important;align-items:center;gap:12px;height:auto;margin:4px 0!important;border:0!important;background:none!important;overflow:visible;visibility:visible!important;opacity:1!important}
html body #community-app :is(.forum-thread-cards,.event-thread-list)>hr.pinned-thread-divider::before{content:'';flex:1;height:1px;background:linear-gradient(90deg,color-mix(in srgb,var(--color-accent-default,#ffc45b) 70%,transparent),color-mix(in srgb,var(--color-accent-default,#ffc45b) 15%,transparent))}
html body #community-app .dispatch-thread-card .thread-pin{display:inline-flex;align-items:center;gap:5px;width:max-content;padding:3px 8px 3px 6px;margin-bottom:4px;border-radius:999px;background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 16%,#0b1015);border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent);color:var(--color-accent-default,#ffc45b)!important;font:700 10.5px/1.2 'Segoe UI',sans-serif!important;letter-spacing:.14em;text-transform:uppercase}
html body #community-app .dispatch-thread-card .thread-pin svg{width:13px;height:13px;transform:rotate(35deg)}
html body #community-app .dispatch-thread-card:has(.thread-pin){box-shadow:0 0 0 1px color-mix(in srgb,var(--color-accent-default,#ffc45b) 40%,transparent),0 8px 22px #0007}
html body #community-app .event-newspaper .etr-pin{display:inline-flex;align-items:center;gap:4px;margin-right:8px;color:var(--news-accent);font:700 10px/1 'Segoe UI',sans-serif;letter-spacing:.14em;text-transform:uppercase;vertical-align:2px}
html body #community-app .event-newspaper .etr-pin svg{width:12px;height:12px;transform:rotate(35deg)}
html body #community-app .event-newspaper .event-thread-row.is-pinned{background:color-mix(in srgb,var(--news-accent) 6%,#0b1015)}
html body #community-app :is(.forum-thread-cards,.event-thread-list)>hr.pinned-thread-divider{display:block!important;height:0;border:0!important;border-top:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent)!important;margin:6px 0!important}
html body #community-app :is(.forum-thread-cards,.event-thread-list)>hr.pinned-thread-divider::before{display:none}

/* =====================================================================
   Main Index in the same style as Events: one dark panel with a masthead, dark category blocks, card tiles.
   ===================================================================== */
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view.hz-index{gap:0!important;--ix-line:#ffffff17;--ix-accent:var(--color-accent-default,#ffc45b)}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view.hz-masthead>.app-heading{display:none!important}
html body #community-app .index-masthead{flex:none;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:20px 28px 18px;
 background:linear-gradient(180deg,#161e28,#111820);border:1px solid #ffffff14;border-bottom:1px solid var(--ix-line);border-radius:12px 12px 0 0;box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--ix-accent) 55%,transparent)}
html body #community-app .index-masthead .index-kicker{display:block;font:700 11px/1.2 'Segoe UI',sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--ix-accent)}
html body #community-app .index-masthead h2{margin:6px 0 0;font:700 clamp(30px,2.8vw,44px)/1.05 'Oswald','Segoe UI',sans-serif;letter-spacing:.02em;text-transform:uppercase;color:#fff}
html body #community-app .index-masthead .index-stats{display:flex;gap:10px;flex-wrap:wrap}
html body #community-app .index-masthead .index-stats span{padding:6px 11px;border:1px solid var(--ix-line);border-radius:999px;background:#ffffff08;font:600 11px/1 'Segoe UI',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#aeb8c4}
html body #community-app .index-masthead .index-stats strong{color:#fff;font-weight:700;margin-right:3px}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index{display:flex!important;flex-direction:column;gap:22px!important;padding:22px 28px 26px!important;margin:0!important;
 background:linear-gradient(180deg,#141b24,#0e1319);border:1px solid #ffffff14;border-top:0;border-radius:0 0 12px 12px;box-shadow:0 18px 40px #0009}
/* Category blocks: a label row, then the tiles - no heavy blue slab. */
html body #community-app:is([data-scene=welcome],[data-scene=index]) .forum-index-section{background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .forum-index-section>header{background:none!important;border:0!important;border-bottom:1px solid var(--ix-line)!important;padding:0 0 10px!important;margin-bottom:14px}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .forum-index-section>header h2 a{color:var(--ix-accent)!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .index-category-children{padding:0!important;gap:14px!important}
/* Tiles: dark card, art fading in from the right, accent edge, lift on hover. */
html body #community-app:is([data-scene=welcome],[data-scene=index]) :is(.basic-forum-entry,.index-page-entry){border:1px solid var(--ix-line)!important;border-top:1px solid var(--ix-line)!important;border-left:3px solid color-mix(in srgb,var(--ix-accent) 70%,transparent)!important;border-radius:10px!important;background:#0b1015!important;box-shadow:none!important;transition:border-color .18s,transform .18s,box-shadow .18s}
html body #community-app:is([data-scene=welcome],[data-scene=index]) :is(.basic-forum-entry,.index-page-entry):hover{border-color:color-mix(in srgb,var(--ix-accent) 55%,transparent)!important;border-left-color:var(--ix-accent)!important;transform:translateY(-2px);box-shadow:0 10px 26px #0008!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) :is(.basic-forum-entry h2,.index-page-entry h3){font:700 22px/1.2 'Segoe UI',sans-serif!important;letter-spacing:0!important;text-transform:none!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) :is(.basic-forum-entry h2,.index-page-entry h3) a{color:#fff!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) :is(.basic-forum-entry,.index-page-entry):hover :is(h2,h3) a{color:var(--ix-accent)!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .basic-forum-counts{color:#aeb8c4!important;font-size:13px!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .basic-forum-counts strong{color:#fff}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .basic-forum-latest{border-top:1px solid var(--ix-line)!important;color:#aeb8c4!important;font-size:13px!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .basic-forum-latest small{color:var(--ix-accent)!important;letter-spacing:.14em;font-weight:700;font-size:10px}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .basic-forum-latest .forum-last-heading>a{color:#fff!important;font-weight:600}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .subcategory-badge-scroller nav a{padding:3px 9px;border:1px solid var(--ix-line);border-radius:999px;background:#ffffff08;font-size:12px;color:#c9d2dc!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .forum-entry-portrait{opacity:.55}
/* Main Index: no masthead; tiles fill the width (more columns as the window widens, never a half-empty row of two). */
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index{border-top:1px solid #ffffff14!important;border-radius:12px!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .index-category-children{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr))!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .index-category-children>*{grid-column:auto!important;min-height:132px}
/* Visible scrollbar with a track, so it's obvious the index scrolls. */
html body #community-app:is([data-scene=events],[data-scene=welcome],[data-scene=index]) #app-view>:is(.event-newspaper,.forum-main-index){scrollbar-width:auto!important;scrollbar-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 75%,transparent) #0b1015!important;scrollbar-gutter:stable!important}
html body #community-app:is([data-scene=events],[data-scene=welcome],[data-scene=index]) #app-view>:is(.event-newspaper,.forum-main-index)::-webkit-scrollbar{width:10px}
html body #community-app:is([data-scene=events],[data-scene=welcome],[data-scene=index]) #app-view>:is(.event-newspaper,.forum-main-index)::-webkit-scrollbar-track{background:#0b1015}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .index-category-children{grid-template-columns:repeat(auto-fill,minmax(min(100%,380px),1fr))!important}

/* =====================================================================
   CONTROL-style type. Titles: a geometric Avant Garde Gothic (TeX Gyre Adventor, the free URW Gothic
   revival - Control's wordmark / area-title face). Menus, labels and subtitles: Overpass, a Highway
   Gothic revival standing in for Interstate (Control's wayfinding / HUD face). Body text is unchanged.
   ===================================================================== */
@font-face{font-family:'Control Title';src:url('/assets/fonts/adventor-bold.woff') format('woff');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Control Title';src:url('/assets/fonts/adventor-regular.woff') format('woff');font-weight:400;font-style:normal;font-display:swap}
#community-app{--font-control-title:'Control Title','Century Gothic','Avant Garde',sans-serif;--font-control-ui:'Overpass','Segoe UI',sans-serif}
/* Titles */
html body #community-app :is(#app-view>.app-heading h1,.event-newspaper .newspaper-masthead h2,.index-masthead h2,.news-feature .news-hero-text h2,.event-newspaper .newspaper-story h2,.event-edition-grid .news-teaser h3,#app-page-title,.thread-view-heading h1,.guide-panes h2,.app-panel>h2){font-family:var(--font-control-title)!important;font-weight:700!important;letter-spacing:.01em!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) :is(.basic-forum-entry h2,.index-page-entry h3){font-family:var(--font-control-title)!important;font-weight:700!important;letter-spacing:.01em!important}
html body #community-app .event-newspaper .etr-title{font-family:var(--font-control-title)!important}
/* Menus, breadcrumbs, labels, kickers, subtitles */
html body #community-app :is(.header-forum-trail,.app-header nav,.account-link,.app-brand small,#app-sidebar,.sidebar-hover-label,#page-settings-panel,.page-settings-head,.forum-index-section>header h2,.news-category,.event-status,.newspaper-edition,.newspaper-rule,.index-kicker,.index-stats,.news-continue,.newspaper-return,.event-linked-threads>h3,.news-facts,.etr-meta,.etr-stats,.news-deck,.thread-view-subtitle,.app-muted,.collection-pages,.news-feature .news-body h3,figcaption,.basic-forum-counts,.basic-forum-latest small,.subcategory-badge-scroller nav a,.player-field h3,.app-actions button){font-family:var(--font-control-ui)!important}
html body #community-app .themed-tooltip,html body .themed-tooltip{font-family:var(--font-control-ui)!important}
html body #community-app .header-forum-trail [aria-current]{font-family:var(--font-control-title)!important;font-weight:700!important;letter-spacing:.02em}

/* =====================================================================
   Main Index v2: staggered category bands + richer tile interiors.
   (Applies to both / and /index.)
   ===================================================================== */
html body #community-app #app-view>.forum-main-index{--ix-line:#ffffff17;--ix-accent:var(--color-accent-default,#ffc45b)}
/* Staggered bands: each category takes 80% of the width, alternating left / right. */
html body #community-app #app-view>.forum-main-index>.forum-index-section{width:80%!important;max-width:none!important;box-sizing:border-box;padding:16px 18px 18px!important;
 background:linear-gradient(90deg,#ffffff06,transparent 70%)!important;border:1px solid var(--ix-line)!important;border-left:3px solid var(--ix-accent)!important;border-radius:4px 12px 12px 4px!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(odd){margin:0 auto 0 0!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(even){margin:0 0 0 auto!important;border-left:1px solid var(--ix-line)!important;border-right:3px solid var(--ix-accent)!important;border-radius:12px 4px 4px 12px!important;background:linear-gradient(270deg,#ffffff06,transparent 70%)!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(even)>header{flex-direction:row-reverse}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(even)>header h2{flex-direction:row-reverse}
html body #community-app #app-view>.forum-main-index .index-category-children{grid-template-columns:repeat(auto-fill,minmax(min(100%,400px),1fr))!important}
@media(max-width:1100px){html body #community-app #app-view>.forum-main-index>.forum-index-section{width:100%!important}}

/* Tile interior: title + sub-forum chips on the left, stat numbers on the right, latest post as a footer strip. */
html body #community-app #app-view>.forum-main-index .basic-forum-entry{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-rows:1fr auto;grid-template-areas:"id stats" "latest latest"!important;
 column-gap:16px;padding:0!important;min-height:150px;position:relative;overflow:hidden}
html body #community-app #app-view>.forum-main-index .basic-forum-entry>.basic-forum-identity{grid-area:id;align-self:center;display:block!important;padding:16px 0 12px 18px!important;min-width:0;position:relative;z-index:1}
html body #community-app #app-view>.forum-main-index .basic-forum-entry .forum-entry-label h2{margin:0 0 8px!important;font-size:21px!important;line-height:1.2!important}
html body #community-app #app-view>.forum-main-index .basic-forum-entry .subcategory-badge-scroller{margin:0!important}
html body #community-app #app-view>.forum-main-index .basic-forum-entry .subcategory-badge-scroller nav{display:flex;flex-wrap:wrap;gap:5px}
html body #community-app #app-view>.forum-main-index .basic-forum-entry>.basic-forum-counts{grid-area:stats;align-self:center;display:grid!important;grid-auto-flow:column;gap:0!important;margin:0 16px 0 0!important;padding:0!important;background:none!important;position:relative;z-index:1;
 font-size:0!important;color:transparent!important}
/* "2 topics 4 posts" becomes two stat cells: big number over a small label. */
html body #community-app #app-view>.forum-main-index .basic-forum-counts>strong{display:grid;justify-items:center;padding:4px 14px;border-right:1px solid var(--ix-line);font:700 24px/1 var(--font-control-title,'Segoe UI'),sans-serif!important;color:#fff!important}
html body #community-app #app-view>.forum-main-index .basic-forum-counts>strong::after{content:'topics';margin-top:5px;font:700 9.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#8d98a5}
html body #community-app #app-view>.forum-main-index .basic-forum-counts>span{display:grid;justify-items:center;padding:4px 0 4px 14px;font:700 24px/1 var(--font-control-title,'Segoe UI'),sans-serif!important;color:#fff!important;word-spacing:100vw;text-align:center;width:min-content}
html body #community-app #app-view>.forum-main-index .basic-forum-counts>span::first-line{font-size:24px}
/* Latest post footer strip. */
html body #community-app #app-view>.forum-main-index .basic-forum-entry>.basic-forum-latest{grid-area:latest;display:flex!important;align-items:center;gap:10px;flex-wrap:wrap;margin:0!important;padding:9px 18px!important;min-height:0!important;position:relative;z-index:1;
 background:#070a0ecc!important;border-top:1px solid var(--ix-line)!important;font-size:12.5px!important;backdrop-filter:blur(2px)}
html body #community-app #app-view>.forum-main-index .basic-forum-latest .forum-last-heading{display:flex;align-items:center;gap:8px;min-width:0;padding:0!important;position:static!important}
html body #community-app #app-view>.forum-main-index .basic-forum-latest:has(.forum-last-avatar){padding-left:18px!important}
html body #community-app #app-view>.forum-main-index .basic-forum-latest .forum-last-avatar{position:static!important;width:24px!important;height:24px!important;border-radius:50%!important;flex:none;font-size:9.5px!important}
html body #community-app #app-view>.forum-main-index .basic-forum-latest .forum-last-heading>a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:22ch}
html body #community-app #app-view>.forum-main-index .basic-forum-latest>span{color:#8d98a5;white-space:nowrap}
html body #community-app #app-view>.forum-main-index .basic-forum-latest>span a{color:#c9d2dc!important}
/* Art sits behind the right half and fades out toward the text. */
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry)>.forum-entry-portrait{position:absolute!important;inset:0 0 0 35%!important;width:auto!important;height:auto!important;opacity:.5!important;z-index:0;
 -webkit-mask:linear-gradient(90deg,transparent,#000 60%);mask:linear-gradient(90deg,transparent,#000 60%)}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry)>.forum-entry-portrait img{width:100%;height:100%;object-fit:cover}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry):hover>.forum-entry-portrait{opacity:.75!important}
/* Page-type tiles (Guidebook, Characters...): title + one-line description, vertically centred. */
html body #community-app #app-view>.forum-main-index .index-page-entry{display:flex!important;align-items:center;min-height:150px;padding:0 18px!important;position:relative;overflow:hidden}
html body #community-app #app-view>.forum-main-index .index-page-entry>.forum-entry-label{position:relative;z-index:1}
html body #community-app #app-view>.forum-main-index .basic-forum-entry>.basic-forum-counts{font-size:inherit!important;color:inherit!important;padding:8px 4px!important;border-radius:8px;background:#070a0eb3!important;backdrop-filter:blur(2px)}
html body #community-app #app-view>.forum-main-index .ix-stat{display:grid;justify-items:center;gap:5px;padding:2px 14px}
html body #community-app #app-view>.forum-main-index .ix-stat+.ix-stat{border-left:1px solid var(--ix-line)}
html body #community-app #app-view>.forum-main-index .ix-stat b{font:700 24px/1 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff}
html body #community-app #app-view>.forum-main-index .ix-stat small{font:700 9.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#8d98a5}
html body #community-app #app-view>.forum-main-index .basic-forum-latest{flex-wrap:nowrap!important}
html body #community-app #app-view>.forum-main-index .basic-forum-latest .forum-last-heading{flex:1 1 auto;min-width:0}
html body #community-app #app-view>.forum-main-index .basic-forum-latest .forum-last-heading>a{max-width:none;flex:1 1 auto;min-width:0}
html body #community-app #app-view>.forum-main-index .basic-forum-latest>span{flex:none}
/* Main Index v3 */
html body #community-app #app-view>.forum-main-index>.forum-index-section{width:90%!important}
/* Forum-style header image (the SDN front door) at the top of the index. */
html body #community-app #app-view>.forum-main-index>.index-hero{flex:none;position:relative;margin:0!important;height:clamp(200px,20vw,340px);border-radius:10px;overflow:hidden;border:1px solid #ffffff17;box-shadow:0 12px 30px #0008}
html body #community-app #app-view>.forum-main-index>.index-hero img{width:100%;height:100%;object-fit:cover;object-position:center 62%;display:block}
html body #community-app #app-view>.forum-main-index>.index-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,#0e1319 100%),radial-gradient(ellipse at 50% 40%,transparent 55%,#0006)}
/* Page tiles share the forum-tile layout: identity + stats on top, footer strip below. */
html body #community-app #app-view>.forum-main-index .index-page-entry{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-rows:1fr auto;grid-template-areas:"id stats" "latest latest"!important;column-gap:16px;padding:0!important;align-items:stretch!important}
html body #community-app #app-view>.forum-main-index .index-page-entry>.forum-entry-icon{display:none!important}
html body #community-app #app-view>.forum-main-index .index-page-entry>.forum-entry-label{grid-area:id;align-self:center;padding:16px 0 12px 18px!important}
html body #community-app #app-view>.forum-main-index .index-page-entry>.forum-entry-label h3::after{content:none!important}
html body #community-app #app-view>.forum-main-index .index-page-entry>.forum-card-description{grid-area:id;align-self:end;margin:0 0 12px 18px;font-size:13px;color:#aeb8c4;position:relative;z-index:1}
html body #community-app #app-view>.forum-main-index .index-page-entry>.basic-forum-counts{grid-area:stats;align-self:center;display:grid!important;grid-auto-flow:column;margin:0 16px 0 0!important;padding:8px 4px!important;border-radius:8px;background:#070a0eb3!important;position:relative;z-index:1}
html body #community-app #app-view>.forum-main-index .index-page-entry>.basic-forum-latest{grid-area:latest;display:flex!important;align-items:center;gap:10px;flex-wrap:nowrap!important;margin:0!important;padding:9px 18px!important;position:relative;z-index:1;background:#070a0ecc!important;border-top:1px solid var(--ix-line)!important;font-size:12.5px!important;color:#aeb8c4}
html body #community-app #app-view>.forum-main-index .index-page-entry .forum-last-heading{display:flex;align-items:center;gap:8px;flex:1 1 auto;min-width:0}
html body #community-app #app-view>.forum-main-index .index-page-entry .forum-last-heading small{color:var(--ix-accent);font:700 10px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.14em;text-transform:uppercase;flex:none}
html body #community-app #app-view>.forum-main-index .index-page-entry .forum-last-heading>:is(a,.ix-latest-title){color:#fff!important;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
html body #community-app #app-view>.forum-main-index .index-page-entry .basic-forum-latest>span{flex:none;color:#8d98a5;white-space:nowrap}
html body #community-app #app-view>.forum-main-index .forum-last-avatar{position:static!important;width:24px!important;height:24px!important;border-radius:50%!important;flex:none;overflow:hidden;display:grid;place-items:center}
html body #community-app #app-view>.forum-main-index .forum-last-avatar img{width:100%;height:100%;object-fit:cover}
html body #community-app #app-view>.forum-main-index .forum-last-avatar.is-sdn{background:color-mix(in srgb,var(--ix-accent) 18%,#0b1015);color:var(--ix-accent);box-shadow:0 0 0 1px color-mix(in srgb,var(--ix-accent) 50%,transparent)}
html body #community-app #app-view>.forum-main-index .forum-last-avatar.is-sdn svg{width:14px;height:14px}
/* Five competencies, wide: 3 on the first row, the last 2 at the same width, centred. */
@container hbprose (min-width:1180px){
 #community-app .handbook-prose .hb-section:has(>.hb-comp)>.hb-comp:nth-of-type(n){grid-column:span 2!important}
 #community-app .handbook-prose .hb-section:has(>.hb-comp)>.hb-comp:nth-of-type(4){grid-column:2 / span 2!important}
}
#community-app .handbook-prose .hb-rung-range{white-space:nowrap}
/* Main Index category titles: large, no accent bar in front. */
html body #community-app .forum-main-index .forum-index-section>header h2{font:700 26px/1.15 var(--font-control-title,'Segoe UI'),sans-serif!important;letter-spacing:.04em!important;text-transform:uppercase!important;gap:0!important}
html body #community-app .forum-main-index .forum-index-section>header h2::before{content:none!important;display:none!important}
html body #community-app .forum-main-index .forum-index-section>header{align-items:center!important}
/* Main Index tiles: the accent edge runs round the whole card (thin), and thickens to match the left edge on hover. */
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry){border:1px solid color-mix(in srgb,var(--ix-accent) 60%,transparent)!important;border-left:3px solid var(--ix-accent)!important}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-visible){border-color:var(--ix-accent)!important;box-shadow:inset 0 0 0 2px var(--ix-accent),0 10px 26px #0008!important;transform:translateY(-2px)}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-visible){box-shadow:0 10px 26px #0008!important}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry)::after{content:'';position:absolute;inset:0;z-index:5;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 0 var(--ix-accent);transition:box-shadow .18s}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-visible)::after{box-shadow:inset 0 0 0 2px var(--ix-accent)}
/* Edit popouts: one scrollbar (the form body), actions bar fixed above it, never covering the title. */
html body #community-app #app-dialog[open]{display:flex!important;flex-direction:column;overflow:hidden!important}
html body #community-app #app-dialog>form{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}
html body #community-app #app-dialog>form>.app-actions{position:static!important;flex:none;order:-2;margin:0 0 6px!important}
html body #community-app #app-dialog>form>#app-form-error{order:-1;flex:none}
html body #community-app #app-dialog-content{flex:1 1 auto;min-height:0;overflow-y:auto!important;padding-right:6px}
/* Main Index header: full-width image at a ratio that keeps the SDN sign in view, copy + panels over the dark left side. */
html body #community-app #app-view>.forum-main-index>.index-hero{flex:none;position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,32%);align-items:end;gap:20px;
 height:auto!important;aspect-ratio:16/7;min-height:300px;margin:0!important;padding:26px 28px;border-radius:10px;overflow:hidden;border:1px solid #ffffff17;box-shadow:0 12px 30px #0008;isolation:isolate}
html body #community-app #app-view>.forum-main-index>.index-hero>img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:60% 45%}
html body #community-app #app-view>.forum-main-index>.index-hero::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#070a0ee6 0%,#070a0e99 38%,transparent 62%),linear-gradient(180deg,transparent 55%,#070a0ecc 100%)}
html body #community-app .index-hero-copy{align-self:start;max-width:560px}
html body #community-app .index-hero-kicker{display:block;font:700 12px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--ix-accent)}
html body #community-app .index-hero-copy h2{margin:8px 0 8px;font:700 clamp(40px,4.6vw,72px)/1 var(--font-control-title,'Segoe UI'),sans-serif;letter-spacing:.06em;color:#fff;text-shadow:0 2px 20px #000c}
html body #community-app .index-hero-copy p{margin:0;font:500 17px/1.5 var(--font-control-ui,'Segoe UI'),sans-serif;color:#dfe5ec;text-shadow:0 1px 10px #000c}
html body #community-app .index-hero-panels{grid-column:1;display:flex;gap:12px;flex-wrap:wrap;align-self:end}
html body #community-app .index-hero-panels section{flex:1 1 220px;max-width:300px;padding:14px 16px;border:1px solid #ffffff1f;border-top:2px solid var(--ix-accent);border-radius:8px;background:#070a0ecc;backdrop-filter:blur(4px)}
html body #community-app .index-hero-panels h3{margin:0 0 6px;font:700 11px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--ix-accent)}
html body #community-app .index-hero-panels p{margin:0 0 8px;font:400 13px/1.5 'Segoe UI',sans-serif;color:#c9d2dc}
html body #community-app .index-hero-panels a{font:700 12px/1 var(--font-control-ui,'Segoe UI'),sans-serif;color:#fff!important;text-decoration:none}
html body #community-app .index-hero-panels a:hover{color:var(--ix-accent)!important}
@media(max-width:1000px){html body #community-app #app-view>.forum-main-index>.index-hero{grid-template-columns:1fr;aspect-ratio:auto}}
/* Category edit: small pencil icon button at the end of the title row. */
html body #community-app .forum-main-index .forum-index-section>header>button.ix-edit{display:grid;place-items:center;width:32px!important;height:32px!important;padding:0!important;border-radius:7px!important;border:1px solid #ffffff24!important;background:#0b1015!important;color:#aab4c0!important;opacity:.7}
html body #community-app .forum-main-index .forum-index-section>header>button.ix-edit:hover{opacity:1;color:var(--ix-accent)!important;border-color:color-mix(in srgb,var(--ix-accent) 60%,transparent)!important}
/* Tiles 50% taller. */
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry){min-height:225px!important}
/* With a window open the page layer is lifted above the sidebar; its empty strip over the sidebar must not swallow clicks. */
html body #community-app .app-body{pointer-events:none}
html body #community-app .app-body>*{pointer-events:auto}
/* Header image: crop ~20% off top and bottom (16:9 source shown at ~16:5.4). */
html body #community-app #app-view>.forum-main-index>.index-hero{aspect-ratio:16/5.4!important;min-height:260px!important}
html body #community-app #app-view>.forum-main-index>.index-hero>img{object-position:60% 50%!important}
html body #community-app .cast-card .cast-tag-unset{color:#ff8a8f!important;border:1px solid #ff2d3d99!important;background:#ff2d3d14!important}
/* Gold inner border sits closer to the black frame (10px instead of 20px); page content moves out by the same 10px. */
html body #community-app #app-view::before{inset:10px!important}
html body #community-app #app-view{--gold-gap-shift:10px}
html body #community-app:not([data-scene=guidebook]) #app-view{padding:max(0px,calc(var(--view-pad,40px) - 10px))!important}
html body #community-app[data-scene=characters] #app-view,html body #community-app #app-view.hz-heroroster{--view-pad:20px}
html body #community-app[data-scene=guidebook] #app-view{padding:10px!important}
/* Watching in the top bar, matching the notification bell. */
html body #community-app .app-header a.header-watching{display:grid;place-items:center;width:34px;height:34px;margin-right:8px;border:1px solid #ffffff1f;border-radius:7px;color:#c9d2dc;background:transparent}
html body #community-app .app-header a.header-watching:hover,html body #community-app .app-header a.header-watching[aria-current]{color:var(--color-accent-default,#ffc45b);border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent)}

/* Flatter frame: the gold-bordered content area sits flush against the black frame, and the extra inner panel
   (Main Index / Events box inside the gold) is dropped - the content fills the gold area directly. */
html body #community-app #app-view::before{inset:0!important;border-radius:12px!important}
html body #community-app:not([data-scene=guidebook]) #app-view{padding:16px!important}
html body #community-app[data-scene=guidebook] #app-view{padding:0!important}
html body #community-app #app-view>:is(.forum-main-index,.event-newspaper){background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important}
html body #community-app #app-view>.forum-main-index{padding:6px 6px 10px!important}
html body #community-app #app-view>.event-newspaper>.newspaper-masthead{border-radius:10px 10px 0 0;border:0!important;margin:0 0 4px!important}
html body #community-app .newspaper-grid.event-edition-grid{padding:16px 6px 0!important}
html body #community-app .event-newspaper.newspaper-open{padding:0 6px 16px!important}
html body #community-app .event-newspaper.newspaper-open>.newspaper-masthead{margin:0!important}
html body #community-app:is([data-scene],[data-scene]) #app-view>:is(.forum-main-index,.event-newspaper){border:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important}
html body #community-app:is([data-scene],[data-scene]) #app-view>.forum-main-index{padding:4px 4px 12px!important}
/* No gold inner border on any page (too busy). */
html body #community-app #app-view::before{display:none!important;content:none!important}
html body #community-app .handbook-book,html body #community-app[data-scene=guidebook] :is(.guide-panes,.guide-pane,.handbook-prose-panel){--gold-border:none}
html body #community-app[data-scene=guidebook] .guide-panel{border-color:transparent!important;box-shadow:none!important}
html body #community-app:not([data-scene=guidebook]) #app-view{padding:14px!important}
/* Card bookmarks float centred on the card's top-right corner, in front of it. */
html body #community-app :is(.cast-card,.dispatch-thread-card,.location-side-card):has(>.card-bookmark){overflow:visible!important}
html body #community-app :is(.cast-card,.dispatch-thread-card,.location-side-card)>.card-bookmark{top:0!important;right:0!important;transform:translate(50%,-50%);z-index:20!important;border-radius:50%!important;box-shadow:0 3px 10px #000a}
html body #community-app .card-bookmark[data-tip-title]{pointer-events:auto}
/* Page corner pills, left of the page-settings gear. */
#community-app #page-corner-actions{position:fixed;z-index:10190;display:flex;gap:8px;align-items:center;transform:translateY(-50%)}
#community-app #page-corner-actions[hidden]{display:none}
#community-app #page-corner-actions .corner-pill{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 14px;border-radius:999px;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent);background:#0b0e12f0;color:#eef0f2;font:700 12px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.06em;white-space:nowrap;box-shadow:0 4px 12px #0008;cursor:pointer}
#community-app #page-corner-actions .corner-pill:hover{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b)}
#community-app #page-corner-actions .corner-pill span{display:grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:#ffffff1a;font-size:11px}
#community-app #page-corner-actions .corner-pill-review[aria-pressed=true]{background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 22%,#0b0e12);color:var(--color-accent-default,#ffc45b)}
#community-app #page-corner-actions .corner-pill-review.is-waiting span{background:#e2493b;color:#fff}
#community-app #page-corner-actions .corner-pill-review.is-waiting{animation:review-blink 2.4s ease-in-out infinite}
@keyframes review-blink{0%,100%{box-shadow:0 4px 12px #0008,0 0 0 0 #e2493b00;border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent)}50%{box-shadow:0 4px 12px #0008,0 0 14px 2px #e2493b99;border-color:#e2493b}}
@media(prefers-reduced-motion:reduce){#community-app #page-corner-actions .corner-pill-review.is-waiting{animation:none;border-color:#e2493b}}
/* Corner pills: same look as the gear (dark glass, soft border, shadow), fade in with the page and out with the gear. */
#community-app #page-corner-actions .corner-pill{height:40px!important;padding:0 16px!important;background:rgba(21,26,29,.933)!important;border:1px solid rgba(255,255,255,.18)!important;color:#d6d2c8!important;box-shadow:0 3px 12px rgba(0,0,0,.6)!important;letter-spacing:.04em;transition:color .15s ease,border-color .15s ease,background .15s ease}
#community-app #page-corner-actions .corner-pill:hover{color:var(--color-accent-default,#ffc45b)!important;border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)!important}
#community-app #page-corner-actions .corner-pill-review[aria-pressed=true]{color:var(--color-accent-default,#ffc45b)!important;border-color:var(--color-accent-default,#ffc45b)!important}
@keyframes review-blink{0%,100%{box-shadow:0 3px 12px rgba(0,0,0,.6),0 0 0 0 #e2493b00;border-color:rgba(255,255,255,.18)}50%{box-shadow:0 3px 12px rgba(0,0,0,.6),0 0 14px 2px #e2493b99;border-color:#e2493b}}
#community-app #page-corner-actions{opacity:1;visibility:visible;transition:opacity .2s ease,visibility 0s}
#community-app #page-corner-actions.is-hidden{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s ease,visibility 0s linear .2s}
#community-app #page-corner-actions.is-entering>*{animation:corner-fade .45s ease both}
#community-app #page-corner-actions.is-entering>.corner-pill-review.is-waiting{animation:corner-fade .45s ease both,review-blink 2.4s ease-in-out .45s infinite}
@keyframes corner-fade{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
/* Never a sideways scrollbar: page-level scroll areas clip horizontally. */
html body #community-app :is(#app-workspace,#app-view,.cast-results,.forum-main-index,.event-newspaper,.guide-panes,.hero-roster){overflow-x:hidden!important}
/* No sideways page scroll: the old "min 1200px, scroll sideways below that" rule is switched off; the app squeezes instead. */
@media (max-width:1199px) and (min-width:651px){
 html{overflow-x:hidden!important}
 body{min-width:0!important}
 #community-app{left:0!important;right:0!important;width:auto!important;min-width:0!important}
}
html,body{overflow-x:hidden!important}

/* =====================================================================
   Main Index v4: one continuous backdrop - the SDN entrance at the top, fading down into a dark
   dispatch city-grid map - with the page content floating over it on glass panels.
   ===================================================================== */
html body #community-app #app-view>.forum-main-index{counter-reset:ixsec;
 background:#090c10 url('/assets/backdrop-index-sdn-city.webp') top center / 100% auto no-repeat local!important;
 padding:0 0 40px!important;border-radius:10px!important}
/* Header: no box; copy + panels sit over the photo, and the first section starts below the entrance. */
html body #community-app #app-view>.forum-main-index>.index-hero{aspect-ratio:auto!important;min-height:0!important;height:auto!important;
 min-height:calc(var(--ix-w,100cqw) * .5)!important;background:none!important;border:0!important;box-shadow:none!important;border-radius:0!important;
 padding:clamp(24px,3vw,44px) clamp(24px,3vw,44px) 0!important;margin:0 0 clamp(40px,5vw,80px)!important;align-content:space-between}
html body #community-app #app-view>.forum-main-index{container-type:inline-size}
html body #community-app #app-view>.forum-main-index>.index-hero{min-height:52cqw!important}
html body #community-app #app-view>.forum-main-index>.index-hero::after{background:linear-gradient(90deg,#05070acc 0%,#05070a66 34%,transparent 58%)!important;inset:0 0 -1px 0}
html body #community-app .index-hero-panels section{background:#070a0ebf!important;backdrop-filter:blur(6px)}
/* Sections: glass bands with a numbered dispatch-style header. */
html body #community-app #app-view>.forum-main-index>.forum-index-section{counter-increment:ixsec;position:relative;
 background:linear-gradient(180deg,#0b1016d9,#080b10e6)!important;backdrop-filter:blur(8px);
 border:1px solid #ffffff14!important;border-left:3px solid var(--ix-accent)!important;border-radius:4px 12px 12px 4px!important;
 box-shadow:0 20px 50px #000a,inset 0 1px 0 #ffffff0d!important;padding:20px 22px 22px!important;margin-left:clamp(16px,2vw,32px)!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(even){margin-left:auto!important;margin-right:clamp(16px,2vw,32px)!important;border-left:1px solid #ffffff14!important;border-right:3px solid var(--ix-accent)!important;border-radius:12px 4px 4px 12px!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section+.forum-index-section{margin-top:clamp(28px,3vw,48px)!important}
html body #community-app .forum-main-index .forum-index-section>header{border-bottom:1px solid #ffffff14!important;padding-bottom:12px!important;margin-bottom:16px!important;gap:14px}
html body #community-app .forum-main-index .forum-index-section>header h2::before{content:counter(ixsec,decimal-leading-zero)!important;display:inline-grid!important;place-items:center;width:auto!important;height:auto!important;margin-right:14px;padding:4px 8px;border:1px solid color-mix(in srgb,var(--ix-accent) 55%,transparent);border-radius:4px;background:color-mix(in srgb,var(--ix-accent) 12%,transparent);font:700 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.1em;color:var(--ix-accent)}
html body #community-app .forum-main-index .forum-index-section>header h2{display:flex!important;align-items:center}
html body #community-app .forum-main-index .forum-index-section>header::after{content:'SDN · CHANNEL ' counter(ixsec,decimal-leading-zero);margin-left:auto;font:600 10.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.2em;color:#6f7a86}
html body #community-app .forum-main-index .forum-index-section>header:has(.ix-edit)::after{margin-left:auto;order:1}
html body #community-app .forum-main-index .forum-index-section>header>.ix-edit{order:2}
html body #community-app .forum-main-index .forum-index-section:nth-of-type(even)>header::after{margin-left:0;margin-right:auto}
/* Tiles: corner brackets, faint scanlines, and a glow on hover. */
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry){background:
 linear-gradient(var(--ix-accent),var(--ix-accent)) top 8px right 8px / 14px 2px no-repeat,
 linear-gradient(var(--ix-accent),var(--ix-accent)) top 8px right 8px / 2px 14px no-repeat,
 repeating-linear-gradient(0deg,#ffffff05 0 1px,transparent 1px 3px),
 linear-gradient(135deg,#0e141b,#070a0e)!important}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-visible){box-shadow:0 12px 30px #000c,0 0 24px color-mix(in srgb,var(--ix-accent) 25%,transparent)!important}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry)>.forum-entry-portrait{opacity:.42!important}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry h2,.index-page-entry h3){font-size:24px!important;text-shadow:0 2px 12px #000}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry) .forum-entry-label::before{content:'';display:block;width:28px;height:2px;margin-bottom:10px;background:var(--ix-accent)}
html body #community-app:is([data-scene],[data-scene]) #app-view>.forum-main-index{background:#090c10 url('/assets/backdrop-index-sdn-city.webp') top center / 100% auto no-repeat local!important}
/* Room for the page-settings gear (and pills) in the top-right corner, and for card bookmarks that float over card corners. */
html body #community-app:not([data-scene=guidebook]) #app-view{padding:30px 22px 18px!important}
html body #community-app[data-scene=guidebook] #app-view{padding:0!important}
html body #community-app[data-scene=guidebook] .guide-tabs,html body #community-app[data-scene=guidebook] :is(.handbook-tabs,.guide-nav,.guide-chapters){padding-top:44px!important;padding-right:14px!important}
html body #community-app .cast-results{padding:14px 16px 16px 4px!important}
html body #community-app .forum-thread-cards{padding-top:14px}
html body #community-app[data-scene=guidebook] .guide-side{padding-top:34px!important;padding-right:16px!important;box-sizing:border-box}
html body #community-app[data-scene=guidebook] .guide-panel{margin-top:0}
html body #community-app[data-scene=guidebook] .guide-side{padding-right:0!important}
html body #community-app .forum-main-index>.forum-index-section:nth-of-type(even)>header h2{flex-direction:row!important}

/* ---- Events front page: lead (2/3) + two side stories (1/3), then a row of three ---- */
html body #community-app .event-front.newspaper-grid.event-edition-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-rows:none!important;grid-auto-rows:auto!important}
html body #community-app .event-front .news-teaser.news-slot-0{grid-column:1 / span 2!important;grid-row:1 / span 2!important}
html body #community-app .event-front .news-teaser.news-slot-1{grid-column:3!important;grid-row:1!important}
html body #community-app .event-front .news-teaser.news-slot-2{grid-column:3!important;grid-row:2!important}
html body #community-app .event-front .news-teaser:is(.news-slot-1,.news-slot-2){display:flex!important;flex-direction:column;padding:0 0 16px!important;align-self:stretch!important}
html body #community-app .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>*{margin-inline:18px!important}
html body #community-app .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>img{order:-1;margin:0!important;width:100%;height:clamp(120px,10vw,180px)!important;min-height:0!important;border-radius:0!important}
html body #community-app .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>.news-meta{margin-top:14px!important}
html body #community-app .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
html body #community-app .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>.news-continue{margin-top:auto!important}
html body #community-app .event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5),html body #community-app .event-archive-grid .news-teaser{grid-column:auto!important;grid-row:auto!important;display:flex!important;flex-direction:column;padding:0 0 16px!important}
html body #community-app :is(.event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5),.event-archive-grid .news-teaser)>*{margin-inline:18px!important}
html body #community-app :is(.event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5),.event-archive-grid .news-teaser)>img{order:-1;margin:0!important;width:100%;height:170px!important;min-height:0!important;border-radius:0!important}
html body #community-app :is(.event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5),.event-archive-grid .news-teaser)>.news-meta{margin-top:14px!important}
html body #community-app :is(.event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5),.event-archive-grid .news-teaser)>h3{font-size:20px!important;line-height:1.25!important}
html body #community-app :is(.event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5),.event-archive-grid .news-teaser)>.news-continue{margin-top:auto!important}
html body #community-app .event-front .news-teaser.news-slot-2{border-top:1px solid var(--news-line)!important}
/* Fewer than three stories: lead fills what's there. */
html body #community-app .event-front:not(:has(.news-slot-1)) .news-slot-0{grid-column:1 / -1!important;grid-row:auto!important}
html body #community-app .event-front:has(.news-slot-1):not(:has(.news-slot-2)) .news-slot-1{grid-row:1 / span 2!important}
/* Archive: plain three-column grid. */
html body #community-app .event-archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:16px 6px 0}
html body #community-app .event-archive-grid .news-teaser{border:1px solid var(--news-line)!important;border-radius:10px;background:#0b1015;overflow:hidden;color:var(--news-ink)!important}
html body #community-app .event-archive-empty{grid-column:1 / -1;padding:40px;text-align:center;color:var(--news-soft)}
html body #community-app .newspaper-archive>.newspaper-return{display:inline-block;margin:16px 6px 0!important}
@media(max-width:1199px){html body #community-app .event-archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 html body #community-app .event-front.newspaper-grid.event-edition-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 html body #community-app .event-front .news-teaser.news-slot-0{grid-column:1 / -1!important;grid-row:auto!important}
 html body #community-app .event-front .news-teaser:is(.news-slot-1,.news-slot-2){grid-column:auto!important;grid-row:auto!important}}
/* "Browse archived events" card under the front page. */
html body #community-app .news-archive-card{display:flex;align-items:center;gap:16px;margin:16px 6px 0;padding:16px 20px;border:1px dashed color-mix(in srgb,var(--news-accent) 45%,transparent);border-radius:10px;background:#0b1015;color:var(--news-ink)!important;text-decoration:none!important;transition:border-color .15s,background .15s}
html body #community-app .news-archive-card:hover{border-style:solid;border-color:var(--news-accent);background:color-mix(in srgb,var(--news-accent) 7%,#0b1015)}
html body #community-app .news-archive-card .nac-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:color-mix(in srgb,var(--news-accent) 14%,transparent);color:var(--news-accent)}
html body #community-app .news-archive-card .nac-text{display:grid;gap:3px;flex:1}
html body #community-app .news-archive-card b{font:700 16px/1.2 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff}
html body #community-app .news-archive-card small{font:500 13px/1.3 'Segoe UI',sans-serif;color:var(--news-soft)}
html body #community-app .news-archive-card .nac-go{font-size:20px;color:var(--news-accent)}
/* Arrange dialog: slot labels, archived rows dimmed. */
#app-dialog .event-order-list li{display:grid;grid-template-columns:auto 1fr auto auto auto;align-items:center;gap:10px}
#app-dialog .event-order-list .eo-slot{font:700 10.5px/1 'Segoe UI',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#ffc45b;padding:3px 7px;border:1px solid #ffc45b55;border-radius:999px}
#app-dialog .event-order-list li.is-archived{opacity:.6}
#app-dialog .event-order-list li.is-archived .eo-slot{color:#aeb8c4;border-color:#ffffff26}
#app-dialog .event-order-list li:nth-child(6){margin-bottom:14px;box-shadow:0 8px 0 -6px #ffc45b66}
/* Lead story fills the height of the two side stories (its image grows). */
html body #community-app .event-front .news-teaser.news-slot-0{align-self:stretch!important;display:flex!important;flex-direction:column}
html body #community-app .event-front .news-teaser.news-slot-0>img{flex:1 1 auto;height:auto!important;min-height:clamp(240px,22vw,380px)!important}
/* Archive uses the same card styling, in a plain three-column grid. */
html body #community-app .event-archive-grid.event-edition-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-rows:none!important;padding:16px 6px 0!important;gap:16px!important}
@media(max-width:1199px){html body #community-app .event-archive-grid.event-edition-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}

/* Main Index: backdrop fades into the frame on every side; sections keep clear of the edges; first section starts
   between the SDN sign and the planters. */
html body #community-app:is([data-scene],[data-scene]) #app-view>.forum-main-index{background:
 linear-gradient(90deg,#090c10 0,transparent 7%,transparent 93%,#090c10 100%) top left / 100% 100% no-repeat local,
 linear-gradient(180deg,#090c10 0,transparent 5%) top left / 100% 100% no-repeat local,
 #090c10 url('/assets/backdrop-index-sdn-city.webp') top center / 100% auto no-repeat local!important}
html body #community-app #app-view>.forum-main-index>.index-hero{min-height:31cqw!important;margin-bottom:0!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section{width:calc(90% - 32px)!important;margin-left:32px!important;margin-right:auto!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(even){margin-left:auto!important;margin-right:32px!important}
html body #community-app #app-view>.forum-main-index>.index-hero{min-height:34cqw!important}
/* Row / archive cards: image on top, text inset - overrides the older solo / slot-3-4 layouts. */
html body #community-app #app-view :is(.event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5),.event-archive-grid .news-teaser){display:flex!important;flex-direction:column!important;grid-template-columns:none!important;grid-template-areas:none!important;padding:0 0 16px!important;grid-column:auto!important;grid-row:auto!important}
html body #community-app #app-view :is(.event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5),.event-archive-grid .news-teaser)>*{margin-inline:18px!important;grid-area:auto!important}
html body #community-app #app-view :is(.event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5),.event-archive-grid .news-teaser)>img{margin:0!important;width:100%!important;height:170px!important;min-height:0!important}
html body #community-app #app-view :is(.event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5),.event-archive-grid .news-teaser)>.news-meta{margin-top:14px!important}
html body #community-app #app-view :is(.event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5),.event-archive-grid .news-teaser)>p{font-size:14px!important;line-height:1.55!important;margin-bottom:10px!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-1,.news-slot-2){padding:0 0 16px!important;grid-template-columns:none!important;grid-template-areas:none!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>*{margin-inline:18px!important;grid-area:auto!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>img{margin:0!important;width:100%!important}
/* Main Index: the backdrop runs right up to the black frame (no inset margin around it). */
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view.hz-index{padding:0!important}
html body #community-app:is([data-scene],[data-scene]) #app-view>.forum-main-index{border-radius:0!important;margin:0!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index>.index-hero{padding-top:clamp(40px,4vw,64px)!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(odd){margin-left:40px!important;margin-right:auto!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(even){margin-right:40px!important;margin-left:auto!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section{width:calc(90% - 40px)!important}
/* Main Index tile edge: one outline that follows the rounded corners (no doubled line on hover). */
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry){border:0!important;border-left:3px solid var(--ix-accent)!important;outline:1px solid color-mix(in srgb,var(--ix-accent) 60%,transparent);outline-offset:-1px;transition:outline-color .18s,outline-width .18s,outline-offset .18s,transform .18s,box-shadow .18s}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-visible){outline:3px solid var(--ix-accent);outline-offset:-3px}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry)::after{content:none!important}
/* Edge drawn by one overlay above the art (outline painted underneath the positioned artwork). */
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry){border:0!important;outline:0!important}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry)::after{content:''!important;display:block!important;position:absolute;inset:0;z-index:6;pointer-events:none;border-radius:inherit;box-sizing:border-box;
 border:1px solid color-mix(in srgb,var(--ix-accent) 60%,transparent);border-left:3px solid var(--ix-accent);box-shadow:none!important;transition:border-width .18s,border-color .18s}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-visible)::after{border:3px solid var(--ix-accent)}
/* Main Index tiles: no corner bracket, no scanlines; compact height. */
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry){background:linear-gradient(135deg,#0e141b,#070a0e)!important;min-height:150px!important}
html body #community-app #app-view>.forum-main-index :is(.basic-forum-entry,.index-page-entry)>:is(.basic-forum-identity,.forum-entry-label){padding:14px 0 10px 18px!important}
/* Main Index sections: clean, uniform containers (same border all round, one radius, no side slabs or channel labels). */
html body #community-app #app-view>.forum-main-index>.forum-index-section,
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(even){border:1px solid #ffffff1a!important;border-radius:12px!important;
 background:#080b10d9!important;backdrop-filter:blur(10px);box-shadow:0 16px 40px #0009!important;padding:18px 20px 20px!important}
html body #community-app .forum-main-index .forum-index-section>header::after{content:none!important}
html body #community-app .forum-main-index .forum-index-section>header{border-bottom:0!important;padding:0 0 0 2px!important;margin-bottom:14px!important}
html body #community-app .forum-main-index .forum-index-section>header h2::before{padding:3px 7px!important;font-size:12px!important}
html body #community-app .forum-main-index .forum-index-section:nth-of-type(even)>header{flex-direction:row!important}
html body #community-app .forum-main-index .forum-index-section>header>.ix-edit{margin-left:auto!important;margin-right:0!important}
html body #community-app .forum-main-index .forum-index-section>header{display:flex!important;justify-content:space-between!important}
html body #community-app .forum-main-index .forum-index-section>header>.ix-edit{order:9!important;margin-left:auto!important}
html body #community-app .forum-main-index .forum-index-section>header>.ix-edit{margin-right:0!important}

/* =====================================================================
   Layout template (first applied to the Main Index): full-page art, invisible top bar.
   ===================================================================== */
#community-app #site-backdrop{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;transition:opacity .5s ease;
 background:#090c10 url('/assets/backdrop-index-sdn-city.webp') no-repeat;background-size:100% auto;background-position:center calc(var(--ix-scroll,0px) * -1)}
#community-app:is([data-scene=welcome],[data-scene=index]) #site-backdrop{opacity:1}
#community-app:is([data-scene=welcome],[data-scene=index])::after{opacity:0!important}
/* Everything over the art goes see-through on the index. */
html body #community-app:is([data-scene=welcome],[data-scene=index]) :is(.app-header,#app-sidebar,#app-workspace,.app-content,.app-body){background:transparent!important;background-image:none!important;box-shadow:none!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-sidebar{background:linear-gradient(90deg,#05070acc,#05070a55)!important;border-color:transparent!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-frame{background:transparent!important;border-color:transparent!important;box-shadow:none!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-frame>.frame-fill{opacity:0}
html body #community-app:is([data-scene],[data-scene]):is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index{background:transparent!important}
/* Top bar: only the right-hand icons and My Profile show on the index; brand, trail and the bottom rule fade in elsewhere. */
html body #community-app .app-header{transition:background-color .4s ease,border-color .4s ease,box-shadow .4s ease}
html body #community-app .app-header :is(.app-brand,.header-forum-trail,#app-page-title){transition:opacity .45s ease .2s}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .app-header{border-bottom-color:transparent!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .app-header :is(.app-brand,.header-forum-trail,#app-page-title){opacity:0;pointer-events:none;transition:opacity .25s ease}
html body #community-app.brand-arriving .app-header .app-brand{opacity:0!important;transition:none!important}
/* Brand now matches the index title: small gold kicker over a white DISPATCH in the title face. */
html body #community-app .app-header .app-brand{display:flex!important;flex-direction:column-reverse;justify-content:center;gap:2px;line-height:1}
html body #community-app .app-header .app-brand small{font:700 8.5px/1.1 var(--font-control-ui,'Segoe UI'),sans-serif!important;letter-spacing:.24em!important;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)!important;margin:0!important}
html body #community-app .app-header .app-brand span{font:700 24px/1 var(--font-control-title,'Segoe UI'),sans-serif!important;letter-spacing:.06em!important;color:#fff!important}
/* The first section starts between the SDN sign and the planters, now measured against the full-page art. */
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index>.index-hero{min-height:calc(33vw - 90px)!important}
html body #community-app .app-header .app-brand{overflow:visible!important;min-width:max-content}
html body #community-app .app-header .app-brand small{white-space:nowrap!important;font-size:8px!important;letter-spacing:.16em!important}
/* Main Index: no leftover frame layers (the world backdrop panel and its dark inset edge sat behind the old frame). */
html body #community-app:is([data-scene=welcome],[data-scene=index]) .world-backdrop{display:none!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-frame{border-width:0!important;padding:0!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-frame::before,html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-frame::after{display:none!important}
/* No box behind the title: its legibility shade now lives on the full-page art, and the index scroll area reaches the window edges. */
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index>.index-hero::after{display:none!important}
#community-app:is([data-scene=welcome],[data-scene=index]) #site-backdrop{background-image:linear-gradient(90deg,#05070acc 0%,#05070a66 30%,transparent 55%),url('/assets/backdrop-index-sdn-city.webp');background-size:100% 100%,100% auto;background-position:0 0,center calc(var(--ix-scroll,0px) * -1)}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-workspace{padding:0!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-frame{margin:0!important;inset:0!important;width:100%!important;height:100%!important;border-radius:0!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index{padding:0 0 60px!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index>.index-hero{padding-left:72px!important;padding-top:80px!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]):is(.has-sidebar,.has-sidebar,:not(.x)) #app-workspace#app-workspace{padding:0!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index>.index-hero{padding-top:110px!important}
@media(min-width:651px){html body #community-app#community-app:is([data-scene=welcome],[data-scene=index]) #app-workspace#app-workspace{padding:0!important;scrollbar-gutter:auto}}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index .index-category-children{grid-template-columns:repeat(auto-fill,minmax(min(100%,520px),1fr))!important}
/* Frameless page: gear sits inside the window edge instead of on a frame corner. */
html body #community-app:is([data-scene=welcome],[data-scene=index]) #page-settings-toggle{left:auto!important;right:24px!important;top:72px!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #page-settings-panel{right:24px!important;top:122px!important}

/* =====================================================================
   Open layout, rolled out: Guidebook. Same frameless template as the Main Index - full-window art behind
   header, sidebar and page; content sits on glass panels. The header keeps its brand, trail and bottom rule.
   ===================================================================== */
#community-app[data-scene=guidebook] #site-backdrop{opacity:1;background-image:linear-gradient(180deg,#05070a99,#05070a33 30%,#05070a66),url('/assets/backdrop-guidebook-desktop-sdn.webp');background-size:100% 100%,cover;background-position:0 0,center}
#community-app[data-scene=guidebook]::after{opacity:0!important}
html body #community-app[data-scene=guidebook] :is(#app-workspace,.app-content,.app-body){background:transparent!important;background-image:none!important;box-shadow:none!important}
html body #community-app[data-scene=guidebook] .app-header{background:linear-gradient(180deg,#05070ae6,#05070a99)!important;backdrop-filter:blur(6px)}
html body #community-app[data-scene=guidebook] #app-sidebar{background:linear-gradient(90deg,#05070ae0,#05070a80)!important;border-color:transparent!important;backdrop-filter:blur(6px)}
html body #community-app[data-scene=guidebook] #app-frame{background:transparent!important;border-width:0!important;box-shadow:none!important;border-radius:0!important}
html body #community-app[data-scene=guidebook] #app-frame>.frame-fill,html body #community-app[data-scene=guidebook] .world-backdrop,html body #community-app[data-scene=guidebook] #app-frame::before,html body #community-app[data-scene=guidebook] #app-frame::after{display:none!important}
@media(min-width:651px){html body #community-app#community-app[data-scene=guidebook] #app-workspace#app-workspace{padding:28px 32px 24px!important}}
html body #community-app[data-scene=guidebook] #page-settings-toggle{left:auto!important;right:24px!important;top:72px!important}
html body #community-app[data-scene=guidebook] #page-settings-panel{right:24px!important;top:122px!important}
/* Reading panel and chapter tabs on dark glass so text stays legible over the desk. */
html body #community-app[data-scene=guidebook] .guide-panel{background:#080b10e6!important;backdrop-filter:blur(10px);border:1px solid #ffffff1a!important;border-radius:14px!important;box-shadow:0 20px 50px #000b!important}
html body #community-app[data-scene=guidebook] .guide-side{padding-top:56px!important}
html body #community-app[data-scene=guidebook] .guide-tab:not(.is-active){background:#080b10cc!important;backdrop-filter:blur(6px)}
html body #community-app[data-scene=guidebook] .guide-tab{word-break:keep-all!important;overflow-wrap:normal!important;hyphens:none}

/* =====================================================================
   Open layout on every page except the World (.open-layout; the Main Index has its own rules above).
   ===================================================================== */
html body #community-app .app-header{border-bottom:0!important;box-shadow:none!important}
#community-app.open-layout #site-backdrop{opacity:1;background-image:linear-gradient(180deg,#05070a99,#05070a33 30%,#05070a66),var(--open-art,url('/assets/backdrop-welcome-office.webp'));background-size:100% 100%,cover;background-position:0 0,center}
#community-app.open-layout[data-scene=guidebook]{--open-art:url('/assets/backdrop-guidebook-desktop-sdn.webp')}
#community-app.open-layout[data-scene=characters]{--open-art:url('/assets/backdrop-hero-roster.webp')}
#community-app.open-layout[data-scene=factions]{--open-art:url('/assets/backdrop-factions-office.webp')}
#community-app.open-layout[data-scene=events]{--open-art:url('/assets/backdrop-events-office.webp')}
#community-app.open-layout[data-scene=archive]{--open-art:url('/assets/backdrop-records-office.webp')}
#community-app.open-layout[data-scene=application]{--open-art:url('/assets/backdrop-application-classifieds.webp')}
#community-app.open-layout:is([data-scene=player],[data-scene=watching],[data-scene=bookmarks]){--open-art:url('/assets/backdrop-welcome-office.webp')}
#community-app.open-layout::after{opacity:0!important}
html body #community-app.open-layout :is(#app-workspace,.app-content,.app-body){background:transparent!important;background-image:none!important;box-shadow:none!important}
html body #community-app.open-layout .app-header{background:linear-gradient(180deg,#05070ae6,#05070a99)!important;backdrop-filter:blur(6px)}
html body #community-app.open-layout #app-sidebar{background:linear-gradient(90deg,#05070ae0,#05070a80)!important;border-color:transparent!important;backdrop-filter:blur(6px)}
html body #community-app.open-layout #app-frame{background:transparent!important;border-width:0!important;box-shadow:none!important;border-radius:0!important}
html body #community-app.open-layout :is(#app-frame>.frame-fill,.world-backdrop,#app-frame::before,#app-frame::after){display:none!important}
@media(min-width:651px){html body #community-app#community-app.open-layout #app-workspace#app-workspace{padding:28px 32px 24px!important}}
html body #community-app.open-layout #page-settings-toggle{left:auto!important;right:24px!important;top:72px!important}
html body #community-app.open-layout #page-settings-panel{right:24px!important;top:122px!important}
html body #community-app.open-layout #page-corner-actions{top:92px!important;right:76px!important}
/* Content on dark glass so it reads over the art. */
html body #community-app.open-layout :is(.guide-panel,.cast-directory,.event-newspaper,.app-panel,.app-surface,.application-desk,.faction-photo-wall,.archive-shelf,.watching-list){background:#080b10e6!important;backdrop-filter:blur(10px);border:1px solid #ffffff1a!important;border-radius:14px!important;box-shadow:0 20px 50px #000b!important}
html body #community-app.open-layout #app-view>.app-heading{padding:6px 4px 10px}
html body #community-app.open-layout #app-view>.app-heading h1{text-shadow:0 2px 14px #000}
/* Open layout spacing: one padding source (the workspace), clear of the corner controls; even gutters inside the character list. */
@media(min-width:651px){html body #community-app#community-app.open-layout #app-workspace#app-workspace{padding:64px 32px 24px!important}}
html body #community-app.open-layout:not([data-scene=guidebook]) #app-view{padding:0!important}
html body #community-app.open-layout .cast-results{padding:20px 20px 20px 20px!important}
html body #community-app.open-layout .cast-sidebar{padding:18px!important}
html body #community-app.open-layout[data-scene=guidebook] .guide-side{padding-top:0!important}
html body #community-app.open-layout[data-scene=guidebook] :is(.guide-tabs,.guide-side){padding-top:0!important;margin-top:0!important}

/* ---- Header space: not reserved on the Main Index; elsewhere the bar drops in and the page slides down to make room ---- */
html body #community-app .app-header{position:absolute!important;top:0;left:0;right:0;z-index:10150;background:transparent!important;backdrop-filter:none!important;isolation:isolate}
html body #community-app .app-header::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:rgba(20,27,37,.93);transform:translateY(0);opacity:1;transition:transform .45s cubic-bezier(.3,.7,.2,1),opacity .35s ease}
html body #community-app.open-layout .app-header::before{background:linear-gradient(180deg,#05070ae6,#05070a99);backdrop-filter:blur(2px)}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .app-header::before{transform:translateY(-100%);opacity:0}
html body #community-app .app-body{top:0!important;padding-top:var(--header-height,58px);box-sizing:border-box;transition:padding-top .45s cubic-bezier(.3,.7,.2,1)}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .app-body{padding-top:0}
html body #community-app #app-sidebar{transition:top .45s cubic-bezier(.3,.7,.2,1),background .35s ease}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-sidebar{top:0!important;height:100%!important}
/* Lighter sidebar blur. */
html body #community-app.open-layout #app-sidebar{backdrop-filter:blur(2px)!important}
/* Main Index: more room on the right. */
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(even){margin-right:88px!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section{width:calc(90% - 88px)!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index>.index-hero{padding-right:88px!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 76px);mask-image:linear-gradient(180deg,transparent 0,#000 76px)}
/* One motion for the header hand-off: bar, page offset, sidebar, trail and the flying title share duration and easing. */
#community-app{--hdr-dur:.6s;--hdr-ease:cubic-bezier(.22,.8,.2,1)}
html body #community-app .app-header::before{transition:transform var(--hdr-dur) var(--hdr-ease),opacity var(--hdr-dur) var(--hdr-ease)!important}
html body #community-app .app-body{transition:padding-top var(--hdr-dur) var(--hdr-ease)!important}
html body #community-app #app-sidebar{transition:top var(--hdr-dur) var(--hdr-ease),height var(--hdr-dur) var(--hdr-ease),width .25s ease,padding .25s ease,background .35s ease!important}
html body #community-app .app-header :is(.header-forum-trail,#app-page-title){transition:opacity var(--hdr-dur) var(--hdr-ease),transform var(--hdr-dur) var(--hdr-ease)!important;transform:none}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .app-header :is(.header-forum-trail,#app-page-title){transform:translateY(-8px)}
html body #community-app .app-header .app-brand{transition:opacity var(--hdr-dur) var(--hdr-ease)!important}
/* The title lands as the brand: no fade-in gap afterwards. */
html body #community-app.brand-landed .app-header .app-brand{opacity:1!important;transition:none!important}
/* The overlaid header only catches clicks on its own controls, so it never blocks the sidebar toggle beneath it. */
html body #community-app .app-header{pointer-events:none}
html body #community-app .app-header>*{pointer-events:auto}
html body #community-app:is([data-scene=welcome],[data-scene=index]) .app-header :is(.app-brand,.header-forum-trail,#app-page-title){pointer-events:none!important}
html body #community-app #app-sidebar{z-index:10160!important}
/* Cast cards stay overflow-visible (for the corner bookmark), so the portrait and head panels round their own outer corners. */
html body #community-app .cast-card>.character-card-portrait{border-radius:16px 0 0 16px!important;overflow:hidden!important}
html body #community-app .cast-card>.cast-card-head{border-top-right-radius:16px!important}
html body #community-app .cast-card>.cast-card-body{border-bottom-right-radius:16px!important}

/* =====================================================================
   The World on the open layout (pass 1): the map fills the window; frame, monitor bezel and ring are gone;
   directory and thread cards float on glass.
   ===================================================================== */
#community-app.world-open .world-backdrop{z-index:-1!important;border-radius:0!important}
#community-app.world-open .world-backdrop::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 55% 50%,transparent 45%,#05070aa6 100%),linear-gradient(180deg,#05070a80,transparent 18%)}
html body #community-app.world-open :is(.world-monitor-frame,.world-frame-ring,#app-frame>.frame-fill,#app-frame::before,#app-frame::after){display:none!important}
html body #community-app.world-open :is(#app-workspace,.app-content,.app-body){background:transparent!important;background-image:none!important;box-shadow:none!important}
html body #community-app.world-open #app-frame{background:transparent!important;border-width:0!important;box-shadow:none!important;border-radius:0!important}
html body #community-app.world-open .app-header::before{background:linear-gradient(180deg,#05070ae6,#05070a99)}
html body #community-app.world-open #app-sidebar{background:linear-gradient(90deg,#05070ae0,#05070a80)!important;border-color:transparent!important;backdrop-filter:blur(2px)!important}
@media(min-width:651px){html body #community-app#community-app.world-open #app-workspace#app-workspace{padding:64px 32px 24px!important}}
html body #community-app.world-open #page-settings-toggle{left:auto!important;right:24px!important;top:72px!important}
html body #community-app.world-open #page-settings-panel{right:24px!important;top:122px!important}
/* Back / forward: top-left corner of the page area. */
html body #community-app.world-open .app-history-controls{top:4px!important;left:0!important}
/* Location directory and thread list on dark glass. */
html body #community-app.world-open .location-side-directory{background:#080b10d9!important;backdrop-filter:blur(8px);border:1px solid #ffffff1a!important;border-radius:14px!important;box-shadow:0 18px 44px #000a!important}
html body #community-app.world-open .thread-grid-pagination{background:#080b10b3;backdrop-filter:blur(6px);border:1px solid #ffffff14;border-radius:14px;padding:14px!important;box-shadow:0 18px 44px #0009}
/* Overview (Operations terminal): full-window world map behind a glass terminal. */
#community-app.world-open[data-world-location=overview] #site-backdrop{opacity:1;background-image:radial-gradient(ellipse at 50% 55%,#05070a33,#05070ae6 85%),url('/assets/world-geography.svg?v=4');background-color:#0d1d24;background-size:100% 100%,cover;background-position:center}
html body #community-app.world-open .world-terminal-screen{background:#080b10d9!important;backdrop-filter:blur(10px);border:1px solid #ffffff1a!important;border-radius:14px!important;box-shadow:0 20px 50px #000b!important}
/* World: the window backdrop is always the world map (never the Main Index art), shown on the overview and faded out
   underneath local maps - so leaving the overview never flashes another page's art. */
#community-app.world-open #site-backdrop{background-image:radial-gradient(ellipse at 50% 55%,#05070a33,#05070ae6 85%),url('/assets/world-geography.svg?v=4')!important;background-color:#0d1d24!important;background-size:100% 100%,cover!important;background-position:center!important;opacity:0}
#community-app.world-open[data-world-location=overview] #site-backdrop{opacity:1}
html body #community-app.world-open .thread-grid-pagination{align-self:start!important;height:auto!important;min-height:0!important;flex:0 0 auto!important}
/* World thread cards lift off the map: a soft dark drop shadow, deeper on hover. */
html body #community-app.world-open .dispatch-thread-card{box-shadow:0 10px 26px rgb(0 0 0 / .55),0 2px 6px rgb(0 0 0 / .45)!important;transition:box-shadow .18s ease,transform .18s ease}
html body #community-app.world-open .dispatch-thread-card:hover{box-shadow:0 16px 36px rgb(0 0 0 / .65),0 3px 8px rgb(0 0 0 / .5)!important}
html body #community-app.world-open .location-side-directory .location-side-card{box-shadow:0 6px 16px rgb(0 0 0 / .45)}
html body #community-app.world-open .dispatch-thread-card{box-shadow:0 14px 34px rgb(0 0 0 / .85),0 4px 10px rgb(0 0 0 / .7),0 0 0 1px rgb(0 0 0 / .6)!important}
html body #community-app.world-open .dispatch-thread-card:hover{box-shadow:0 20px 44px rgb(0 0 0 / .9),0 6px 14px rgb(0 0 0 / .75),0 0 0 1px rgb(0 0 0 / .6)!important}
html body #community-app.world-open .thread-grid-pagination{background:#080b1066!important}
/* Main Index sections: no visible container - just the header and its cards over the art. */
html body #community-app #app-view>.forum-main-index>.forum-index-section,
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(even){background:none!important;backdrop-filter:none!important;border:0!important;box-shadow:none!important;padding:0!important}
html body #community-app .forum-main-index .forum-index-section>header h2{text-shadow:0 2px 12px #000,0 0 2px #000}

/* ---- No framed panel: content sits directly on the page art; each piece carries its own shadow ---- */
html body #community-app.open-layout .cast-directory{background:none!important;backdrop-filter:none!important;border:0!important;box-shadow:none!important;border-radius:0!important;gap:24px!important}
html body #community-app.open-layout .cast-sidebar{background:#080b10d9!important;backdrop-filter:blur(8px);border:1px solid #ffffff1a!important;border-radius:14px!important;box-shadow:0 16px 40px rgb(0 0 0 / .7),0 3px 8px rgb(0 0 0 / .5)!important;align-self:start;max-height:100%;overflow:auto}
html body #community-app.open-layout .cast-results{background:none!important;border:0!important;padding:14px 16px 20px 6px!important}
html body #community-app.open-layout .cast-card{box-shadow:0 14px 34px rgb(0 0 0 / .8),0 4px 10px rgb(0 0 0 / .6)!important;transition:box-shadow .18s ease,transform .18s ease}
html body #community-app.open-layout .cast-card:hover{box-shadow:0 20px 44px rgb(0 0 0 / .85),0 6px 14px rgb(0 0 0 / .65)!important}

/* ---- Main Index: compact square tiles that widen on hover/focus to reveal counts + last post ---- */
@media (hover:hover) and (min-width:760px){
html body #community-app #app-view>.forum-main-index .index-category-children{display:flex!important;flex-wrap:wrap;gap:16px!important;grid-template-columns:none!important;align-items:stretch}
html body #community-app #app-view>.forum-main-index .index-category-children>:is(.basic-forum-entry,.index-page-entry){--sq:184px;flex:0 0 var(--sq)!important;width:var(--sq)!important;min-width:0!important;height:var(--sq)!important;min-height:0!important;overflow:hidden;transition:flex-basis .42s cubic-bezier(.22,.8,.2,1),width .42s cubic-bezier(.22,.8,.2,1),box-shadow .2s ease;transition-delay:.06s}
html body #community-app #app-view>.forum-main-index .index-category-children>:is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-within){flex-basis:min(620px,100%)!important;width:min(620px,100%)!important;transition-delay:0s}
/* collapsed: art fills the square, title sits at the bottom */
html body #community-app #app-view>.forum-main-index .index-category-children>*>.forum-entry-portrait{transition:opacity .3s ease}
html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within)>.forum-entry-portrait{position:absolute!important;inset:0!important;width:auto!important;height:auto!important;opacity:.55;-webkit-mask-image:linear-gradient(180deg,#000 20%,transparent 100%)!important;mask-image:linear-gradient(180deg,#000 20%,transparent 100%)!important}
html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within)>.forum-entry-portrait img{width:100%!important;height:100%!important;object-fit:cover}
html body #community-app #app-view>.forum-main-index .index-category-children>*>:is(.basic-forum-counts,.basic-forum-latest,.forum-entry-children,.index-entry-children){transition:opacity .25s ease;transition-delay:.15s;white-space:nowrap}
html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within)>:not(.forum-entry-portrait,.basic-forum-identity,.forum-entry-label){opacity:0!important;pointer-events:none;transition-delay:0s}
html body #community-app #app-view>.forum-main-index .index-category-children>*>:not(.forum-entry-portrait,.basic-forum-identity,.forum-entry-label){transition:opacity .25s ease;transition-delay:.18s}
html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within){display:block!important}
html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within) :is(h2,h3){font-size:20px!important;line-height:1.15!important;white-space:normal!important}
html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within)>:is(.basic-forum-identity,.forum-entry-label){position:absolute!important;left:16px!important;right:14px!important;bottom:16px!important;top:auto!important;width:auto!important;margin:0!important;z-index:2}
html body #community-app #app-view>.forum-main-index .index-category-children>:is(.basic-forum-entry,.index-page-entry){position:relative}
}
@media (hover:hover) and (min-width:760px){
html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within) :is(h2,h3){font-size:17px!important;overflow-wrap:normal!important;word-break:normal!important;hyphens:none}
html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within) .basic-forum-identity>:not(.forum-entry-label){display:none!important}
html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within)>.forum-entry-portrait{opacity:.8}
}
@media (hover:hover) and (min-width:760px){html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within) .forum-entry-label>:not(h2,h3){display:none!important}}
@media (hover:hover) and (min-width:760px){
html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within)>.basic-forum-identity>:not(.forum-entry-label){display:none!important}
html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within) :is(h2,h3){font-size:18px!important;overflow-wrap:normal!important;word-break:normal!important}
}

/* ---- Events front page fits the window (sized like the Guidebook panel), no page scroll; unframed ---- */
html body #community-app.open-layout #app-view>.event-newspaper{background:none!important;backdrop-filter:none!important;border:0!important;box-shadow:none!important}
html body #community-app.open-layout .event-newspaper>.newspaper-masthead{border-radius:14px!important;background:#080b10d9!important;backdrop-filter:blur(8px);border:1px solid #ffffff1a!important;box-shadow:0 16px 40px rgb(0 0 0 / .7),0 3px 8px rgb(0 0 0 / .5),inset 0 -2px 0 color-mix(in srgb,var(--news-accent) 55%,transparent)!important;margin:0!important}
html body #community-app.open-layout .event-newspaper :is(.news-teaser,.news-archive-card){box-shadow:0 14px 34px rgb(0 0 0 / .8),0 4px 10px rgb(0 0 0 / .6)!important;border-radius:12px!important;background:#0b1015f2!important}
html body #community-app.open-layout .event-newspaper .event-front .news-teaser.news-slot-2{border-top:0!important}
@media (min-width:1200px) and (min-height:860px){
html body #community-app[data-scene=events] #app-view>.event-newspaper:has(>.event-front){flex:0 0 auto!important;height:calc(100% - 32px)!important;display:flex!important;flex-direction:column;overflow:hidden!important;padding:0!important}
html body #community-app .event-newspaper:has(>.event-front)>.newspaper-masthead{flex:none;padding:14px 24px!important}
html body #community-app .event-newspaper:has(>.event-front)>.newspaper-masthead h2{font-size:clamp(26px,2.4vw,36px)!important;margin:4px 0 0!important}
html body #community-app .event-front.newspaper-grid.event-edition-grid{flex:1 1 auto;min-height:0;padding:16px 0 0!important;grid-template-rows:minmax(0,1fr) minmax(0,1fr)!important;grid-auto-rows:minmax(0,1fr)!important}
html body #community-app .event-front.newspaper-grid.event-edition-grid:has(.news-slot-3){grid-template-rows:minmax(0,1fr) minmax(0,1fr) minmax(0,.62fr)!important}
html body #community-app .event-front .news-teaser{min-height:0!important;overflow:hidden!important}
/* lead story: art shrinks to whatever room is left after the text */
html body #community-app .event-front .news-teaser.news-slot-0{display:flex!important;flex-direction:column;padding:0 0 16px!important}
html body #community-app .event-front .news-teaser.news-slot-0>*{margin-inline:22px!important}
html body #community-app .event-front .news-teaser.news-slot-0>img{order:-1;flex:1 1 0;min-height:80px!important;height:auto!important;width:auto;margin:0!important;border-radius:0!important;object-fit:cover}
html body #community-app .event-front .news-teaser.news-slot-0>.news-meta{margin-top:14px!important}
html body #community-app .event-front .news-teaser.news-slot-0>h3{font-size:clamp(22px,2vw,30px)!important;line-height:1.15!important;margin-block:8px 6px!important}
html body #community-app .event-front .news-teaser.news-slot-0>p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-block:0 8px!important;font-size:15px!important}
html body #community-app .event-front .news-teaser.news-slot-0>.news-continue{margin-top:0!important}
/* side stories */
html body #community-app .event-front .news-teaser:is(.news-slot-1,.news-slot-2){padding:0 0 12px!important}
html body #community-app .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>img{flex:1 1 0;height:auto!important;min-height:50px!important}
html body #community-app .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>h3{font-size:clamp(16px,1.25vw,20px)!important;line-height:1.2!important;margin-block:6px 4px!important}
html body #community-app .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>p{-webkit-line-clamp:2!important;font-size:13.5px!important;margin-block:0 6px!important}
html body #community-app .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>.news-meta{margin-top:10px!important}
/* lower row: compact side-by-side cards */
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5){display:grid!important;grid-template-columns:40% 1fr!important;grid-template-rows:auto auto 1fr!important;grid-template-areas:"img meta" "img title" "img more"!important;flex-direction:unset!important;column-gap:14px;padding:0 14px 0 0!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5)>*{margin-inline:0!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5)>img{grid-area:img!important;height:100%!important;width:100%!important;min-height:0!important;margin:0!important;order:0!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5)>.news-meta{grid-area:meta!important;margin-top:12px!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5)>h3{grid-area:title!important;font-size:16px!important;margin:6px 0 0!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5)>p{display:none!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5)>.news-continue{grid-area:more!important;align-self:end;margin:0 0 12px!important}
/* archive link: slim bar */
html body #community-app .event-newspaper:has(>.event-front)>.news-archive-card{flex:none;margin:14px 0 0!important;padding:9px 16px!important}
html body #community-app .event-newspaper:has(>.event-front)>.news-archive-card .nac-icon{width:30px;height:30px}
html body #community-app .event-newspaper:has(>.event-front)>.news-archive-card small{display:none}
}
@media (min-width:1200px) and (min-height:860px){html body #community-app .event-front:has(.news-slot-3) .news-teaser:is(.news-slot-1,.news-slot-2)>p{display:none!important}}
/* ---- Events: smaller lead story — half width, capped art; side stories use the compact side-by-side card ---- */
@media (min-width:1200px) and (min-height:860px){
html body #community-app #app-view .event-front.newspaper-grid.event-edition-grid,
html body #community-app #app-view .event-front.newspaper-grid.event-edition-grid:has(.news-slot-3){grid-template-columns:repeat(6,minmax(0,1fr))!important;grid-template-rows:auto auto!important;grid-auto-rows:minmax(150px,190px)!important;align-content:start;flex:0 1 auto!important}
html body #community-app #app-view .event-front .news-teaser.news-slot-0{grid-column:1 / span 3!important;grid-row:1 / span 2!important}
html body #community-app #app-view .event-front .news-teaser.news-slot-0>img{flex:none!important;height:clamp(180px,26vh,300px)!important;min-height:0!important}
html body #community-app #app-view .event-front .news-teaser.news-slot-0>h3{font-size:clamp(20px,1.6vw,26px)!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-1,.news-slot-2){grid-column:4 / span 3!important;display:grid!important;grid-template-columns:40% 1fr!important;grid-template-rows:auto auto 1fr auto!important;grid-template-areas:"img meta" "img title" "img text" "img more"!important;column-gap:16px;padding:0 16px 0 0!important}
html body #community-app #app-view .event-front .news-teaser.news-slot-1{grid-row:1!important}
html body #community-app #app-view .event-front .news-teaser.news-slot-2{grid-row:2!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>*{margin-inline:0!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>img{grid-area:img!important;order:0!important;height:100%!important;width:100%!important;min-height:0!important;margin:0!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>.news-meta{grid-area:meta!important;margin-top:14px!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>h3{grid-area:title!important;font-size:18px!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>p{grid-area:text!important;display:-webkit-box!important;-webkit-line-clamp:3!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-1,.news-slot-2)>.news-continue{grid-area:more!important;margin:0 0 14px!important}
html body #community-app #app-view .event-front .news-teaser:is(.news-slot-3,.news-slot-4,.news-slot-5){grid-column:span 2!important;grid-row:auto!important}
}

/* ---- Site Events in the Guidebook layout: reading panel + event tabs (Front Page first, pager in the last slot) ---- */
#community-app[data-scene] .guide-layout.event-guide{--gb1:233 179 90;--gb2:111 194 184;--gb3:98 162 228;--gb-glass:rgba(12,16,18,.66);display:block;max-width:none;width:100%;margin:0;padding:0;transform:none;color:#d6d2c8;font:400 15px/1.6 'Segoe UI',sans-serif}
html body #community-app .event-guide .guide-panes>.event-newspaper{background:none!important;backdrop-filter:none!important;border:0!important;box-shadow:none!important;border-radius:0!important;padding:0!important;margin:0!important;width:100%!important;max-width:none!important;overflow:visible!important;height:auto!important}
html body #community-app .event-guide .event-in-guide :is(.news-teaser){box-shadow:0 10px 26px rgb(0 0 0 / .6)!important}
html body #community-app .event-guide .event-guide-opener{margin:0 0 18px}
html body #community-app .event-guide .event-guide-opener span{display:block;font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.24em;text-transform:uppercase;color:rgb(233 179 90)}
html body #community-app .event-guide .event-guide-opener h2{margin:6px 0 0;font:700 clamp(28px,2.6vw,40px)/1.05 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff;text-transform:uppercase;letter-spacing:.02em}
html body #community-app #app-view .event-guide .event-front.newspaper-grid.event-edition-grid{padding:0!important;flex:none!important}
/* feature article inside the panel */
html body #community-app .event-guide .event-newspaper.newspaper-open{display:block!important;padding:0!important}
html body #community-app .event-guide .event-newspaper.newspaper-open>.newspaper-story{padding:0!important}
/* tabs: event titles in two lines max, a status dot, smaller than the chapter tabs */
#community-app[data-scene] .event-guide .guide-tab.event-tab{display:flex;align-items:center;gap:10px;font:600 14px/1.25 var(--font-control-title,'Segoe UI'),sans-serif;letter-spacing:.02em;text-transform:none;padding:10px 14px;min-height:52px}
#community-app[data-scene] .event-guide .guide-tab.event-tab-front{font:400 clamp(1.05rem,1.4vw,1.25rem)/1 'Bebas Neue','Arial Narrow',sans-serif;letter-spacing:1.5px;text-transform:uppercase;min-height:0;padding:12px 16px}
#community-app[data-scene] .event-guide .etab-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-width:0}
#community-app[data-scene] .event-guide .etab-dot{flex:none;width:8px;height:8px;border-radius:50%;background:#ff6b5b;box-shadow:0 0 8px #ff6b5b99}
#community-app[data-scene] .event-guide .etab-dot.is-complete{background:#7fd6a4;box-shadow:none}
#community-app[data-scene] .event-guide .event-tab-pager{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 8px;font:600 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.12em}
#community-app[data-scene] .event-guide .event-tab-pager:hover{padding-left:8px;background:var(--gb-glass)}
#community-app[data-scene] .event-guide .event-tab-pager button{width:34px;height:34px;border-radius:8px;border:1px solid rgb(233 179 90 / .5);background:transparent;color:#fff;font-size:18px;cursor:pointer}
#community-app[data-scene] .event-guide .event-tab-pager button:hover:not(:disabled){background:rgb(233 179 90 / .25)}
#community-app[data-scene] .event-guide .event-tab-pager button:disabled{opacity:.3;cursor:default}
#community-app[data-scene] .event-guide .guide-tab.is-active .etab-dot{box-shadow:0 0 0 2px #fff}

/* ---- Main Index v3: no section headings; every tile numbered; each row of tiles steps further right ---- */
html body #community-app #app-view>.forum-main-index{counter-reset:ixtile}
html body #community-app #app-view>.forum-main-index>.forum-index-section{position:relative;margin-right:40px!important;margin-top:0!important;margin-bottom:18px!important;width:auto!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(1){margin-left:72px!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(2){margin-left:142px!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(3){margin-left:212px!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(4){margin-left:282px!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(5){margin-left:352px!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section:nth-of-type(n+6){margin-left:422px!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section>header{position:absolute!important;top:0;left:-40px;margin:0!important;padding:0!important;min-height:0!important;border:0!important;background:none!important;z-index:3}
html body #community-app #app-view>.forum-main-index>.forum-index-section>header h2{display:none!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section>header .ix-edit{position:static!important;width:30px;height:30px;opacity:.55}
html body #community-app #app-view>.forum-main-index>.forum-index-section>header .ix-edit:hover{opacity:1}
html body #community-app #app-view>.forum-main-index .index-category-children>:is(.basic-forum-entry,.index-page-entry){counter-increment:ixtile}
html body #community-app #app-view>.forum-main-index .index-category-children>:is(.basic-forum-entry,.index-page-entry)::before{content:attr(data-tile-no);position:absolute;top:12px;right:14px;z-index:3;font:700 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.12em;color:var(--color-accent-default,#ffc45b);padding:5px 7px;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent);border-radius:6px;background:#05070acc;pointer-events:none;transition:opacity .2s ease}
html body #community-app #app-view>.forum-main-index .index-category-children>:is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-within)::before{opacity:0}
@media (hover:hover) and (min-width:760px){
html body #community-app #app-view>.forum-main-index .index-category-children{flex-wrap:nowrap!important}
html body #community-app #app-view>.forum-main-index .index-category-children>:is(.basic-forum-entry,.index-page-entry){--sqw:276px;flex:0 1 var(--sqw)!important;width:var(--sqw)!important;min-width:150px!important}
html body #community-app #app-view>.forum-main-index .index-category-children>:is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-within){flex:0 0 min(620px,70%)!important;width:min(620px,70%)!important}
}
html body #community-app #app-view>.forum-main-index{row-gap:18px!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section{margin-bottom:0!important;padding:0!important;min-height:0!important}
html body #community-app #app-view>.forum-main-index>.forum-index-section>.index-category-children{margin:0!important;padding:0!important}
html body #community-app #app-view#app-view>.forum-main-index>.forum-index-section.forum-index-section{margin-top:0!important}
html body #community-app #app-view#app-view>.forum-main-index>.forum-index-section.forum-index-section{margin-bottom:0!important}

/* ---- Event threads: cards, three across; neutral until hovered, then they take on the poster's color ---- */
html body #community-app .event-guide .event-linked-threads{clear:both;margin:34px 0 8px!important;padding:0!important;border:0!important;background:none!important}
html body #community-app .event-guide .event-linked-threads>h3{display:flex;align-items:center;gap:12px;margin:0 0 14px!important;font:700 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;letter-spacing:.22em;text-transform:uppercase;color:rgb(233 179 90)!important}
html body #community-app .event-guide .event-linked-threads>h3::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgb(233 179 90 / .5),transparent)}
html body #community-app .event-guide .event-linked-threads>h3 span{padding:3px 8px;border-radius:999px;background:rgb(233 179 90 / .15);letter-spacing:.05em}
html body #community-app .event-guide .event-thread-list{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))!important;gap:14px!important;margin:0!important}
html body #community-app .event-thread-card{--card-base:#9fb2c8;position:relative;isolation:isolate;display:flex;flex-direction:column;gap:6px;min-height:150px;padding:14px 16px 12px 18px;border:1px solid #ffffff1f;border-radius:10px;background:#0d131a;cursor:pointer;overflow:hidden;box-shadow:0 8px 22px rgb(0 0 0 / .45);transition:border-color .35s ease,transform .2s ease,box-shadow .35s ease}
html body #community-app .event-thread-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--card-base);transition:background .35s ease,width .35s ease;z-index:1}
html body #community-app .event-thread-card::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(135deg,color-mix(in srgb,var(--thread-accent) 26%,transparent),transparent 70%);opacity:0;transition:opacity .35s ease}
html body #community-app .event-thread-card:is(:hover,:focus-visible){border-color:color-mix(in srgb,var(--thread-accent) 60%,transparent);transform:translateY(-2px);box-shadow:0 14px 30px rgb(0 0 0 / .55),0 0 0 1px color-mix(in srgb,var(--thread-accent) 25%,transparent);outline:none}
html body #community-app .event-thread-card:is(:hover,:focus-visible)::before{background:var(--thread-accent);width:4px}
html body #community-app .event-thread-card:is(:hover,:focus-visible)::after{opacity:1}
html body #community-app .event-thread-card .etc-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font:600 10.5px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#8d98a5}
html body #community-app .event-thread-card .etc-place{margin-right:auto}
html body #community-app .event-thread-card .etr-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font:700 17px/1.25 var(--font-control-title,'Segoe UI'),sans-serif!important;color:#fff!important;text-decoration:none!important;transition:color .35s ease}
html body #community-app .event-thread-card:hover .etr-title{color:color-mix(in srgb,var(--thread-accent) 55%,#fff)!important}
html body #community-app .event-thread-card .etr-sub{margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font:400 13.5px/1.45 'Segoe UI',sans-serif;color:#aab4bf}
html body #community-app .event-thread-card :is(.etr-new,.etr-done,.etr-pin){padding:2px 6px;border-radius:4px;font:700 9.5px/1.3 'Segoe UI',sans-serif;letter-spacing:.1em}
html body #community-app .event-thread-card .etr-new{background:#5ad1e0;color:#0b1015}
html body #community-app .event-thread-card .etr-done{color:#7fd6a4;border:1px solid #7fd6a466}
html body #community-app .event-thread-card .etr-pin{color:rgb(233 179 90);border:1px solid rgb(233 179 90 / .45)}
html body #community-app .event-thread-card .etc-foot{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:10px;border-top:1px solid #ffffff12;font:500 12px/1.3 'Segoe UI',sans-serif;color:#8d98a5}
html body #community-app .event-thread-card .etc-avatar{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;font:700 10px/1 'Segoe UI',sans-serif;color:#0b1015;background:var(--card-base);transition:background .35s ease}
html body #community-app .event-thread-card:hover .etc-avatar{background:var(--thread-accent)}
html body #community-app .event-thread-card .etc-by b{color:#c9d2dc;font-weight:600}
html body #community-app .event-thread-card .etc-stats{margin-left:auto;display:grid;justify-items:end;text-align:right;white-space:nowrap}
html body #community-app .event-thread-card .etc-stats strong{color:#fff;font-size:15px}
html body #community-app .event-thread-card .etc-stats small{font-size:11px;color:#77828e}
html body #community-app .event-thread-card.is-complete{opacity:.8}

/* ---- In-page event editing ---- */
html body #community-app .event-guide .guide-panes:has(.is-editing){padding-top:0!important}
html body #community-app .event-in-guide.is-editing>.event-edit-bar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 16px;padding:10px 12px;border:1px solid rgb(233 179 90 / .35);border-top:0;border-radius:0 0 12px 12px;background:#0a0e13f2;backdrop-filter:blur(8px);box-shadow:0 10px 24px rgb(0 0 0 / .5)}
html body #community-app .event-edit-bar .eeb-label{font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.2em;text-transform:uppercase;color:rgb(233 179 90)}
html body #community-app .event-edit-bar .eeb-tools{flex:1;min-width:0}
html body #community-app .event-edit-bar .eeb-tools .rich-toolbar{margin:0!important;border:0!important;background:none!important;padding:0!important}
html body #community-app .event-edit-bar .eeb-actions{display:flex;gap:8px}
html body #community-app .event-edit-bar .eeb-actions button{padding:8px 16px;border-radius:8px;font:600 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer;border:1px solid #ffffff30;background:transparent;color:#dfe5ec}
html body #community-app .event-edit-bar .eeb-save{background:rgb(233 179 90)!important;border-color:transparent!important;color:#14100a!important}
html body #community-app .event-edit-bar .eeb-error{flex-basis:100%;margin:0;color:#ff8a7a;font-size:13px}
html body #community-app .event-edit-bar .eeb-error:empty{display:none}
html body #community-app .event-in-guide.is-editing .ee-field{outline:1px dashed rgb(233 179 90 / .45);outline-offset:4px;border-radius:4px;cursor:text;min-width:2ch}
html body #community-app .event-in-guide.is-editing .ee-field:focus{outline:2px solid rgb(233 179 90);background:#0008}
html body #community-app .event-in-guide.is-editing .ee-field:empty::before{content:attr(data-placeholder);color:#ffffff66}
html body #community-app .event-in-guide.is-editing .ee-status{cursor:pointer;user-select:none}
html body #community-app .event-in-guide.is-editing .news-hero{overflow:visible}
html body #community-app .event-in-guide.is-editing .ee-art{position:absolute;top:14px;right:14px;z-index:5;display:flex;flex-direction:column;align-items:flex-end;gap:8px}
html body #community-app .event-in-guide.is-editing .news-hero.no-image .ee-art{position:static;align-items:flex-start;padding:0 32px 18px}
html body #community-app .ee-art .ee-art-toggle{padding:7px 12px;border-radius:8px;border:1px solid #ffffff40;background:#05070acc;color:#fff;font:600 12.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer}
html body #community-app .ee-art .ee-art-field{display:flex;gap:6px;padding:8px;border-radius:10px;background:#05070ae6;border:1px solid #ffffff26;box-shadow:0 10px 24px #000a}
html body #community-app .ee-art .ee-art-field[hidden]{display:none}
html body #community-app .ee-art .ee-art-field input{width:320px;padding:7px 10px;border-radius:6px;border:1px solid #ffffff30;background:#0d131a;color:#fff}
html body #community-app .ee-art .ee-art-field button{padding:7px 10px;border-radius:6px;border:1px solid #ffffff30;background:#1a2230;color:#fff;cursor:pointer}
html body #community-app .event-in-guide.is-editing .ee-body{min-height:300px;outline:1px dashed rgb(233 179 90 / .35);outline-offset:10px;border-radius:6px;background:none!important;border:0!important;padding:0!important}
html body #community-app .event-in-guide.is-editing .ee-body:focus{outline-color:rgb(233 179 90 / .7)}
html body #community-app .event-in-guide.is-editing>.event-linked-threads{opacity:.35;pointer-events:none}
/* Main Index tiles: bigger titles, gentler widen, art only while hovered */
@media (hover:hover) and (min-width:760px){
html body #community-app #app-view>.forum-main-index .index-category-children>:is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-within){flex:0 0 min(420px,60%)!important;width:min(420px,60%)!important}
html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within)>.forum-entry-portrait{opacity:0!important}
html body #community-app #app-view>.forum-main-index .index-category-children>*>.forum-entry-portrait{transition:opacity .42s cubic-bezier(.22,.8,.2,1)!important}
html body #community-app #app-view>.forum-main-index .index-category-children>:is(.basic-forum-entry,.index-page-entry) :is(h2,h3){font-size:clamp(22px,1.8vw,28px)!important;line-height:1.12!important}
html body #community-app #app-view>.forum-main-index .index-category-children>:not(:hover,:focus-within) :is(h2,h3){font-size:clamp(22px,1.8vw,28px)!important}
}
html body #community-app .event-edit-bar .eeb-tools .rich-tools{flex-wrap:wrap;row-gap:6px}
html body #community-app .event-edit-bar .eeb-actions{margin-left:auto}

/* ---- Main Index v4: one two-row tile grid under the SDN sign; live wire cards in the sky above it ---- */
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles.ix-tiles{display:grid!important;grid-template-columns:repeat(var(--ix-cols,11),minmax(0,1fr))!important;grid-auto-rows:184px;gap:16px!important;margin:0 72px 40px 72px!important;padding:0!important;flex-wrap:initial!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry){width:100%!important;min-width:0!important;height:184px!important;flex:none!important;justify-self:start;z-index:1;transition:width .4s cubic-bezier(.22,.8,.2,1),box-shadow .25s ease!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-grow-left{justify-self:end}
@media (hover:hover){
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-within){width:calc(150% + 8px)!important;z-index:5;box-shadow:0 22px 50px rgb(0 0 0 / .8)!important}
}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry) :is(h2,h3){font-size:clamp(20px,1.55vw,26px)!important}
/* hero: wire cards float above the sign, staggered down and to the left */
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index>.index-hero{position:relative}
html body #community-app #app-view>.forum-main-index>.index-hero>.index-hero-panels.ix-wire{position:absolute!important;top:96px;right:120px;display:flex!important;flex-direction:column;align-items:flex-end;gap:14px;max-width:none!important;margin:0!important;grid-column:auto!important;z-index:2}
html body #community-app .ix-wire .ixw-card{--d:0s;display:flex;flex-direction:column;gap:6px;width:320px;padding:14px 18px 14px;border-radius:12px;border:1px solid #ffffff1f;border-top:2px solid var(--color-accent-default,#ffc45b);background:#070a0ec7;backdrop-filter:blur(8px);box-shadow:0 18px 40px rgb(0 0 0 / .6);color:#dfe5ec!important;text-decoration:none!important;animation:ixw-float 7s ease-in-out var(--d) infinite;transition:border-color .25s ease,box-shadow .25s ease,background .25s ease}
html body #community-app .ix-wire .ixw-card:nth-child(2){--d:-2.3s;margin-right:150px}
html body #community-app .ix-wire .ixw-card:nth-child(3){--d:-4.6s;margin-right:300px}
html body #community-app .ix-wire .ixw-card:hover{border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent);background:#0a0f15e6;box-shadow:0 24px 50px rgb(0 0 0 / .7),0 0 24px color-mix(in srgb,var(--color-accent-default,#ffc45b) 18%,transparent);animation-play-state:paused}
@keyframes ixw-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@media (prefers-reduced-motion:reduce){html body #community-app .ix-wire .ixw-card{animation:none}}
html body #community-app .ix-wire .ixw-kicker{display:flex;align-items:center;gap:8px;font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app .ix-wire .ixw-live{width:8px;height:8px;border-radius:50%;background:#ff5b4d;box-shadow:0 0 0 0 #ff5b4d99;animation:ixw-pulse 1.8s ease-out infinite}
@keyframes ixw-pulse{0%{box-shadow:0 0 0 0 #ff5b4daa}100%{box-shadow:0 0 0 10px #ff5b4d00}}
html body #community-app .ix-wire .ixw-row{display:flex;align-items:center;gap:14px}
html body #community-app .ix-wire .ixw-count{display:grid;justify-items:center;flex:none;padding-right:14px;border-right:1px solid #ffffff1f}
html body #community-app .ix-wire .ixw-count b{font:700 34px/1 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff}
html body #community-app .ix-wire .ixw-count small{font:600 9.5px/1.4 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#8d98a5}
html body #community-app .ix-wire .ixw-ticker{position:relative;flex:1;min-width:0;height:2.6em;font:600 14.5px/1.3 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff}
html body #community-app .ix-wire .ixw-ticker>span{position:absolute;inset:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;opacity:0;transform:translateY(8px);transition:opacity .5s ease,transform .5s ease}
html body #community-app .ix-wire .ixw-ticker>span.is-on{opacity:1;transform:none}
html body #community-app .ix-wire .ixw-updates strong{font:600 15px/1.3 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff}
html body #community-app .ix-wire .ixw-updates small{font:500 12px/1.2 'Segoe UI',sans-serif;color:#8d98a5}
html body #community-app .ix-wire .ixw-card p{margin:0;font:400 13px/1.45 'Segoe UI',sans-serif;color:#c9d2dc}
html body #community-app .ix-wire .ixw-go{margin-top:2px;font:700 12px/1 var(--font-control-ui,'Segoe UI'),sans-serif;color:#fff;opacity:.75;transition:opacity .2s ease,color .2s ease}
html body #community-app .ix-wire .ixw-card:hover .ixw-go{opacity:1;color:var(--color-accent-default,#ffc45b)}
@media(max-width:1100px){html body #community-app #app-view>.forum-main-index>.index-hero>.index-hero-panels.ix-wire{position:static!important;align-items:stretch;margin-top:20px!important}html body #community-app .ix-wire .ixw-card{width:auto;margin-right:0!important}}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles.ix-tiles{align-self:stretch!important;width:auto!important;max-width:none!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry){grid-column:var(--gc)!important;grid-row:var(--gr)!important}
html body #community-app .ix-tiles .ix-short{display:none}
html body #community-app .ix-tiles .ix-row>:not(:hover,:focus-within) .ix-full{display:none}
html body #community-app .ix-tiles .ix-row>:not(:hover,:focus-within) .ix-short{display:inline}
/* tile symbols + even side padding; titles size to the tile so long names never touch the edge */
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry){container-type:inline-size}
html body #community-app .ix-tiles .ix-symbol{position:absolute;top:18px;left:22px;z-index:3;width:30px;height:30px;color:var(--color-accent-default,#ffc45b);opacity:.9;pointer-events:none;transition:opacity .25s ease,transform .3s ease}
html body #community-app .ix-tiles .ix-symbol svg{width:100%;height:100%;filter:drop-shadow(0 2px 6px #000a)}
html body #community-app .ix-tiles .ix-row>:is(:hover,:focus-within) .ix-symbol{opacity:0;transform:scale(.8)}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:not(:hover,:focus-within)>:is(.basic-forum-identity,.forum-entry-label){left:22px!important;right:22px!important;padding:0!important;margin:0!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:not(:hover,:focus-within)>.basic-forum-identity>.forum-entry-label{padding:0!important;margin:0!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry) :is(h2,h3){font-size:clamp(18px,10cqi,28px)!important;overflow-wrap:break-word}
html body #community-app .ix-wire .ixw-ticker>span:not(.is-on){transition:opacity .25s ease,transform .25s ease;transform:translateY(-6px)}
html body #community-app #app-view#app-view>.forum-main-index .ix-tiles .ix-row>:not(:hover,:focus-within)>.ix-symbol.ix-symbol{opacity:.9!important;visibility:visible!important;display:block!important;transform:none!important}
html body #community-app #app-view .ix-tiles .ix-row>:is(:hover,:focus-within)>.ix-symbol{opacity:0!important}

/* ---- Main Index: dispatch alert ticker beside the title (replaces the floating wire cards) ---- */
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index>.index-hero .index-hero-copy{max-width:none!important;width:100%;padding-right:120px;box-sizing:border-box}
html body #community-app .index-hero .ix-title-row{display:flex;align-items:center;gap:36px;min-width:0}
html body #community-app .index-hero .ix-title-row>h2{flex:none}
html body #community-app .ix-alert{--ixa-c:var(--color-accent-default,#ffc45b);flex:1 1 auto;min-width:0;max-width:980px;display:flex;align-items:stretch;height:46px;margin-top:6px;border-radius:10px;overflow:hidden;background:#06090dd9;backdrop-filter:blur(8px);border:1px solid #ffffff1f;box-shadow:0 16px 36px rgb(0 0 0 / .6),inset 0 -2px 0 color-mix(in srgb,var(--ixa-c) 45%,transparent);animation:ixa-in .6s cubic-bezier(.22,.8,.2,1) .25s both}
html body #community-app .ix-alert.has-priority{--ixa-c:#ff5b4d}
@keyframes ixa-in{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
html body #community-app .ix-alert .ixa-tag{flex:none;display:flex;align-items:center;gap:9px;padding:0 16px 0 14px;font:800 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.24em;text-transform:uppercase;color:#0b0d10;background:var(--ixa-c);clip-path:polygon(0 0,100% 0,calc(100% - 10px) 100%,0 100%);padding-right:22px}
html body #community-app .ix-alert .ixa-tag i{width:8px;height:8px;border-radius:50%;background:#0b0d10;animation:ixa-blink 1.4s ease-in-out infinite}
@keyframes ixa-blink{0%,100%{opacity:1}50%{opacity:.25}}
html body #community-app .ix-alert .ixa-window{position:relative;flex:1;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 40px),transparent)}
html body #community-app .ix-alert .ixa-track{display:flex;width:max-content;height:100%;animation:ixa-scroll var(--ixa-dur,30s) linear infinite}
html body #community-app .ix-alert:is(:hover,:focus-within) .ixa-track{animation-play-state:paused}
@keyframes ixa-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
html body #community-app .ix-alert .ixa-run{display:flex;align-items:center;gap:22px;padding-left:22px;height:100%;white-space:nowrap}
html body #community-app .ix-alert .ixa-item{display:inline-flex;align-items:baseline;gap:10px;color:#dfe5ec!important;text-decoration:none!important;font:500 14px/1 'Segoe UI',sans-serif}
html body #community-app .ix-alert .ixa-kind{font:800 10px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app .ix-alert .ixa-item.is-priority .ixa-kind{color:#ff6b5b}
html body #community-app .ix-alert .ixa-item.is-update .ixa-kind{color:#8fc4ff}
html body #community-app .ix-alert .ixa-item.is-welcome .ixa-kind{color:#7fd6a4}
html body #community-app .ix-alert .ixa-item b{font:700 15px/1 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff}
html body #community-app .ix-alert .ixa-detail{color:#9aa6b2}
html body #community-app .ix-alert .ixa-item em{font:700 11.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;font-style:normal;letter-spacing:.06em;color:#fff;opacity:.55;transition:opacity .2s ease,color .2s ease}
html body #community-app .ix-alert .ixa-item:is(:hover,:focus-visible){outline:none}
html body #community-app .ix-alert .ixa-item:is(:hover,:focus-visible) b{text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--ixa-c) 70%,transparent);text-underline-offset:4px}
html body #community-app .ix-alert .ixa-item:is(:hover,:focus-visible) em{opacity:1;color:var(--ixa-c)}
html body #community-app .ix-alert .ixa-sep{color:color-mix(in srgb,var(--ixa-c) 60%,transparent);font-size:9px}
@media (prefers-reduced-motion:reduce){html body #community-app .ix-alert .ixa-track{animation:none}html body #community-app .ix-alert .ixa-window{overflow-x:auto}}
@media(max-width:1100px){html body #community-app .index-hero .ix-title-row{flex-direction:column;align-items:stretch;gap:12px}html body #community-app .ix-alert{max-width:none}}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index>.index-hero{grid-template-columns:minmax(0,1fr)!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index>.index-hero .index-hero-copy{grid-column:1 / -1!important}
html body #community-app .index-hero .ix-title-row{gap:88px!important}
html body #community-app .ix-alert{max-width:none!important}
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index>.index-hero .index-hero-copy{padding-right:24px!important}
html body #community-app .index-hero .ix-alert{margin-right:-64px!important}
/* three rows (one per category), tucked up under the tagline; alert bar: same gap on both sides */
html body #community-app:is([data-scene=welcome],[data-scene=index]) #app-view>.forum-main-index>.index-hero{min-height:0!important;height:auto!important;padding-bottom:30px!important}
html body #community-app .index-hero .ix-alert{margin-right:-40px!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles.ix-tiles{margin-right:clamp(160px,15vw,260px)!important}
html body #community-app .ix-alert:is(:hover,:focus-within) .ixa-track{animation-play-state:running!important}
html body #community-app .ix-alert .ixa-tag{text-decoration:none!important;cursor:pointer}
html body #community-app .ix-alert .ixa-bell{width:16px;height:16px;transform-origin:50% 10%;animation:ixa-ring 2.4s ease-in-out infinite}
@keyframes ixa-ring{0%,100%{transform:rotate(0);opacity:1}4%{transform:rotate(16deg)}8%{transform:rotate(-14deg)}12%{transform:rotate(10deg)}16%{transform:rotate(-6deg)}20%{transform:rotate(0)}50%{opacity:1}60%{opacity:.35}70%{opacity:1}}
@media (prefers-reduced-motion:reduce){html body #community-app .ix-alert .ixa-bell{animation:none}}
/* bulletin filler: calmer, the bell stays still */
html body #community-app .ix-alert.is-filler{--ixa-c:#8fb3d9}
html body #community-app .ix-alert.is-filler .ixa-bell{animation:none}
html body #community-app .ix-alert .ixa-item.is-bulletin{cursor:default}
html body #community-app .ix-alert .ixa-item.is-bulletin .ixa-kind{color:#8fb3d9}
html body #community-app .ix-alert .ixa-item.is-bulletin .ixa-detail{color:#cfd6de}
/* tiles no longer grow on hover: the art fades in behind the title and the border brightens */
@media (hover:hover){
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-within){width:100%!important;z-index:1;box-shadow:0 18px 40px rgb(0 0 0 / .75)!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(:hover,:focus-within)>:is(.basic-forum-counts,.basic-forum-latest){display:none!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(:hover,:focus-within)>:is(.basic-forum-identity,.forum-entry-label){position:absolute!important;left:22px!important;right:22px!important;bottom:16px!important;top:auto!important;padding:0!important;margin:0!important;z-index:2}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(:hover,:focus-within)>.basic-forum-identity>:not(.forum-entry-label){display:none!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(:hover,:focus-within)>.forum-entry-portrait{position:absolute!important;inset:0!important;width:auto!important;height:auto!important;opacity:.6!important;-webkit-mask-image:linear-gradient(180deg,#000 20%,transparent 100%)!important;mask-image:linear-gradient(180deg,#000 20%,transparent 100%)!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(:hover,:focus-within)>.forum-entry-portrait img{width:100%!important;height:100%!important;object-fit:cover}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(:hover,:focus-within)>.ix-symbol.ix-symbol{opacity:.9!important;transform:none!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(:hover,:focus-within) .ix-full{display:none}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(:hover,:focus-within) .ix-short{display:inline}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(:hover,:focus-within)::before{opacity:1!important}
}

/* ---- Events Front Page filler: old newsprint so it never passes for a live event ---- */
html body #community-app #app-view#app-view .event-front .news-teaser.news-filler{display:flex!important;flex-direction:column!important;gap:0!important;padding:16px 20px 16px!important;border-radius:4px!important;border:1px solid #b9a987!important;color:#2b251c!important;cursor:default;box-shadow:0 12px 28px rgb(0 0 0 / .55)!important;
 background:radial-gradient(ellipse at 30% 20%,#f1e8d2 0%,#e6dbc0 60%,#d8caa6 100%)!important;position:relative;overflow:hidden!important;font-family:Georgia,'Times New Roman',serif}
html body #community-app #app-view#app-view .event-front .news-teaser.news-filler::after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 2px,rgb(80 60 30 / .035) 2px 3px);mix-blend-mode:multiply}
html body #community-app #app-view#app-view .event-front .news-teaser.news-filler>*{margin-inline:0!important;grid-area:auto!important}
html body #community-app .news-filler .nf-kicker{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding-bottom:6px;margin-bottom:8px;border-bottom:3px double #6b5a3d}
html body #community-app .news-filler .nf-kicker span{font:700 11px/1 Georgia,serif;letter-spacing:.2em;text-transform:uppercase;color:#9b2a1c}
html body #community-app .news-filler .nf-kicker i{font:italic 400 11px/1 Georgia,serif;color:#6b5a3d}
html body #community-app #app-view .event-front .news-filler h3{margin:0 0 6px!important;font:700 19px/1.18 Georgia,'Times New Roman',serif!important;color:#1d1811!important;letter-spacing:-.01em;text-transform:none!important;display:block!important}
html body #community-app .news-filler .nf-deck{margin:0 0 8px!important;font:italic 400 13.5px/1.35 Georgia,serif!important;color:#4d4130!important;display:block!important}
html body #community-app .news-filler .nf-body{margin:0!important;font:400 13px/1.5 Georgia,serif!important;color:#3a3226!important;text-align:justify;hyphens:auto;display:-webkit-box!important;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
html body #community-app .news-filler .nf-by{margin-top:auto!important;padding-top:8px;font:italic 400 11.5px/1 Georgia,serif;color:#6b5a3d}
/* in the lead slot: bigger headline, body in two columns */
html body #community-app #app-view .event-front .news-filler.news-slot-0 h3{font-size:clamp(26px,2.2vw,34px)!important;line-height:1.08!important;margin-bottom:10px!important}
html body #community-app #app-view .event-front .news-filler.news-slot-0 .nf-deck{font-size:16px!important}
html body #community-app #app-view .event-front .news-filler.news-slot-0 .nf-body{font-size:14.5px!important;column-count:2;column-gap:22px;column-rule:1px solid #b9a98799;-webkit-line-clamp:unset;display:block!important}
html body #community-app #app-view#app-view .event-front .news-teaser.news-filler p.nf-deck{color:#4d4130!important;opacity:1!important;display:block!important;-webkit-text-fill-color:#4d4130}
html body #community-app #app-view#app-view .event-front .news-teaser.news-filler p.nf-body{color:#2f281e!important;opacity:1!important;-webkit-text-fill-color:#2f281e;display:-webkit-box!important}
html body #community-app #app-view#app-view .event-front .news-teaser.news-filler.news-slot-0 p.nf-body{display:block!important}
html body #community-app #app-view#app-view .event-front .news-teaser.news-filler:is(.news-slot-3,.news-slot-4,.news-slot-5) p.nf-body{display:none!important}
html body #community-app #app-view#app-view .event-front .news-teaser.news-filler p.nf-deck{font:italic 400 13.5px/1.35 Georgia,serif!important;margin:4px 0 0!important}

/* ---- Main Index v5: compact tiles, anchored low-left so the title, alert bar, sign and tiles balance ---- */
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles.ix-tiles{grid-template-columns:repeat(var(--ix-cols,13),44px)!important;grid-auto-rows:128px!important;column-gap:14px!important;row-gap:12px!important;justify-content:start;margin:max(24px,calc(47vh - 262px)) 40px 48px 72px!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry){height:128px!important;border-radius:12px!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry) :is(h2,h3){font-size:clamp(17px,9cqi,21px)!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>*>:is(.basic-forum-identity,.forum-entry-label){left:18px!important;right:18px!important;bottom:14px!important}
html body #community-app .ix-tiles .ix-symbol{top:14px!important;left:18px!important;width:24px!important;height:24px!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry)::before{top:12px!important;right:12px!important;font-size:11px!important;padding:4px 6px!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>* .forum-entry-label::before{width:22px!important;margin-bottom:6px!important}
html body #community-app #app-view .ix-tiles .subcategory-badge-scroller{display:none!important}
/* hover: tile widens ~25% (over its neighbour, no reflow) so longer names like "Out of Character" fit on one line */
@media (hover:hover){
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-within){width:125%!important;z-index:5;transition:width .3s cubic-bezier(.22,.8,.2,1),box-shadow .25s ease!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(:hover,:focus-within) .ix-full{display:inline!important;white-space:nowrap}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(:hover,:focus-within) .ix-short{display:none!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(:hover,:focus-within) :is(h2,h3){white-space:nowrap!important}
}
/* ---- Main Index rows as flex lines: a hovered tile grows to the right and pushes the tiles after it along ---- */
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles.ix-tiles{display:flex!important;flex-direction:column!important;align-items:flex-start;gap:12px!important;grid-template-columns:none!important}
html body #community-app #app-view .ix-tiles>.ix-row{display:flex;gap:14px;margin-left:calc(var(--ix-r,0) * 58px);align-items:stretch}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry){flex:0 0 auto!important;width:218px!important;height:128px!important;justify-self:auto!important;transition:width .32s cubic-bezier(.22,.8,.2,1),box-shadow .25s ease!important}
@media (hover:hover){html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry):is(:hover,:focus-within){width:272px!important}}

/* ---- OOC: member directory + member spaces ---- */
#community-app.open-layout[data-scene=ooc]{--open-art:var(--ooc-art,url('/assets/backdrop-index-sdn-city.webp'))}
html body #community-app .ooc-directory,html body #community-app .ooc-space{width:100%;max-width:1320px;margin:0 auto;padding:8px 8px 40px}
html body #community-app .ooc-head{margin:8px 0 22px;text-shadow:0 2px 12px #000c}
html body #community-app .ooc-head>span,html body #community-app .ooc-space-title>span{display:block;font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app .ooc-head h2{margin:8px 0 8px;font:700 clamp(30px,3vw,44px)/1 var(--font-control-title,'Segoe UI'),sans-serif;text-transform:uppercase;color:#fff}
html body #community-app .ooc-head p{margin:0;max-width:640px;font:400 15px/1.5 'Segoe UI',sans-serif;color:#dfe5ec}
html body #community-app .ooc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
html body #community-app .ooc-member{position:relative;isolation:isolate;display:grid;grid-template-rows:auto auto auto 1fr auto;gap:4px;min-height:230px;padding:84px 18px 14px;border-radius:14px;border:1px solid #ffffff1f;background:#080b10e0;color:#dfe5ec!important;text-decoration:none!important;overflow:hidden;box-shadow:0 14px 34px rgb(0 0 0 / .75);transition:transform .2s ease,border-color .25s ease,box-shadow .25s ease}
html body #community-app .ooc-member:hover,html body #community-app .ooc-member:focus-visible{transform:translateY(-3px);border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent);box-shadow:0 20px 44px rgb(0 0 0 / .8);outline:none}
html body #community-app .ooc-member .ooc-art{position:absolute;inset:0 0 auto;height:110px;z-index:-1;background:var(--member-art,url('/assets/backdrop-index-sdn-city.webp')) center/cover;opacity:.55;-webkit-mask-image:linear-gradient(180deg,#000 30%,transparent);mask-image:linear-gradient(180deg,#000 30%,transparent);transition:opacity .25s ease}
html body #community-app .ooc-member:hover .ooc-art{opacity:.85}
html body #community-app .ooc-avatar{position:absolute;top:44px;left:18px;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;font:700 19px/1 var(--font-control-title,'Segoe UI'),sans-serif;color:#0b0d10;background:linear-gradient(135deg,#ffd27a,#c98a2a);box-shadow:0 0 0 3px #080b10,0 8px 18px #000a}
html body #community-app .ooc-member .ooc-avatar{position:absolute}
html body #community-app .ooc-member.is-me{border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent)}
html body #community-app .ooc-star{position:absolute;top:-12px;right:-12px;z-index:3;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--color-accent-default,#ffc45b);box-shadow:0 0 0 3px #080b10,0 6px 16px #000b}
html body #community-app .ooc-member{overflow:visible}
html body #community-app .ooc-member .ooc-art{border-radius:14px 14px 0 0}
html body #community-app .ooc-star svg{width:18px;height:18px;fill:#0b0d10}
html body #community-app .ooc-name{margin-top:10px;display:flex;align-items:center;gap:8px;font:700 20px/1.2 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff}
html body #community-app .ooc-example{padding:2px 6px;border-radius:4px;border:1px solid #ffffff33;font:700 9.5px/1.3 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#9aa6b2}
html body #community-app .ooc-sub{font:400 13px/1.35 'Segoe UI',sans-serif;color:#9aa6b2}
html body #community-app .ooc-cast{display:flex;flex-wrap:wrap;gap:5px;align-content:start;margin-top:6px}
html body #community-app .ooc-cast i{font:600 11px/1 'Segoe UI',sans-serif;font-style:normal;padding:4px 7px;border-radius:999px;border:1px solid color-mix(in srgb,var(--c,#9aa6b2) 55%,transparent);color:color-mix(in srgb,var(--c,#9aa6b2) 70%,#fff)}
html body #community-app .ooc-member footer{display:flex;justify-content:space-between;gap:10px;margin-top:10px;padding-top:10px;border-top:1px solid #ffffff14;font:500 12px/1.2 'Segoe UI',sans-serif;color:#8d98a5}
html body #community-app .ooc-member footer b{color:#fff}
/* a member's space */
html body #community-app .ooc-space-head{position:relative!important;display:flex!important;align-items:center;gap:18px;margin:8px 0 18px!important;padding:18px 22px 18px 100px!important;min-height:96px;border-radius:14px!important;border:1px solid #ffffff1f!important;background:#080b10d9!important;backdrop-filter:blur(8px);box-shadow:0 16px 40px rgb(0 0 0 / .7)!important}
html body #community-app .ooc-space-head::before,html body #community-app .ooc-space-head::after{display:none!important;content:none!important}
html body #community-app .ooc-space-head .ooc-avatar{top:50%;left:22px;transform:translateY(-50%);width:60px;height:60px}
html body #community-app .ooc-back{position:absolute;top:-26px;left:4px;font:600 12.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;color:#dfe5ec!important;text-decoration:none!important;text-shadow:0 1px 8px #000}
html body #community-app .ooc-back:hover{color:var(--color-accent-default,#ffc45b)!important}
html body #community-app .ooc-space-title{flex:1;min-width:0}
html body #community-app .ooc-space-title h2{margin:6px 0 0;font:700 clamp(24px,2.2vw,32px)/1.05 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff}
html body #community-app .ooc-space-title p{margin:6px 0 0;color:#aab4bf;font:400 14px/1.4 'Segoe UI',sans-serif}
html body #community-app .ooc-space-actions button{padding:10px 16px;border-radius:9px;border:0;background:var(--color-accent-default,#ffc45b);color:#14100a;font:700 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer}
html body #community-app .ooc-space-actions button:disabled{opacity:.5}
html body #community-app .ooc-threads{background:none!important;border:0!important;padding:0!important}
html body #community-app .ooc-threads .forum-thread-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:16px}
html body #community-app .ooc-empty{padding:40px;border-radius:14px;border:1px dashed #ffffff33;background:#080b10b3;text-align:center;color:#c9d2dc}
/* background editor */
html body #community-app .ooc-art-editor{display:flex;gap:20px;margin:0 0 18px;padding:16px;border-radius:14px;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,transparent);background:#080b10eb;box-shadow:0 16px 40px rgb(0 0 0 / .7)}
html body #community-app .ooc-art-editor[hidden]{display:none}
html body #community-app .oae-preview{flex:none;width:320px;aspect-ratio:16/9;border-radius:10px;border:1px solid #ffffff26;background:#0d131a url('/assets/backdrop-index-sdn-city.webp') center/cover;display:grid;place-items:end start;padding:8px}
html body #community-app .oae-preview span{font:700 10px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:#000a;padding:4px 6px;border-radius:4px}
html body #community-app .oae-preview span:empty{display:none}
html body #community-app .oae-body{flex:1;min-width:0}
html body #community-app .oae-body h3{margin:0 0 6px;font:700 16px/1.2 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff}
html body #community-app .oae-spec{margin:0 0 12px;font:400 13px/1.5 'Segoe UI',sans-serif;color:#aab4bf}
html body #community-app .oae-spec b{color:var(--color-accent-default,#ffc45b)}
html body #community-app .oae-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
html body #community-app .oae-row button,html body #community-app .oae-file{padding:8px 14px;border-radius:8px;border:1px solid #ffffff30;background:#1a2230;color:#fff;font:600 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer}
html body #community-app .oae-row [data-save]{background:var(--color-accent-default,#ffc45b);color:#14100a;border-color:transparent}
html body #community-app .oae-row [data-save]:disabled{opacity:.45;cursor:default}
html body #community-app .oae-url{flex:1;min-width:200px;padding:8px 10px;border-radius:8px;border:1px solid #ffffff30;background:#0d131a;color:#fff}
html body #community-app .oae-msg{margin:10px 0;min-height:1.2em;font:400 13px/1.4 'Segoe UI',sans-serif;color:#dfe5ec}
html body #community-app .oae-actions{margin-top:4px}
@media(max-width:800px){html body #community-app .ooc-art-editor{flex-direction:column}html body #community-app .oae-preview{width:100%}}
html body #community-app .ooc-member{padding-top:112px!important}
html body #community-app .ooc-member .ooc-avatar{top:36px}
html body #community-app .ooc-space-actions button{background:var(--color-accent-default,#ffc45b)!important;color:#14100a!important;border:0!important}
html body #community-app.open-layout[data-scene=ooc] #site-backdrop{background-position:0 0,center top!important}
/* Main Index tile accent line: twice the gap above the name; on hover it runs the width of the tile and fades out */
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>* .forum-entry-label::before{display:block!important;width:22px!important;margin-bottom:12px!important;background:linear-gradient(90deg,var(--color-accent-default,#ffc45b) 60%,color-mix(in srgb,var(--color-accent-default,#ffc45b) 0%,transparent))!important;transition:width .35s cubic-bezier(.22,.8,.2,1)!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(:hover,:focus-within) .forum-entry-label::before{width:100%!important;background:linear-gradient(90deg,var(--color-accent-default,#ffc45b),transparent)!important}
/* OOC directory v2: members as World-style thread cards, you first, then a divider, plus a username search */
html body #community-app .ooc-search{display:flex;align-items:center;gap:16px;margin:0 0 18px;padding:12px 16px;border-radius:14px;border:1px solid #ffffff1a;background:#080b10d9;backdrop-filter:blur(8px);box-shadow:0 16px 40px rgb(0 0 0 / .7)}
html body #community-app .ooc-search label{flex:1;display:flex;align-items:center;gap:10px;padding:0 12px;border-radius:9px;border:1px solid #ffffff26;background:#0d131a}
html body #community-app .ooc-search label:focus-within{border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)}
html body #community-app .ooc-search svg{width:16px;height:16px;flex:none;color:#8d98a5}
html body #community-app .ooc-search input{flex:1;min-width:0;padding:10px 0;border:0!important;background:none!important;color:#fff;font:400 14px/1.2 'Segoe UI',sans-serif;outline:none;box-shadow:none!important}
html body #community-app .ooc-count{flex:none;font:600 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#8d98a5}
html body #community-app .ooc-member-list{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(520px,1fr))!important;gap:16px!important;margin:0!important}
html body #community-app .ooc-member-list>[hidden]{display:none!important}
html body #community-app .ooc-divider{grid-column:1 / -1;height:0;margin:6px 0!important;border:0!important;border-top:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,transparent)!important;background:none!important}
html body #community-app .ooc-member-card{position:relative;overflow:visible!important;cursor:pointer}
html body #community-app .ooc-member-card .ooc-star{top:-12px;right:-12px}
html body #community-app .ooc-member-card.is-me{box-shadow:0 0 0 1px color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent),0 14px 34px rgb(0 0 0 / .75)!important}
html body #community-app .ooc-member-card .ooc-cast{margin-top:10px}
html body #community-app .ooc-member-card .ooc-cast em{font:italic 400 12px/1 'Segoe UI',sans-serif;color:#77828e}
html body #community-app .ooc-member-card .ooc-example-badge{background:#ffffff1f!important;color:#c9d2dc!important}
html body #community-app .ooc-none{padding:30px;text-align:center;color:#c9d2dc;text-shadow:0 1px 8px #000}
/* OOC member cards: Discord avatar in the portrait slot (same placement and fade as a character portrait); initials when there's no avatar */
html body #community-app .ooc-member-card .thread-latest{position:relative}
html body #community-app .ooc-member-card .thread-latest .ooc-avatar-fallback{position:absolute;inset:0 0 0 32%;display:grid;place-items:center;font:700 44px/1 var(--font-control-title,'Segoe UI'),sans-serif;letter-spacing:.02em;color:color-mix(in srgb,var(--thread-accent,#ffc45b) 75%,#fff);background:radial-gradient(circle at 60% 45%,color-mix(in srgb,var(--thread-accent,#ffc45b) 35%,#0b0f14) 0%,#0b0f14 75%);-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 48%,#000 100%);mask-image:linear-gradient(to right,transparent 0%,#000 48%,#000 100%);pointer-events:none}
html body #community-app .ooc-member-card .thread-latest-copy{position:relative;z-index:1}
html body #community-app .ooc-member-card .thread-latest .ooc-avatar-fallback{font:700 44px/1 var(--font-control-title,'Segoe UI'),sans-serif!important}
/* OOC member cards v3: folders - avatar, name, handle, description */
html body #community-app .ooc-member-list{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))!important}
html body #community-app .ooc-member-card{display:flex!important;align-items:center;gap:16px;min-height:96px!important;height:auto!important;padding:16px 18px!important;grid-template:none!important;isolation:isolate}
html body #community-app .ooc-member-card>.ooc-folder-art{position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--member-art,none) center/cover;opacity:.35;-webkit-mask-image:linear-gradient(90deg,transparent 20%,#000);mask-image:linear-gradient(90deg,transparent 20%,#000);transition:opacity .25s ease}
html body #community-app .ooc-member-card:hover>.ooc-folder-art{opacity:.6}
html body #community-app .ooc-folder-avatar{position:relative;flex:none;display:grid;place-items:center;width:60px;height:60px;border-radius:50%;overflow:hidden;background:radial-gradient(circle at 40% 35%,color-mix(in srgb,var(--thread-accent,#ffc45b) 45%,#0b0f14),#0b0f14 80%);box-shadow:0 0 0 2px color-mix(in srgb,var(--thread-accent,#ffc45b) 60%,transparent),0 6px 16px #000a}
html body #community-app .ooc-folder-avatar b{font:700 20px/1 var(--font-control-title,'Segoe UI'),sans-serif;color:color-mix(in srgb,var(--thread-accent,#ffc45b) 70%,#fff)}
html body #community-app .ooc-folder-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
html body #community-app .ooc-folder-text{min-width:0;display:flex;flex-direction:column;gap:3px}
html body #community-app .ooc-folder-text .thread-card-title{font-size:20px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app .ooc-folder-text .thread-started-by span{color:var(--thread-accent,#ffc45b)}
html body #community-app .ooc-folder-text .ooc-nohandle{color:#77828e!important;font-style:italic}
html body #community-app .ooc-folder-text .thread-card-subtitle{margin:2px 0 0!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html body #community-app .ooc-member-card .ooc-example-badge{align-self:flex-start;padding:2px 6px;border-radius:4px;background:#ffffff1f;color:#c9d2dc;font:700 9.5px/1.3 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.12em}
/* sync note + sign-in */
.dispatch-sync-note{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:100000;padding:9px 16px;border-radius:999px;background:#0b1015f2;border:1px solid #ffc45b66;color:#f0e6d2;font:500 13px/1.3 'Segoe UI',sans-serif;box-shadow:0 10px 30px #000b}
.dispatch-sync-note[hidden]{display:none}
html body #community-app .account-link.dispatch-signin{cursor:pointer;padding:7px 14px;border-radius:9px;background:#5865f2;color:#fff!important;font-weight:600;text-decoration:none!important}
html body #community-app .account-link.dispatch-signin:hover{background:#4752c4}
/* sync status note + sign-in button */
.dispatch-sync-note{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:100000;padding:9px 16px;border-radius:999px;background:#0b1015f0;border:1px solid #ffc45b66;color:#f1e6cc;font:600 13px/1.2 'Segoe UI',sans-serif;box-shadow:0 10px 30px #000a}
.dispatch-sync-note[hidden]{display:none}
html body #community-app .account-link.dispatch-signin{cursor:pointer;padding:6px 12px;border-radius:8px;background:#5865f2;color:#fff!important;font-weight:700}

/* ---- OOC member folders: shallow parallelograms, Discord avatar peeking out behind the top-right corner ---- */
html body #community-app .ooc-member-list.ooc-folders{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))!important;gap:34px 26px!important;padding:30px 30px 10px 6px;margin:0!important}
html body #community-app .ooc-folder{--slant:18px;--edge:color-mix(in srgb,var(--color-accent-default,#ffc45b) 35%,#ffffff22);position:relative;display:block;height:92px;color:#dfe5ec!important;text-decoration:none!important;filter:drop-shadow(0 12px 18px rgb(0 0 0 / .65));transition:transform .2s ease,filter .2s ease}
html body #community-app .ooc-folder:hover,html body #community-app .ooc-folder:focus-visible{transform:translateY(-3px);filter:drop-shadow(0 18px 24px rgb(0 0 0 / .75));outline:none;--edge:var(--color-accent-default,#ffc45b)}
html body #community-app .ooc-folder .of-shape{position:absolute;inset:0;z-index:1;clip-path:polygon(var(--slant) 0,100% 0,calc(100% - var(--slant)) 100%,0 100%);background:linear-gradient(var(--edge),var(--edge));transition:background .2s ease}
html body #community-app .ooc-folder .of-shape::before{content:'';position:absolute;inset:1.5px;clip-path:polygon(var(--slant) 0,100% 0,calc(100% - var(--slant)) 100%,0 100%);background:linear-gradient(100deg,#0b1016f2 0%,#0b1016e6 55%,#0b101699 100%),var(--member-art,none) center/cover,#0b1016}
html body #community-app .ooc-folder.is-me{--edge:color-mix(in srgb,var(--color-accent-default,#ffc45b) 75%,transparent)}
html body #community-app .ooc-folder .of-avatar{position:absolute;z-index:0;top:-30px;right:-4px;width:74px;height:74px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle at 40% 35%,color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,#1a2230),#0b1016 80%);box-shadow:0 0 0 2px var(--edge),0 6px 14px #000a;transition:transform .25s ease,box-shadow .2s ease}
html body #community-app .ooc-folder:hover .of-avatar{transform:translateY(-4px)}
html body #community-app .ooc-folder .of-avatar img{width:100%;height:100%;object-fit:cover}
html body #community-app .ooc-folder .of-avatar b{font:700 24px/1 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff}
html body #community-app .ooc-folder .of-body{position:absolute;z-index:2;inset:0;display:flex;flex-direction:column;justify-content:center;gap:3px;padding:0 84px 0 calc(var(--slant) + 16px);min-width:0}
html body #community-app .ooc-folder .of-name{font:700 19px/1.15 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app .ooc-folder:hover .of-name{color:var(--color-accent-default,#ffc45b)}
html body #community-app .ooc-folder .of-handle{font:500 12.5px/1.2 'Segoe UI',sans-serif;color:#8d98a5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app .ooc-folder .of-tag{position:absolute;right:calc(var(--slant) + 12px);bottom:9px;font:700 9px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#77828e}
html body #community-app .ooc-folder .of-star{position:absolute;left:4px;top:-11px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--color-accent-default,#ffc45b);box-shadow:0 0 0 2px #080b10}
html body #community-app .ooc-folder .of-star svg{width:13px;height:13px;fill:#0b0d10}
html body #community-app .ooc-folders>[hidden]{display:none!important}
html body #community-app .ooc-folders .ooc-divider{margin:-6px 0!important}
html body #community-app .ooc-folder .of-avatar{top:-44px;right:-34px;width:82px;height:82px}
html body #community-app .ooc-folder .of-avatar b{transform:translate(8px,-8px)}
html body #community-app .ooc-folder.is-me{box-shadow:none!important}
html body #community-app .ooc-member-list.ooc-folders{padding:44px 40px 10px 6px}
html body #community-app .ooc-folder .of-body{padding-right:64px}
/* confirmation popouts: compact, text first, buttons underneath */
html body #community-app #app-dialog.is-confirm{width:min(420px,calc(100vw - 32px))!important;max-width:420px!important;height:auto!important;max-height:none!important;padding:24px 24px 20px!important}
html body #community-app #app-dialog.is-confirm>form{display:flex;flex-direction:column;gap:14px}
html body #community-app #app-dialog.is-confirm #app-dialog-content{overflow:visible!important;padding:0!important;flex:none}
html body #community-app #app-dialog.is-confirm #app-dialog-content h2{margin:0 0 8px!important;font:700 22px/1.2 var(--font-control-title,'Segoe UI'),sans-serif!important}
html body #community-app #app-dialog.is-confirm #app-dialog-content p{margin:0!important;font:400 14.5px/1.5 'Segoe UI',sans-serif;color:#c9d2dc}
html body #community-app #app-dialog.is-confirm>form>.app-actions{order:2!important;display:flex!important;justify-content:flex-end;gap:10px;margin:4px 0 0!important}
html body #community-app #app-dialog.is-confirm>form>#app-form-error{order:1!important}
html body #community-app #app-dialog.is-confirm>form>#app-form-error:empty{display:none}
html body #community-app #app-dialog.is-confirm .app-actions button[type=submit]{background:#c9463d!important;border-color:#c9463d!important;color:#fff!important}
html body #community-app #app-dialog.is-confirm[open]{height:auto!important;max-height:calc(100vh - 40px)!important;top:50%!important;bottom:auto!important;margin:0 auto!important;transform:translateY(-50%)!important;inset-block:auto!important}
html body #community-app #app-dialog.is-confirm>form{flex:none!important}
html body #community-app #app-dialog.is-confirm[open]{position:fixed!important;inset:0!important;margin:auto!important;transform:none!important;height:fit-content!important}
html body #community-app #app-dialog.is-confirm>form::after,html body #community-app #app-dialog.is-confirm>form::before,html body #community-app #app-dialog.is-confirm::after{display:none!important}html body #community-app #app-dialog.is-confirm>form>:not(#app-dialog-content):not(.app-actions):not(#app-form-error){display:none!important}html body #community-app #app-dialog.is-confirm .app-actions{border:0!important;padding:0!important;box-shadow:none!important}
/* signed-in member's Discord avatar as the My Profile icon */
html body #community-app .account-link .account-avatar{width:26px;height:26px;border-radius:50%;object-fit:cover;vertical-align:middle;margin-right:6px;box-shadow:0 0 0 2px color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)}
html.has-me-avatar #sidebar-footer-actions a[href="#/player"] svg{visibility:hidden}
html.has-me-avatar #sidebar-footer-actions a[href="#/player"]{position:relative}
html.has-me-avatar #sidebar-footer-actions a[href="#/player"]::before{content:'';position:absolute;left:var(--me-avatar-left,50%);top:50%;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:var(--me-avatar) center/cover;box-shadow:0 0 0 2px color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent);pointer-events:none}

/* ---- OOC folders v2: avatar circle sits IN FRONT of the card, rising above its top edge and cut off by its bottom (and slanted right) edge ---- */
html body #community-app .ooc-folder .of-avatar{display:none!important}
html body #community-app .ooc-folder .of-clip{position:absolute;z-index:3;left:0;right:0;top:-40px;bottom:0;pointer-events:none;clip-path:polygon(0 0,100% 0,100% 40px,calc(100% - var(--slant)) 100%,0 100%)}
html body #community-app .ooc-folder .of-disc{position:absolute;right:6px;top:18px;width:104px;height:104px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle at 40% 35%,color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,#1a2230),#0b1016 80%);box-shadow:0 0 0 3px #0b1016,0 0 0 5px var(--edge),0 10px 22px #000c;transition:transform .25s cubic-bezier(.22,.8,.2,1)}
html body #community-app .ooc-folder:hover .of-disc{transform:translateY(-6px)}
html body #community-app .ooc-folder .of-disc img{width:100%;height:100%;object-fit:cover}
html body #community-app .ooc-folder .of-disc b{font:700 30px/1 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff;transform:translateY(-10px)}
html body #community-app .ooc-folder .of-body{padding-right:126px!important}
html body #community-app .ooc-folder .of-tag{right:auto!important;left:calc(var(--slant) + 16px);bottom:8px}
html body #community-app .ooc-member-list.ooc-folders{padding:44px 20px 10px 6px!important;gap:46px 26px!important}
html body #community-app .ooc-folder .of-disc{width:122px;height:122px;top:20px;right:-2px}html body #community-app .ooc-folder .of-disc b{transform:translate(-4px,-14px)}html body #community-app .ooc-folder .of-body{padding-right:132px!important}
/* the card's bottom and slanted right edges are redrawn over the avatar, so it reads as tucked into the card */
html body #community-app .ooc-folder .of-edges{position:absolute;inset:0;z-index:4;pointer-events:none}
html body #community-app .ooc-folder .of-edges::before,html body #community-app .ooc-folder .of-edges::after{content:'';position:absolute;inset:0;background:var(--edge);transition:background .2s ease}
html body #community-app .ooc-folder .of-edges::before{clip-path:polygon(calc(100% - 1.5px) 0,100% 0,calc(100% - var(--slant)) 100%,calc(100% - var(--slant) - 1.5px) 100%)}
html body #community-app .ooc-folder .of-edges::after{clip-path:polygon(0 calc(100% - 1.5px),calc(100% - var(--slant)) calc(100% - 1.5px),calc(100% - var(--slant)) 100%,0 100%)}
html body #community-app .ooc-folder .of-disc{right:-18px}html body #community-app .ooc-folder .of-body{padding-right:118px!important}
html body #community-app .ooc-folder .of-clip{right:-80px;clip-path:polygon(0 0,100% 0,100% 40px,calc(100% - 80px) 40px,calc(100% - 80px - var(--slant)) 100%,0 100%)}html body #community-app .ooc-folder .of-disc{right:62px}html body #community-app .ooc-folder .of-disc b{transform:translate(-12px,-14px)}
/* OOC folders: the avatar is cut by the card's slanted right edge carried on up past the top corner, so the circle meets the corner exactly */
html body #community-app .ooc-folder .of-clip{right:0!important;clip-path:polygon(0 0,calc(100% + var(--slant) * 40 / 92) 0,100% 40px,calc(100% - var(--slant)) 100%,0 100%)!important}
html body #community-app .ooc-folder .of-disc{right:-26px!important}
html body #community-app .ooc-member-list.ooc-folders{grid-template-columns:repeat(auto-fill,minmax(330px,1fr))!important}

/* ======== Site Events: one dark online newspaper ======== */
html body #community-app .dn-paper{--dn-ink:#e9e4d8;--dn-soft:#a8a295;--dn-line:#ffffff1f;--dn-acc:var(--color-accent-default,#ffc45b);box-sizing:border-box;width:100%;max-width:1400px;height:calc(100dvh - 58px - 60px - 20px - 40px);margin:0 auto;padding:22px 34px 36px;overflow-y:auto;overscroll-behavior:contain;border-radius:14px;border:1px solid #ffffff1a;background:#080b10eb;backdrop-filter:blur(10px);box-shadow:0 20px 50px #000c;color:var(--dn-ink);scrollbar-width:thin;scrollbar-color:#ffc45b66 transparent}
html body #community-app .dn-paper h2,html body #community-app .dn-paper h3,html body #community-app .dn-paper h4{text-transform:none;letter-spacing:0}
/* masthead */
html body #community-app .dn-mast{text-align:center;margin-bottom:22px}
html body #community-app .dn-mast-line,html body #community-app .dn-mast-rule{display:flex;justify-content:space-between;gap:12px;font:600 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--dn-soft)}
html body #community-app .dn-mast-line{padding-bottom:10px;border-bottom:1px solid var(--dn-line)}
html body #community-app .dn-nameplate{display:block;margin:14px 0 12px;font:700 clamp(40px,4.6vw,68px)/1 Georgia,'Times New Roman',serif;letter-spacing:-.01em;color:#fff!important;text-decoration:none!important;text-shadow:0 2px 20px #000}
html body #community-app .dn-paper.is-article .dn-nameplate{font-size:clamp(28px,2.6vw,40px);margin:10px 0 8px}
html body #community-app .dn-mast-rule{padding:9px 0;border-top:3px double #ffffff40;border-bottom:1px solid var(--dn-line)}
html body #community-app .dn-mast-rule span:first-child{color:var(--dn-acc)}
html body #community-app .dn-paper h4{display:flex;align-items:center;gap:12px;margin:0 0 12px;font:700 12px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;letter-spacing:.2em!important;text-transform:uppercase!important;color:var(--dn-acc)}
html body #community-app .dn-paper h4::after{content:'';flex:1;height:1px;background:var(--dn-line)}
html body #community-app .dn-kicker{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font:700 10.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--dn-soft)}
/* front: lead + top stories */
html body #community-app .dn-front{display:grid;grid-template-columns:minmax(0,2.1fr) minmax(280px,1fr);gap:28px;padding-bottom:24px;border-bottom:1px solid var(--dn-line)}
html body #community-app .dn-lead{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:22px;align-items:start;color:inherit!important;text-decoration:none!important}
html body #community-app .dn-lead-img img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px;box-shadow:0 12px 30px #000a;transition:filter .2s ease}
html body #community-app .dn-lead:hover .dn-lead-img img{filter:brightness(1.1)}
html body #community-app .dn-lead-copy{display:flex;flex-direction:column;gap:12px}
html body #community-app .dn-lead h2{margin:0!important;font:700 clamp(26px,2.4vw,38px)/1.1 Georgia,'Times New Roman',serif!important;color:#fff!important}
html body #community-app .dn-lead:hover h2{text-decoration:underline;text-decoration-color:var(--dn-acc);text-underline-offset:5px}
html body #community-app .dn-lead p{margin:0;font:400 16px/1.55 Georgia,serif;color:var(--dn-ink)}
html body #community-app .dn-read{font:700 12px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--dn-acc)}
html body #community-app .dn-top{display:flex;flex-direction:column;padding-left:24px;border-left:1px solid var(--dn-line)}
html body #community-app .dn-brief{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:start;padding:12px 0;border-bottom:1px solid var(--dn-line);color:inherit!important;text-decoration:none!important}
html body #community-app .dn-brief:last-child{border-bottom:0}
html body #community-app .dn-brief-wire{grid-template-columns:1fr}
html body #community-app .dn-thumb img,html body #community-app .dn-thumb-empty{display:block;width:96px;height:68px;object-fit:cover;border-radius:4px;background:#141a22}
html body #community-app .dn-brief-copy{display:flex;flex-direction:column;gap:6px;min-width:0}
html body #community-app .dn-brief b{font:700 16px/1.25 Georgia,serif;color:#fff}
html body #community-app a.dn-brief:hover b{text-decoration:underline;text-decoration-color:var(--dn-acc)}
html body #community-app .dn-brief small{font:500 11.5px/1 'Segoe UI',sans-serif;color:var(--dn-soft)}
/* more from the city */
html body #community-app .dn-more{padding:22px 0 24px;border-bottom:1px solid var(--dn-line)}
html body #community-app .dn-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
html body #community-app .dn-grid>*{padding:0 18px;border-left:1px solid var(--dn-line)}
html body #community-app .dn-grid>:first-child{padding-left:0;border-left:0}
html body #community-app .dn-grid>:last-child{padding-right:0}
html body #community-app .dn-card{display:flex;flex-direction:column;gap:8px;color:inherit!important;text-decoration:none!important}
html body #community-app .dn-card-img img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:4px}
html body #community-app .dn-card h3{margin:0!important;font:700 18px/1.25 Georgia,serif!important;color:#fff!important}
html body #community-app .dn-card:hover h3{text-decoration:underline;text-decoration-color:var(--dn-acc)}
html body #community-app .dn-card p{margin:0;font:400 13.5px/1.5 'Segoe UI',sans-serif;color:var(--dn-soft);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
html body #community-app .dn-card small{font:500 11.5px/1 'Segoe UI',sans-serif;color:#77828e}
/* wire filler: same paper, set apart by an italic serif, a dashed rule and a "From the wire" kicker; never a link */
html body #community-app .dn-wire{display:flex;flex-direction:column;gap:8px;cursor:default}
html body #community-app .dn-wire-kicker{font:700 10px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#8fb3d9;padding-bottom:8px;border-bottom:1px dashed #8fb3d966}
html body #community-app .dn-wire h3{margin:0!important;font:italic 700 17px/1.25 Georgia,serif!important;color:#dfe5ec!important}
html body #community-app .dn-wire-deck{margin:0;font:italic 400 13.5px/1.4 Georgia,serif;color:var(--dn-soft)}
html body #community-app .dn-wire-body{margin:0;font:400 13px/1.55 Georgia,serif;color:#b9b3a6;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
html body #community-app .dn-wire small{font:italic 400 12px/1 Georgia,serif;color:#77828e}
html body #community-app .dn-wire-lead h3{font-size:clamp(26px,2.4vw,36px)!important}
html body #community-app .dn-brief-wire b{font-style:italic;color:#dfe5ec}
/* all stories index */
html body #community-app .dn-index{padding-top:22px}
html body #community-app .dn-index ol{list-style:none;margin:0;padding:0;columns:2;column-gap:40px}
html body #community-app .dn-index li{break-inside:avoid;border-bottom:1px solid var(--dn-line)}
html body #community-app .dn-index li a{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:baseline;padding:10px 0;color:inherit!important;text-decoration:none!important}
html body #community-app .dn-index li b{font:700 15px/1.3 Georgia,serif;color:#fff}
html body #community-app .dn-index li a:hover b{text-decoration:underline;text-decoration-color:var(--dn-acc)}
html body #community-app .dn-index li small{font:500 11.5px/1 'Segoe UI',sans-serif;color:var(--dn-soft)}
html body #community-app .dn-pager{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:14px;font:600 12px/1 var(--font-control-ui,'Segoe UI'),sans-serif;color:var(--dn-soft)}
html body #community-app .dn-pager button{padding:7px 12px;border-radius:6px;border:1px solid #ffffff30;background:transparent;color:#fff;cursor:pointer}
html body #community-app .dn-pager button:disabled{opacity:.35;cursor:default}
/* article view */
html body #community-app .dn-article-wrap{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:32px;align-items:start}
html body #community-app .dn-article-wrap:not(:has(.dn-rail)){grid-template-columns:minmax(0,1fr)}
html body #community-app .dn-back{position:absolute;top:-16px;left:0;transform:translateY(-100%);font:700 12px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--dn-acc)!important;text-decoration:none!important}
html body #community-app .dn-article{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0!important;max-width:none!important;width:auto!important;height:auto!important;overflow:visible!important;display:block!important}
html body #community-app .dn-article .news-hero-text h2{font-family:Georgia,'Times New Roman',serif!important;text-transform:none!important;letter-spacing:0!important}
html body #community-app .dn-rail{position:sticky;top:0;padding-left:22px;border-left:1px solid var(--dn-line)}
html body #community-app .dn-rail .dn-brief{grid-template-columns:72px minmax(0,1fr)}
html body #community-app .dn-rail .dn-thumb img,html body #community-app .dn-rail .dn-thumb-empty{width:72px;height:52px}
html body #community-app .dn-rail .dn-brief b{font-size:14.5px}
@media(max-width:1100px){html body #community-app .dn-front,html body #community-app .dn-article-wrap{grid-template-columns:1fr}html body #community-app .dn-top,html body #community-app .dn-rail{padding-left:0;border-left:0}html body #community-app .dn-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:22px}html body #community-app .dn-lead{grid-template-columns:1fr}html body #community-app .dn-index ol{columns:1}}
/* newspaper fixes: plain status labels (no stamp), serif article headline, back link in the flow */
html body #community-app .dn-paper .event-status{position:static!important;inset:auto!important;transform:none!important;rotate:none!important;display:inline-flex!important;align-items:center;gap:5px;margin:0!important;padding:4px 7px!important;width:auto!important;height:auto!important;border-radius:3px!important;border:1px solid currentColor!important;background:none!important;box-shadow:none!important;opacity:1!important;font:700 10px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;letter-spacing:.14em!important;text-shadow:none!important;mix-blend-mode:normal!important}
html body #community-app .dn-paper .event-status::before,html body #community-app .dn-paper .event-status::after{display:none!important}
html body #community-app .dn-paper .event-status.is-active{color:#ff8a7a!important}
html body #community-app .dn-paper .event-status.is-complete{color:#7fd6a4!important}
html body #community-app .dn-back{position:static!important;transform:none!important;display:inline-block;margin:0 0 14px;grid-column:1 / -1}
html body #community-app .dn-article-wrap{grid-template-rows:auto 1fr}
html body #community-app .dn-article-wrap>.dn-article{grid-column:1}
html body #community-app .dn-article-wrap>.dn-rail{grid-column:2;grid-row:2}
html body #community-app .dn-paper .dn-article .news-feature .news-hero-text h2{font:700 clamp(30px,3vw,48px)/1.08 Georgia,'Times New Roman',serif!important;text-transform:none!important;letter-spacing:-.01em!important}
html body #community-app .dn-paper .dn-article,html body #community-app .dn-paper .dn-article .news-feature{outline:0!important;border:0!important;box-shadow:none!important;background:none!important;padding:0!important}
html body #community-app .dn-paper .dn-article .news-feature-body .news-body{font-family:Georgia,'Times New Roman',serif}
html body #community-app .dn-article-wrap{gap:0 32px!important}
html body #community-app#community-app .dn-paper .dn-article .news-hero-text h2{font:700 clamp(30px,3vw,46px)/1.08 Georgia,'Times New Roman',serif!important;letter-spacing:-.01em!important;text-transform:none!important}
html body #community-app#community-app .dn-paper .dn-article .news-body :is(p,li){font-family:Georgia,'Times New Roman',serif!important;font-size:17px!important;line-height:1.7!important}
html body #community-app#community-app .dn-paper .dn-article .news-hero-text .news-deck{font-family:Georgia,serif!important;font-style:italic}
/* newspaper type: the site's own fonts instead of the serif */
html body #community-app#community-app .dn-paper :is(.dn-nameplate,.dn-lead h2,.dn-card h3,.dn-brief b,.dn-index li b,.dn-wire h3){font-family:var(--font-control-title,'Segoe UI'),sans-serif!important;font-style:normal!important;letter-spacing:-.005em!important}
html body #community-app#community-app .dn-paper .dn-nameplate{font-size:clamp(38px,4.2vw,62px)!important;letter-spacing:.01em!important;text-transform:uppercase}
html body #community-app#community-app .dn-paper.is-article .dn-nameplate{font-size:clamp(26px,2.4vw,36px)!important}
html body #community-app#community-app .dn-paper :is(.dn-lead p,.dn-wire-deck,.dn-wire-body,.dn-wire small,.dn-card p){font-family:'Segoe UI',system-ui,sans-serif!important;font-style:normal!important}
html body #community-app#community-app .dn-paper .dn-lead p{font-size:16px!important;line-height:1.55}
html body #community-app#community-app .dn-paper .dn-wire h3{color:#c9d4df!important}
html body #community-app#community-app .dn-paper .dn-wire-deck{color:#9aa6b2!important}
html body #community-app#community-app .dn-paper .dn-brief-wire small{white-space:normal;line-height:1.35}
html body #community-app#community-app .dn-paper .dn-article .news-hero-text h2{font-family:var(--font-control-title,'Segoe UI'),sans-serif!important;letter-spacing:0!important}
html body #community-app#community-app .dn-paper .dn-article .news-body :is(p,li){font-family:'Segoe UI',system-ui,sans-serif!important;font-size:16px!important;line-height:1.7!important}
html body #community-app#community-app .dn-paper .dn-article .news-hero-text .news-deck{font-family:'Segoe UI',sans-serif!important;font-style:normal}
/* Site Events uses the Main Index city art; the paper sits on it as frosted glass so the art reads through */
#community-app.open-layout[data-scene=events]{--open-art:url('/assets/backdrop-index-sdn-city.webp')}
html body #community-app.open-layout[data-scene=events] #site-backdrop{background-position:0 0,center top!important}
html body #community-app[data-scene=events] .dn-paper{background:#06090dc2!important;backdrop-filter:blur(14px) saturate(1.1)}

/* ======== Site Events v2: no masthead, blocks sit directly on the city art ======== */
html body #community-app .dn-paper.dn-v2{background:none!important;backdrop-filter:none!important;border:0!important;box-shadow:none!important;border-radius:0!important;padding:4px 6px 28px!important;max-width:1500px}
html body #community-app .dn-v2 .dn-block,html body #community-app .dn-v2 .dn-card{border-radius:14px;border:1px solid #ffffff1a;background:#080b10d9;backdrop-filter:blur(10px);box-shadow:0 16px 40px rgb(0 0 0 / .7)}
/* front row: big lead card with the story over its picture, top stories beside it; together they fill the window height */
html body #community-app .dn-v2 .dn-front{display:grid;grid-template-columns:minmax(0,2fr) minmax(300px,1fr);gap:22px;height:clamp(420px,calc(100dvh - 58px - 60px - 20px - 40px - 250px),640px);padding:0!important;border:0!important}
html body #community-app .dn-v2 .dn-lead{position:relative;display:block;height:100%;border-radius:14px;overflow:hidden;border:1px solid #ffffff1a;box-shadow:0 18px 44px rgb(0 0 0 / .75);background:#0b1016}
html body #community-app .dn-v2 .dn-lead-img,html body #community-app .dn-v2 .dn-lead-img img{position:absolute;inset:0;width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:cover;border-radius:0!important;box-shadow:none!important}
html body #community-app .dn-v2 .dn-lead::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,#05070acc 70%,#05070af2 100%);pointer-events:none}
html body #community-app .dn-v2 .dn-lead-copy{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:28px 32px 26px;gap:10px!important}
html body #community-app .dn-v2 .dn-lead h2{font-size:clamp(28px,2.6vw,42px)!important;line-height:1.05!important;text-shadow:0 2px 16px #000}
html body #community-app .dn-v2 .dn-lead p{max-width:760px;font-size:15.5px!important;color:#dfe5ec!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html body #community-app .dn-v2 .dn-lead-empty .dn-lead-copy{position:static;height:100%;justify-content:center}
html body #community-app .dn-v2 .dn-lead-empty::after{display:none}
html body #community-app .dn-v2 .dn-top{padding:18px 20px!important;border-left:1px solid #ffffff1a!important;overflow:hidden;display:flex;flex-direction:column}
html body #community-app .dn-v2 .dn-top .dn-brief{flex:1;align-content:center}
/* second row: remaining events as cards */
html body #community-app .dn-v2 .dn-more{padding:22px 0 0!important;border:0!important}
html body #community-app .dn-v2 .dn-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px!important}
html body #community-app .dn-v2 .dn-grid>*{padding:0!important;border-left:1px solid #ffffff1a!important}
html body #community-app .dn-v2 .dn-card{overflow:hidden;gap:8px;padding:0 0 16px}
html body #community-app .dn-v2 .dn-card>:not(.dn-card-img){margin:0 16px!important}
html body #community-app .dn-v2 .dn-card-img img{border-radius:0!important}
html body #community-app .dn-v2 .dn-index{margin-top:22px;padding:18px 22px!important}
/* article: no masthead either */
html body #community-app .dn-v2.is-article{padding-top:4px!important}
html body #community-app .dn-v2 .dn-article-wrap{padding:22px 26px;border-radius:14px;border:1px solid #ffffff1a;background:#080b10e0;backdrop-filter:blur(10px);box-shadow:0 16px 40px rgb(0 0 0 / .7)}
@media(max-width:1100px){html body #community-app .dn-v2 .dn-front{grid-template-columns:1fr;height:auto}html body #community-app .dn-v2 .dn-lead{height:380px}html body #community-app .dn-v2 .dn-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* front row fills the window when there's no second row */
html body #community-app .dn-v2:not(:has(.dn-more)):not(:has(.dn-index)) .dn-front{height:calc(100dvh - 58px - 60px - 20px - 40px - 24px)}
/* My Profile lives only in the header now, as just the avatar (no sidebar duplicate, no label) */
html body #sidebar-footer-actions a[href="#/player"]{display:none!important}
html body #community-app .account-link{font-size:0!important;gap:0!important;padding:0!important}
html body #community-app .account-link .account-avatar{width:32px!important;height:32px!important;margin:0!important}
html body #community-app .account-link:not(:has(img)):not(.dispatch-signin)::before{content:'◎';font-size:22px;line-height:1}
html body #community-app .account-link.dispatch-signin{font-size:13px!important;padding:6px 12px!important}

/* ======== Popouts (page settings forms): one themed layout. Title, fields, then Cancel / Save at the bottom ======== */
html body #community-app#community-app #app-dialog[open]{position:fixed!important;inset:0!important;margin:auto!important;transform:none!important;width:min(620px,calc(100vw - 32px))!important;max-width:none!important;height:fit-content!important;max-height:min(86vh,900px)!important;padding:0!important;border-radius:16px!important;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 30%,#ffffff1a)!important;background:#080b10f2!important;backdrop-filter:blur(14px);box-shadow:0 30px 80px #000d,0 0 0 1px #0008!important;color:#dfe5ec;overflow:hidden!important;display:flex!important;flex-direction:column}
html body #community-app#community-app #app-dialog::backdrop{background:#02040799;backdrop-filter:blur(3px)}
html body #community-app#community-app #app-dialog>form{display:flex!important;flex-direction:column!important;flex:1 1 auto!important;min-height:0!important;margin:0!important}
html body #community-app#community-app #app-dialog #app-dialog-content{order:1!important;flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;padding:24px 28px 8px!important;scrollbar-width:thin;scrollbar-color:#ffc45b66 transparent}
html body #community-app#community-app #app-dialog>form>#app-form-error{order:2!important;margin:0 28px!important;color:#ff8a7a;font:500 13px/1.4 'Segoe UI',sans-serif}
html body #community-app#community-app #app-dialog>form>#app-form-error:empty{display:none}
html body #community-app#community-app #app-dialog>form>.app-actions{order:3!important;position:static!important;display:flex!important;justify-content:flex-end!important;gap:10px!important;margin:0!important;padding:14px 28px 18px!important;border-top:1px solid #ffffff14!important;background:#05070acc!important;box-shadow:none!important}
html body #community-app#community-app #app-dialog .app-actions button{min-width:96px;padding:10px 18px!important;border-radius:9px!important;font:700 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;letter-spacing:.04em;cursor:pointer}
html body #community-app#community-app #app-dialog #app-dialog-cancel{background:transparent!important;border:1px solid #ffffff30!important;color:#dfe5ec!important}
html body #community-app#community-app #app-dialog #app-dialog-cancel:hover{border-color:#ffffff66!important}
html body #community-app#community-app #app-dialog .app-actions button[type=submit]{background:var(--color-accent-default,#ffc45b)!important;border:1px solid transparent!important;color:#14100a!important}
html body #community-app#community-app #app-dialog .app-actions button[type=submit]:hover{filter:brightness(1.08)}
html body #community-app#community-app #app-dialog #app-dialog-content>h2:first-child{margin:0 0 6px!important;font:700 24px/1.15 var(--font-control-title,'Segoe UI'),sans-serif!important;color:#fff!important;text-transform:none!important;letter-spacing:0!important}
html body #community-app#community-app #app-dialog #app-dialog-content :is(p.app-muted,.app-muted,small.hint){display:block;margin:0 0 16px!important;font:400 13.5px/1.5 'Segoe UI',sans-serif!important;color:#9aa6b2!important}
html body #community-app#community-app #app-dialog #app-dialog-content label{display:flex!important;flex-direction:column!important;gap:7px!important;margin:0 0 16px!important;font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;letter-spacing:.14em!important;text-transform:uppercase!important;color:#aab4bf!important}
html body #community-app#community-app #app-dialog #app-dialog-content label:has(>input[type=checkbox]),html body #community-app#community-app #app-dialog #app-dialog-content label:has(>input[type=radio]){flex-direction:row!important;align-items:center;gap:10px!important;text-transform:none!important;letter-spacing:0!important;font:500 14px/1.3 'Segoe UI',sans-serif!important;color:#dfe5ec!important}
html body #community-app#community-app #app-dialog #app-dialog-content :is(input:not([type=checkbox]):not([type=radio]):not([type=color]),select,textarea){width:100%!important;box-sizing:border-box;padding:10px 12px!important;border-radius:9px!important;border:1px solid #ffffff24!important;background:#0d131a!important;color:#fff!important;font:400 14.5px/1.4 'Segoe UI',sans-serif!important;text-transform:none!important;letter-spacing:0!important;box-shadow:none!important;outline:none}
html body #community-app#community-app #app-dialog #app-dialog-content :is(input,select,textarea):focus{border-color:var(--color-accent-default,#ffc45b)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--color-accent-default,#ffc45b) 22%,transparent)!important}
html body #community-app#community-app #app-dialog #app-dialog-content textarea{min-height:90px;resize:vertical}
html body #community-app#community-app #app-dialog #app-dialog-content input::placeholder{color:#6b7682}
html body #community-app#community-app #app-dialog #app-dialog-content :is(input,select,textarea)+:is(small,p){margin-top:-8px!important}
html body #community-app#community-app #app-dialog #app-dialog-content fieldset{margin:0 0 16px!important;padding:12px 14px 14px!important;border:1px solid #ffffff1f!important;border-radius:12px!important;background:#0b1016!important}
html body #community-app#community-app #app-dialog #app-dialog-content legend{padding:0 6px!important;font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;letter-spacing:.14em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)!important}
html body #community-app#community-app #app-dialog.is-confirm[open]{width:min(440px,calc(100vw - 32px))!important}
/* icon picker */
html body #community-app#community-app #app-dialog .icon-picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:8px}
html body #community-app#community-app #app-dialog .icon-picker-grid label{position:relative;display:grid!important;place-items:center;margin:0!important;aspect-ratio:1;border-radius:10px;border:1px solid #ffffff1f;background:#0d131a;color:#aab4bf!important;cursor:pointer;transition:border-color .15s,color .15s,background .15s}
html body #community-app#community-app #app-dialog .icon-picker-grid label:hover{color:#fff!important;border-color:#ffffff55}
html body #community-app#community-app #app-dialog .icon-picker-grid input{position:absolute;opacity:0;pointer-events:none}
html body #community-app#community-app #app-dialog .icon-picker-grid label:has(input:checked){border-color:var(--color-accent-default,#ffc45b);background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 16%,#0d131a);color:var(--color-accent-default,#ffc45b)!important}
html body #community-app#community-app #app-dialog .icon-picker-grid label:has(input:focus-visible){box-shadow:0 0 0 3px color-mix(in srgb,var(--color-accent-default,#ffc45b) 30%,transparent)}
html body #community-app#community-app #app-dialog .icon-picker-grid svg{width:22px;height:22px}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* arrange tiles */
html body #community-app .ixa-rows{display:flex;flex-direction:column;gap:12px}
html body #community-app .ixa-row{border:1px solid #ffffff1f;border-radius:12px;background:#0b1016;padding:10px 12px 12px}
html body #community-app .ixa-row header{display:flex;align-items:center;gap:10px;margin-bottom:8px;font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app .ixa-row header small{color:#77828e;letter-spacing:.08em}
html body #community-app .ixa-remove{margin-left:auto;padding:5px 9px;border-radius:6px;border:1px solid #ffffff26;background:none;color:#aab4bf;font:600 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer}
html body #community-app .ixa-remove:hover{color:#ff8a7a;border-color:#ff8a7a88}
html body #community-app .ixa-drop{display:flex;flex-wrap:wrap;gap:8px;min-height:44px;margin:0;padding:6px;list-style:none;border-radius:9px;border:1px dashed transparent;transition:border-color .15s,background .15s}
html body #community-app .ixa-drop.is-over{border-color:var(--color-accent-default,#ffc45b);background:#ffc45b0f}
html body #community-app .ixa-drop li[data-key]{display:flex;align-items:center;gap:8px;padding:8px 8px 8px 10px;border-radius:8px;border:1px solid #ffffff26;background:#141b24;color:#fff;font:600 13.5px/1 var(--font-control-title,'Segoe UI'),sans-serif;cursor:grab;user-select:none}
html body #community-app .ixa-drop li.dragging{opacity:.4}
html body #community-app .ixa-grip{color:#77828e}
html body #community-app .ixa-move{display:inline-flex;gap:2px;margin-left:4px}
html body #community-app .ixa-move button{width:22px;height:22px;padding:0;border-radius:5px;border:1px solid #ffffff1f;background:none;color:#aab4bf;cursor:pointer;font-size:12px}
html body #community-app .ixa-empty{padding:8px;color:#6b7682;font:italic 400 13px/1 'Segoe UI',sans-serif}
html body #community-app .ixa-add{align-self:flex-start;padding:9px 14px;border-radius:9px;border:1px dashed #ffffff40;background:none;color:#dfe5ec;font:600 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer}
html body #community-app .ixa-add:hover{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b)}
/* the gear menu itself */
html body #page-settings-panel{min-width:230px;padding:10px!important;border-radius:14px!important;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 30%,#ffffff1a)!important;background:#080b10f2!important;backdrop-filter:blur(14px);box-shadow:0 20px 50px #000c!important}
html body #page-settings-panel .page-settings-head{padding:4px 6px 10px!important;margin:0 0 6px!important;border-bottom:1px solid #ffffff14;font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;letter-spacing:.2em!important;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)!important}
html body #page-settings-panel .page-settings-body{display:flex!important;flex-direction:column!important;gap:2px!important}
html body #page-settings-panel .page-settings-body>:is(button,a,label){display:flex!important;align-items:center;gap:8px;width:100%;box-sizing:border-box;margin:0!important;padding:9px 10px!important;border-radius:8px!important;border:0!important;background:transparent!important;color:#dfe5ec!important;font:600 13.5px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif!important;text-align:left;text-decoration:none!important;text-transform:none!important;letter-spacing:0!important;box-shadow:none!important;cursor:pointer}
html body #page-settings-panel .page-settings-body>:is(button,a,label):hover{background:#ffffff0f!important;color:#fff!important}

/* ======== Site Events v3: an even grid of cards; the lead is simply double width ======== */
html body #community-app .dn-v2 .dn-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;align-items:start}
html body #community-app .dn-v2 .dn-cards>.dn-card{display:flex;flex-direction:column;gap:8px;padding:0 0 16px!important;border-left:1px solid #ffffff1a!important;min-width:0}
html body #community-app .dn-v2 .dn-cards>.dn-card-lead{grid-column:span 2}
html body #community-app .dn-v2 .dn-cards .dn-card-img img{aspect-ratio:16/9;height:auto}
html body #community-app .dn-v2 .dn-cards .dn-card-lead .dn-card-img img{aspect-ratio:32/9}
html body #community-app .dn-v2 .dn-cards .dn-card>:not(.dn-card-img){margin:0 16px!important}
html body #community-app .dn-v2 .dn-cards .dn-card>.dn-kicker:first-child,html body #community-app .dn-v2 .dn-cards .dn-card>.dn-wire-kicker:first-child{margin-top:16px!important}
html body #community-app .dn-v2 .dn-cards .dn-card h3{font-size:18px!important;line-height:1.2!important}
html body #community-app .dn-v2 .dn-cards .dn-card-lead h3{font-size:24px!important}
html body #community-app .dn-v2 .dn-cards .dn-card p{-webkit-line-clamp:2!important}
html body #community-app .dn-v2 .dn-cards .dn-card-lead p{-webkit-line-clamp:2!important;font-size:14.5px!important}
html body #community-app .dn-v2 .dn-cards .dn-card-wire{background:#080b10b8!important;border-style:dashed!important;border-color:#8fb3d955!important;cursor:default}
html body #community-app .dn-v2 .dn-cards .dn-card-wire .dn-wire-kicker{border-bottom:0;padding-bottom:0}
html body #community-app .dn-v2 .dn-cards .dn-card-wire h3{color:#c9d4df!important}
html body #community-app .dn-v2 .dn-cards .dn-card-wire p{margin:0;font:400 13.5px/1.5 'Segoe UI',sans-serif;color:#9aa6b2;display:-webkit-box;-webkit-line-clamp:4!important;-webkit-box-orient:vertical;overflow:hidden}
html body #community-app .dn-v2 .dn-cards .dn-card-wire small{font:400 12px/1 'Segoe UI',sans-serif;color:#77828e}
html body #community-app .dn-v2 .dn-cards .dn-card:hover:not(.dn-card-wire){border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,#ffffff1a)!important}
@media(max-width:1100px){html body #community-app .dn-v2 .dn-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
html body #community-app .dn-v2 .dn-cards{align-items:stretch!important}html body #community-app .dn-v2 .dn-cards .dn-card>small{margin-top:auto!important}
html body #community-app .dn-v2 .dn-cards .dn-card>small{margin:auto 16px 0!important;padding-top:6px}html body #community-app .dn-v2 .dn-cards .dn-card-wire p{-webkit-line-clamp:9!important}html body #community-app .dn-v2 .dn-cards .dn-card-wire h3{font-size:20px!important}
/* article view: soft dark-blue glow that fades into the art instead of a hard-edged box; "Front page" floats above it */
html body #community-app .dn-v2.is-article{padding-top:38px!important}
html body #community-app .dn-v2 .dn-article-wrap{position:relative;isolation:isolate;background:none!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;padding:26px 34px 34px!important}
html body #community-app .dn-v2 .dn-article-wrap::before{content:'';position:absolute;inset:-40px -30px;z-index:-1;background:#0a111c;opacity:.94;-webkit-mask-image:radial-gradient(ellipse 72% 62% at 50% 45%,#000 55%,transparent 100%),linear-gradient(#000,#000);mask-image:linear-gradient(90deg,transparent,#000 60px,#000 calc(100% - 60px),transparent),linear-gradient(180deg,transparent,#000 60px,#000 calc(100% - 80px),transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 60px,#000 calc(100% - 60px),transparent),linear-gradient(180deg,transparent,#000 60px,#000 calc(100% - 80px),transparent);-webkit-mask-composite:source-in;mask-composite:intersect;backdrop-filter:blur(10px);pointer-events:none}
html body #community-app .dn-v2 .dn-back{position:absolute!important;top:-30px;left:34px;z-index:2;margin:0!important;padding:8px 14px;border-radius:999px;background:#0a111ce6;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,transparent);box-shadow:0 8px 20px #000a;backdrop-filter:blur(8px);transition:background .15s ease,transform .15s ease}
html body #community-app .dn-v2 .dn-back:hover{background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 18%,#0a111c);transform:translateY(-1px)}
html body #community-app .dn-v2 .dn-article-wrap{grid-template-rows:auto!important}html body #community-app .dn-v2 .dn-article-wrap>.dn-rail{grid-row:1!important}html body #community-app .dn-v2 .dn-article-wrap>.dn-article{grid-row:1!important}
/* event header image: secondary accent border */
html body #community-app .dn-paper .news-feature .news-hero{border:2px solid var(--color-accent-secondary,#5ad1e0)!important;box-shadow:0 0 0 1px #0008,0 18px 40px #000a!important}
/* header image border: the theme's main accent (gold on the default skin) */
html body #community-app .dn-paper .news-feature .news-hero{border-color:var(--color-accent-default,#ffc45b)!important}
/* article: page height is fixed, article scrolls, thread column stays put beside it */
html body #community-app .dn-v2.is-article .dn-article-wrap{grid-template-columns:minmax(0,1fr) 320px!important}
html body #community-app .dn-thread-rail{position:sticky;top:0;align-self:start}
html body #community-app .dn-thread-rail h4 .dn-count{padding:2px 8px;border-radius:999px;background:#ffc45b22;color:var(--color-accent-default,#ffc45b);letter-spacing:.04em}
html body #community-app .dn-thread-list{display:flex;flex-direction:column;gap:8px}
html body #community-app .dn-thread{display:flex;flex-direction:column;gap:4px;padding:10px 12px 10px 14px;border-radius:10px;border:1px solid #ffffff1a;border-left:3px solid var(--thread-accent,#ffc45b);background:#0b1016cc;color:inherit!important;text-decoration:none!important;transition:background .15s,border-color .15s}
html body #community-app .dn-thread[hidden]{display:none}
html body #community-app .dn-thread:hover{background:color-mix(in srgb,var(--thread-accent,#ffc45b) 12%,#0b1016);border-color:color-mix(in srgb,var(--thread-accent,#ffc45b) 45%,transparent)}
html body #community-app .dn-thread-top{display:flex;gap:6px;align-items:center;font:700 10px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#8d98a5}
html body #community-app .dn-thread-top i{font-style:normal;padding:2px 5px;border-radius:3px;border:1px solid #ffc45b66;color:var(--color-accent-default,#ffc45b)}
html body #community-app .dn-thread-top i.is-new{background:#5ad1e0;border-color:#5ad1e0;color:#0b1015}
html body #community-app .dn-thread b{font:700 15px/1.25 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff}
html body #community-app .dn-thread small{font:500 12px/1.3 'Segoe UI',sans-serif;color:#8d98a5}
html body #community-app .dn-thread.is-complete{opacity:.75}
html body #community-app .dn-thread-pager{display:flex;align-items:center;justify-content:space-between;margin-top:10px;font:600 12px/1 var(--font-control-ui,'Segoe UI'),sans-serif;color:#8d98a5}
html body #community-app .dn-thread-pager[hidden]{display:none}
html body #community-app .dn-thread-pager button{width:32px;height:30px;border-radius:7px;border:1px solid #ffffff30;background:transparent;color:#fff;font-size:16px;cursor:pointer}
html body #community-app .dn-thread-pager button:disabled{opacity:.3;cursor:default}
html body #community-app .dn-thread-empty{margin:0;font:400 13.5px/1.5 'Segoe UI',sans-serif;color:#8d98a5}
/* header art editor */
html body #community-app .ee-art .ee-art-field{flex-direction:column;align-items:stretch;gap:8px;width:min(560px,80vw)}
html body #community-app .ee-art .ee-art-field[hidden]{display:none}
html body #community-app .ee-art-spec{margin:0;font:400 12.5px/1.45 'Segoe UI',sans-serif;color:#aab4bf}
html body #community-app .ee-art-spec b{color:var(--color-accent-default,#ffc45b)}
html body #community-app .ee-art-row{display:flex;gap:6px;align-items:center}
html body #community-app .ee-art-row input[type=url]{flex:1;min-width:0;width:auto!important}
html body #community-app .ee-art-upload{padding:7px 10px;border-radius:6px;border:0;background:var(--color-accent-default,#ffc45b);color:#14100a;font:700 12.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer;white-space:nowrap}
html body #community-app .ee-art-msg{margin:0;min-height:1em;font:500 12.5px/1.4 'Segoe UI',sans-serif;color:#dfe5ec}
html body #community-app .ee-art-msg:empty{display:none}
/* event header: 1900 x 560 banner shape */
html body #community-app .dn-paper .news-feature .news-hero:not(.no-image){min-height:0!important;height:auto!important;aspect-ratio:1900/560}
html body #community-app .dn-paper .news-feature .news-hero-text{padding:20px 28px 20px!important}
html body #community-app .dn-paper .news-feature .news-hero-text h2{font-size:clamp(26px,2.4vw,40px)!important;margin:8px 0 6px!important}
html body #community-app .dn-paper .news-feature .news-hero-text .news-deck{font-size:15.5px!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html body #community-app .dn-v2 .dn-cards .dn-card-lead .dn-card-img img{aspect-ratio:1900/560!important}
/* crop picker */
html body #community-app .ee-art-crop:empty{display:none}
html body #community-app .crop-frame{position:relative;width:100%;overflow:hidden;border-radius:8px;border:2px solid var(--color-accent-default,#ffc45b);background:#000;cursor:grab;touch-action:none;user-select:none}
html body #community-app .crop-frame.is-dragging{cursor:grabbing}
html body #community-app .crop-frame img{position:absolute;left:0;top:0;max-width:none!important;pointer-events:none}
html body #community-app .crop-frame::after{content:'';position:absolute;left:0;right:0;bottom:0;height:40%;background:linear-gradient(transparent,#0008);pointer-events:none}
html body #community-app .crop-hint{position:absolute;left:10px;top:8px;z-index:1;padding:3px 8px;border-radius:999px;background:#000a;font:600 11px/1.3 'Segoe UI',sans-serif;color:#fff;pointer-events:none}
html body #community-app .crop-controls{display:flex;align-items:center;gap:8px;margin-top:8px;font:600 13px/1 'Segoe UI',sans-serif;color:#aab4bf}
html body #community-app .crop-controls input[type=range]{flex:1;accent-color:var(--color-accent-default,#ffc45b)}
html body #community-app .crop-size{font:500 11.5px/1 'Segoe UI',sans-serif;color:#8d98a5;white-space:nowrap}
html body #community-app .crop-controls [data-crop-ok]{background:var(--color-accent-default,#ffc45b)!important;color:#14100a!important;border:0!important}
/* ---- Events: never scroll sideways; collapse sensibly as the window narrows ---- */
html body #community-app .dn-paper{overflow-x:clip!important}
html body #community-app .dn-v2 .dn-article-wrap{min-width:0}
html body #community-app .dn-v2 .dn-article-wrap::before{inset:-40px 0!important}
html body #community-app .dn-v2 .dn-article-wrap>*{min-width:0}
html body #community-app .dn-v2 .dn-article .news-body img,html body #community-app .dn-v2 .dn-article .news-body figure{max-width:100%!important;height:auto}
@media(max-width:1180px){
 html body #community-app#community-app .dn-v2.is-article .dn-article-wrap{grid-template-columns:minmax(0,1fr)!important;padding:24px 18px 28px!important}
 html body #community-app#community-app .dn-v2 .dn-article-wrap>.dn-rail{grid-column:1!important;grid-row:2!important;position:static;padding:22px 0 0!important;border-left:0!important;border-top:1px solid #ffffff1a}
 html body #community-app .dn-thread-list{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
}
@media(max-width:760px){
 html body #community-app .dn-v2 .dn-cards{grid-template-columns:minmax(0,1fr)!important}
 html body #community-app .dn-v2 .dn-cards>.dn-card-lead{grid-column:auto}
 html body #community-app .dn-paper .news-feature .news-hero:not(.no-image){aspect-ratio:auto;min-height:260px!important}
 html body #community-app .dn-v2 .dn-article .news-body :is(figure,.rich-image){float:none!important;width:100%!important;margin:12px 0!important}
 html body #community-app .dn-v2 .dn-back{left:18px}
 html body #community-app .dn-index ol{columns:1!important}
}
html body #community-app .dn-v2 .dn-article .news-body :is(figure,.rich-image){box-sizing:border-box;max-width:100%!important}html body #community-app .dn-v2 .dn-article .news-body{overflow-x:clip}
html body #community-app#community-app .dn-v2 .dn-article .news-body :is(figure,.rich-image){margin-left:0!important;margin-right:0!important}

/* ---- Guidebook matches the event page: same column split (content + 320px side column), same fading backdrop ---- */
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-body{grid-template-columns:minmax(0,1fr) 320px!important;gap:32px!important;padding:24px 34px 0 40px;box-sizing:border-box}
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel{border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;padding:0!important;overflow:visible!important}
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel::before{inset:-24px -32px -10px -40px!important;border-radius:0!important;background:#0a111c!important;opacity:.94;backdrop-filter:blur(10px);-webkit-mask-image:linear-gradient(90deg,transparent,#000 60px,#000 calc(100% - 60px),transparent),linear-gradient(180deg,transparent,#000 50px,#000 calc(100% - 60px),transparent)!important;-webkit-mask-composite:source-in!important;mask-image:linear-gradient(90deg,transparent,#000 60px,#000 calc(100% - 60px),transparent),linear-gradient(180deg,transparent,#000 50px,#000 calc(100% - 60px),transparent)!important;mask-composite:intersect!important}
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panes{padding:8px 26px 24px 0!important}
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-side{padding-left:22px;border-left:1px solid #ffffff1a;overflow-x:hidden}
/* images inside the guidebook scale down to fit */
html body #community-app[data-scene=guidebook] .handbook-prose :is(img,figure){max-width:100%!important;height:auto}
html body #community-app[data-scene=guidebook] .handbook-prose .handbook-plate img{max-height:340px;width:100%;object-fit:cover}
@media(max-width:900px){html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-body{padding:12px 16px 0}html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-side{padding-left:0;border-left:0}}
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel::before{right:0!important}
html body #community-app[data-scene=guidebook] .handbook-prose .hb-timeline{overflow-x:clip!important}html body #community-app[data-scene=guidebook] .hb-tl-item{min-width:0}@media(max-width:900px){html body #community-app[data-scene=guidebook] .guide-layout .guide-tabs{flex-wrap:wrap!important;overflow:visible!important}html body #community-app[data-scene=guidebook] .guide-layout .guide-tab{flex:1 1 140px!important;min-width:0;white-space:normal}html body #community-app[data-scene=guidebook] .guide-layout,html body #community-app[data-scene=guidebook] .guide-body{overflow-x:clip!important;min-width:0}}
html body #community-app[data-scene=guidebook] .guide-layout .guide-tab{overflow:hidden;text-overflow:ellipsis}
/* @mentions */
.mention{display:inline;padding:0 .3em;border-radius:.35em;font-weight:700;white-space:nowrap;color:var(--mention-color,#c9b8ff);cursor:default}
.mention.glow-dark{background:color-mix(in srgb,var(--mention-color,#c9b8ff) 16%,#0008);text-shadow:0 0 6px #000,0 0 2px #000}
.mention.glow-light{background:#ffffffd9;text-shadow:0 0 1px #fff6}
.mention-role::before{content:'';}
.mention-pop{position:fixed;z-index:100001;width:270px;max-height:320px;overflow:auto;padding:6px;border-radius:12px;border:1px solid #ffc45b55;background:#080b10f5;box-shadow:0 16px 40px #000c;backdrop-filter:blur(10px)}
.mention-pop button{display:flex;align-items:center;gap:9px;width:100%;padding:7px 8px;border:0;border-radius:8px;background:none;color:#dfe5ec;text-align:left;cursor:pointer;font:500 13.5px/1.2 'Segoe UI',sans-serif}
.mention-pop button.is-sel,.mention-pop button:hover{background:#ffffff14}
.mention-pop img,.mention-pop i{flex:none;width:24px;height:24px;border-radius:50%;object-fit:cover;display:grid;place-items:center;font-style:normal;font-weight:700;background:#1a2230;color:#aab4bf}
.mention-pop b{font-weight:700;color:#fff}
.mention-pop small{margin-left:auto;color:#77828e;font-size:11.5px}
.rich-toolbar .rich-mention-btn{padding:6px 10px;border-radius:7px;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent);background:transparent;color:var(--color-accent-default,#ffc45b);font:700 12.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer}
.rich-toolbar .rich-mention-btn:hover{background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 15%,transparent)}
.mention-pop i.is-role{color:#0b0d10;background:#aab4bf}
html body #community-app .mention{color:var(--mention-color,#c9b8ff)!important;-webkit-text-fill-color:var(--mention-color,#c9b8ff)!important;font-family:inherit}html body #community-app .mention.glow-light{background:#ffffffe0!important}html body #community-app .mention.glow-dark{background:color-mix(in srgb,var(--mention-color,#c9b8ff) 18%,#000a)!important}
/* event cards show the banner at its own shape (1900 x 560), so new images appear uncropped on every card */
html body #community-app .dn-v2 .dn-cards .dn-card-img img,html body #community-app .dn-v2 .dn-cards .dn-card-lead .dn-card-img img{aspect-ratio:1900/560!important;object-fit:cover;object-position:center 35%}
html body #community-app .dn-v2 .dn-cards .dn-card-img{position:relative;display:block;border-bottom:1px solid #ffffff14}
/* guidebook: more room inside the fade, tabs tucked in beside it, no divider */
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-body{gap:14px!important}
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel::before{inset:-24px -10px -10px -40px!important;right:-10px!important}
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panes{padding:22px 48px 40px 32px!important}
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-side{border-left:0!important;padding-left:0!important;padding-top:6px}
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel::before{right:0!important}
/* Seamless fade (event articles + guidebook): long eased edges, no blur edge, colour from one theme token so new skins can retint it */
:root{--fade-panel:#0a111c}
html body #community-app .dn-v2 .dn-article-wrap::before,html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel::before{background:var(--fade-panel)!important;opacity:.9!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
 -webkit-mask-image:linear-gradient(90deg,transparent 0,rgb(0 0 0/.12) 30px,rgb(0 0 0/.45) 80px,rgb(0 0 0/.8) 130px,#000 170px,#000 calc(100% - 170px),rgb(0 0 0/.8) calc(100% - 130px),rgb(0 0 0/.45) calc(100% - 80px),rgb(0 0 0/.12) calc(100% - 30px),transparent 100%),linear-gradient(180deg,transparent 0,rgb(0 0 0/.3) 30px,rgb(0 0 0/.75) 80px,#000 120px,#000 calc(100% - 140px),rgb(0 0 0/.7) calc(100% - 80px),rgb(0 0 0/.25) calc(100% - 30px),transparent 100%)!important;
 mask-image:linear-gradient(90deg,transparent 0,rgb(0 0 0/.12) 30px,rgb(0 0 0/.45) 80px,rgb(0 0 0/.8) 130px,#000 170px,#000 calc(100% - 170px),rgb(0 0 0/.8) calc(100% - 130px),rgb(0 0 0/.45) calc(100% - 80px),rgb(0 0 0/.12) calc(100% - 30px),transparent 100%),linear-gradient(180deg,transparent 0,rgb(0 0 0/.3) 30px,rgb(0 0 0/.75) 80px,#000 120px,#000 calc(100% - 140px),rgb(0 0 0/.7) calc(100% - 80px),rgb(0 0 0/.25) calc(100% - 30px),transparent 100%)!important;
 -webkit-mask-composite:source-in!important;mask-composite:intersect!important}
/* guidebook: give the longer fade room so the text still sits on the solid part */
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel::before{inset:-40px 0 -30px -110px!important}
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panes{padding:22px 110px 40px 40px!important}
html body #community-app .dn-v2 .dn-article-wrap::before{inset:-60px 0!important}
/* guidebook: keep the whole fade inside the page area (it was being cut by the page's left edge) */
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel::before{inset:-40px 0 -30px -36px!important;
 -webkit-mask-image:linear-gradient(90deg,transparent 0,rgb(0 0 0/.15) 25px,rgb(0 0 0/.5) 60px,rgb(0 0 0/.85) 95px,#000 120px,#000 calc(100% - 120px),rgb(0 0 0/.85) calc(100% - 95px),rgb(0 0 0/.5) calc(100% - 60px),rgb(0 0 0/.15) calc(100% - 25px),transparent 100%),linear-gradient(180deg,transparent 0,rgb(0 0 0/.3) 30px,rgb(0 0 0/.75) 80px,#000 120px,#000 calc(100% - 140px),rgb(0 0 0/.7) calc(100% - 80px),rgb(0 0 0/.25) calc(100% - 30px),transparent 100%)!important;
 mask-image:linear-gradient(90deg,transparent 0,rgb(0 0 0/.15) 25px,rgb(0 0 0/.5) 60px,rgb(0 0 0/.85) 95px,#000 120px,#000 calc(100% - 120px),rgb(0 0 0/.85) calc(100% - 95px),rgb(0 0 0/.5) calc(100% - 60px),rgb(0 0 0/.15) calc(100% - 25px),transparent 100%),linear-gradient(180deg,transparent 0,rgb(0 0 0/.3) 30px,rgb(0 0 0/.75) 80px,#000 120px,#000 calc(100% - 140px),rgb(0 0 0/.7) calc(100% - 80px),rgb(0 0 0/.25) calc(100% - 30px),transparent 100%)!important}
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panes{padding:22px 84px 40px 60px!important}
html body #community-app#community-app .guide-layout .guide-panel{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}html body #community-app#community-app .dn-v2 :is(.dn-article-wrap,.dn-article,.newspaper-story){backdrop-filter:none!important;-webkit-backdrop-filter:none!important}

/* fades sit OUTSIDE the content: everything under text and images stays fully dark, the dissolve happens in the margin */
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel::before{inset:-60px -46px -60px -72px!important;right:-46px!important;-webkit-mask-image:linear-gradient(90deg,transparent 0,rgb(0 0 0/.35) 29px,rgb(0 0 0/.8) 54px,#000 72px,#000 calc(100% - 46px),rgb(0 0 0/.8) calc(100% - 34px),rgb(0 0 0/.35) calc(100% - 18px),transparent 100%),linear-gradient(180deg,transparent 0,rgb(0 0 0/.35) 24px,rgb(0 0 0/.8) 45px,#000 60px,#000 calc(100% - 60px),rgb(0 0 0/.8) calc(100% - 45px),rgb(0 0 0/.35) calc(100% - 24px),transparent 100%)!important;mask-image:linear-gradient(90deg,transparent 0,rgb(0 0 0/.35) 29px,rgb(0 0 0/.8) 54px,#000 72px,#000 calc(100% - 46px),rgb(0 0 0/.8) calc(100% - 34px),rgb(0 0 0/.35) calc(100% - 18px),transparent 100%),linear-gradient(180deg,transparent 0,rgb(0 0 0/.35) 24px,rgb(0 0 0/.8) 45px,#000 60px,#000 calc(100% - 60px),rgb(0 0 0/.8) calc(100% - 45px),rgb(0 0 0/.35) calc(100% - 24px),transparent 100%)!important;-webkit-mask-composite:source-in!important;mask-composite:intersect!important;}
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panes{padding:24px 26px 30px 8px!important}
html body #community-app .dn-v2 .dn-article-wrap::before{inset:-64px -34px!important;-webkit-mask-image:linear-gradient(90deg,transparent 0,rgb(0 0 0/.35) 26px,rgb(0 0 0/.8) 48px,#000 64px,#000 calc(100% - 64px),rgb(0 0 0/.8) calc(100% - 48px),rgb(0 0 0/.35) calc(100% - 26px),transparent 100%),linear-gradient(180deg,transparent 0,rgb(0 0 0/.35) 26px,rgb(0 0 0/.8) 48px,#000 64px,#000 calc(100% - 64px),rgb(0 0 0/.8) calc(100% - 48px),rgb(0 0 0/.35) calc(100% - 26px),transparent 100%)!important;mask-image:linear-gradient(90deg,transparent 0,rgb(0 0 0/.35) 26px,rgb(0 0 0/.8) 48px,#000 64px,#000 calc(100% - 64px),rgb(0 0 0/.8) calc(100% - 48px),rgb(0 0 0/.35) calc(100% - 26px),transparent 100%),linear-gradient(180deg,transparent 0,rgb(0 0 0/.35) 26px,rgb(0 0 0/.8) 48px,#000 64px,#000 calc(100% - 64px),rgb(0 0 0/.8) calc(100% - 48px),rgb(0 0 0/.35) calc(100% - 26px),transparent 100%)!important;-webkit-mask-composite:source-in!important;mask-composite:intersect!important;}
/* fade v3: solid panel whose edges dissolve through a very soft glow of the same colour (smooth falloff, content stays dark) */
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel::before,html body #community-app .dn-v2 .dn-article-wrap::before{-webkit-mask-image:none!important;mask-image:none!important;border-radius:28px!important;opacity:.88!important;background:var(--fade-panel)!important;box-shadow:0 0 70px 34px color-mix(in srgb,var(--fade-panel) 88%,transparent)!important}
html body #community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel::before{inset:-6px 0 -6px -18px!important;right:0!important}
html body #community-app .dn-v2 .dn-article-wrap::before{inset:-8px -6px!important}

/* ---- fade experiment retired: guidebook back to its bordered glass panel, event article back to the standard card box ---- */
html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel{border:2px solid rgb(var(--gb1))!important;border-radius:18px!important;overflow:hidden!important;padding:16px 6px 16px 0!important;background:transparent!important}
html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel::before{inset:0!important;right:0!important;border-radius:inherit!important;opacity:1!important;box-shadow:none!important;background:var(--gb-glass)!important;-webkit-backdrop-filter:blur(8px)!important;backdrop-filter:blur(8px)!important;-webkit-mask-image:none!important;mask-image:none!important}
html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panes{padding:26px 40px 26px 40px!important}
html body #community-app#community-app .dn-v2 .dn-article-wrap::before{content:none!important;display:none!important}
html body #community-app#community-app .dn-v2 .dn-article-wrap{padding:24px 28px 30px!important;border-radius:14px!important;border:1px solid #ffffff1a!important;background:#080b10e0!important;-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important;box-shadow:0 16px 40px rgb(0 0 0/.7)!important}
html body #community-app#community-app .dn-v2.is-article{padding-top:22px!important;padding-left:22px!important}
/* back to the front page: a round return-arrow badge pinned over the article's top-left corner, "Go back" on hover */
html body #community-app#community-app .dn-v2 .dn-back{position:absolute!important;top:-17px!important;left:-17px!important;z-index:3;width:36px;height:36px;padding:0!important;margin:0!important;display:grid!important;place-items:center;border-radius:50%;transform:none!important;background:#0b1018!important;border:1.5px solid var(--color-accent-default,#ffc45b)!important;color:var(--color-accent-default,#ffc45b)!important;box-shadow:0 6px 16px #000b;backdrop-filter:none!important;transition:background .15s ease,color .15s ease,transform .15s ease}
html body #community-app#community-app .dn-v2 .dn-back:hover,html body #community-app#community-app .dn-v2 .dn-back:focus-visible{background:var(--color-accent-default,#ffc45b)!important;color:#0b1018!important}
html body #community-app#community-app .dn-v2 .dn-back svg{transition:transform .2s ease}html body #community-app#community-app .dn-v2 .dn-back:hover svg{transform:rotate(-25deg)}
html body #community-app#community-app .dn-v2 .dn-back::after{content:attr(data-tip);position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%) translateX(-4px);white-space:nowrap;padding:5px 10px;border-radius:7px;background:#0b1018f2;border:1px solid #ffffff22;color:#e8e2d4;font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.1em;text-transform:uppercase;opacity:0;pointer-events:none;transition:opacity .15s ease,transform .15s ease}
html body #community-app#community-app .dn-v2 .dn-back:hover::after,html body #community-app#community-app .dn-v2 .dn-back:focus-visible::after{opacity:1;transform:translateY(-50%) translateX(0)}
/* the back badge sits exactly on the article box's top-left corner (absolute children of a grid otherwise anchor to their grid area) */
html body #community-app#community-app .dn-v2 .dn-article-wrap>.dn-back{grid-column:auto!important;grid-row:auto!important;top:-18px!important;left:-18px!important}
/* events front page gets the same container box as the article view */
html body #community-app#community-app .dn-paper.dn-v2:not(.is-article){padding-top:22px!important;padding-left:22px!important}
html body #community-app#community-app .dn-v2 .dn-front-wrap{position:relative;padding:26px 28px 30px!important;border-radius:14px!important;border:1px solid #ffffff1a!important;background:#080b10e0!important;-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important;box-shadow:0 16px 40px rgb(0 0 0/.7)!important}
@media(max-width:760px){html body #community-app#community-app .dn-v2 .dn-front-wrap{padding:22px 14px 20px!important}}
/* events front page search: a round badge on the box's top-left corner that opens into a search field along the top edge */
html body #community-app#community-app .dn-v2 .dn-search{position:absolute;top:-18px;left:-18px;z-index:3;display:flex;align-items:center;height:36px;border-radius:999px;background:#0b1018;border:1.5px solid var(--color-accent-default,#ffc45b);box-shadow:0 6px 16px #000b}
html body #community-app#community-app .dn-v2 .dn-search-btn{flex:none;width:33px;height:33px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:none;color:var(--color-accent-default,#ffc45b);cursor:pointer;position:relative;transition:background .15s ease,color .15s ease}
html body #community-app#community-app .dn-v2 .dn-search:not(.is-open) .dn-search-btn:hover{background:var(--color-accent-default,#ffc45b);color:#0b1018}
html body #community-app#community-app .dn-v2 .dn-search:not(.is-open) .dn-search-btn::after{content:attr(data-tip);position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%) translateX(-4px);white-space:nowrap;padding:5px 10px;border-radius:7px;background:#0b1018f2;border:1px solid #ffffff22;color:#e8e2d4;font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.1em;text-transform:uppercase;opacity:0;pointer-events:none;transition:opacity .15s ease,transform .15s ease}
html body #community-app#community-app .dn-v2 .dn-search:not(.is-open) .dn-search-btn:hover::after{opacity:1;transform:translateY(-50%)}
html body #community-app#community-app .dn-v2 .dn-search input{width:0;padding:0;border:0;outline:0;background:none;color:#eef1f4;font:500 14px/1 var(--font-control-ui,'Segoe UI'),sans-serif;transition:width .25s ease,padding .25s ease}
html body #community-app#community-app .dn-v2 .dn-search.is-open input{width:min(300px,60vw);padding:0 14px 0 2px}
html body #community-app#community-app .dn-v2 .dn-search input::placeholder{color:#8a94a0}
html body #community-app#community-app .dn-v2 .dn-search input::-webkit-search-cancel-button{filter:invert(.7) sepia(1) saturate(3) hue-rotate(5deg);cursor:pointer}
html body #community-app#community-app .dn-v2 .dn-results-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 16px;color:#aab4bf;font:500 14px/1.3 var(--font-control-ui,'Segoe UI'),sans-serif}
html body #community-app#community-app .dn-v2 .dn-results-head b{color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .dn-v2 .dn-results-head button{padding:6px 12px;border-radius:999px;border:1px solid #ffffff26;background:none;color:#dfe5ec;font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
html body #community-app#community-app .dn-v2 .dn-results-head button:hover{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .dn-v2 .dn-no-results{margin:30px 0;text-align:center;color:#8a94a0;font-size:15px}
html body #community-app#community-app .dn-v2 .dn-results>.dn-pager{margin-top:18px}
/* ---- even framing on every boxed view: gap under the header = gap beside the collapsed sidebar (32px) ---- */
@media(min-width:651px){
 html body #community-app#community-app:is(.open-layout,.world-open,[data-scene=guidebook]) #app-workspace#app-workspace{padding:32px 32px 24px!important}
 html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-body{padding:0 0 0 0!important}
 html body #community-app#community-app .dn-paper.dn-v2{padding-top:18px!important;padding-left:18px!important}
}
/* page gear + page action pills in the header bar */
html body #community-app#community-app .app-header #page-settings-toggle{position:relative!important;inset:auto!important;left:auto!important;top:auto!important;right:auto!important;width:34px!important;height:34px!important;flex:none;margin-right:8px;z-index:auto!important}
html body #community-app#community-app .app-header #page-settings-toggle svg{width:19px!important;height:19px!important}
html body #community-app#community-app .app-header #page-corner-actions{position:static!important;inset:auto!important;display:flex;align-items:center;gap:8px;margin-right:10px}
html body #community-app#community-app .app-header #page-corner-actions:empty{display:none}
/* guidebook fills the frame: viewport minus header (58) and the 32px top/bottom gaps */
@media(min-width:651px){html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-body{height:max(480px,calc(100dvh - 58px - 64px))!important}
 html body #community-app#community-app[data-scene=guidebook] #app-workspace#app-workspace{padding-bottom:32px!important}}
/* world terminal: same gap on top as on the left */
@media(min-width:651px){html body #community-app#community-app .world-terminal{margin:0!important}}
@media(min-width:651px){html body #community-app#community-app.world-open #app-view#app-view{padding-top:22px!important}}
html body #community-app#community-app .app-header #page-corner-actions>*{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 13px;border-radius:999px;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 40%,#ffffff1a);background:#0b1018;color:#e8e2d4!important;font:700 11.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.06em;text-transform:uppercase;text-decoration:none!important;white-space:nowrap;box-shadow:none;position:static!important;transform:none!important}
html body #community-app#community-app .app-header #page-corner-actions>*:hover{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b)!important}
@media(max-width:900px){html body #community-app#community-app .app-header #page-corner-actions>*{padding:0 10px;font-size:10.5px}}
html body #community-app#community-app .app-header #page-corner-actions{align-self:center!important;height:34px;margin-top:0!important;margin-bottom:0!important;padding:0!important}
html body #community-app#community-app .app-header #page-corner-actions>*{margin:0!important;align-self:center!important}
html body #community-app#community-app .app-header #page-corner-actions{transform:none!important;translate:none!important}
/* header breadcrumbs never wrap; on tighter screens they shorten with an ellipsis */
html body #community-app#community-app .header-forum-trail{min-width:0;overflow:hidden}
html body #community-app#community-app .header-forum-trail a{white-space:nowrap}
/* character cards: the Draft / Pending / Changes badge sits first in the pill row, same size as the other pills */
html body #community-app .cast-directory .cast-tags .cast-status-tag{margin:0!important;align-self:center;justify-self:auto;padding:4px 8px;font:800 10px/1 Consolas,monospace;letter-spacing:1px;border-radius:4px}
/* shared corner search badge (same look as the events search) */
html body #community-app#community-app .corner-search{position:absolute;top:-18px;left:-18px;z-index:3;display:flex;align-items:center;height:36px;border-radius:999px;background:#0b1018;border:1.5px solid var(--color-accent-default,#ffc45b);box-shadow:0 6px 16px #000b}
html body #community-app#community-app .corner-search-btn{flex:none;width:33px;height:33px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:none;color:var(--color-accent-default,#ffc45b);cursor:pointer;position:relative;transition:background .15s ease,color .15s ease}
html body #community-app#community-app .corner-search:not(.is-open) .corner-search-btn:hover{background:var(--color-accent-default,#ffc45b);color:#0b1018}
html body #community-app#community-app .corner-search:not(.is-open) .corner-search-btn::after{content:attr(data-tip);position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%) translateX(-4px);white-space:nowrap;padding:5px 10px;border-radius:7px;background:#0b1018f2;border:1px solid #ffffff22;color:#e8e2d4;font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.1em;text-transform:uppercase;opacity:0;pointer-events:none;transition:opacity .15s ease,transform .15s ease}
html body #community-app#community-app .corner-search:not(.is-open) .corner-search-btn:hover::after{opacity:1;transform:translateY(-50%)}
html body #community-app#community-app .corner-search input{width:0;padding:0;border:0;outline:0;background:none;color:#eef1f4;font:500 14px/1 var(--font-control-ui,'Segoe UI'),sans-serif;transition:width .25s ease,padding .25s ease}
html body #community-app#community-app .corner-search.is-open input{width:min(300px,60vw);padding:0 14px 0 2px}
html body #community-app#community-app .corner-search input::placeholder{color:#8a94a0}
html body #community-app#community-app .corner-search input::-webkit-search-cancel-button{filter:invert(.7) sepia(1) saturate(3) hue-rotate(5deg);cursor:pointer}
/* OOC member directory: boxed like events, no header or divider */
html body #community-app#community-app .ooc-directory.ooc-boxed{position:relative;box-sizing:border-box;margin:22px 0 22px 22px!important;padding:34px 28px 30px!important;max-width:none;border-radius:14px;border:1px solid #ffffff1a;background:#080b10e0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 16px 40px rgb(0 0 0/.7)}
html body #community-app#community-app .ooc-directory.ooc-boxed .ooc-count{margin:-10px 0 18px;color:#aab4bf;font:500 14px/1.3 var(--font-control-ui,'Segoe UI'),sans-serif}
html body #community-app#community-app .ooc-directory.ooc-boxed .ooc-count b{color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .ooc-directory.ooc-boxed .ooc-member-list{margin-top:0!important}
/* characters: filter panel lines up with the top of the card grid and keeps the same gap on its left */
@media(min-width:651px){html body #community-app#community-app .cast-sidebar{margin-top:14px!important;margin-left:14px!important}}
html body #community-app#community-app .ooc-directory.ooc-boxed .ooc-count{text-transform:none!important;letter-spacing:normal!important;margin:-8px 0 16px!important}
/* ---- one frame for every main page: the main box sits 22px inside the page area on all sides (54px from header and sidebar),
        leaving room for corner buttons like Search and Go back ---- */
@media(min-width:651px){
 html body #community-app#community-app:not([data-scene=welcome]):not([data-scene=index]) #app-frame #app-view#app-view{padding:22px!important;box-sizing:border-box}
 html body #community-app#community-app .dn-paper.dn-v2,html body #community-app#community-app .dn-paper.dn-v2:not(.is-article),html body #community-app#community-app .dn-v2.is-article{padding:0!important;overflow:visible!important}
 html body #community-app#community-app .ooc-directory.ooc-boxed{margin:0!important}
 html body #community-app#community-app .cast-sidebar{margin-top:0!important;margin-left:0!important}
}
@media(min-width:651px){html body #community-app#community-app:is(.open-layout,.world-open,[data-scene=guidebook]) #app-workspace#app-workspace{padding-right:22px!important}}
/* shared corner "go back" badge */
html body #community-app#community-app .corner-back{position:absolute!important;top:-18px!important;left:-18px!important;z-index:3;width:36px;height:36px;padding:0!important;margin:0!important;display:grid!important;place-items:center;border-radius:50%;transform:none!important;background:#0b1018!important;border:1.5px solid var(--color-accent-default,#ffc45b)!important;color:var(--color-accent-default,#ffc45b)!important;box-shadow:0 6px 16px #000b;text-decoration:none!important;transition:background .15s ease,color .15s ease}
html body #community-app#community-app .corner-back:hover,html body #community-app#community-app .corner-back:focus-visible{background:var(--color-accent-default,#ffc45b)!important;color:#0b1018!important}
html body #community-app#community-app .corner-back svg{transition:transform .2s ease}html body #community-app#community-app .corner-back:hover svg{transform:rotate(-25deg)}
html body #community-app#community-app .corner-back::after{content:attr(data-tip);position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%) translateX(-4px);white-space:nowrap;padding:5px 10px;border-radius:7px;background:#0b1018f2;border:1px solid #ffffff22;color:#e8e2d4;font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.1em;text-transform:uppercase;opacity:0;pointer-events:none;transition:opacity .15s ease,transform .15s ease}
html body #community-app#community-app .corner-back:hover::after,html body #community-app#community-app .corner-back:focus-visible::after{opacity:1;transform:translateY(-50%)}
/* OOC member space: one box like the directory */
html body #community-app#community-app .ooc-space.ooc-boxed{position:relative;box-sizing:border-box;margin:0!important;padding:30px 28px 30px!important;max-width:none!important;border-radius:14px;border:1px solid #ffffff1a;background:#080b10e0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 16px 40px rgb(0 0 0/.7)}
html body #community-app#community-app .ooc-space.ooc-boxed>.ooc-space-head{margin:0 0 22px!important;padding:0 0 20px!important;border:0!important;border-bottom:1px solid #ffffff14!important;border-radius:0!important;background:none!important;box-shadow:none!important;backdrop-filter:none!important}
/* page subtitles are parked for now (to be rewritten and re-placed per page later) */
html body #community-app#community-app .app-heading>div>.app-muted{display:none!important}
html body #community-app#community-app .app-heading:not(:has(>:not(div))):not(:has(>div>:not(h1):not(.app-muted))){display:none!important}
html body #community-app#community-app .ooc-space.ooc-boxed>.ooc-space-head{display:flex!important;align-items:center;gap:16px}
html body #community-app#community-app .ooc-space.ooc-boxed>.ooc-space-head>.ooc-avatar{position:static!important;transform:none!important;flex:none}
html body #community-app#community-app .ooc-space.ooc-boxed>.ooc-space-head>.ooc-space-actions{margin-left:auto}
/* Watching / Bookmarks style lists fill the frame like the other boxes */
html body #community-app#community-app .watching-list{width:auto!important;max-width:none!important;margin:0!important}
html body #community-app#community-app .watching-list .forum-thread-cards>p:only-child{margin:0;padding:6px 8px;color:#c7ced6}
/* ==== STANDARD PAGE LAYOUTS (docs/PAGE-LAYOUTS.md) ====
   --page-gap : distance from the header to every page's main box, from the sidebar to a left/full box,
                and from the window's right edge to a right/full box. 32px workspace padding + 22px view padding
                (the 22px leaves room for corner buttons like Search / Go back).
   --page-max : widest a left- or right-anchored box gets before it stops growing. */
:root{--page-gap:54px;--page-max:1800px}
@media(min-width:651px){
 html body #community-app#community-app[data-layout=left]:not([data-scene=index]):not([data-scene=welcome]) #app-frame #app-view#app-view{padding-right:max(22px,calc(100% - 22px - var(--page-max)))!important}
 html body #community-app#community-app[data-layout=right]:not([data-scene=index]):not([data-scene=welcome]) #app-frame #app-view#app-view{padding-left:max(22px,calc(100% - 22px - var(--page-max)))!important}
 /* Main Index has no box: its title block and tiles start on the same top line and left edge as every other page */
 html body #community-app#community-app:is([data-scene=index],[data-scene=welcome]) #app-view#app-view>.forum-main-index>.index-hero.index-hero{padding-top:calc(58px + var(--page-gap))!important;padding-left:var(--page-gap)!important}
 html body #community-app#community-app:is([data-scene=index],[data-scene=welcome]) #app-view#app-view>.forum-main-index>.ix-tiles.ix-tiles.ix-tiles{margin-left:var(--page-gap)!important}
}
/* sidebar: World regions under Bookmarks */
#community-app #sidebar-links>.sidebar-world{display:flex;flex-direction:column;gap:5px;margin-top:9px;padding-top:10px;border-top:1px solid rgb(53,68,91)}
#community-app #sidebar-links .sidebar-region .sidebar-region-chev{margin-left:auto;display:grid;place-items:center;font-style:normal;opacity:.6;transition:transform .2s ease}
#community-app #sidebar-links .sidebar-region.is-open .sidebar-region-chev{transform:rotate(90deg);opacity:1}
#community-app.sidebar-collapsed #sidebar-links .sidebar-region .sidebar-region-chev,#community-app.sidebar-collapsed #sidebar-links .sidebar-sublist{display:none!important}
#community-app #sidebar-links .sidebar-sublist{display:flex;flex-direction:column;gap:2px;margin:0 0 4px 20px;padding-left:12px;border-left:1px solid rgb(53,68,91)}
#community-app #sidebar-links .sidebar-sublist[hidden]{display:none}
#community-app #sidebar-links .sidebar-sublist .sidebar-subloc{min-height:32px!important;height:auto!important;padding:6px 10px!important;font-size:13.5px!important;font-weight:600;color:#c3cad4}
#community-app #sidebar-links .sidebar-sublist .sidebar-subloc:hover{color:#fff}
#community-app #sidebar-links .sidebar-sublist .sidebar-subloc.is-here{color:var(--color-accent-default,#ffc45b)}
#community-app #sidebar-links .sidebar-subloc span{display:inline!important}
#community-app #sidebar-links>.sidebar-world{order:9999}
/* ==== STANDARD PAGER (docs/PAGE-LAYOUTS.md) — the World's ← PAGE n / m → control, used everywhere.
   Left layouts: left edge of the box. Right layouts: right edge. Full-page layouts: centred. ==== */
html body #community-app#community-app .std-pager{display:flex!important;align-items:center;gap:8px;width:100%!important;box-sizing:border-box;margin:16px 0 0!important;padding:0!important;border:0!important;background:none!important;justify-content:center}
html body #community-app#community-app[data-layout=left] .std-pager{justify-content:flex-start}
html body #community-app#community-app[data-layout=right] .std-pager{justify-content:flex-end}
html body #community-app#community-app[data-layout=full] .std-pager{justify-content:center}
html body #community-app#community-app .std-pager>button{display:grid!important;place-items:center;width:32px!important;min-width:0!important;height:30px!important;margin:0!important;padding:0!important;border:1px solid rgb(216,162,92)!important;border-radius:7px!important;background:rgb(73,53,31)!important;color:rgb(255,230,188)!important;font:700 19px/1 sans-serif!important;box-shadow:0 3px 9px #0005!important;cursor:pointer;transition:background .15s ease,transform .15s ease}
html body #community-app#community-app .std-pager>button:not(:disabled):hover{background:rgb(98,70,38)!important;transform:translateY(-1px)}
html body #community-app#community-app .std-pager>button:disabled{opacity:.35;cursor:default}
html body #community-app#community-app .std-pager>span{display:block;margin:0!important;padding:5px 10px!important;border:1px solid rgb(155,117,71)!important;border-radius:5px!important;background:rgba(33,27,22,.85)!important;color:rgb(255,224,173)!important;font:700 12px/16.8px Consolas,monospace!important;letter-spacing:normal!important;text-transform:none!important}
/* guidebook fills exactly the space between the top line and the matching bottom gap (header + 2 x page gap) */
@media(min-width:651px){html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-body{height:max(480px,calc(100dvh - 58px - 2 * var(--page-gap)))!important}}
/* World location pages: roomier inside the location box */
@media(min-width:651px){
 html body #community-app#community-app[data-scene=world] .location-content-panel>.thread-grid-pagination{padding:26px 30px 28px!important}
 html body #community-app#community-app[data-scene=world] .location-content-panel .forum-thread-cards{padding-top:22px!important;gap:18px 20px!important}
 html body #community-app#community-app[data-scene=world] .location-content-panel .location-side-directory{padding:14px 18px 16px!important}
 html body #community-app#community-app[data-scene=world] .location-content-panel .thread-card-main{padding:14px 16px!important}
 html body #community-app#community-app[data-scene=world] .location-content-panel .thread-card-footer{padding:6px 14px!important}
}
/* World location box: the list's dark fill now runs under its border (the map was showing through the edge as a light
   blue line), and the header's divider is the same quiet line used everywhere else, so header + box read as one panel */
html body #community-app#community-app[data-scene=world] .location-content-panel>.thread-grid-pagination::before{inset:-1px!important;border-radius:inherit}
html body #community-app#community-app[data-scene=world] .dispatch-navigation::after{background:#ffffff14!important;height:1px!important}

/* ---- World thread view opens INSIDE the location box: same header bar (location name), same content box ---- */
instead of a full-width strip. */
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation{
 width:calc(100% - 38px)!important;max-width:1082px!important;margin:0 12px 14px auto!important;box-sizing:border-box;
 min-height:0!important;padding:8px 12px!important;border:1px solid rgb(255 255 255 / .094)!important;border-radius:10px!important;
 background:rgb(8 10 11 / .937)!important;box-shadow:none!important;justify-content:flex-end;
}
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation .dispatch-actions{margin:0 0 0 auto;align-items:center;gap:8px}
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation .dispatch-actions>*{height:32px;box-sizing:border-box;display:inline-flex;align-items:center}
with a little padding all round. */
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation{border-radius:12px 12px 0 0!important;margin-bottom:0!important;border-bottom-color:rgb(255 255 255 / .06)!important;background:rgb(8 10 11 / .82)!important;padding:10px 16px!important}
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation::before{content:"POSTING OPTIONS";margin-right:auto;font:700 13px/1 'Segoe UI',sans-serif;letter-spacing:2px;color:#d9c7a3}
fading out toward both ends. */
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--theme-cyan,#9fbce4) 75%,#fff) 50%,transparent);opacity:.55}
so it
   scales with the container). */
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation{
 background:linear-gradient(180deg,rgb(7 9 12 / .80),color-mix(in srgb,var(--theme-cyan,#9fbce4) 8%,rgb(7 9 12 / .80)))!important;
 border:1px solid color-mix(in srgb,var(--theme-cyan,#9fbce4) 35%,transparent)!important;border-bottom:0!important;container-type:inline-size;
}
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation::before{color:color-mix(in srgb,var(--theme-cyan,#9fbce4) 75%,#fff)}
in the theme accent and the DISPATCH brand face. */
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation::before{content:attr(data-location-title);font:800 18px/1 Consolas,monospace;letter-spacing:3px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45%}
no light band. */
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation{background:linear-gradient(180deg,color-mix(in srgb,var(--theme-cyan,#9fbce4) 18%,rgb(7 9 12 / .82)),color-mix(in srgb,var(--theme-cyan,#9fbce4) 15%,rgb(7 9 12 / .82)))!important}
then the locations strip and page controls follow. */
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation{
 background:rgb(24 29 32 / .80)!important;border-color:rgb(255 255 255 / .10)!important;
 animation:posting-panel-in 380ms ease-out both;
}
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation{max-width:1650px!important}
/* ---- Thread panel refinements ---- */
/* Headers (location title bar and thread title bar) are darker / more solid so they stand
   out from the page; the panel body starts at the same tone and deepens toward the bottom. */
#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation{background:rgb(13 16 19 / .93)!important}
html body #community-app#community-app[data-scene=world] #app-frame #app-view.hz-thread>.dispatch-navigation{display:flex!important}
html body #community-app#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation>ol{display:none!important}
/* thread view uses the same box as the location's thread list (which keeps its own natural width, so wide screens still get 3 columns) */
html body #community-app#community-app[data-scene=world] #app-view.hz-thread>:is(.thread-view-heading,.thread-panel-backdrop,.thread-reading-area){width:min(calc(100% - 320px),1650px)!important;max-width:none!important;margin-left:auto!important;margin-right:12px!important;justify-self:end}
html body #community-app#community-app[data-scene=world] #app-view.hz-thread>.thread-view-heading{border-radius:0!important;border-top:0!important}
/* thread view header bar: same size and position as the location's */
html body #community-app#community-app[data-scene=world] #app-frame #app-view.hz-thread>.dispatch-navigation{margin:0 12px 0 26px!important;min-height:53px;box-sizing:border-box;width:auto!important;max-width:none!important}
html body #community-app#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation::before{content:attr(data-location-title)!important;font:800 18px/1 Consolas,monospace!important;letter-spacing:3px!important;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45%;margin-right:auto}
html body #community-app#community-app[data-scene=world] #app-view.hz-thread>.dispatch-navigation{padding-left:16px!important;align-items:center}
/* thread cards: border takes the card's own character colour (it was one flat teal on every card) */
html body #community-app#community-app .dispatch-thread-card{border-color:color-mix(in srgb,var(--thread-accent,#ffc45b) 42%,#0000)!important}
html body #community-app#community-app .dispatch-thread-card:hover{border-color:color-mix(in srgb,var(--thread-accent,#ffc45b) 70%,#0000)!important}
/* thread cards: unread cards no longer get a cyan outline ring (the NEW tag already marks them); every card uses its own colour */
html body #community-app#community-app .dispatch-thread-card.thread-unread{box-shadow:0 14px 34px #000d,0 4px 10px #000b!important}
/* the card doesn't clip its contents (the bookmark pin sits on its corner), so the footer rounds its own bottom corners */
html body #community-app#community-app .dispatch-thread-card>.thread-card-footer{border-radius:0 0 9px 9px!important}
html body #community-app#community-app .dispatch-thread-card>.thread-card-main{border-top-left-radius:9px}
/* thread view: no location header bar; the thread's own title bar is the top of the box (same top line) */
html body #community-app#community-app[data-scene=world] #app-frame #app-view.hz-thread>.dispatch-navigation{display:none!important}
html body #community-app#community-app[data-scene=world] #app-view.hz-thread>.thread-view-heading{border-radius:12px 12px 0 0!important;border-top:1px solid rgb(255 255 255/.10)!important}
/* the post view's scrollbar uses the theme accent, not the opening poster's colour */
html body #community-app#community-app .thread-reading-area{scrollbar-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,#3a3f41) transparent!important}
html body #community-app#community-app .thread-reading-area::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,#3a3f41)!important;background-clip:padding-box!important}
/* ---- World uses the RIGHT layout: the location box / thread box fill the right-anchored frame
        (same width a left-layout page gets, mirrored), instead of the old narrow box beside an empty strip ---- */
@media(min-width:651px){
 html body #community-app#community-app[data-layout=right][data-scene=world] #app-view>.dispatch-navigation{margin:0!important;width:auto!important;max-width:none!important}
 html body #community-app#community-app[data-layout=right][data-scene=world] #app-view .location-content-panel>.thread-grid-pagination{width:auto!important;max-width:none!important;margin:0!important}
 html body #community-app#community-app[data-layout=right][data-scene=world] #app-view.hz-thread>:is(.thread-view-heading,.thread-panel-backdrop,.thread-reading-area){width:auto!important;max-width:none!important;margin:0!important;justify-self:stretch}
}
/* World back/forward buttons stay on the box's top-left corner when the right layout pushes the box right */
@media(min-width:651px){html body #community-app#community-app.world-open[data-layout=right] #app-frame>.app-history-controls{left:calc(max(22px,100% - 22px - var(--page-max)) - 22px)!important}}
/* ---- post layout: text starts at the left with even padding (no floating centred column); posted / edited times are a
        footer in the post's bottom-right corner; Quote / Edit stay small in the top-right ---- */
html body #community-app#community-app .thread-reading-area .forum-post>.post-body{display:flex!important;flex-direction:column!important;min-width:0;padding:44px 34px 14px!important;box-sizing:border-box}
html body #community-app#community-app .thread-reading-area .forum-post>.post-body>.forum-rich{max-width:none!important;margin:0!important;flex:1 1 auto!important;text-align:left;font-size:16px;line-height:1.75}
html body #community-app#community-app .thread-reading-area .forum-post>.post-body>.forum-rich p{margin:0 0 1.05em}
html body #community-app#community-app .thread-reading-area .forum-post>.post-body>.forum-rich>:last-child{margin-bottom:0}
html body #community-app#community-app .thread-reading-area .forum-post>.post-body>.post-controls{top:10px!important;right:12px!important}
html body #community-app#community-app .forum-post .post-body>.post-time-footer{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin:22px 0 0;padding-top:10px;border-top:1px solid #ffffff12;color:#8d97a3;font:600 11.5px/1.3 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.04em}

/* ---- long posts: the author panel's portrait + name stay pinned while you read (desktop) ---- */
html body #community-app#community-app .thread-reading-area .forum-post,html body #community-app#community-app .thread-reading-area .forum-post>.post-author{overflow:clip!important}
@media(min-width:1200px){
 html body #community-app#community-app .thread-reading-area .forum-post>.post-author{display:block!important}
 html body #community-app#community-app .thread-reading-area .forum-post>.post-author>.post-author-pin{position:sticky;top:14px;display:flex;flex-direction:column;gap:10px}
 html body #community-app#community-app .thread-reading-area .forum-post>.post-author .post-portrait-reveal{position:relative!important;top:auto!important}
}
@media(max-width:1199px){html body #community-app#community-app .post-author-pin{display:contents}}
/* posting view: breathing room under the title bar and at the bottom of the list */
html body #community-app#community-app .thread-reading-area{padding-top:24px!important;padding-bottom:36px!important;box-sizing:border-box}
html body #community-app#community-app[data-scene=world] #app-view.hz-thread>.thread-view-heading{padding-bottom:18px!important}
html body #community-app#community-app[data-scene=world] #app-view#app-view>.thread-reading-area{padding-top:20px!important}
html body #community-app#community-app .thread-reading-area>.forum-post:first-child{margin-top:0!important}
/* back / forward always sit above the page box */
html body #community-app#community-app #app-frame>.app-history-controls{z-index:60!important}
/* pager docked in a box's title bar, in line with its other buttons */
html body #community-app#community-app .std-pager.std-pager-docked{width:auto!important;margin:0 6px 0 0!important;gap:6px;flex:none}
html body #community-app#community-app .std-pager.std-pager-docked>button{height:32px!important;width:32px!important;font-size:17px!important;box-shadow:none!important}
html body #community-app#community-app .std-pager.std-pager-docked>span{padding:7px 10px!important;line-height:16px!important}
/* pager parts are exact 32px boxes with their contents centred (arrow icons instead of font glyphs, which sit off-centre in some fonts) */
html body #community-app#community-app .std-pager>button,html body #community-app#community-app .std-pager>span{box-sizing:border-box!important;height:32px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;line-height:1!important;vertical-align:middle}
html body #community-app#community-app .std-pager>span{padding:0 11px!important}
html body #community-app#community-app .std-pager>button svg{display:block}
html body #community-app#community-app .dispatch-navigation .dispatch-actions>:is(button,a,details>summary){box-sizing:border-box;height:32px;display:inline-flex;align-items:center}
/* thread title bar: the post pager lines up with the watch / edit / back buttons */
html body #community-app#community-app .thread-post-pager.in-heading{display:flex!important;align-items:center;align-self:center;margin:0!important;padding:0!important}
html body #community-app#community-app .thread-post-pager.in-heading .std-pager{margin:0!important;width:auto!important}
html body #community-app#community-app .thread-post-pager.in-heading .std-pager>*{height:34px!important}
html body #community-app#community-app .thread-post-pager.in-heading .std-pager>button{width:34px!important}

/* ---- back / forward in the title bar (World locations and posts) ---- */
html body #community-app#community-app .app-history-controls.in-bar{position:static!important;inset:auto!important;display:flex!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;order:-1;margin:0 14px 0 0!important;gap:6px!important;flex:none;z-index:auto!important;transition:none!important}
html body #community-app#community-app .app-history-controls.in-bar .app-back-control{width:34px!important;height:34px!important;padding:0!important;display:grid!important;place-items:center;border-radius:999px!important;border:1px solid color-mix(in srgb,#9fbce4 52%,transparent)!important;background:rgb(37 43 49)!important;color:rgb(240 236 226)!important;font:700 16px/1 sans-serif!important;box-shadow:none!important}
html body #community-app#community-app .app-history-controls.in-bar .app-back-control:is(:hover,:focus-visible):not(:disabled){border-color:var(--color-accent-default,#ffc45b)!important;color:var(--color-accent-default,#ffc45b)!important;background:rgb(45 40 30)!important}
html body #community-app#community-app .app-history-controls.in-bar .app-back-control:disabled{display:none!important}
html body #community-app#community-app[data-scene=world] #app-view>.dispatch-navigation::before{order:0}
html body #community-app#community-app[data-scene=world] #app-view>.dispatch-navigation{padding-left:16px!important}
html body #community-app#community-app[data-scene=world] #app-view>.dispatch-navigation>.dispatch-actions{order:1}
/* the post title bar's own ↶ back button is now the ← on the left */
html body #community-app#community-app .thread-view-heading .thread-go-back{display:none!important}
html body #community-app#community-app .thread-view-heading:has(>.app-history-controls.in-bar){justify-content:flex-start!important}
html body #community-app#community-app .thread-view-heading>.app-history-controls.in-bar~:last-child{margin-left:auto!important}
html body #community-app#community-app #app-view.morph-pending>*{opacity:0!important}
/* ==== STANDARD BOX TITLE BAR (docs/PAGE-LAYOUTS.md): ‹ ›  TITLE ……… search · pager · actions ==== */
html body #community-app#community-app .box-bar{display:flex;align-items:center;gap:10px;box-sizing:border-box;min-height:48px;padding:7px 16px;border-bottom:1px solid #ffffff14;background:rgb(8 10 11/.55)}
html body #community-app#community-app .box-bar>.app-history-controls.in-bar{margin-right:6px!important}
html body #community-app#community-app .box-bar .app-history-controls.in-bar .app-back-control{width:30px!important;height:30px!important;font-size:14px!important}
html body #community-app#community-app .box-bar-title{margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:800 16px/1 Consolas,monospace;letter-spacing:3px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .box-bar-tools{display:flex;align-items:center;gap:8px;margin-left:auto;flex:none}
html body #community-app#community-app .box-bar-tools>:is(button,a):not(.std-pager *){box-sizing:border-box;height:30px;display:inline-flex;align-items:center;padding:0 12px;border-radius:7px;font-size:13px}
html body #community-app#community-app .box-bar .std-pager.std-pager-docked>*{height:30px!important}
html body #community-app#community-app .box-bar .std-pager.std-pager-docked>button{width:30px!important}
/* search in the bar: same round badge, opening leftward into a field */
html body #community-app#community-app .box-bar :is(.corner-search,.dn-search).in-bar{position:static!important;inset:auto!important;height:30px!important;box-shadow:none!important;flex-direction:row-reverse}
html body #community-app#community-app .box-bar :is(.corner-search-btn,.dn-search-btn){width:28px!important;height:28px!important}
html body #community-app#community-app .box-bar :is(.corner-search,.dn-search).in-bar.is-open input{padding:0 2px 0 14px!important}
html body #community-app#community-app .box-bar :is(.corner-search,.dn-search).in-bar :is(.corner-search-btn,.dn-search-btn)::after{left:auto!important;right:calc(100% + 10px)!important}
/* boxes that carry the bar: the bar runs edge to edge across their top */
html body #community-app#community-app :is(.dn-front-wrap,.dn-article-wrap,.ooc-boxed){padding-top:0!important;overflow:hidden}
html body #community-app#community-app :is(.dn-front-wrap,.dn-article-wrap,.ooc-boxed)>.box-bar{margin:0 -28px 22px!important}
html body #community-app#community-app .dn-article-wrap>.box-bar{grid-column:1/-1}
html body #community-app#community-app .guide-layout .guide-panel>.box-bar{margin:-16px -6px 0 0!important;flex:none;position:relative;z-index:2;border-radius:16px 16px 0 0}
/* the standard box for pages that didn't have one */
html body #community-app#community-app .std-box{box-sizing:border-box;border-radius:14px;border:1px solid #ffffff1a;background:#080b10e0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 16px 40px rgb(0 0 0/.7);overflow:hidden}
html body #community-app#community-app .std-box>.std-box-body{padding:22px 26px 26px}
html body #community-app#community-app .std-box>.std-box-body>*:first-child{margin-top:0!important}
/* no more corner badges for search / back when a bar exists */
html body #community-app#community-app .box-bar~.corner-back,html body #community-app#community-app .box-bar~.dn-back{display:none!important}
html body #community-app#community-app#community-app .dn-v2 :is(.dn-front-wrap,.dn-article-wrap),html body #community-app#community-app#community-app :is(.ooc-directory,.ooc-space).ooc-boxed{padding-top:0!important}
html body #community-app#community-app#community-app .dn-v2 .dn-article-wrap>.box-bar{grid-row:1!important}
html body #community-app#community-app#community-app .dn-v2 .dn-article-wrap>:not(.box-bar){grid-row:2!important}
html body #community-app#community-app .ooc-space.ooc-boxed .ooc-space-title h2{display:none}
/* characters inside the standard box: the directory fills the box below its bar (header + gaps + bar + body padding) */
@media(min-width:651px){html body #community-app#community-app .std-box .cast-directory{height:calc(100dvh - 58px - 2 * var(--page-gap) - 48px - 40px)!important;min-height:420px}
 html body #community-app#community-app .std-box>.std-box-body:has(>.cast-directory){padding:20px 20px 20px 22px}}
html body #community-app#community-app .box-bar{height:48px;min-height:0}
html body #community-app#community-app .box-bar-tools :is(button,a,label){max-height:30px;box-sizing:border-box}
html body #community-app#community-app .box-bar-tools>*{display:flex;align-items:center;gap:6px}
/* ==== STANDARD BUTTONS (docs/PAGE-LAYOUTS.md) ====
   One shape (8px corners), one height per context, one colour set:
   default = dark fill + faint border, hover = gold; primary (the page's main "+ …" / post action) = gold tint;
   selected toggles = gold fill. Icon-only buttons are the same shape, square. */
:root{--btn-radius:8px;--btn-bg:#161c22;--btn-border:#ffffff26;--btn-fg:#e6e1d6;--btn-acc:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app :is(
 .app-header .header-watching,.app-header #notify-bell,.app-header #page-settings-toggle,.app-header .corner-pill,
 .app-history-controls.in-bar .app-back-control,
 .dispatch-actions>button,.dispatch-actions>a,.box-bar-tools button:not(.std-pager *):not(.corner-search-btn):not(.dn-search-btn),.box-bar-tools>a,
 .thread-heading-actions .thread-icon-button,.thread-manage>.thread-icon-button,
 .std-pager>button,.post-controls>button,.recycle-folder button,.dn-results-head button,
 #reply-form button[type=submit],.thread-reply-toggle>summary,.forum-composer .composer-templates>summary,.location-strip-arrow,
 .app-surface>button,.app-surface .app-actions>button
){border-radius:var(--btn-radius)!important;background:var(--btn-bg)!important;border:1px solid var(--btn-border)!important;color:var(--btn-fg)!important;box-shadow:none!important;text-shadow:none!important;transform:none;transition:border-color .15s ease,color .15s ease,background .15s ease!important}
html body #community-app#community-app :is(
 .app-header .header-watching,.app-header #notify-bell,.app-header #page-settings-toggle,.app-header .corner-pill,
 .app-history-controls.in-bar .app-back-control,.dispatch-actions>button,.dispatch-actions>a,.box-bar-tools button:not(.std-pager *),.box-bar-tools>a,
 .thread-heading-actions .thread-icon-button,.thread-manage>.thread-icon-button,.std-pager>button,.post-controls>button,.recycle-folder button,.dn-results-head button,
 #reply-form button[type=submit],.thread-reply-toggle>summary,.forum-composer .composer-templates>summary,.location-strip-arrow,.app-surface>button,.app-surface .app-actions>button
):is(:hover,:focus-visible):not(:disabled){border-color:var(--btn-acc)!important;color:var(--btn-acc)!important;background:color-mix(in srgb,var(--btn-acc) 10%,var(--btn-bg))!important}
html body #community-app#community-app :is(.std-pager>button,.app-history-controls .app-back-control):disabled{opacity:.35!important}
/* primary actions: gold tint */
html body #community-app#community-app :is(#new-thread,#empty-new-thread,.box-bar-tools>button:is([id*=new],[id*=add]),.corner-pill:not(.corner-pill-review),#reply-form button[type=submit],.thread-reply-toggle>summary){background:color-mix(in srgb,var(--btn-acc) 16%,var(--btn-bg))!important;border-color:color-mix(in srgb,var(--btn-acc) 60%,transparent)!important;color:#ffe3b0!important}
/* selected toggles (archive filters, etc.) */
html body #community-app#community-app .box-bar-tools :is(button[aria-pressed=true],button.is-active,button.active){background:var(--btn-acc)!important;border-color:var(--btn-acc)!important;color:#15110a!important}
/* sizes: 34px in the header and title bars of World/thread, 30px in slim box bars, 26px for small in-post buttons */
html body #community-app#community-app :is(.app-header .header-watching,.app-header #notify-bell,.app-header #page-settings-toggle){width:34px!important;height:34px!important}
html body #community-app#community-app .app-header .corner-pill{height:34px!important;padding:0 14px!important;font-size:11.5px!important}
html body #community-app#community-app .post-controls>button{height:26px!important;padding:0 10px!important;font-size:12px!important}
html body #community-app#community-app .box-bar-tools button:not(.std-pager *):not(.corner-search-btn):not(.dn-search-btn){height:30px!important;padding:0 12px!important;font-size:12.5px!important}
/* the pager counter is a label, not a button */
html body #community-app#community-app .std-pager>span{border-radius:var(--btn-radius)!important;background:transparent!important;border:1px solid var(--btn-border)!important;color:var(--btn-fg)!important}
/* search badges in bars: same shape */
html body #community-app#community-app .box-bar :is(.corner-search,.dn-search).in-bar{border-radius:var(--btn-radius)!important;border:1px solid var(--btn-border)!important;background:var(--btn-bg)!important}
html body #community-app#community-app .box-bar :is(.corner-search,.dn-search).in-bar.is-open{border-color:var(--btn-acc)!important}
html body #community-app#community-app .box-bar :is(.corner-search-btn,.dn-search-btn){border-radius:calc(var(--btn-radius) - 1px)!important;color:var(--btn-fg)!important}
html body #community-app#community-app .box-bar :is(.corner-search:not(.is-open) .corner-search-btn,.dn-search:not(.is-open) .dn-search-btn):hover{background:transparent!important;color:var(--btn-acc)!important}
html body #community-app#community-app#community-app#community-app :is(.box-bar-tools,.dispatch-actions) :is(button[aria-pressed=true],button.is-active,button.active){background:var(--btn-acc)!important;border-color:var(--btn-acc)!important;color:#15110a!important}
/* ---- posts made as yourself (staff, Discord name + avatar): same panel size, the round avatar sits on a
        backdrop made from the avatar's own colours, and the post is tinted to match ---- */
html body #community-app#community-app .forum-post.is-member-post .post-portrait-reveal{display:grid!important;place-items:center;background:radial-gradient(circle at 50% 38%,color-mix(in srgb,var(--character-color) 38%,transparent),transparent 62%),linear-gradient(160deg,color-mix(in srgb,var(--character-secondary) 70%,#0b0f14),#0b0f14)!important;border:1px solid color-mix(in srgb,var(--character-color) 35%,transparent)!important;border-radius:10px;overflow:hidden}
html body #community-app#community-app .forum-post.is-member-post .post-portrait-reveal>img{width:72%!important;height:auto!important;aspect-ratio:1/1!important;border-radius:50%!important;object-fit:cover!important;border:3px solid var(--character-color);box-shadow:0 0 0 6px color-mix(in srgb,var(--character-color) 18%,transparent),0 12px 30px #000a;margin:auto!important}
html body #community-app#community-app .forum-post.is-member-post .post-portrait-facts{display:none!important}
html body #community-app#community-app .forum-post.is-member-post .post-group-pill{background:color-mix(in srgb,var(--character-color) 22%,#0b0f14)!important;border:1px solid color-mix(in srgb,var(--character-color) 60%,transparent)!important;color:#fff!important}
html body #community-app#community-app .forum-post.is-member-post{border-color:color-mix(in srgb,var(--character-color) 45%,transparent)!important;background:linear-gradient(135deg,color-mix(in srgb,var(--character-secondary) 28%,#10141a),color-mix(in srgb,var(--character-color) 8%,#10141a))!important}
html body #community-app#community-app .post-as-option.is-member .post-as-portrait img{border-radius:50%}
/* quick reply */
html body #community-app#community-app .quick-reply{margin:22px 0 0;padding:14px 16px 12px;border-radius:12px;border:1px solid #ffffff1f;background:#0d1217e6}
html body #community-app#community-app .quick-reply-head{display:flex;align-items:center;gap:12px;margin-bottom:10px}
html body #community-app#community-app .quick-reply-label{font:800 12px/1 Consolas,monospace;letter-spacing:2.5px;text-transform:uppercase;color:var(--btn-acc)}
html body #community-app#community-app .quick-reply-as{margin-left:auto;display:flex;align-items:center;gap:8px;color:#9aa4ae;font-size:12.5px}
html body #community-app#community-app :is(.quick-reply-as,.post-edit-as) select{height:30px;padding:0 10px;border-radius:var(--btn-radius);border:1px solid var(--btn-border);background:var(--btn-bg);color:var(--btn-fg);font:600 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif}
html body #community-app#community-app .quick-reply textarea{width:100%;box-sizing:border-box;min-height:96px;resize:vertical;padding:12px 14px;border-radius:10px;border:1px solid #ffffff1f;background:#070a0d;color:#e9e4d8;font:400 15px/1.6 Georgia,'Times New Roman',serif}
html body #community-app#community-app .quick-reply textarea:focus{outline:none;border-color:color-mix(in srgb,var(--btn-acc) 60%,transparent)}
html body #community-app#community-app .quick-reply-actions{display:flex;align-items:center;gap:8px;margin-top:10px}
html body #community-app#community-app .quick-reply-error{margin-right:auto;color:#ff9c93;font-size:13px}
html body #community-app#community-app .quick-reply-actions>button{height:32px;padding:0 14px;border-radius:var(--btn-radius);border:1px solid var(--btn-border);background:var(--btn-bg);color:var(--btn-fg);font:600 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer}
html body #community-app#community-app .quick-reply-actions>button:hover{border-color:var(--btn-acc);color:var(--btn-acc)}
html body #community-app#community-app .quick-reply-actions>.quick-reply-post{background:color-mix(in srgb,var(--btn-acc) 16%,var(--btn-bg));border-color:color-mix(in srgb,var(--btn-acc) 60%,transparent);color:#ffe3b0}
/* with the quick reply showing, the full composer opens from its "Full editor" button instead of its own bar */
html body #community-app#community-app details.thread-reply-toggle.has-quick-reply:not([open]){display:none!important}
html body #community-app#community-app details.thread-reply-toggle.has-quick-reply>summary{display:none!important}
html body #community-app#community-app .post-edit-as{display:inline-flex;align-items:center;gap:8px;margin-right:10px;color:#9aa4ae;font-size:12.5px}
html body #community-app#community-app .forum-post.is-member-post .member-initials{width:72%;aspect-ratio:1/1;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--character-color) 30%,#0b0f14);border:3px solid var(--character-color);box-shadow:0 0 0 6px color-mix(in srgb,var(--character-color) 18%,transparent),0 12px 30px #000a;color:#fff;font:800 42px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:1px}
/* ---- character post portraits: a two-sided card ----
   front: picture + stat pentagon; hover dims it and shows a flip cursor; click flips (0.6s) to the dossier;
   the back links to the sheet; leaving turns it back after 1.5s */
@media(min-width:1200px){
html body #community-app#community-app .forum-post .post-portrait-reveal.post-flip-card{perspective:1100px;overflow:visible!important;background:transparent!important;cursor:pointer}
html body #community-app#community-app .post-flip-card.is-flipped{cursor:default}
html body #community-app#community-app .post-flip-inner{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.3,.7,.25,1)}
html body #community-app#community-app .post-flip-card.is-flipped .post-flip-inner{transform:rotateY(180deg)}
html body #community-app#community-app :is(.post-flip-front,.post-flip-back){position:absolute;inset:0;display:block;border-radius:5px;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden}
html body #community-app#community-app .post-flip-front{background:color-mix(in srgb,var(--character-secondary) 30%,#101719)}
html body #community-app#community-app .post-flip-front>img{width:100%!important;height:100%!important;object-fit:cover;object-position:center 20%;opacity:1!important;transition:filter .35s ease!important}
html body #community-app#community-app .post-flip-card:not(.is-flipped):is(:hover,:focus-visible) .post-flip-front>img{filter:brightness(.45) saturate(.8)}
html body #community-app#community-app .post-flip-card:not(.is-flipped):is(:hover,:focus-visible) .post-card-radar{opacity:1}
html body #community-app#community-app .post-card-radar{position:absolute;right:6px;bottom:6px;width:44%;max-width:118px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle,#0b0f1455 45%,#0b0f1400 68%);opacity:.6;transition:opacity .35s ease;pointer-events:none}
html body #community-app#community-app .post-card-radar .post-stat-radar{width:100%!important;height:100%!important;margin:0!important;transform:scale(1.28)}
html body #community-app#community-app .post-card-radar .post-radar-icon{display:none!important}
/* back: dossier */
html body #community-app#community-app .post-flip-back{transform:rotateY(180deg);display:flex;flex-direction:column;gap:9px;padding:14px 13px 10px;box-sizing:border-box;background:linear-gradient(170deg,color-mix(in srgb,var(--character-color) 18%,#0c1115),color-mix(in srgb,var(--character-secondary) 35%,#0a0e12));border:1px solid color-mix(in srgb,var(--character-color) 45%,transparent);color:#ece6da;text-align:left}
html body #community-app#community-app .dossier-head b{display:block;font:400 26px/1 'Bebas Neue','Arial Narrow',sans-serif;letter-spacing:.8px;text-transform:uppercase;color:var(--character-color)}
html body #community-app#community-app .dossier-head small{display:block;margin-top:2px;font:600 11px/1.2 'Segoe UI',sans-serif;color:#b9b3a6;letter-spacing:.4px}
html body #community-app#community-app .dossier-tags{display:flex;flex-wrap:wrap;gap:4px}
html body #community-app#community-app .dossier-tags i{font:700 9.5px/1 Consolas,monospace;font-style:normal;letter-spacing:.4px;text-transform:lowercase;padding:3px 6px;border-radius:4px;background:color-mix(in srgb,var(--character-color) 16%,transparent);border:1px solid color-mix(in srgb,var(--character-color) 35%,transparent)}
html body #community-app#community-app .dossier-rows{margin:0;display:flex;flex-direction:column;gap:7px;min-height:0;flex:1 1 auto;overflow:hidden;-webkit-mask-image:linear-gradient(#000 calc(100% - 22px),transparent);mask-image:linear-gradient(#000 calc(100% - 22px),transparent)}
html body #community-app#community-app .dossier-row{flex:none}
html body #community-app#community-app .dossier-row dt{font:800 9px/1 'Segoe UI',sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:var(--character-color);margin-bottom:3px}
html body #community-app#community-app .dossier-row dd{margin:0;font:500 11.5px/1.4 'Segoe UI',sans-serif;color:#e4ded2;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
html body #community-app#community-app .dossier-open{margin-top:0;flex:none;font:700 10.5px/1 'Segoe UI',sans-serif;color:var(--character-color);letter-spacing:.3px}
html body #community-app#community-app .dossier-player{display:flex;align-items:center;gap:8px;padding-top:9px;border-top:1px solid #ffffff1c}
html body #community-app#community-app .dossier-player-av{flex:none;width:30px;height:30px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#1a2230;border:1px solid #ffffff2a}
html body #community-app#community-app .dossier-player-av img{width:100%!important;height:100%!important;aspect-ratio:1/1!important;object-fit:cover;border-radius:50%!important}
html body #community-app#community-app .dossier-player-av b{font:800 11px/1 'Segoe UI',sans-serif;color:#cfd6de}
html body #community-app#community-app .dossier-player>span:last-child{display:flex;flex-direction:column;min-width:0}
html body #community-app#community-app .dossier-player small{font:800 8.5px/1 'Segoe UI',sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:#9aa3ad}
html body #community-app#community-app .dossier-player strong{font:700 12.5px/1.25 'Segoe UI',sans-serif;color:#f3eee4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app#community-app .dossier-player em{font:500 10.5px/1.2 'Segoe UI',sans-serif;font-style:normal;color:#8fa0b4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@media(max-width:1199px){html body #community-app#community-app :is(.post-flip-back,.post-card-radar){display:none!important}html body #community-app#community-app .post-flip-inner,html body #community-app#community-app .post-flip-front{display:contents}}
@media(prefers-reduced-motion:reduce){html body #community-app#community-app .post-flip-inner{transition:none}}

@media(min-width:1200px){
html body #community-app#community-app .dossier-quote{margin:2px 0 0;padding:8px 10px;border-left:2px solid var(--character-color);background:color-mix(in srgb,var(--character-color) 9%,transparent);border-radius:0 6px 6px 0;font:italic 500 12.5px/1.45 Georgia,'Times New Roman',serif;color:#f1ebdf;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;overflow:hidden;flex:none}
html body #community-app#community-app .dossier-id-btn{flex:none;display:flex;align-items:center;justify-content:center;gap:8px;height:32px;border-radius:var(--btn-radius,8px);border:1px solid color-mix(in srgb,var(--character-color) 60%,transparent);background:color-mix(in srgb,var(--character-color) 16%,#0b0f14);color:#fff;font:700 11.5px/1 'Segoe UI',sans-serif;letter-spacing:.4px;text-transform:uppercase;cursor:pointer;transition:background .15s ease,border-color .15s ease}
html body #community-app#community-app .dossier-id-btn:is(:hover,:focus-visible){background:color-mix(in srgb,var(--character-color) 30%,#0b0f14);border-color:var(--character-color);outline:none}
html body #community-app#community-app .dossier-id-btn svg{color:var(--character-color)}
}
/* every post's author column is the same width (224px), left or right, so every portrait is the same size (195 × 293, 2:3) */
@media(min-width:1200px){html body #community-app#community-app .thread-reading-area .forum-post.post-profile-right{grid-template-columns:minmax(0,1fr) 224px!important}}
/* pentagon sits closer to the corner (half its old gap) */
@media(min-width:1200px){html body #community-app#community-app .post-card-radar{right:-2px!important;bottom:-4px!important}}
html body #community-app#community-app .dossier-id-btn{white-space:nowrap;font-size:10.5px!important;letter-spacing:.2px!important}
/* card-back tags: bigger, all caps */
@media(min-width:1200px){html body #community-app#community-app .dossier-tags i{font:800 11px/1 'Segoe UI',sans-serif!important;text-transform:uppercase!important;letter-spacing:.8px!important;padding:4px 7px!important}}

.flip-tip{position:fixed;z-index:100002;pointer-events:none;padding:5px 10px;border-radius:7px;background:#0b1018f2;border:1px solid #ffffff22;color:#e8e2d4;font:700 11px/1 'Segoe UI',sans-serif;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;opacity:0;transform:translateY(3px);transition:opacity .25s ease,transform .25s ease}
.flip-tip.is-on{opacity:1;transform:none}
@media(min-width:1200px){html body #community-app#community-app .dossier-spacer{flex:1 1 auto}}
/* ---- thread title bar ---- */
html body #community-app#community-app #app-view>.thread-view-heading{position:relative;align-items:center!important;gap:16px!important;padding:18px 22px 16px 18px!important;background:linear-gradient(100deg,color-mix(in srgb,var(--thread-frame-accent,#ffc45b) 14%,#0d1115) 0%,#0d1115 55%)!important;border-bottom:0!important}
html body #community-app#community-app #app-view>.thread-view-heading::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,var(--thread-frame-accent,#ffc45b),color-mix(in srgb,var(--thread-frame-accent,#ffc45b) 20%,transparent) 60%,transparent)}
html body #community-app#community-app #app-view>.thread-view-heading>.app-history-controls.in-bar{align-self:flex-start;margin-top:4px!important}
html body #community-app#community-app .th-head-main{min-width:0;flex:1 1 auto;display:flex;flex-direction:column;gap:6px}
html body #community-app#community-app .th-kicker{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font:800 11px/1 Consolas,monospace;letter-spacing:2.2px;text-transform:uppercase}
html body #community-app#community-app .th-where{color:var(--thread-frame-accent,#ffc45b)}
html body #community-app#community-app .th-status{padding:4px 8px;border-radius:5px;letter-spacing:1.2px;color:#cfe9d6;background:#2e8a5a26;border:1px solid #4fbf8455}
html body #community-app#community-app .th-status.is-complete{color:#d9dde2;background:#ffffff12;border-color:#ffffff30}
html body #community-app#community-app .th-status.is-incomplete{color:#ffc2b8;background:#e0544a1f;border-color:#e0544a55}
html body #community-app#community-app .th-kicker .thread-tags{display:flex;gap:6px;margin:0}
html body #community-app#community-app .th-kicker .app-pill{height:auto;padding:4px 8px!important;border-radius:5px!important;font:800 11px/1 Consolas,monospace!important;letter-spacing:1.2px!important;background:color-mix(in srgb,var(--btn-acc,#ffc45b) 14%,transparent)!important;border:1px solid color-mix(in srgb,var(--btn-acc,#ffc45b) 45%,transparent)!important;color:#ffe3b0!important}
html body #community-app#community-app .th-head-main h1{margin:2px 0 0!important;font-family:var(--font-control-title,'Segoe UI'),sans-serif!important;font-weight:700!important;font-size:32px!important;line-height:1.05!important;letter-spacing:.02em!important;text-transform:uppercase;color:#f6f1e7!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app#community-app .th-sub{margin:0!important;font:italic 400 15px/1.35 Georgia,'Times New Roman',serif;color:#cfc8ba;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app#community-app .th-byline{display:flex;flex-wrap:wrap;gap:6px 0;margin-top:2px;font:500 12.5px/1.3 var(--font-control-ui,'Segoe UI'),sans-serif;color:#8f99a4}
html body #community-app#community-app .th-byline b{font-weight:700}
html body #community-app#community-app .th-byline .th-dot::before{content:'';display:inline-block;width:4px;height:4px;margin:0 10px 2px;border-radius:50%;background:#ffffff33;vertical-align:middle}
html body #community-app#community-app #app-view>.thread-view-heading>.thread-heading-actions{align-self:flex-start;margin-top:2px}

@media(min-width:1200px){html body #community-app#community-app .dossier-dm-btn{flex:none;display:flex;align-items:center;justify-content:center;gap:8px;height:30px;margin-top:-3px;border-radius:var(--btn-radius,8px);border:1px solid #ffffff2a;background:#0b0f14b0;color:#dfe3ea;font:700 10.5px/1 'Segoe UI',sans-serif;letter-spacing:.2px;text-transform:uppercase;white-space:nowrap;cursor:pointer;transition:border-color .15s ease,color .15s ease}
html body #community-app#community-app .dossier-dm-btn:is(:hover,:focus-visible){border-color:#8ea1ff;color:#c9d2ff;outline:none}
html body #community-app#community-app .dossier-dm-btn svg{color:#8ea1ff}}
html body #community-app#community-app .player-toggle{display:flex;align-items:center;gap:10px;margin:10px 0 4px;font-weight:600}
@media(min-width:1200px){
 html body #community-app#community-app .post-flip-back{gap:7px!important;padding:12px 11px 9px!important}
 html body #community-app#community-app .dossier-head b{font-size:24px!important}
 html body #community-app#community-app .dossier-tags{gap:4px!important}
 html body #community-app#community-app .dossier-tags i{font-size:10.5px!important;padding:3px 6px!important;letter-spacing:.6px!important}
 html body #community-app#community-app .dossier-quote{-webkit-line-clamp:3!important;padding:6px 9px!important;font-size:12px!important;line-height:1.4!important}
 html body #community-app#community-app :is(.dossier-id-btn,.dossier-dm-btn){height:28px!important;margin-top:0!important}
 html body #community-app#community-app .dossier-player{padding-top:7px!important}
}
@media(min-width:1200px){html body #community-app#community-app .post-flip-back:has(.dossier-dm-btn) .dossier-quote{-webkit-line-clamp:2!important}
 html body #community-app#community-app .post-flip-back:has(.dossier-dm-btn){gap:6px!important}}
@media(min-width:1200px){html body #community-app#community-app .post-flip-back:has(.dossier-dm-btn){gap:5px!important;padding-top:10px!important}
 html body #community-app#community-app .post-flip-back:has(.dossier-dm-btn) .dossier-head b{font-size:22px!important}
 html body #community-app#community-app .post-flip-back:has(.dossier-dm-btn) .dossier-tags i{padding:2px 6px!important}
 html body #community-app#community-app .post-flip-back:has(.dossier-dm-btn) .dossier-player{padding-top:5px!important}}
/* card back never overflows: the buttons and PLAYED BY are pinned to the bottom; tags and quote give up space first (fading out) */
@media(min-width:1200px){
 html body #community-app#community-app .post-flip-back>*{flex:none}
 html body #community-app#community-app .post-flip-back>.dossier-tags{flex:0 1 auto!important;min-height:22px;overflow:hidden}
 html body #community-app#community-app .post-flip-back>.dossier-quote{flex:0 1 auto!important;min-height:0;display:block!important;-webkit-line-clamp:unset!important;overflow:hidden;-webkit-mask-image:linear-gradient(#000 calc(100% - 14px),transparent);mask-image:linear-gradient(#000 calc(100% - 14px),transparent)}
 html body #community-app#community-app .post-flip-back>.dossier-spacer{flex:1 1 0!important;min-height:0}
 html body #community-app#community-app .post-flip-back>.dossier-id-btn{margin-top:auto!important}
}
@media(min-width:1200px){html body #community-app#community-app .post-flip-back>.dossier-tags{flex:0 0 auto!important;max-height:84px}html body #community-app#community-app .post-flip-back>.dossier-quote{flex:0 1000 auto!important}}
/* stat tiles under the portrait: THREADS (completed) · POSTS · RANK; author column widened a little to fit them */
@media(min-width:1200px){
 html body #community-app#community-app .thread-reading-area .forum-post{grid-template-columns:244px minmax(0,1fr)!important}
 html body #community-app#community-app .thread-reading-area .forum-post.post-profile-right{grid-template-columns:minmax(0,1fr) 244px!important}
}
html body #community-app#community-app .post-stat-tiles{display:grid;grid-template-columns:1fr 1fr 1.25fr;gap:6px;margin:8px 0 2px}
html body #community-app#community-app .post-stat-tiles .pst{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;padding:8px 4px 7px;border-radius:8px;background:color-mix(in srgb,var(--character-color) 12%,#0b0f14);border:1px solid color-mix(in srgb,var(--character-color) 35%,transparent)}
html body #community-app#community-app .post-stat-tiles .pst b{font:700 20px/1 var(--font-control-title,'Segoe UI'),sans-serif;color:var(--character-color);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body #community-app#community-app .post-stat-tiles .pst small{font:700 8.5px/1 'Segoe UI',sans-serif;letter-spacing:1.3px;text-transform:uppercase;color:#9aa3ad}
html body #community-app#community-app .post-stat-tiles .pst-rank{background:color-mix(in srgb,#ffc45b 10%,#0b0f14);border-color:#ffc45b66}
html body #community-app#community-app .post-stat-tiles .pst-rank b{font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:#ffc45b}
@media(max-width:1199px){html body #community-app#community-app .post-stat-tiles{display:none}}
/* portrait frame: a two-colour gradient border (the character's secondary → accent) with a soft glow in those colours */
@media(min-width:1200px){
 html body #community-app#community-app .forum-post .post-portrait-reveal{isolation:isolate;border-radius:9px!important;box-shadow:0 0 18px -2px color-mix(in srgb,var(--character-color) 45%,transparent),0 0 34px -6px color-mix(in srgb,var(--character-secondary) 55%,transparent)!important}
 html body #community-app#community-app .forum-post .post-portrait-reveal::before{content:'';position:absolute;inset:-3px;z-index:-1;border-radius:11px;background:linear-gradient(170deg,color-mix(in srgb,var(--character-color) 80%,#fff) 0%,var(--character-color) 22%,color-mix(in srgb,var(--character-secondary) 55%,var(--character-color)) 60%,var(--character-color) 100%);pointer-events:none}
 html body #community-app#community-app .forum-post .post-portrait-reveal :is(.post-flip-front,.post-flip-back){border-radius:7px!important}
 html body #community-app#community-app .forum-post .post-author-pin{padding-top:3px}
}

/* thread title bar uses the skin's accent, not the poster's colour */
html body #community-app#community-app #app-view>.thread-view-heading{background:linear-gradient(100deg,color-mix(in srgb,var(--color-accent-default,#ffc45b) 11%,#0d1115) 0%,#0d1115 55%)!important}
html body #community-app#community-app #app-view>.thread-view-heading::after{background:linear-gradient(90deg,var(--color-accent-default,#ffc45b),color-mix(in srgb,var(--color-accent-default,#ffc45b) 20%,transparent) 60%,transparent)!important}
html body #community-app#community-app .th-where{color:var(--color-accent-default,#ffc45b)!important}
/* nameplate above the portrait: name in spaced capitals, alias beneath in the character colour */
@media(min-width:1200px){
 html body #community-app#community-app .post-author-pin{display:flex;flex-direction:column}
 html body #community-app#community-app .post-author-pin>.post-identity{order:-1;text-align:center;padding:0 0 10px!important;margin:0 0 6px!important;border-bottom:0!important}
 html body #community-app#community-app .post-author-pin>.post-identity h3{font-family:var(--font-control-title,'Segoe UI'),sans-serif!important;font-weight:700!important;font-size:19px!important;letter-spacing:.22em!important;text-transform:uppercase;line-height:1.15!important;color:#f4eee2!important}
 html body #community-app#community-app .post-author-pin>.post-identity .post-codename{margin-top:4px!important;font:800 italic 16px/1.2 'Segoe UI',sans-serif!important;color:var(--character-color)!important;text-shadow:0 0 12px color-mix(in srgb,var(--character-color) 45%,transparent)}
 html body #community-app#community-app .post-author-pin>.post-identity .post-codename>span{display:none}
 html body #community-app#community-app .post-author-pin>.post-memberships{justify-content:center;margin-top:10px}
}

@media(min-width:1200px){
 /* name in the character colour, alias in white */
 html body #community-app#community-app .post-author-pin>.post-identity h3,html body #community-app#community-app .post-author-pin>.post-identity h3 a{color:var(--character-color)!important;text-shadow:0 0 12px color-mix(in srgb,var(--character-color) 40%,transparent)}
 html body #community-app#community-app .post-author-pin>.post-identity .post-codename{color:#f4eee2!important;text-shadow:none!important}
 /* under the stats: faction only (designation and origin live on the card back) */
 html body #community-app#community-app .post-author-pin .post-memberships .post-group-pill{display:none!important}
 html body #community-app#community-app .forum-post.is-member-post .post-author-pin .post-memberships .post-group-pill{display:inline-flex!important}
 /* card back image / GIF */
 html body #community-app#community-app .post-flip-back>.dossier-gif{flex:1 1 0!important;min-height:0;display:block;border-radius:6px;overflow:hidden;border:1px solid color-mix(in srgb,var(--character-color) 35%,transparent);background:#0b0f14}
 html body #community-app#community-app .post-flip-back>.dossier-gif img{display:block;width:100%!important;height:100%!important;object-fit:cover;object-position:center;border-radius:0!important;aspect-ratio:auto!important}
}
html body #community-app#community-app #app-view>.thread-view-heading>.th-right{flex:none;align-self:stretch;display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:10px}
html body #community-app#community-app .th-right>.thread-heading-actions{margin:0!important;align-self:flex-end}
html body #community-app#community-app .th-facts{display:flex;gap:18px;margin:0;font:500 12px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;color:#aab3bd}
html body #community-app#community-app .th-facts>div{display:flex;flex-direction:column;align-items:flex-end;gap:3px}
html body #community-app#community-app .th-facts dt{font:800 9px/1 'Segoe UI',sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:#747e89}
html body #community-app#community-app .th-facts dd{margin:0;white-space:nowrap}
html body #community-app#community-app .th-facts b{font-weight:700}
/* page-curl peek: when the flip hint appears, the card's top-right corner folds over to show a glimpse of the other side */
@property --peel{syntax:'<length>';inherits:true;initial-value:0px}
@media(min-width:1200px){
 html body #community-app#community-app .post-flip-card{--peel:0px;transition:--peel .32s cubic-bezier(.3,.7,.25,1)}
 html body #community-app#community-app .post-flip-card.is-peeking{--peel:34px}
 html body #community-app#community-app .post-flip-card :is(.post-flip-front,.post-flip-back){clip-path:polygon(0 0,calc(100% - var(--peel)) 0,100% var(--peel),100% 100%,0 100%)}
 html body #community-app#community-app .post-flip-card::before{clip-path:polygon(0 0,calc(100% - var(--peel) - 4px) 0,100% calc(var(--peel) + 4px),100% 100%,0 100%)}
 html body #community-app#community-app .post-flip-card::after{content:'';position:absolute;top:0;right:0;z-index:4;width:var(--peel);height:var(--peel);pointer-events:none;border-radius:0 0 0 4px;
  background:linear-gradient(225deg,transparent 50%,color-mix(in srgb,var(--character-color) 45%,#0c1115) 50%,color-mix(in srgb,var(--character-color) 22%,#0a0e12) 100%);
  filter:drop-shadow(-3px 3px 4px #000a)}
 html body #community-app#community-app .post-flip-card.is-flipped::after{background:linear-gradient(225deg,transparent 50%,color-mix(in srgb,var(--character-secondary) 55%,#d8d2c4) 50%,color-mix(in srgb,var(--character-secondary) 70%,#1a1e22) 100%)}
}
@media(prefers-reduced-motion:reduce){html body #community-app#community-app .post-flip-card{transition:none}}
/* thread title bar: the skin's primary (gold) reads as gold, not a brown wash */
html body #community-app#community-app #app-view>.thread-view-heading{background:linear-gradient(180deg,color-mix(in srgb,var(--color-accent-default,#ffc45b) 7%,transparent),transparent 70%),#0d1115!important}
html body #community-app#community-app #app-view>.thread-view-heading::after{height:2px!important;background:linear-gradient(90deg,var(--color-accent-default,#ffc45b) 0%,var(--color-accent-default,#ffc45b) 35%,color-mix(in srgb,var(--color-accent-default,#ffc45b) 35%,transparent) 100%)!important;box-shadow:0 0 12px color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,transparent)}
html body #community-app#community-app #app-view>.thread-view-heading::before{content:'';position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:0 3px 3px 0;background:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app #app-view>.thread-view-heading::after{opacity:1!important}
/* posts use the skin's control font by default (a post's own formatting can still change it) */
html body #community-app#community-app .forum-post .post-body>.forum-rich,html body #community-app#community-app .quick-reply textarea{font-family:var(--font-control-ui,'Segoe UI'),sans-serif!important}
html body #community-app#community-app .forum-post .post-body>.forum-rich{font-size:15.5px;line-height:1.75}

html body #community-app#community-app #app-view>.thread-view-heading::before{content:none!important;display:none!important}
.flip-tip{display:none!important}
@media(min-width:1200px){html body #community-app#community-app .post-flip-back>.dossier-gif.is-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:1.5px dashed color-mix(in srgb,var(--character-color) 55%,transparent);background:color-mix(in srgb,var(--character-color) 6%,transparent);color:color-mix(in srgb,var(--character-color) 80%,#fff);text-align:center}
 html body #community-app#community-app .dossier-gif.is-empty b{font:800 10px/1 'Segoe UI',sans-serif;letter-spacing:1.4px;text-transform:uppercase}
 html body #community-app#community-app .dossier-gif.is-empty small{font:600 10.5px/1 'Segoe UI',sans-serif;color:#aab3bd}}

/* ==== peel instead of flip: the picture peels away from the top-right corner, folding over, to uncover the
   dossier underneath; clicking again lays it back down ==== */
@media(min-width:1200px){
 html body #community-app#community-app .post-flip-card{transition:--peel .75s cubic-bezier(.45,.05,.25,1)!important}
 html body #community-app#community-app .post-flip-card.is-flipped{--peel:620px}
 html body #community-app#community-app .post-flip-card .post-flip-inner{transform:none!important;transform-style:flat!important;transition:none!important;overflow:hidden;border-radius:7px}
 html body #community-app#community-app .post-flip-card :is(.post-flip-front,.post-flip-back){-webkit-backface-visibility:visible!important;backface-visibility:visible!important}
 html body #community-app#community-app .post-flip-card .post-flip-back{transform:none!important;z-index:1;clip-path:none!important}
 html body #community-app#community-app .post-flip-card .post-flip-front{z-index:2;clip-path:polygon(calc(100% - var(--peel) - 2000px) -2000px,calc(100% - var(--peel) + 2000px) 2000px,-2000px 2000px)!important;filter:drop-shadow(-4px 4px 6px #0009)}
 html body #community-app#community-app .post-flip-card.is-flipped .post-flip-front{pointer-events:none}
 html body #community-app#community-app .post-flip-card::after{content:none!important}
 html body #community-app#community-app .post-flip-card::before{clip-path:none!important}
 html body #community-app#community-app .post-peel-flap{position:absolute;top:0;right:0;z-index:3;width:var(--peel);height:var(--peel);pointer-events:none;
  background:linear-gradient(225deg,transparent 50%,color-mix(in srgb,var(--character-color) 55%,#e9e3d6) 50%,color-mix(in srgb,var(--character-color) 30%,#2a3036) 78%,color-mix(in srgb,var(--character-color) 18%,#12161a) 100%);
  filter:drop-shadow(-5px 5px 7px #000b)}
}
@media(min-width:1200px){html body #community-app#community-app .dossier-tags i{display:inline-flex;align-items:center;gap:5px}
 html body #community-app#community-app .dossier-tags i .designation-icon{display:inline-grid;width:13px;height:13px;margin:0;color:var(--character-color)}
 html body #community-app#community-app .dossier-tags i .designation-icon svg{width:100%;height:100%}}
/* BBCode / dohtml */
.rich-toolbar .rich-bbcode-btn{padding:6px 10px;border-radius:7px;border:1px solid #ffffff2e;background:transparent;color:#dfe5ec;font:700 12.5px/1 Consolas,monospace;cursor:pointer}
.rich-toolbar .rich-bbcode-btn[aria-pressed=true],.rich-toolbar .rich-bbcode-btn:hover{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b)}
textarea.bbcode-source{display:block;width:100%;box-sizing:border-box;padding:12px 14px;border-radius:8px;border:1px solid #ffffff26;background:#06090c;color:#e6e1d6;font:13.5px/1.6 Consolas,'Courier New',monospace;resize:vertical;tab-size:2}
html body #community-app#community-app .forum-rich .dohtml{contain:layout paint;isolation:isolate;overflow:auto;max-width:100%}
html body #community-app#community-app .forum-rich .bb-quote{margin:10px 0;padding:10px 14px;border-left:3px solid var(--character-color,#ffc45b);background:#ffffff08;border-radius:0 8px 8px 0}
html body #community-app#community-app .forum-rich .bb-quote cite{display:block;margin-bottom:6px;font:700 11px/1 'Segoe UI',sans-serif;font-style:normal;letter-spacing:1px;text-transform:uppercase;color:var(--character-color,#ffc45b)}
html body #community-app#community-app .forum-rich .bb-code{margin:10px 0;padding:12px 14px;border-radius:8px;background:#06090c;border:1px solid #ffffff1c;overflow:auto;font:13px/1.55 Consolas,monospace;color:#d6dde4;white-space:pre-wrap}
html body #community-app#community-app .forum-rich .bb-spoiler{margin:10px 0;padding:8px 12px;border-radius:8px;border:1px dashed #ffffff33}
html body #community-app#community-app .forum-rich .bb-spoiler>summary{cursor:pointer;font-weight:700;color:var(--color-accent-default,#ffc45b)}

/* the corner peel, flip cursor and dimming all start together, 50ms into a hover */
@media(min-width:1200px){
 html body #community-app#community-app .post-flip-card.is-peeking:not(.is-flipped){cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg stroke='%23000' stroke-width='4'%3E%3Cpath d='M20 11a8 8 0 0 0-14.3-4.3M4 13a8 8 0 0 0 14.3 4.3'/%3E%3Cpath d='M5 3v4h4M19 21v-4h-4'/%3E%3C/g%3E%3Cg stroke='%23fff' stroke-width='2'%3E%3Cpath d='M20 11a8 8 0 0 0-14.3-4.3M4 13a8 8 0 0 0 14.3 4.3'/%3E%3Cpath d='M5 3v4h4M19 21v-4h-4'/%3E%3C/g%3E%3C/svg%3E") 14 14,pointer!important}
 html body #community-app#community-app .post-flip-card:not(.is-flipped):is(:hover,:focus-visible):not(.is-peeking) .post-flip-front>img{filter:none!important}
 html body #community-app#community-app .post-flip-card:not(.is-flipped):is(:hover,:focus-visible):not(.is-peeking) .post-card-radar{opacity:.6!important}
 html body #community-app#community-app .post-flip-card.is-peeking:not(.is-flipped) .post-flip-front>img{filter:brightness(.45) saturate(.8)!important}
 html body #community-app#community-app .post-flip-card.is-peeking:not(.is-flipped) .post-card-radar{opacity:1!important}
 html body #community-app#community-app .post-flip-front>img{transition:filter .32s cubic-bezier(.3,.7,.25,1)!important}
}
html body #community-app#community-app .forum-rich p:empty{display:none}

/* only the folded corner turns the card: hovering it dims the picture and shows the flip cursor */
@media(min-width:1200px){
 html body #community-app#community-app .post-flip-card.is-peeking:not(.is-flipped){cursor:pointer!important}
 html body #community-app#community-app .post-flip-card.is-peeking:not(.is-flipped) .post-flip-front>img{filter:none!important}
 html body #community-app#community-app .post-flip-card.is-peeking:not(.is-flipped) .post-card-radar{opacity:.6!important}
 html body #community-app#community-app .post-flip-card.corner-hot:not(.is-flipped) .post-flip-front>img{filter:brightness(.45) saturate(.8)!important}
 html body #community-app#community-app .post-flip-card.corner-hot:not(.is-flipped) .post-card-radar{opacity:1!important}
 html body #community-app#community-app .post-flip-card:not(.is-flipped) .post-peel-flap{pointer-events:auto;cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg stroke='%23000' stroke-width='4'%3E%3Cpath d='M20 11a8 8 0 0 0-14.3-4.3M4 13a8 8 0 0 0 14.3 4.3'/%3E%3Cpath d='M5 3v4h4M19 21v-4h-4'/%3E%3C/g%3E%3Cg stroke='%23fff' stroke-width='2'%3E%3Cpath d='M20 11a8 8 0 0 0-14.3-4.3M4 13a8 8 0 0 0 14.3 4.3'/%3E%3Cpath d='M5 3v4h4M19 21v-4h-4'/%3E%3C/g%3E%3C/svg%3E") 14 14,pointer}
 html body #community-app#community-app .post-flip-card.corner-hot:not(.is-flipped){--peel:44px}
 html body #community-app#community-app .post-flip-card.is-flipped .post-peel-flap{pointer-events:none}
 /* card back: name heading, more room under age / pronouns, sheet + music buttons side by side */
 html body #community-app#community-app .dossier-head small{margin-top:4px!important;margin-bottom:6px}
 html body #community-app#community-app .dossier-btn-row{flex:none;display:flex;gap:6px;margin-top:auto}
 html body #community-app#community-app .dossier-btn-row>.dossier-id-btn{flex:1 1 auto;margin-top:0!important}
 html body #community-app#community-app .dossier-music-btn{flex:none;width:32px;height:auto;display:grid;place-items:center;border-radius:var(--btn-radius,8px);border:1px solid #1db95466;background:#1db9541a;color:#1ed760;text-decoration:none!important}
 html body #community-app#community-app .dossier-music-btn:is(:hover,:focus-visible){border-color:#1ed760;background:#1db95433;outline:none}
}
@media(min-width:1200px){html body #community-app#community-app .dossier-btn-row{min-width:0}
 html body #community-app#community-app .dossier-btn-row>.dossier-id-btn{min-width:0;overflow:hidden}
 html body #community-app#community-app .dossier-btn-row:has(.dossier-music-btn)>.dossier-id-btn svg{display:none}}
/* author panel: twice the side gutters (28px) around the portrait; column widened so the portrait keeps its size */
@media(min-width:1200px){
 html body #community-app#community-app .thread-reading-area .forum-post{grid-template-columns:272px minmax(0,1fr)!important}
 html body #community-app#community-app .thread-reading-area .forum-post.post-profile-right{grid-template-columns:minmax(0,1fr) 272px!important}
 html body #community-app#community-app .thread-reading-area .forum-post>.post-author{padding-left:28px!important;padding-right:28px!important}
}
html body #community-app#community-app .post-last-online{margin:8px 0 0;text-align:center;font:800 10px/1.2 'Segoe UI',sans-serif;letter-spacing:1.3px;text-transform:uppercase;color:#7f8994}
html body #community-app#community-app .post-last-online.is-online{color:#5fd08d}
html body #community-app#community-app .post-last-online.is-online::before{content:'';display:inline-block;width:6px;height:6px;margin:0 6px 1px 0;border-radius:50%;background:#5fd08d;box-shadow:0 0 6px #5fd08d;vertical-align:middle}
@media(max-width:1199px){html body #community-app#community-app .post-last-online{display:none}}
/* arrow cursor on the card itself; only the folded corner shows the flip cursor. Initial fold 30% smaller */
@media(min-width:1200px){
 html body #community-app#community-app .forum-post .post-portrait-reveal.post-flip-card,html body #community-app#community-app .post-flip-card.is-peeking:not(.is-flipped),html body #community-app#community-app .post-flip-card.is-flipped{cursor:default!important}
 html body #community-app#community-app .post-flip-card.is-peeking{--peel:24px}
 html body #community-app#community-app .post-flip-card.corner-hot:not(.is-flipped){--peel:32px}
}
html body #community-app#community-app .post-last-online,html body #community-app#community-app .post-last-online.is-online{color:#f1ece2!important;margin-bottom:0!important}
html body #community-app#community-app .post-last-online::before{content:'';display:inline-block;width:6px;height:6px;margin:0 6px 1px 0;border-radius:50%;background:#6b7580;vertical-align:middle}
html body #community-app#community-app .post-last-online.is-online::before{background:#5fd08d;box-shadow:0 0 6px #5fd08d}
html body #community-app#community-app .post-author-pin>.post-memberships:empty{display:none!important}
@media(min-width:1200px){html body #community-app#community-app .thread-reading-area .forum-post>.post-author{padding-bottom:12px!important}}
@media(min-width:1200px){
 html body #community-app#community-app .post-flip-card,html body #community-app#community-app .post-flip-card *{cursor:default!important}
 html body #community-app#community-app .post-flip-card:not(.is-flipped) .post-peel-flap{cursor:var(--flip-cursor),pointer!important}
 html body #community-app#community-app .post-flip-card.is-flipped :is(.dossier-id-btn,.dossier-dm-btn,.dossier-music-btn),html body #community-app#community-app .post-flip-card.is-flipped :is(.dossier-id-btn,.dossier-dm-btn,.dossier-music-btn) *{cursor:pointer!important}
 html body #community-app#community-app .dossier-head small{font-size:12.5px!important;margin-top:0!important}
}

:root{--flip-cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg stroke='%23000' stroke-width='4'%3E%3Cpath d='M20 11a8 8 0 0 0-14.3-4.3M4 13a8 8 0 0 0 14.3 4.3'/%3E%3Cpath d='M5 3v4h4M19 21v-4h-4'/%3E%3C/g%3E%3Cg stroke='%23fff' stroke-width='2'%3E%3Cpath d='M20 11a8 8 0 0 0-14.3-4.3M4 13a8 8 0 0 0 14.3 4.3'/%3E%3Cpath d='M5 3v4h4M19 21v-4h-4'/%3E%3C/g%3E%3C/svg%3E") 14 14}

/* the card back folds at its corner too, showing a glimpse of the picture side; click it to lay the card back down */
@property --bpeel{syntax:'<length>';inherits:true;initial-value:0px}
@media(min-width:1200px){
 html body #community-app#community-app .post-flip-card{--bpeel:0px;transition:--peel .75s cubic-bezier(.45,.05,.25,1),--bpeel .32s cubic-bezier(.3,.7,.25,1)!important}
 html body #community-app#community-app .post-flip-card.is-flipped.is-peeking{--bpeel:24px}
 html body #community-app#community-app .post-flip-card.is-flipped.corner-hot{--bpeel:32px}
 html body #community-app#community-app .post-flip-card .post-flip-back{clip-path:polygon(0 0,calc(100% - var(--bpeel)) 0,100% var(--bpeel),100% 100%,0 100%)!important}
 html body #community-app#community-app .post-peel-back-flap{position:absolute;top:0;right:0;z-index:4;width:var(--bpeel);height:var(--bpeel);pointer-events:none;
  background:linear-gradient(225deg,transparent 50%,color-mix(in srgb,var(--character-secondary) 60%,#cfc8ba) 50%,color-mix(in srgb,var(--character-secondary) 55%,#1a1e22) 100%);filter:drop-shadow(-4px 4px 5px #000b)}
 html body #community-app#community-app .post-flip-card.is-flipped .post-peel-back-flap{pointer-events:auto;cursor:var(--flip-cursor),pointer!important}
 html body #community-app#community-app .post-flip-card:not(.is-flipped) .post-peel-back-flap{display:none}
}
@media(min-width:1200px){html body #community-app#community-app .post-flip-card.is-flipped{--peel:620px!important}}
/* stat tiles: a little bigger and roomier */
html body #community-app#community-app .post-stat-tiles{grid-template-columns:1fr 1fr 1.1fr!important;gap:6px!important;margin:10px 0 2px!important}
html body #community-app#community-app .post-stat-tiles .pst{padding:10px 3px 9px!important;gap:5px!important}
html body #community-app#community-app .post-stat-tiles .pst b{font-size:24px!important}
html body #community-app#community-app .post-stat-tiles .pst small{font-size:9.5px!important;letter-spacing:.7px!important}
html body #community-app#community-app .post-stat-tiles .pst-rank b{font-size:15px!important}
/* faction card under the stats (faction badges no longer repeat further down) */
html body #community-app#community-app .post-author-pin .post-memberships .faction-short-badge{display:none!important}
html body #community-app#community-app .post-faction-card{display:flex;align-items:center;gap:9px;margin-top:6px;padding:7px 10px;border-radius:8px;text-decoration:none!important;background:linear-gradient(90deg,color-mix(in srgb,var(--faction-color) 28%,#0b0f14),color-mix(in srgb,var(--faction-color) 8%,#0b0f14));border:1px solid color-mix(in srgb,var(--faction-color) 55%,transparent)}
html body #community-app#community-app .post-faction-card:hover{border-color:var(--faction-color)}
html body #community-app#community-app .pfc-mark{flex:none;width:30px;height:30px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:var(--faction-color);color:var(--faction-ink,#0b0f14);font:900 10px/1 'Segoe UI',sans-serif;letter-spacing:.5px}
html body #community-app#community-app .pfc-mark img{width:100%!important;height:100%!important;object-fit:cover;border-radius:50%!important;aspect-ratio:1/1!important}
html body #community-app#community-app .pfc-text{display:flex;flex-direction:column;min-width:0}
html body #community-app#community-app .pfc-text small{font:800 8.5px/1 'Segoe UI',sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:color-mix(in srgb,var(--faction-color) 70%,#fff)}
html body #community-app#community-app .pfc-text strong{margin-top:3px;font:700 13px/1.2 'Segoe UI',sans-serif;color:#f4efe5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:1199px){html body #community-app#community-app .post-faction-card{display:none}}
/* while the dossier is showing, its folded corner uncovers the picture underneath */
@media(min-width:1200px){
 html body #community-app#community-app .post-flip-card .post-flip-front{clip-path:polygon(-2000px 2000px,calc(100% - var(--peel) - 2000px) -2000px,calc(100% - var(--bpeel)) 0,100% 0,100% var(--bpeel),calc(100% - var(--bpeel)) 0,calc(100% - var(--peel) - 2000px) -2000px,calc(100% - var(--peel) + 2000px) 2000px)!important}
 html body #community-app#community-app .post-flip-card.is-flipped .post-flip-front{z-index:3;filter:none}
 html body #community-app#community-app .post-flip-card.is-flipped .post-peel-back-flap{z-index:5}
 /* age · pronouns: readable */
 html body #community-app#community-app .dossier-head small{font:600 13.5px/1.3 'Segoe UI',sans-serif!important;color:#efe9dd!important;letter-spacing:.2px!important;margin-bottom:8px!important}
}
html body #community-app#community-app .post-stat-tiles .pst-rank b{font-size:13px!important;letter-spacing:.03em!important}
html body #community-app#community-app .post-faction-card{margin-top:0!important}
/* third tile = faction */
html body #community-app#community-app .post-faction-card{display:none!important}
html body #community-app#community-app .post-stat-tiles{grid-template-columns:1fr 1fr 1fr!important}
html body #community-app#community-app .post-stat-tiles .pst-faction{text-decoration:none!important;background:color-mix(in srgb,var(--faction-color,var(--character-color)) 16%,#0b0f14);border-color:color-mix(in srgb,var(--faction-color,var(--character-color)) 55%,transparent)}
html body #community-app#community-app .post-stat-tiles .pst-faction:hover{border-color:var(--faction-color,var(--character-color))}
html body #community-app#community-app .pst-mark{width:30px;height:30px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:var(--faction-color);color:var(--faction-ink,#0b0f14)}
html body #community-app#community-app .pst-mark img{width:100%!important;height:100%!important;object-fit:contain;border-radius:0!important;aspect-ratio:1/1!important}
html body #community-app#community-app .pst-mark:has(img){background:transparent}
html body #community-app#community-app .pst-mark>b{font:900 10px/1 'Segoe UI',sans-serif!important;color:inherit!important;letter-spacing:.4px}
html body #community-app#community-app .pst-faction.is-designation .pst-mark{background:transparent;color:var(--character-color);width:28px;height:28px}
html body #community-app#community-app .pst-faction.is-designation .pst-mark .designation-icon{display:grid;width:26px;height:26px;margin:0}
html body #community-app#community-app .pst-faction.is-designation .pst-mark svg{width:100%;height:100%}
html body #community-app#community-app .pst-faction small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.form-hint{margin:-4px 0 10px;font-size:12.5px;line-height:1.45}
@media(min-width:1200px){html body #community-app#community-app .post-author-pin>.post-stat-tiles{margin-left:-14px!important;margin-right:-14px!important}}
html body #community-app#community-app .pst-faction.is-designation .pst-mark .designation-icon,html body #community-app#community-app .pst-faction.is-designation .pst-mark .designation-icon svg{color:var(--character-color)!important;fill:var(--character-color)!important;background:none!important;border:0!important;box-shadow:none!important}

@media(min-width:1200px){
 /* unpeel: the dossier peels off the same way, the picture lies underneath */
 html body #community-app#community-app .post-flip-card.is-unpeeling{--bpeel:620px!important;transition:--bpeel .75s cubic-bezier(.45,.05,.25,1)!important}
 html body #community-app#community-app .post-flip-card.is-unpeeling .post-flip-front{z-index:1!important;clip-path:none!important;filter:none!important}
 html body #community-app#community-app .post-flip-card.is-unpeeling .post-flip-back{z-index:2!important;filter:drop-shadow(-4px 4px 6px #0009)}
 html body #community-app#community-app .post-flip-card.is-unpeeling .post-peel-back-flap{z-index:3!important}
 html body #community-app#community-app .post-flip-card.peel-reset,html body #community-app#community-app .post-flip-card.peel-reset *{transition:none!important}
 /* no dimming on the corner */
 html body #community-app#community-app .post-flip-card.corner-hot:not(.is-flipped) .post-flip-front>img{filter:none!important}
 html body #community-app#community-app .post-flip-card.corner-hot:not(.is-flipped) .post-card-radar{opacity:.6!important}
 /* pentagon sharpens when you point at it */
 html body #community-app#community-app .post-flip-card:not(.is-flipped) .post-card-radar{pointer-events:auto;transition:opacity .25s ease,transform .25s ease,filter .25s ease!important}
 html body #community-app#community-app .post-flip-card:not(.is-flipped) .post-card-radar:hover{opacity:1!important;transform:scale(1.08);filter:drop-shadow(0 0 8px color-mix(in srgb,var(--character-color) 60%,transparent))}
}
/* all three tiles share one shape (6:5); a faction's badge fills its tile edge to edge */
html body #community-app#community-app .post-stat-tiles .pst{aspect-ratio:6/5;box-sizing:border-box}
html body #community-app#community-app .post-stat-tiles .pst-faction:not(.is-designation){position:relative;padding:0!important;overflow:hidden;background:var(--faction-color)!important}
html body #community-app#community-app .post-stat-tiles .pst-faction>.pst-badge{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover;border-radius:0!important;aspect-ratio:auto!important}
html body #community-app#community-app .post-stat-tiles .pst-faction:not(.is-designation)>b{color:var(--faction-ink,#0b0f14)!important;font-size:18px!important;letter-spacing:.06em}
html body #community-app#community-app .post-stat-tiles .pst-faction:not(.is-designation)>small{color:color-mix(in srgb,var(--faction-ink,#0b0f14) 75%,transparent)!important}
/* Discord-style image field */
.img-field{display:flex;flex-direction:column;gap:8px;margin:4px 0 12px}
.img-field-label{font-weight:700}
.img-field-row{display:flex;gap:12px;align-items:flex-start}
.img-field-preview{flex:none;width:120px;border-radius:8px;overflow:hidden;display:grid;place-items:center;background:#0b0f14;border:1px dashed #ffffff33}
.img-field-preview img{width:100%;height:100%;object-fit:cover;display:block}
.img-field-preview i{font-size:11px;color:#8a94a0;font-style:normal}
.img-field-actions{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-width:0}
.img-field-actions>*{height:30px;box-sizing:border-box}
.img-field-upload{display:inline-flex;align-items:center;padding:0 12px;border-radius:8px;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent);background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 16%,#161c22);color:#ffe3b0;font-weight:600;font-size:13px;cursor:pointer}
.img-field-actions input[type=url]{flex:1 1 180px;min-width:0}
.img-field-hint{margin:0;font-size:12.5px;color:#9aa3ad}
.img-field-msg{margin:0;font-size:12.5px;color:#cfd6de}
.img-field-crop:empty{display:none}
.img-field-crop .crop-frame{max-width:420px}
#app-dialog .img-field-upload,.img-field .img-field-upload{text-transform:none!important;letter-spacing:normal!important;margin:0!important;line-height:1!important;font:600 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important}
.img-field .img-field-crop{max-width:360px}
.img-field .img-field-crop .crop-frame{width:100%;max-width:360px}
html body #community-app#community-app .post-card-radar{user-select:none;-webkit-user-select:none}
/* edit history sits on the same line as the Posted / Edited times */
html body #community-app#community-app .forum-post .post-time-footer>.post-meta-footer{margin:0 auto 0 0!important;padding:0!important;border:0!important;background:none!important;font:inherit;display:inline-flex}
html body #community-app#community-app .forum-post .post-time-footer>.post-meta-footer *{margin-top:0!important;margin-bottom:0!important}
@media(min-width:1200px){
 /* age and pronouns are badges like designation and origin */
 html body #community-app#community-app .dossier-head:empty{display:none}
 html body #community-app#community-app .dossier-tags i:not(:has(.designation-icon)){padding-left:7px!important}
 /* icon buttons on the card back, labels on hover */
 html body #community-app#community-app .dossier-btn-row{justify-content:flex-start;gap:8px!important}
 html body #community-app#community-app .dossier-btn-row>.dossier-icon-btn,html body #community-app#community-app .dossier-btn-row>.dossier-music-btn{flex:none!important;width:40px!important;height:36px!important;padding:0!important;display:grid!important;place-items:center;position:relative;overflow:visible!important;margin:0!important}
 html body #community-app#community-app .dossier-btn-row>.dossier-icon-btn svg{display:block!important;width:18px;height:18px}
 html body #community-app#community-app .dossier-btn-row [data-tip]::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 7px);left:50%;transform:translate(-50%,3px);white-space:nowrap;padding:5px 9px;border-radius:6px;background:#0b1018f2;border:1px solid color-mix(in srgb,var(--character-color) 50%,transparent);color:#f1ece2;font:700 10.5px/1 'Segoe UI',sans-serif;letter-spacing:.06em;text-transform:uppercase;opacity:0;pointer-events:none;transition:opacity .15s ease,transform .15s ease;z-index:10}
 html body #community-app#community-app .dossier-btn-row [data-tip]:is(:hover,:focus-visible)::after{opacity:1;transform:translate(-50%,0)}
}
/* faction tile: thicker outline; hover label in the faction's own colours */
html body #community-app#community-app .post-stat-tiles .pst-faction{border-width:2px!important;overflow:visible!important;position:relative}
html body #community-app#community-app .post-stat-tiles .pst-faction>.pst-badge{border-radius:6px!important}
html body #community-app#community-app .pst-faction[data-tip]::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 7px);left:50%;transform:translate(-50%,3px);white-space:nowrap;padding:6px 10px;border-radius:6px;background:var(--faction-color);color:var(--faction-tip,#fff);border:1px solid color-mix(in srgb,var(--faction-tip,#fff) 40%,transparent);font:800 11px/1 'Segoe UI',sans-serif;letter-spacing:.06em;text-transform:uppercase;box-shadow:0 6px 16px #000a;opacity:0;pointer-events:none;transition:opacity .15s ease,transform .15s ease;z-index:10}
html body #community-app#community-app .pst-faction[data-tip]:is(:hover,:focus-visible)::after{opacity:1;transform:translate(-50%,0)}
html body #community-app#community-app .pst-faction[data-tip]::after{left:auto!important;right:-2px!important;transform:translateY(3px)!important;white-space:normal!important;width:max-content;max-width:220px;text-align:right;line-height:1.25!important}
html body #community-app#community-app .pst-faction[data-tip]:is(:hover,:focus-visible)::after{transform:none!important}
@media(min-width:1200px){html body #community-app#community-app .dossier-btn-row [data-tip]::after{left:0!important;transform:translateY(3px)!important}
 html body #community-app#community-app .dossier-btn-row [data-tip]:is(:hover,:focus-visible)::after{transform:none!important}
 html body #community-app#community-app .dossier-btn-row>:last-child[data-tip]::after{left:auto!important;right:0!important}}
/* ---- Factions list: cards in the site's standard style, accented with each faction's colour ---- */
html body #community-app#community-app .fx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
html body #community-app#community-app .fx-card{display:flex;flex-direction:column;border-radius:12px;overflow:hidden;text-decoration:none!important;background:#0d1217;border:1px solid color-mix(in srgb,var(--faction-color) 40%,#ffffff14);box-shadow:0 10px 26px #0008;transition:border-color .15s ease,transform .15s ease}
html body #community-app#community-app .fx-card:hover{border-color:var(--faction-color);transform:translateY(-2px)}
html body #community-app#community-app .fx-art{position:relative;display:grid;place-items:center;aspect-ratio:8/3;background:linear-gradient(135deg,color-mix(in srgb,var(--faction-color) 55%,#0d1217),color-mix(in srgb,var(--faction-color) 20%,#0d1217));border-bottom:3px solid var(--faction-color);overflow:hidden}
html body #community-app#community-app .fx-art>img{width:100%;height:100%;object-fit:cover}
html body #community-app#community-app .fx-art>img.is-badge{width:auto;height:100%;object-fit:contain;aspect-ratio:6/5}
html body #community-app#community-app .fx-art>b{font:800 42px/1 var(--font-control-title,'Segoe UI'),sans-serif;letter-spacing:.06em;color:var(--faction-ink,#fff)}
html body #community-app#community-app .fx-body{display:flex;flex-direction:column;gap:10px;padding:14px 16px 14px}
html body #community-app#community-app .fx-head{display:flex;align-items:center;gap:10px}
html body #community-app#community-app .fx-badge{flex:none;width:48px;aspect-ratio:6/5;object-fit:cover;border-radius:6px;border:2px solid var(--faction-color)}
html body #community-app#community-app .fx-head small{display:block;font:800 10.5px/1 Consolas,monospace;letter-spacing:2px;text-transform:uppercase;color:var(--faction-color)}
html body #community-app#community-app .fx-head strong{display:block;margin-top:4px;font:700 19px/1.2 var(--font-control-title,'Segoe UI'),sans-serif;color:#f4efe5}
html body #community-app#community-app .fx-body>p{margin:0;font:400 14px/1.5 var(--font-control-ui,'Segoe UI'),sans-serif;color:#c6ccd3;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
html body #community-app#community-app .fx-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:10px;border-top:1px solid #ffffff14;font:700 11px/1 'Segoe UI',sans-serif;letter-spacing:1.2px;text-transform:uppercase;color:#9aa3ad}
html body #community-app#community-app .fx-avatars{display:flex}
html body #community-app#community-app .fx-avatars i{width:28px;height:28px;margin-right:-7px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 30%,#0d1217);border:2px solid #0d1217;box-shadow:0 0 0 1px var(--c);font:800 11px/1 'Segoe UI',sans-serif;font-style:normal;color:#fff}
html body #community-app#community-app .fx-avatars img{width:100%;height:100%;object-fit:cover;border-radius:50%}
html body #community-app#community-app .fx-art>img.is-badge{width:auto!important;height:100%!important;max-width:none!important;object-fit:contain!important}
/* ---- Faction page ---- */
html body #community-app#community-app .fx-detail{all:unset;display:block;box-sizing:border-box;color:#e6e1d6}
html body #community-app#community-app .fx-detail::before,html body #community-app#community-app .fx-detail::after{content:none!important}
html body #community-app#community-app .fx-detail-banner{margin:-22px -26px 0;aspect-ratio:8/3;max-height:320px;overflow:hidden;border-bottom:3px solid var(--faction-color)}
html body #community-app#community-app .fx-detail-banner img{width:100%;height:100%;object-fit:cover;display:block}
html body #community-app#community-app .fx-detail-head{display:flex;align-items:center;gap:18px;padding:18px 0 18px;border-bottom:1px solid #ffffff14}
html body #community-app#community-app .fx-detail-badge{flex:none;width:120px;aspect-ratio:6/5;object-fit:cover;border-radius:10px;border:3px solid var(--faction-color);box-shadow:0 8px 22px #0009}
html body #community-app#community-app .fx-detail-badge.is-text{display:grid;place-items:center;background:var(--faction-color);color:var(--faction-ink,#fff);font:800 30px/1 var(--font-control-title,'Segoe UI'),sans-serif}
html body #community-app#community-app .fx-detail-title{min-width:0;flex:1}
html body #community-app#community-app .fx-detail-title small{font:800 11px/1 Consolas,monospace;letter-spacing:2px;text-transform:uppercase;color:var(--faction-color)}
html body #community-app#community-app .fx-detail-title h2{margin:6px 0 0;font:700 32px/1.1 var(--font-control-title,'Segoe UI'),sans-serif;color:#f6f1e7;text-transform:none}
html body #community-app#community-app .fx-detail-title p{margin:8px 0 0;font:italic 400 16px/1.45 var(--font-control-ui,'Segoe UI'),sans-serif;color:#c9c2b4}
html body #community-app#community-app .fx-detail-head>#edit-faction{align-self:flex-start;flex:none}
html body #community-app#community-app .fx-detail-body{padding:18px 0}
html body #community-app#community-app .fx-detail-body .faction-prose{font:400 15.5px/1.7 var(--font-control-ui,'Segoe UI'),sans-serif;color:#e2ddd2;max-width:none}
html body #community-app#community-app .fx-detail-body .faction-prose *{color:inherit;font-family:inherit}
/* members roster in the standard style */
html body #community-app#community-app .fx-detail .faction-roster,html body #community-app#community-app .fx-detail [class*=faction-roster]{background:none!important;border:0!important;box-shadow:none!important;padding:16px 0 0!important;border-top:1px solid #ffffff14!important;border-radius:0!important;color:#e6e1d6!important}
html body #community-app#community-app .fx-detail [class*=faction-roster] :is(h2,h3,h4){color:var(--faction-color)!important;font-family:var(--font-control-ui,'Segoe UI'),sans-serif!important;letter-spacing:2px!important;font-size:13px!important;text-transform:uppercase!important;border-color:#ffffff14!important}
html body #community-app#community-app .fx-detail [class*=faction-roster] :is(a,strong,b){color:#f4efe5!important}
html body #community-app#community-app .fx-detail [class*=faction-roster] :is(li,article,.faction-member,[class*=member-card]){background:#0d1217!important;border:1px solid color-mix(in srgb,var(--faction-color) 35%,#ffffff14)!important;border-radius:10px!important;box-shadow:none!important;color:#c6ccd3!important}
/* ---- Guidebook panel: standard box, no amber outline ---- */
html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel{border:1px solid #ffffff1a!important;border-radius:14px!important;box-shadow:0 16px 40px rgb(0 0 0/.7)!important}
html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel::before{background:#080b10e0!important;border-radius:inherit!important}
html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel>.box-bar{border-radius:13px 13px 0 0}
html body #community-app#community-app .fx-art>img.is-badge{position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);height:100%!important;width:auto!important}
/* faction page buttons in the standard style */
html body #community-app#community-app .fx-detail :is(#edit-faction,#add-faction-member,[data-edit-member],[data-remove-member]){border-radius:var(--btn-radius,8px)!important;background:var(--btn-bg,#161c22)!important;border:1px solid var(--btn-border,#ffffff26)!important;color:var(--btn-fg,#e6e1d6)!important;box-shadow:none!important;height:32px;padding:0 12px;font:600 12.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;cursor:pointer}
html body #community-app#community-app .fx-detail :is([data-edit-member],[data-remove-member]){width:32px;padding:0!important}
html body #community-app#community-app .fx-detail #add-faction-member{background:color-mix(in srgb,var(--btn-acc,#ffc45b) 16%,#161c22)!important;border-color:color-mix(in srgb,var(--btn-acc,#ffc45b) 60%,transparent)!important;color:#ffe3b0!important}
html body #community-app#community-app .fx-detail :is(#edit-faction,#add-faction-member,[data-edit-member],[data-remove-member]):hover{border-color:var(--btn-acc,#ffc45b)!important;color:var(--btn-acc,#ffc45b)!important}
/* copy-link buttons */
html body #community-app#community-app .post-controls>.post-copy-link{width:26px!important;padding:0!important;display:inline-grid!important;place-items:center}
html body #community-app#community-app [data-copy-link]{position:relative}
html body #community-app#community-app [data-copy-link].is-copied{border-color:#5fd08d!important;color:#5fd08d!important}
html body #community-app#community-app [data-copy-link].is-copied::after{content:attr(data-copied-tip);position:absolute;right:calc(100% + 8px);top:50%;transform:translateY(-50%);white-space:nowrap;padding:4px 8px;border-radius:6px;background:#0b1018f2;border:1px solid #5fd08d66;color:#cfeedd;font:700 10.5px/1 'Segoe UI',sans-serif;letter-spacing:.06em;text-transform:uppercase;pointer-events:none;z-index:10}
html body #community-app#community-app .forum-post.is-linked{outline:2px solid var(--color-accent-default,#ffc45b);outline-offset:3px;transition:outline-color 2s ease}
/* narrow screens: info panel from the thumbnail */
@media(max-width:1199px){
 html body #community-app#community-app .forum-post .post-portrait-reveal.post-flip-card{cursor:pointer}
 html body #community-app#community-app .post-info-sheet{grid-column:1/-1;position:relative;display:flex;flex-direction:column;gap:10px;margin:0 12px 12px;padding:14px 14px 12px;border-radius:12px;background:linear-gradient(170deg,color-mix(in srgb,var(--character-color) 16%,#0c1115),color-mix(in srgb,var(--character-secondary) 30%,#0a0e12));border:1px solid color-mix(in srgb,var(--character-color) 45%,transparent)}
 html body #community-app#community-app .post-info-sheet .post-stat-tiles{display:grid!important;margin:0!important;max-width:360px}
 html body #community-app#community-app .post-info-sheet .post-last-online{display:block!important;text-align:left;margin:0}
 html body #community-app#community-app .post-info-back{display:flex;flex-direction:column;gap:8px}
 html body #community-app#community-app .post-info-back .dossier-spacer{display:none}
 html body #community-app#community-app .post-info-back .dossier-tags{display:flex;flex-wrap:wrap;gap:5px}
 html body #community-app#community-app .post-info-back .dossier-tags i{display:inline-flex;align-items:center;gap:5px;font:800 11px/1 'Segoe UI',sans-serif;font-style:normal;letter-spacing:.6px;text-transform:uppercase;padding:4px 7px;border-radius:4px;background:color-mix(in srgb,var(--character-color) 16%,transparent);border:1px solid color-mix(in srgb,var(--character-color) 35%,transparent)}
 html body #community-app#community-app .post-info-back .dossier-tags .designation-icon{width:13px;height:13px;display:inline-grid;color:var(--character-color)}
 html body #community-app#community-app .post-info-back .dossier-quote{margin:0;padding:8px 10px;border-left:2px solid var(--character-color);background:color-mix(in srgb,var(--character-color) 9%,transparent);border-radius:0 6px 6px 0;font:italic 13.5px/1.45 Georgia,serif;color:#f1ebdf}
 html body #community-app#community-app .post-info-back .dossier-btn-row{display:flex;gap:8px}
 html body #community-app#community-app .post-info-back :is(.dossier-icon-btn,.dossier-music-btn){width:42px;height:38px;display:grid;place-items:center;border-radius:8px;border:1px solid color-mix(in srgb,var(--character-color) 50%,transparent);background:#0b0f14aa;color:var(--character-color);cursor:pointer}
 html body #community-app#community-app .post-info-back .dossier-music-btn{color:#1ed760;border-color:#1db95466}
 html body #community-app#community-app .post-info-back .dossier-dm-btn{color:#8ea1ff}
 html body #community-app#community-app .post-info-back .dossier-player{display:flex;align-items:center;gap:8px;padding-top:8px;border-top:1px solid #ffffff1c}
 html body #community-app#community-app .post-info-back .dossier-player-av{width:30px;height:30px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#1a2230}
 html body #community-app#community-app .post-info-back .dossier-player-av img{width:100%;height:100%;object-fit:cover}
 html body #community-app#community-app .post-info-back .dossier-player>span:last-child{display:flex;flex-direction:column}
 html body #community-app#community-app .post-info-back .dossier-player small{font:800 9px/1 'Segoe UI',sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:#9aa3ad}
 html body #community-app#community-app .post-info-back .dossier-player strong{font:700 13px/1.3 'Segoe UI',sans-serif;color:#f3eee4}
 html body #community-app#community-app .post-info-close{position:absolute;top:8px;right:10px;width:28px;height:28px;border-radius:8px;border:1px solid #ffffff26;background:#161c22;color:#e6e1d6;font-size:18px;line-height:1;cursor:pointer}
}
@media(max-width:650px){
 html body #community-app#community-app .post-info-sheet{position:fixed;left:0;right:0;bottom:0;z-index:100000;margin:0;border-radius:16px 16px 0 0;max-height:75vh;overflow:auto;box-shadow:0 -12px 40px #000c;animation:info-sheet-up .25s ease-out}
}
@keyframes info-sheet-up{from{transform:translateY(100%)}to{transform:none}}
/* a soft shadow spreads out from the folded corner to draw the eye to it */
@media(min-width:1200px){
 html body #community-app#community-app .post-flip-front::after,html body #community-app#community-app .post-flip-back::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:3;opacity:0;transition:opacity .3s ease;background:radial-gradient(circle at 100% 0,rgb(0 0 0/.55) 0,rgb(0 0 0/.28) calc(var(--peel) * 1.6),transparent calc(var(--peel) * 3.6))}
 html body #community-app#community-app .post-flip-back::after{background:radial-gradient(circle at 100% 0,rgb(0 0 0/.55) 0,rgb(0 0 0/.28) calc(var(--bpeel) * 1.6),transparent calc(var(--bpeel) * 3.6))}
 html body #community-app#community-app .post-flip-card.is-peeking:not(.is-flipped) .post-flip-front::after,html body #community-app#community-app .post-flip-card.is-flipped.is-peeking:not(.is-unpeeling) .post-flip-back::after{opacity:1}
 html body #community-app#community-app .post-flip-card.is-flipped .post-flip-front::after{opacity:0!important}
}
/* designation tile (no faction): the symbol alone, colours reversed: bright fill, dark symbol */
html body #community-app#community-app .post-stat-tiles .pst-faction.is-designation{background:var(--character-color)!important;border-color:var(--character-color)!important;position:relative;overflow:visible!important}
html body #community-app#community-app .pst-faction.is-designation .pst-mark{width:36px!important;height:36px!important}
html body #community-app#community-app .pst-faction.is-designation .pst-mark .designation-icon{width:34px!important;height:34px!important}
html body #community-app#community-app .pst-faction.is-designation .pst-mark .designation-icon,html body #community-app#community-app .pst-faction.is-designation .pst-mark .designation-icon svg,html body #community-app#community-app .pst-faction.is-designation .pst-mark>b{color:color-mix(in srgb,var(--character-secondary) 70%,#000)!important;fill:color-mix(in srgb,var(--character-secondary) 70%,#000)!important}
html body #community-app#community-app .pst-faction.is-designation[data-tip]::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 7px);right:-2px;white-space:nowrap;padding:6px 10px;border-radius:6px;background:var(--character-color);color:color-mix(in srgb,var(--character-secondary) 70%,#000);font:800 11px/1 'Segoe UI',sans-serif;letter-spacing:.06em;text-transform:uppercase;box-shadow:0 6px 16px #000a;opacity:0;pointer-events:none;transition:opacity .15s ease;z-index:10}
html body #community-app#community-app .pst-faction.is-designation[data-tip]:hover::after{opacity:1}
/* card back as an ID card: labelled rows that fill the space evenly */
@media(min-width:1200px){
 html body #community-app#community-app .post-flip-back{gap:10px!important;padding:14px 13px 10px!important}
 html body #community-app#community-app .dossier-facts{flex:1 1 auto;display:flex;flex-direction:column;justify-content:space-between;min-height:0;gap:6px}
 html body #community-app#community-app .df-row{display:flex;flex-direction:column;gap:3px;padding-bottom:6px;border-bottom:1px solid color-mix(in srgb,var(--character-color) 18%,transparent)}
 html body #community-app#community-app .df-row:last-child{border-bottom:0;padding-bottom:0}
 html body #community-app#community-app .df-k{font:800 9px/1 'Segoe UI',sans-serif;letter-spacing:1.6px;text-transform:uppercase;color:color-mix(in srgb,var(--character-color) 75%,#fff)}
 html body #community-app#community-app .df-v{display:flex;align-items:center;gap:6px;font:700 15px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;color:#f3eee4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 html body #community-app#community-app .df-v .designation-icon{flex:none;width:15px;height:15px;display:inline-grid;margin:0;color:var(--character-color)}
 html body #community-app#community-app .df-v .designation-icon svg{width:100%;height:100%}
 html body #community-app#community-app .post-flip-back>.dossier-spacer{display:none}
 html body #community-app#community-app .post-flip-back>.dossier-quote{-webkit-line-clamp:3!important;flex:none!important}
 html body #community-app#community-app .dossier-btn-row{margin-top:0!important}
}
@media(max-width:1199px){html body #community-app#community-app .post-info-back .dossier-facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
 html body #community-app#community-app .post-info-back .df-row{display:flex;flex-direction:column;gap:3px}
 html body #community-app#community-app .post-info-back .df-k{font:800 9px/1 'Segoe UI',sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:var(--character-color)}
 html body #community-app#community-app .post-info-back .df-v{font:700 14px/1.2 'Segoe UI',sans-serif;color:#f3eee4;display:flex;gap:5px;align-items:center}
 html body #community-app#community-app .post-info-back .df-v .designation-icon{width:14px;height:14px;display:inline-grid;color:var(--character-color)}}
@media(max-width:1199px){html body #community-app#community-app .thread-reading-area .forum-post>.post-info-sheet{grid-row:2!important}html body #community-app#community-app .thread-reading-area .forum-post:has(>.post-info-sheet)>.post-body{grid-row:3!important}}
@media(min-width:1200px){
 html body #community-app#community-app .dossier-facts{flex:none!important;display:grid!important;grid-template-columns:1fr 1fr;gap:9px 10px!important}
 html body #community-app#community-app .df-row{padding-bottom:7px!important;border-bottom:1px solid color-mix(in srgb,var(--character-color) 18%,transparent)!important}
 html body #community-app#community-app .df-row:first-child{grid-column:1/-1}
 html body #community-app#community-app .df-row:nth-last-child(-n+2){border-bottom:0!important;padding-bottom:0!important}
 html body #community-app#community-app .df-v{font-size:14px!important}
 html body #community-app#community-app .df-row:first-child .df-v{font-size:17px!important}
 html body #community-app#community-app .post-flip-back>.dossier-spacer{display:block!important;flex:1 1 0!important;min-height:0}
 html body #community-app#community-app .post-flip-back>.dossier-quote{-webkit-line-clamp:4!important}
}
@media(min-width:1200px){html body #community-app#community-app .dossier-facts{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}html body #community-app#community-app .df-row{min-width:0}}
/* hover fold appears immediately (fast), the full peel keeps its slower motion */
@media(min-width:1200px){
 html body #community-app#community-app .post-flip-card{transition:--peel .14s ease-out,--bpeel .14s ease-out!important}
 html body #community-app#community-app .post-flip-card.is-flipped:not(.is-unpeeling){transition:--peel .75s cubic-bezier(.45,.05,.25,1),--bpeel .14s ease-out!important}
 html body #community-app#community-app .post-flip-front::after,html body #community-app#community-app .post-flip-back::after{transition:opacity .14s ease-out!important}
}
/* card back: one fact per row (faction lives in the faction tile) */
@media(min-width:1200px){
 html body #community-app#community-app .dossier-facts{grid-template-columns:minmax(0,1fr)!important;gap:8px!important}
 html body #community-app#community-app .df-row:first-child{grid-column:auto}
 html body #community-app#community-app .df-row{flex-direction:row!important;align-items:baseline;justify-content:space-between;gap:10px!important;padding-bottom:7px!important;border-bottom:1px solid color-mix(in srgb,var(--character-color) 18%,transparent)!important}
 html body #community-app#community-app .df-row:nth-last-child(-n+2){border-bottom:1px solid color-mix(in srgb,var(--character-color) 18%,transparent)!important;padding-bottom:7px!important}
 html body #community-app#community-app .df-row:last-child{border-bottom:0!important;padding-bottom:0!important}
 html body #community-app#community-app .df-k{flex:none}
 html body #community-app#community-app .df-v,html body #community-app#community-app .df-row:first-child .df-v{font-size:15px!important;min-width:0;justify-content:flex-end;text-align:right}
}
/* faction colour carries to its containers */
html body #community-app#community-app .std-box.is-faction-box{border-color:color-mix(in srgb,var(--faction-color) 55%,transparent)!important;background:linear-gradient(180deg,color-mix(in srgb,var(--faction-color) 10%,#080b10e0),#080b10e0 420px)!important;box-shadow:0 16px 40px rgb(0 0 0/.7),0 0 0 1px color-mix(in srgb,var(--faction-color) 18%,transparent),0 0 40px color-mix(in srgb,var(--faction-color) 14%,transparent)!important}
html body #community-app#community-app .std-box.is-faction-box>.box-bar{background:color-mix(in srgb,var(--faction-color) 16%,#0b0f14)!important;border-bottom-color:color-mix(in srgb,var(--faction-color) 45%,transparent)!important}
html body #community-app#community-app .std-box.is-faction-box>.box-bar .box-bar-title{color:color-mix(in srgb,var(--faction-color) 70%,#fff)!important}
html body #community-app#community-app .fx-card{background:linear-gradient(180deg,color-mix(in srgb,var(--faction-color) 14%,#0d1217),#0d1217 70%)!important;border-color:color-mix(in srgb,var(--faction-color) 60%,transparent)!important}
html body #community-app#community-app .fx-card:hover{border-color:var(--faction-color)!important;box-shadow:0 10px 26px #0008,0 0 22px color-mix(in srgb,var(--faction-color) 25%,transparent)!important}
/* faction hover label: exact size, optional glow, same fade as the other hover labels */
html body #community-app#community-app .pst-faction[data-tip]::after,html body #community-app#community-app .pst-faction.is-designation[data-tip]::after,html body #community-app#community-app .dossier-btn-row [data-tip]::after{transition:opacity .2s ease,transform .2s ease!important}
html body #community-app#community-app .pst-faction:not(.is-designation)[data-tip]::after{font:800 var(--faction-tip-size,11px)/1.25 'Segoe UI',sans-serif!important;letter-spacing:.06em;padding:.55em .9em!important;text-shadow:var(--faction-tip-glow,none);border-width:1px!important}
.fx-tip-set{border:1px solid #ffffff1f;border-radius:10px;padding:10px 14px 14px;margin:6px 0 12px}
.fx-tip-set legend{padding:0 6px;font:800 11px/1 'Segoe UI',sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:#cfc7b8}
.fx-tip-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px 14px;align-items:end}
.fx-tip-grid label.is-off{opacity:.4}
.fx-tip-check{display:flex!important;flex-direction:row!important;align-items:center;gap:8px;min-height:36px}
.fx-tip-check input{width:auto!important;margin:0}
.fx-tip-preview{display:flex;align-items:center;gap:14px;margin-top:12px;padding:12px;border-radius:8px;background:#0b0f14;border:1px dashed #ffffff1f}
.fx-tip-sample{flex:none;padding:.55em .9em;border-radius:6px;background:var(--faction-color);color:var(--faction-tip,#fff);border:1px solid color-mix(in srgb,var(--faction-tip,#fff) 40%,transparent);font:800 var(--faction-tip-size,11px)/1.25 'Segoe UI',sans-serif;letter-spacing:.06em;text-transform:uppercase;text-shadow:var(--faction-tip-glow,none);box-shadow:0 6px 16px #000a;max-width:220px}
.fx-tip-preview small{color:#9d978c;font-size:12px;line-height:1.4}
/* faction roster member cards: name and player on separate lines */
html body #community-app#community-app .fx-detail .faction-member-info{display:flex!important;flex-direction:column;gap:2px;min-width:0}
html body #community-app#community-app .fx-detail .faction-member-info small{font-size:12px;color:#a49d90!important}
/* scrollbars always use the theme accent, never a character's colour */
#community-app#community-app *{--scrollbar-accent:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,#3a3f41)}
/* ==== NEW THREAD: opens inside the location box like a thread ==== */
html body #community-app#community-app .location-content-panel.is-composing{overflow-y:auto;scrollbar-gutter:stable}
html body #community-app#community-app .location-content-panel.is-composing>[hidden]{display:none!important}
html body #community-app#community-app .dispatch-navigation:has(~.location-content-panel.is-composing) .std-pager{visibility:hidden}
html body #community-app#community-app .thread-compose-view{all:unset;display:flex;flex-direction:column;gap:14px;box-sizing:border-box;width:100%;padding:22px 26px 26px;color:#e6e1d6}
html body #community-app#community-app .tc-head{display:flex;flex-direction:column;gap:6px;padding-bottom:14px;border-bottom:1px solid #ffffff14}
html body #community-app#community-app .tc-kicker{display:flex;gap:10px;font:800 11px/1 Consolas,monospace;letter-spacing:2.2px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .tc-kicker span:last-child{color:#9aa3a8}
html body #community-app#community-app .thread-compose-view .tc-title,html body #community-app#community-app .thread-compose-view .tc-subtitle{all:unset;box-sizing:border-box;width:100%;border-bottom:1px dashed transparent;transition:border-color .15s ease}
html body #community-app#community-app .thread-compose-view .tc-title{margin-top:4px;padding:2px 0 4px;font:700 32px/1.1 var(--font-control-title,'Segoe UI'),sans-serif;letter-spacing:.02em;text-transform:uppercase;color:#f6f1e7}
html body #community-app#community-app .thread-compose-view .tc-subtitle{padding:2px 0 4px;font:italic 400 16px/1.4 var(--font-control-ui,'Segoe UI'),sans-serif;color:#c9c2b4}
html body #community-app#community-app .thread-compose-view :is(.tc-title,.tc-subtitle)::placeholder{color:#ffffff40}
html body #community-app#community-app .thread-compose-view :is(.tc-title,.tc-subtitle):is(:hover,:focus){border-bottom-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent)}
/* tags as small chips */
html body #community-app#community-app .thread-tag-fields.is-compact{all:unset;display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}
html body #community-app#community-app .tag-chips-label{font:800 10px/1 Consolas,monospace;letter-spacing:2px;text-transform:uppercase;color:#8d949a;margin-right:2px}
html body #community-app#community-app .is-compact .thread-tag-select{all:unset;position:relative;display:block}
html body #community-app#community-app .is-compact .thread-tag-select>summary{list-style:none;display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:var(--btn-radius,8px);background:var(--btn-bg,#161c22);border:1px solid var(--btn-border,#ffffff26);color:var(--btn-fg,#e6e1d6);font:700 12px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer;transition:border-color .15s,color .15s}
html body #community-app#community-app .is-compact .thread-tag-select>summary::-webkit-details-marker{display:none}
html body #community-app#community-app .is-compact .thread-tag-select>summary::before{content:'+';font-weight:800;color:var(--btn-acc,#ffc45b)}
html body #community-app#community-app .is-compact .thread-tag-select>summary span{display:contents}
html body #community-app#community-app .is-compact .tag-count:empty{display:none}
html body #community-app#community-app .is-compact .tag-count{min-width:16px;height:16px;padding:0 4px;box-sizing:border-box;border-radius:8px;background:var(--btn-acc,#ffc45b);color:#12100b;font:800 10px/16px 'Segoe UI',sans-serif;text-align:center}
html body #community-app#community-app .is-compact .thread-tag-select:is([open],:hover)>summary{border-color:var(--btn-acc,#ffc45b);color:var(--btn-acc,#ffc45b)}
html body #community-app#community-app .is-compact .thread-tag-select>div{position:absolute;left:0;top:calc(100% + 6px);z-index:20;display:flex;flex-direction:column;gap:2px;min-width:200px;max-width:280px;max-height:260px;overflow-y:auto;padding:6px;border-radius:10px;background:#0d1217f7;border:1px solid #ffffff24;box-shadow:0 14px 30px #000b}
html body #community-app#community-app .is-compact .thread-tag-select>div label{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:6px;font:600 13px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;color:#e6e1d6;cursor:pointer;text-transform:none;letter-spacing:0}
html body #community-app#community-app .is-compact .thread-tag-select>div label:hover{background:#ffffff0f}
html body #community-app#community-app .is-compact .thread-tag-select>div input{accent-color:var(--btn-acc,#ffc45b);margin:0}
html body #community-app#community-app .tag-picked{display:contents}
html body #community-app#community-app .tag-pick{all:unset;display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 8px;border-radius:5px;cursor:pointer;background:color-mix(in srgb,var(--btn-acc,#ffc45b) 14%,transparent);border:1px solid color-mix(in srgb,var(--btn-acc,#ffc45b) 45%,transparent);color:#ffe3b0;font:800 11px/1 Consolas,monospace;letter-spacing:1px;text-transform:uppercase}
html body #community-app#community-app .tag-pick span{opacity:.6}
html body #community-app#community-app .tag-pick:hover span{opacity:1}
/* ==== COMPOSER FOOT: templates bottom-left, posting as + preview + actions bottom-right ==== */
html body #community-app#community-app .composer-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:10px}
html body #community-app#community-app .composer-foot-start,html body #community-app#community-app .composer-foot-end{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
html body #community-app#community-app .composer-foot-end{margin-left:auto}
html body #community-app#community-app .composer-foot .composer-template-picker{margin:0}
html body #community-app#community-app .composer-foot .composer-template-picker>summary,html body #community-app#community-app .composer-foot-end>button{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;box-sizing:border-box;border-radius:var(--btn-radius,8px)!important;background:var(--btn-bg,#161c22)!important;border:1px solid var(--btn-border,#ffffff26)!important;color:var(--btn-fg,#e6e1d6)!important;font:700 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;box-shadow:none!important;cursor:pointer;transition:border-color .15s,color .15s,background .15s}
html body #community-app#community-app .composer-foot .composer-template-picker>summary::after{content:'';width:7px;height:7px;border:solid currentColor;border-width:0 2px 2px 0;transform:translateY(-2px) rotate(45deg);margin-left:2px}
html body #community-app#community-app .composer-foot .composer-template-picker>summary:hover,html body #community-app#community-app .composer-foot .composer-template-picker[open]>summary,html body #community-app#community-app .composer-foot-end>button:is(:hover,:focus-visible){border-color:var(--btn-acc,#ffc45b)!important;color:var(--btn-acc,#ffc45b)!important;background:color-mix(in srgb,var(--btn-acc,#ffc45b) 10%,var(--btn-bg,#161c22))!important}
html body #community-app#community-app .composer-foot-end>button:is([type=submit],.is-primary){background:color-mix(in srgb,var(--btn-acc,#ffc45b) 16%,#161c22)!important;border-color:color-mix(in srgb,var(--btn-acc,#ffc45b) 60%,transparent)!important;color:#ffe3b0!important}
html body #community-app#community-app .composer-foot-end>.composer-preview-btn[aria-pressed=true]{background:var(--btn-acc,#ffc45b)!important;border-color:var(--btn-acc,#ffc45b)!important;color:#12100b!important}
html body #community-app#community-app .composer-foot .composer-template-menu{top:calc(100% + 6px)}
/* preview pane, in the editor's place */
html body #community-app#community-app .composer-preview{position:relative;box-sizing:border-box;padding:26px 22px 18px;border-radius:10px;background:#0b1015;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 35%,transparent)}
html body #community-app#community-app .composer-preview[hidden]{display:none!important}
html body #community-app#community-app .composer-preview-tag{position:absolute;top:8px;left:12px;font:800 10px/1 Consolas,monospace;letter-spacing:2px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .composer-preview>.forum-rich{font:400 15.5px/1.7 var(--font-control-ui,'Segoe UI'),sans-serif;color:#e2ddd2;border:0!important;background:none!important;padding:0!important;min-height:0!important;outline:0!important}
html body #community-app#community-app .composer-preview-empty{color:#8d949a;font-style:italic}
html body #community-app#community-app .forum-composer.is-previewing .forum-toolbar-host{opacity:.35;pointer-events:none}
html body #community-app#community-app .forum-composer>.forum-rich[hidden]{display:none!important}
/* posting as: one compact button with a dropdown */
html body #community-app#community-app .post-as-picker.is-drop{all:unset;position:relative;display:block}
html body #community-app#community-app .post-as-current{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 10px 0 4px;border-radius:var(--btn-radius,8px);background:var(--btn-bg,#161c22);border:1px solid color-mix(in srgb,var(--character-color,#ffc45b) 45%,var(--btn-border,#ffffff26));color:var(--btn-fg,#e6e1d6);cursor:pointer;transition:border-color .15s}
html body #community-app#community-app .post-as-current:is(:hover,:focus-visible),html body #community-app#community-app .post-as-picker.is-open .post-as-current{border-color:var(--character-color,#ffc45b)}
html body #community-app#community-app .post-as-current>small{order:-1;padding-left:8px;font:800 9px/1 Consolas,monospace;letter-spacing:1.6px;text-transform:uppercase;color:#8d949a}
html body #community-app#community-app .post-as-current .post-as-portrait{width:26px;height:26px;flex:none;border-radius:6px;overflow:hidden;background:color-mix(in srgb,var(--character-color,#ffc45b) 25%,#0b0f14);border:1px solid var(--character-color,#ffc45b)}
html body #community-app#community-app .post-as-current .post-as-portrait img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
html body #community-app#community-app .post-as-picker.is-drop .is-member .post-as-portrait,html body #community-app#community-app .post-as-current[data-member-author] .post-as-portrait{border-radius:50%}
html body #community-app#community-app .post-as-current .post-as-text{display:flex;flex-direction:column;gap:2px;min-width:0}
html body #community-app#community-app .post-as-current .post-as-text strong{font:700 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;color:#f3eee4}
html body #community-app#community-app .post-as-current .post-as-text small{font:700 10px/1 var(--font-control-ui,'Segoe UI'),sans-serif;color:var(--character-color,#ffc45b);letter-spacing:.04em}
html body #community-app#community-app .post-as-caret{color:#9aa3a8;margin-left:2px}
html body #community-app#community-app .post-as-picker.is-drop>.post-as-options{display:none;position:absolute;right:0;bottom:calc(100% + 6px);z-index:30;flex-direction:column;gap:2px;min-width:240px;max-height:320px;overflow-y:auto;padding:6px;border-radius:10px;background:#0d1217f7;border:1px solid #ffffff24;box-shadow:0 14px 30px #000b}
html body #community-app#community-app .post-as-picker.is-drop.is-open>.post-as-options{display:flex}
html body #community-app#community-app .post-as-picker.is-drop .post-as-option{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:7px;cursor:pointer;border:1px solid transparent}
html body #community-app#community-app .post-as-picker.is-drop .post-as-option:hover{background:#ffffff0d}
html body #community-app#community-app .post-as-picker.is-drop .post-as-option:has(input:checked){border-color:color-mix(in srgb,var(--character-color) 55%,transparent);background:color-mix(in srgb,var(--character-color) 10%,transparent)}
html body #community-app#community-app .post-as-picker.is-drop .post-as-option input{position:absolute;opacity:0;pointer-events:none}
html body #community-app#community-app .post-as-picker.is-drop .post-as-option .post-as-portrait{width:30px;height:30px;flex:none;border-radius:6px;overflow:hidden;background:color-mix(in srgb,var(--character-color) 25%,#0b0f14);border:1px solid var(--character-color)}
html body #community-app#community-app .post-as-picker.is-drop .post-as-option .post-as-portrait img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
html body #community-app#community-app .post-as-picker.is-drop .post-as-option .post-as-text{display:flex;flex-direction:column;gap:3px}
html body #community-app#community-app .post-as-picker.is-drop .post-as-option strong{font:700 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;color:#f3eee4}
html body #community-app#community-app .post-as-picker.is-drop .post-as-option small{font:700 10.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;color:var(--character-color)}
html body #community-app#community-app .thread-compose-view .forum-compose-error:empty{display:none}
/* quick reply preview */
html body #community-app#community-app .quick-reply textarea[hidden]{display:none!important}
/* the new-thread view sits on the same dark panel a thread does */
html body #community-app#community-app .location-content-panel.is-composing{background:rgb(13 16 19 / .93)!important;border-radius:0 0 12px 12px;flex:1 1 auto;min-height:0;max-height:calc(100dvh - 58px - 2 * var(--page-gap,54px) - 56px)}
html body #community-app#community-app .thread-compose-view .tc-subtitle::placeholder{color:#ffffff59}
/* ==== FACTION PAGE: stronger faction colour, roster, notes ==== */
html body #community-app#community-app .std-box.is-faction-box{background:linear-gradient(180deg,color-mix(in srgb,var(--faction-color) 30%,#0b0f14) 0,color-mix(in srgb,var(--faction-color) 16%,#0b0f14) 380px,color-mix(in srgb,var(--faction-color) 10%,#0b0f14) 100%)!important;border-color:color-mix(in srgb,var(--faction-color) 70%,transparent)!important}
html body #community-app#community-app .std-box.is-faction-box>.box-bar{background:color-mix(in srgb,var(--faction-color) 34%,#0b0f14)!important}
html body #community-app#community-app .fx-detail-head{border-bottom-color:color-mix(in srgb,var(--faction-color) 40%,transparent)!important}
html body #community-app#community-app .fx-detail-title small{color:color-mix(in srgb,var(--faction-color) 55%,#fff)!important}
html body #community-app#community-app .fx-sec-head{display:flex;align-items:center;gap:12px;margin:0 0 14px;padding-bottom:10px;border-bottom:2px solid color-mix(in srgb,var(--faction-color) 60%,transparent)}
html body #community-app#community-app .fx-sec-head h3{margin:0;font:800 14px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;letter-spacing:2.4px;text-transform:uppercase;color:color-mix(in srgb,var(--faction-color) 45%,#fff)!important}
html body #community-app#community-app .fx-sec-head h3 span{margin-left:6px;padding:2px 7px;border-radius:10px;background:color-mix(in srgb,var(--faction-color) 40%,#0b0f14);color:#fff;font-size:11px;letter-spacing:0}
html body #community-app#community-app .fx-sec-head>button,html body #community-app#community-app .fx-sec-tools{margin-left:auto}
html body #community-app#community-app .fx-sec-tools{display:flex;gap:8px}
html body #community-app#community-app .fx-sec-head button{height:30px;padding:0 12px;border-radius:var(--btn-radius,8px)!important;background:var(--btn-bg,#161c22)!important;border:1px solid var(--btn-border,#ffffff26)!important;color:var(--btn-fg,#e6e1d6)!important;font:700 12.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;cursor:pointer}
html body #community-app#community-app .fx-sec-head button:hover{border-color:var(--btn-acc,#ffc45b)!important;color:var(--btn-acc,#ffc45b)!important}
html body #community-app#community-app .fx-sec-head #add-faction-member,html body #community-app#community-app .fx-sec-head #fx-note-add{background:color-mix(in srgb,var(--btn-acc,#ffc45b) 16%,#161c22)!important;border-color:color-mix(in srgb,var(--btn-acc,#ffc45b) 60%,transparent)!important;color:#ffe3b0!important}
html body #community-app#community-app .fx-empty{color:#a8a294;font-style:italic;margin:6px 4px}
/* roster */
html body #community-app#community-app .fx-roster{padding:22px 4px 8px}
html body #community-app#community-app .fx-role+.fx-role{margin-top:18px}
html body #community-app#community-app .fx-role h4{margin:0 0 10px 2px;font:800 11px/1 Consolas,monospace;letter-spacing:2px;text-transform:uppercase;color:color-mix(in srgb,var(--faction-color) 40%,#fff)}
html body #community-app#community-app .fx-members{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px 16px;padding:10px 10px 4px}
html body #community-app#community-app .fx-member{position:relative;display:flex;gap:14px;align-items:stretch;padding:12px 16px 12px 12px;border-radius:12px;background:linear-gradient(135deg,color-mix(in srgb,var(--character-color) 20%,#0d1217),#0d1217 70%);border:1px solid color-mix(in srgb,var(--character-color) 55%,transparent);box-shadow:0 8px 20px #0007,inset 0 1px 0 #ffffff0d;transition:border-color .15s,transform .15s}
html body #community-app#community-app .fx-member:hover{border-color:var(--character-color);transform:translateY(-1px)}
html body #community-app#community-app .fx-m-portrait{flex:none;width:72px;aspect-ratio:2/3;border-radius:8px;overflow:hidden;display:grid;place-items:center;background:color-mix(in srgb,var(--character-color) 25%,#0b0f14);border:2px solid var(--character-color);box-shadow:0 4px 12px #0008}
html body #community-app#community-app .fx-m-portrait img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
html body #community-app#community-app .fx-m-portrait b{font:800 26px/1 var(--font-control-title,'Segoe UI'),sans-serif;color:var(--character-color)}
html body #community-app#community-app .fx-m-info{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0;padding:2px 0}
html body #community-app#community-app .fx-m-name{font:700 19px/1.1 var(--font-control-title,'Segoe UI'),sans-serif;color:var(--character-color)!important;text-decoration:none!important;text-transform:uppercase;letter-spacing:.04em;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body #community-app#community-app .fx-m-name:hover{filter:brightness(1.2)}
html body #community-app#community-app .fx-m-alias{margin-top:-3px;font:italic 600 13px/1.1 var(--font-control-ui,'Segoe UI'),sans-serif;color:#e8e2d6}
html body #community-app#community-app .fx-m-title{display:inline-block;max-width:100%;padding:4px 9px;border-radius:5px;background:var(--faction-color);color:var(--faction-ink,#fff);font:800 11px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:1.2px;text-transform:uppercase;box-shadow:0 2px 8px #0006;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body #community-app#community-app .fx-m-player{all:unset;margin-top:auto;display:inline-flex;align-items:center;gap:7px;max-width:100%;padding:3px 9px 3px 3px;border-radius:14px;background:#0b0f14b3;border:1px solid #ffffff1a;color:var(--role-color,#e6e1d6);font:700 12.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer;transition:border-color .15s}
html body #community-app#community-app .fx-m-player:hover{border-color:var(--role-color,#ffffff66)}
html body #community-app#community-app .fx-m-player:disabled,html body #community-app#community-app .fx-m-player.is-none{cursor:default;color:#9aa3a8}
html body #community-app#community-app .fx-m-player span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body #community-app#community-app .fx-m-av{flex:none;width:20px;height:20px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#2a3138;font:800 9px/1 'Segoe UI',sans-serif;color:#fff}
html body #community-app#community-app .fx-m-av img{width:100%;height:100%;object-fit:cover}
html body #community-app#community-app .fx-m-edit{all:unset;position:absolute;top:-11px;right:-11px;z-index:2;width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#161c22;border:1px solid color-mix(in srgb,var(--character-color) 60%,#ffffff26);color:#e6e1d6;cursor:pointer;box-shadow:0 4px 12px #0009;opacity:.9;transition:opacity .15s,border-color .15s,color .15s,background .15s}
html body #community-app#community-app .fx-m-edit:hover,html body #community-app#community-app .fx-m-edit:focus-visible{opacity:1;border-color:var(--btn-acc,#ffc45b);color:#12100b;background:var(--btn-acc,#ffc45b)}
html body #community-app#community-app .fx-m-edit[data-tip]::after{content:attr(data-tip);position:absolute;right:calc(100% + 8px);top:50%;transform:translate(3px,-50%);white-space:nowrap;padding:5px 9px;border-radius:6px;background:#0b1018f2;border:1px solid #ffffff26;color:#f1ece2;font:700 10.5px/1 'Segoe UI',sans-serif;letter-spacing:.06em;text-transform:uppercase;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}
html body #community-app#community-app .fx-m-edit[data-tip]:hover::after{opacity:1;transform:translate(0,-50%)}
.fx-remove-member,.fx-note-delete{margin-top:8px;align-self:flex-start;background:#e0544a1f!important;border:1px solid #e0544a80!important;color:#ffc2b8!important;border-radius:8px;padding:8px 14px;cursor:pointer;font-weight:700}
/* discord profile popover */
.discord-pop{position:fixed;z-index:9999;padding:4px;border-radius:9px;background:#0d1217f7;border:1px solid #5865f2aa;box-shadow:0 12px 28px #000c;animation:discordPop .16s ease-out}
.discord-pop a{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:6px;color:#e6e8ff!important;text-decoration:none!important;font:700 13px/1 'Segoe UI',sans-serif}
.discord-pop a:hover{background:#5865f2}
@keyframes discordPop{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
/* faction notes: guidebook-style tabs inside the faction box */
html body #community-app#community-app .fx-notes{padding:18px 4px 6px}
html body #community-app#community-app .fx-notes.is-hidden-notes{opacity:.55}
html body #community-app#community-app .fx-notes-display{display:inline-flex!important;align-items:center;gap:6px;margin:0!important;padding:4px 10px;border-radius:14px;background:#0b0f14b3;border:1px solid #ffffff1f;font:700 12px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;color:#e6e1d6;text-transform:none!important;letter-spacing:0!important;cursor:pointer}
html body #community-app#community-app .fx-notes-display input{margin:0;accent-color:var(--faction-color)}
html body #community-app#community-app .fx-notes-off{margin:6px 4px;color:#a8a294;font-size:13px}
html body #community-app#community-app .fx-notes-box{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:start}
html body #community-app#community-app .fx-notes-body{min-height:160px;padding:18px 22px;border-radius:12px;background:#080b10cc;border:1px solid color-mix(in srgb,var(--faction-color) 40%,#ffffff14)}
html body #community-app#community-app .fx-notes-body h4{margin:0 0 12px;font:700 22px/1.15 var(--font-control-title,'Segoe UI'),sans-serif;color:color-mix(in srgb,var(--faction-color) 40%,#fff);text-transform:uppercase;letter-spacing:.03em}
html body #community-app#community-app .fx-notes-body .forum-rich{font:400 15px/1.7 var(--font-control-ui,'Segoe UI'),sans-serif;color:#e2ddd2;border:0!important;background:none!important;padding:0!important;min-height:0!important}
html body #community-app#community-app .fx-notes-tabs{display:flex;flex-direction:column;gap:8px;width:max-content;min-width:170px}
html body #community-app#community-app .fx-notes-tabs button{all:unset;box-sizing:border-box;width:100%;padding:10px 16px;border-radius:9px;border:2px solid color-mix(in srgb,var(--faction-color) 70%,transparent);background:#0b0f14cc;color:#f1ece2;font:600 15px/1 var(--font-control-title,'Segoe UI'),sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:background .15s,color .15s}
html body #community-app#community-app .fx-notes-tabs button:hover{background:color-mix(in srgb,var(--faction-color) 22%,#0b0f14)}
html body #community-app#community-app .fx-notes-tabs button.is-active{background:var(--faction-color);color:var(--faction-ink,#fff);border-color:var(--faction-color)}
.fx-note-editor .forum-rich{min-height:220px}
/* dialogs drag by their title */
#app-dialog #app-dialog-content>h2{cursor:move;user-select:none;touch-action:none}
/* ==== FACTION EDITOR: badge section ==== */
.fx-set-help{margin:0 0 12px!important;font-size:13px!important;line-height:1.5;color:#b9b2a5!important}
.fx-set-help b{color:#f1ece2}
.fx-badge-grid{display:flex;gap:18px;align-items:flex-start}
.fx-badge-fields{flex:1;display:grid;gap:10px;min-width:0}
.fx-badge-preview{flex:none;display:flex;flex-direction:column;align-items:center;gap:6px}
.fx-badge-preview>small{font:800 9.5px/1 Consolas,monospace;letter-spacing:1.6px;text-transform:uppercase;color:#8d949a}
.fx-badge-tile{width:84px;aspect-ratio:6/5;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border-radius:8px;background:var(--faction-color,#e8373a);border:2px solid color-mix(in srgb,var(--faction-color,#e8373a) 70%,#fff);box-shadow:0 6px 16px #0009;color:var(--badge-ink,#fff)}
.fx-badge-tile b{font:800 20px/1 'Segoe UI',sans-serif;letter-spacing:.06em}
.fx-badge-tile[data-len="4"] b{font-size:17px}.fx-badge-tile[data-len="5"] b{font-size:14px;letter-spacing:.03em}
.fx-badge-tile small{font:700 8.5px/1 'Segoe UI',sans-serif;letter-spacing:1px;text-transform:uppercase;opacity:.75}
.fx-badge-set .img-field{margin-top:14px!important}
html body #community-app#community-app .post-stat-tiles .pst-faction:not(.is-designation)>b[data-len="4"]{font-size:16px!important}
html body #community-app#community-app .post-stat-tiles .pst-faction:not(.is-designation)>b[data-len="5"]{font-size:13.5px!important;letter-spacing:.03em!important}
/* upload / paste row: text centred, matching heights */
#app-dialog .img-field-actions{align-items:center!important}
#app-dialog .img-field-actions>*,#app-dialog label.img-field-upload{height:36px!important;box-sizing:border-box!important}
#app-dialog label.img-field-upload{display:inline-flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;gap:6px;padding:0 14px!important;line-height:1!important;white-space:nowrap}
#app-dialog .img-field-actions input[type=url]{padding:0 12px!important;height:36px!important}
#app-dialog .img-field-actions button{display:inline-flex!important;align-items:center!important;justify-content:center!important;padding:0 12px!important;line-height:1!important}
/* ==== STANDARD HOVER LABEL (#dn-tip): above the element, centred, fades in; never clipped ==== */
html body #community-app#community-app [data-tip]::after{content:none!important;display:none!important}
#dn-tip{position:fixed;z-index:2147482000;left:0;top:0;pointer-events:none;max-width:240px;width:max-content;box-sizing:border-box;padding:6px 10px;border-radius:6px;background:#0b1018f2;border:1px solid #ffffff2e;color:#f1ece2;font:700 10.5px/1.25 'Segoe UI',sans-serif;letter-spacing:.06em;text-transform:uppercase;text-align:center;box-shadow:0 6px 16px #000a;opacity:0;transform:translateY(3px);transition:opacity .2s ease,transform .2s ease}
#dn-tip.is-below{transform:translateY(-3px)}
#dn-tip.is-on{opacity:1;transform:none}
#dn-tip.is-faction{background:var(--faction-color);color:var(--faction-tip,#fff);border-color:color-mix(in srgb,var(--faction-tip,#fff) 40%,transparent);font-size:var(--faction-tip-size,11px);font-weight:800;text-shadow:var(--faction-tip-glow,none);padding:.55em .9em}
#dn-tip.is-designation{background:var(--character-color);color:color-mix(in srgb,var(--character-secondary,#000) 70%,#000);border-color:transparent;font-weight:800;font-size:11px}
/* ==== CARD BACK: buttons and spacing ==== */
@media(min-width:1200px){
 html body #community-app#community-app .dossier-btn-row{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px!important;width:100%}
 html body #community-app#community-app .dossier-btn-row>.dossier-icon-btn{width:auto!important;height:38px!important;border-radius:8px!important}
 html body #community-app#community-app .dossier-btn-row>.dossier-id-btn{background:var(--character-color)!important;color:color-mix(in srgb,var(--character-secondary,#000) 55%,#05080b)!important}
 html body #community-app#community-app .dossier-btn-row>.dossier-id-btn:hover{filter:brightness(1.12)}
 html body #community-app#community-app .dossier-btn-row>.dossier-id-btn svg{width:22px!important;height:22px!important;stroke-width:2.1}
 html body #community-app#community-app .dossier-btn-row>.dossier-dm-btn{background:color-mix(in srgb,#5865f2 30%,#0d1217)!important;border-color:#7b86ff!important;color:#c9ceff!important}
 html body #community-app#community-app .dossier-btn-row>.dossier-dm-btn:hover{background:#5865f2!important;color:#fff!important}
 html body #community-app#community-app .dossier-btn-row>.dossier-music-btn{background:color-mix(in srgb,#1db954 22%,#0d1217)!important;border-color:#3ed07a!important;color:#b8f5cf!important}
 html body #community-app#community-app .dossier-btn-row>.dossier-music-btn:hover{background:#1db954!important;color:#06140b!important}
 html body #community-app#community-app .dossier-btn-row>.dossier-link-btn{background:color-mix(in srgb,var(--character-color) 18%,#0d1217)!important;border-color:color-mix(in srgb,var(--character-color) 70%,transparent)!important;color:#f1ece2!important}
 html body #community-app#community-app .dossier-btn-row>.dossier-link-btn:hover{border-color:var(--character-color)!important;color:var(--character-color)!important}
 html body #community-app#community-app .dossier-btn-row>.is-off{opacity:.38;cursor:default!important;filter:grayscale(.6)}
 html body #community-app#community-app .dossier-btn-row>.is-off *{cursor:default!important}
 html body #community-app#community-app .post-flip-back .dossier-player{margin-top:2px!important;padding-top:9px!important}
 html body #community-app#community-app .post-flip-back .dossier-facts{padding-bottom:2px}
}
/* designation tile (no faction): bigger symbol */
html body #community-app#community-app .post-stat-tiles .pst-faction.is-designation .pst-mark{width:48px!important;height:48px!important}
html body #community-app#community-app .post-stat-tiles .pst-faction.is-designation .pst-mark .designation-icon{width:46px!important;height:46px!important}
@media(min-width:1200px){html body #community-app#community-app .dossier-btn-row>.dossier-id-btn svg,html body #community-app#community-app .dossier-btn-row>.dossier-id-btn svg *{color:inherit!important;stroke:currentColor!important}}
/* Plotters folders: the slanted right edge continues up to meet the avatar ring (no gap) */
html body #community-app .ooc-folder .of-disc{right:-22px!important}
html body #community-app .ooc-folder .of-edges{top:-12px;right:-4px}
html body #community-app .ooc-folder .of-edges::before{clip-path:polygon(calc(100% - 3.25px) 0,calc(100% - 1.75px) 0,calc(100% - 4px - var(--slant)) 100%,calc(100% - 5.5px - var(--slant)) 100%)!important}
html body #community-app .ooc-folder .of-edges::after{clip-path:polygon(0 calc(100% - 1.5px),calc(100% - 4px - var(--slant)) calc(100% - 1.5px),calc(100% - 4px - var(--slant)) 100%,0 100%)!important}
/* Plotters folders: the player's characters as small circles (5 to a line) */
html body #community-app .ooc-folder .of-name{color:var(--role-color,#f4efe5)}
html body #community-app .ooc-folder .of-chars{display:grid;grid-template-columns:repeat(5,26px);gap:6px;margin-top:7px}
html body #community-app .ooc-folder .of-chars i{position:relative;width:26px;height:26px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 30%,#0b0f14);box-shadow:0 0 0 2px var(--c),0 2px 6px #0009;transition:transform .15s ease}
html body #community-app .ooc-folder .of-chars i:hover{transform:translateY(-2px) scale(1.08)}
html body #community-app .ooc-folder .of-chars img{width:100%;height:100%;object-fit:cover;object-position:top}
html body #community-app .ooc-folder .of-chars b{font:800 11px/1 'Segoe UI',sans-serif;color:#fff}
html body #community-app .ooc-folder .of-chars em{align-self:center;font:700 11px/1 'Segoe UI',sans-serif;color:#9aa3a8;font-style:normal}
/* a touch more life: lift and warm the folder on hover */
html body #community-app .ooc-folder{transition:transform .18s ease,filter .18s ease}
html body #community-app .ooc-folder:hover{transform:translateY(-3px);filter:drop-shadow(0 10px 18px #000a)}
html body #community-app .ooc-folder:hover{--edge:color-mix(in srgb,#ffc45b 75%,#fff 10%)}
/* guidebook tabs: all the same width, sized to the longest label (little empty space at the end) */
@media(min-width:651px){
 html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-body{grid-template-columns:minmax(0,1fr) max-content!important}
 html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-side{width:max-content!important;min-width:0!important;max-width:none!important;display:flex!important;flex-direction:column}
 html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-side .guide-tab{width:100%!important;box-sizing:border-box!important;padding-right:22px!important;white-space:nowrap}
}
/* minimized windows: flush with the bottom of the screen, taller, a little longer */
html body #community-app#community-app .minimized-sheet-dock{padding:0 8px 0!important;bottom:0!important}
html body #community-app#community-app .minimized-sheet-dock .minimized-character-file{min-height:40px;align-items:stretch;margin-bottom:0!important}
html body #community-app#community-app .minimized-sheet-dock .minimized-character-file button{padding:10px 13px!important;font-size:13px!important;line-height:1.2!important}
html body #community-app#community-app .minimized-sheet-dock .minimized-character-restore{min-width:150px;padding-right:2.6em!important;text-align:left}
html body #community-app#community-app .minimized-sheet-dock .minimized-file-drag{padding:8px 11px!important}


/* =====================================================================
   The World overview, open layout (like the Guidebook): one directory box on the left, no terminal
   around it. The page background IS the map (world-backdrop.js): hovering a place glides the camera
   there, framed inside .world-focus (the open area right of the box). City dots mark each location.
   ===================================================================== */
html body #community-app.world-open[data-world-location=overview] #site-backdrop{opacity:0!important}
html body #community-app#community-app[data-scene=world][data-world-location=overview] .world-backdrop{visibility:visible!important;display:block!important}
html body #community-app.world-open[data-world-location=overview] .world-backdrop::after{background:linear-gradient(90deg,#05070acc 0,#05070a66 30%,transparent 55%),radial-gradient(ellipse at 68% 55%,transparent 40%,#05070a99 100%),linear-gradient(180deg,#05070a80,transparent 16%)!important}
html body #community-app[data-world-location=overview] .world-location-pin{display:none}
html body #community-app[data-world-location=overview] #app-view>.dispatch-navigation{display:none!important}
html body #community-app#community-app[data-scene=world] #app-view.hz-overview{display:flex!important;flex-direction:column}
html body #community-app .world-overview{flex:1 1 auto;display:flex;align-items:stretch;gap:28px;min-height:0;height:100%;box-sizing:border-box}
html body #community-app#community-app .world-overview>.world-overview-box{flex:0 0 clamp(360px,28vw,460px);align-self:flex-start;max-height:100%;display:flex;flex-direction:column;background:#080b10d9}
html body #community-app#community-app .world-overview-box>.std-box-body{overflow:auto;min-height:0;padding:22px 22px 24px}
html body #community-app .world-focus{flex:1 1 auto;position:relative;min-width:0;pointer-events:none}
/* intro */
html body #community-app .world-overview-intro{display:flex;align-items:center;gap:16px;margin:0 0 20px}
html body #community-app .world-overview-intro .terminal-brand{font:italic 950 54px/1 'Segoe UI',sans-serif;letter-spacing:-4px;color:#eab66b;padding-right:4px}
html body #community-app .world-overview-intro p{margin:0 0 6px;font:700 10px/1 Consolas,monospace;letter-spacing:3px;text-transform:uppercase;color:#d8b36c}
html body #community-app .world-overview-intro h3{margin:0;font:800 21px/1.1 'Segoe UI',sans-serif;letter-spacing:.5px;text-transform:uppercase;color:#eef2f0}
html body #community-app .world-overview-label{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0 12px;border-top:1px solid #ffffff17;font:700 10px/1 Consolas,monospace;letter-spacing:2.5px;text-transform:uppercase;color:#8fb2ae}
html body #community-app .world-overview-label .terminal-status{display:inline-flex;align-items:center;gap:7px;margin:0;font:inherit;letter-spacing:inherit;color:#9fc7a6}
html body #community-app .world-overview-label .terminal-status-dot{width:7px;height:7px;border-radius:50%;background:#5fd48a;box-shadow:0 0 8px #5fd48a}
/* region heading */
html body #community-app .world-overview-region-title{display:flex;align-items:center;gap:10px;padding:10px 4px 10px 2px;margin:0 0 8px;border:0;border-bottom:1px solid #eab66b40;background:none;cursor:pointer;min-height:0;box-shadow:none}
html body #community-app .world-overview-region-title>span{font:800 17px/1.2 'Segoe UI',sans-serif;color:#f5e9d0}
html body #community-app .world-overview-region-title>small{font:700 10px/1 Consolas,monospace;letter-spacing:1px;color:#e6bd7e}
html body #community-app .world-overview-region-title>.territory-expand{margin-left:auto;width:26px;height:26px;display:grid;place-items:center;padding:0;border-radius:6px;border:1px solid #ffffff22;background:#ffffff0d;color:#eab66b;font-size:11px}
html body #community-app .world-overview-region-title.is-previewing>span,html body #community-app .world-overview-region-title:hover>span{color:#ffd58c}
/* city cards: taller, the city's own district map shows through on the right */
html body #community-app .world-overview .territory-child-cards{gap:10px}
html body #community-app .world-overview .territory-child-card{border:1px solid #ffffff1c;border-radius:10px;background:#0c1418;box-shadow:0 8px 22px #0008;transition:border-color .18s ease,transform .22s cubic-bezier(.22,.8,.2,1),box-shadow .18s ease;cursor:pointer}
html body #community-app .world-overview .territory-child-banner{opacity:.75;object-position:50% 45%;-webkit-mask-image:linear-gradient(90deg,transparent 18%,#000 70%);mask-image:linear-gradient(90deg,transparent 18%,#000 70%);transition:opacity .2s ease}
html body #community-app .world-overview .territory-child-content{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:6px;min-height:58px;align-content:center;padding:12px 16px;background:linear-gradient(90deg,#0c1418f5 0,#0c1418d0 45%,#0c141833 100%)!important}
html body #community-app .world-overview .territory-child-heading{justify-content:flex-start}
html body #community-app .world-overview .territory-child-heading>a{font:800 16px/1.2 'Segoe UI',sans-serif;color:#f5e9d0;text-shadow:0 1px 6px #000}
html body #community-app .world-overview .territory-last-post{display:grid!important;text-align:left!important;justify-items:start!important;margin:0;gap:2px}
html body #community-app .world-overview .territory-last-heading{justify-content:flex-start!important;width:auto;max-width:100%}
html body #community-app .world-overview .territory-child-card:is(:hover,:focus-within,.is-previewing){border-color:#eab66bcc;transform:translateX(4px);box-shadow:0 10px 26px #000a,0 0 0 1px #eab66b33,0 0 22px #eab66b22}
html body #community-app .world-overview .territory-child-card:is(:hover,:focus-within,.is-previewing) .territory-child-banner{opacity:1}
/* caption in the focus area */
html body #community-app .world-focus-caption{position:absolute;right:0;bottom:0;padding:12px 18px;border-left:3px solid #e3b752;background:#07121acc;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:0 8px 8px 0;box-shadow:0 10px 26px #0009;color:#e6eeea;min-width:190px}
html body #community-app .world-focus-caption>span,html body #community-app .world-focus-caption>small{display:block;font:700 9px/1.2 Consolas,monospace;letter-spacing:2px;text-transform:uppercase;color:#86afb0}
html body #community-app .world-focus-caption>strong{display:block;margin:6px 0 5px;font:800 20px/1.1 'Segoe UI',sans-serif;letter-spacing:.5px;text-transform:uppercase}
/* city markers on the map */
.world-map-markers{position:absolute;inset:0;z-index:1;pointer-events:none;display:none}
#community-app[data-scene=world][data-world-location=overview] .world-map-markers{display:block}
.world-map-marker{position:absolute;left:0;top:0;will-change:transform}
.world-map-marker>i{position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;background:#d69c4c;border:2px solid #ffe0a3;box-sizing:border-box;box-shadow:0 0 0 4px #d69c4c26,0 0 10px #eab86866;transition:transform .25s ease,box-shadow .25s ease}
.world-map-marker>b{position:absolute;left:12px;top:-8px;white-space:nowrap;font:700 10px/16px Consolas,monospace;letter-spacing:1.5px;text-transform:uppercase;color:#f3e3bf;text-shadow:0 1px 3px #000,0 0 8px #000;transition:opacity .25s ease,color .25s ease}
.world-map-markers.has-active .world-map-marker:not(.is-active)>b{opacity:.45}
.world-map-marker.is-active>i{transform:scale(1.45);box-shadow:0 0 0 6px #eab66b33,0 0 18px #ffd58c;animation:world-marker-pulse 1.6s ease-out infinite}
.world-map-marker.is-active>b{color:#ffd58c;font-size:12px}
@keyframes world-marker-pulse{0%{box-shadow:0 0 0 0 #ffd58c88,0 0 18px #ffd58c}100%{box-shadow:0 0 0 14px #ffd58c00,0 0 18px #ffd58c}}
@media(prefers-reduced-motion:reduce){.world-map-marker.is-active>i{animation:none}}
@media(max-width:900px){html body #community-app .world-overview{flex-direction:column}html body #community-app#community-app .world-overview>.world-overview-box{flex:none;width:100%}html body #community-app .world-focus{min-height:260px}}
.world-map-marker.is-left>b{left:auto;right:12px}
/* site events bar: the tag is a link to Site Events - glow + underline on hover */
html body #community-app .ix-alert .ixa-tag{transition:text-shadow .2s ease,box-shadow .2s ease,filter .2s ease}
html body #community-app .ix-alert .ixa-tag:is(:hover,:focus-visible){text-decoration:underline!important;text-decoration-thickness:2px!important;text-underline-offset:4px;box-shadow:0 0 18px color-mix(in srgb,var(--color-accent-default,#ffc45b) 75%,transparent),inset 0 0 0 1px #fff6;filter:brightness(1.12);text-shadow:0 0 8px #fff9}
html body #community-app .ix-alert .ixa-item em{display:none!important}
/* guidebook cards: same gold accents as the rest of the guidebook (not the blue) */
#community-app#community-app .handbook-prose .hb-card{border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 22%,transparent)!important;background:linear-gradient(180deg,color-mix(in srgb,var(--color-accent-default,#ffc45b) 6%,transparent),rgb(255 255 255/.01))!important}
#community-app#community-app[data-scene] .guide-layout .handbook-prose .hb-card h4{color:var(--color-accent-default,#ffc45b)!important}
#community-app#community-app .handbook-prose .hb-card ul{margin:0;padding-left:18px;display:grid;gap:8px;font-size:14px;line-height:1.6}
#community-app#community-app .handbook-prose .hb-card-alert{margin:0 0 14px;padding:18px 22px;border:2px solid #e0544a!important;background:linear-gradient(180deg,#e0544a24,#e0544a0a)!important}
#community-app#community-app[data-scene] .guide-layout .handbook-prose .hb-card-alert h4{color:#ff8a7a!important;font-size:26px!important}
#community-app#community-app .handbook-prose .hb-card-alert p+p{margin-top:10px!important}
#community-app#community-app .handbook-prose .hb-card-alert p strong{color:#fff}
/* ==== EDITOR TOOLBAR: one size for every control, icon groups, laid-out popouts ==== */
#community-app .rich-toolbar .rich-tools{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
#community-app .rich-toolbar :is(button,select,summary,input[type=number]){box-sizing:border-box!important;height:32px!important;min-height:32px!important;margin:0!important;border-radius:7px!important;font:700 12.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important}
#community-app .rich-toolbar :is(button,summary){display:inline-flex!important;align-items:center;justify-content:center;gap:6px;padding:0 11px!important;border:1px solid #ffffff2e!important;background:#161c22!important;color:#e6e1d6!important;cursor:pointer}
#community-app .rich-toolbar summary{list-style:none}
#community-app .rich-toolbar summary::-webkit-details-marker{display:none}
#community-app .rich-toolbar summary::after{content:'';width:6px;height:6px;border:solid currentColor;border-width:0 1.8px 1.8px 0;transform:translateY(-2px) rotate(45deg);margin-left:2px;opacity:.8}
#community-app .rich-toolbar :is(button,summary):hover{border-color:var(--color-accent-default,#ffc45b)!important;color:var(--color-accent-default,#ffc45b)!important}
#community-app .rich-toolbar button[aria-pressed=true]{background:var(--color-accent-default,#ffc45b)!important;color:#12100b!important;border-color:var(--color-accent-default,#ffc45b)!important}
#community-app .rich-toolbar .rich-icon-btn{width:32px!important;padding:0!important}
#community-app .rich-toolbar .rich-letter-btn{font:800 14px/1 Georgia,serif!important}
#community-app .rich-toolbar .rich-letter-btn[data-cmd=italic]{font-style:italic!important}
#community-app .rich-toolbar .rich-letter-btn[data-cmd=underline]{text-decoration:underline!important}
#community-app .rich-toolbar .rich-icon-group{display:inline-flex;gap:0;border-radius:7px;overflow:hidden}
#community-app .rich-toolbar .rich-icon-group>button{border-radius:0!important;margin-left:-1px!important}
#community-app .rich-toolbar .rich-icon-group>button:first-child{border-radius:7px 0 0 7px!important;margin-left:0!important}
#community-app .rich-toolbar .rich-icon-group>button:last-child{border-radius:0 7px 7px 0!important}
#community-app .rich-toolbar select{padding:0 8px!important;background:#0b0f14!important;border:1px solid #ffffff2e!important;color:#f1ece2!important}
#community-app .rich-toolbar label{gap:6px!important;font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;text-transform:uppercase;letter-spacing:.06em;color:#b9b2a5!important}
/* popouts: a titled, tidy panel */
#community-app .rich-more.rich-floating-panel{display:grid!important;gap:10px!important;padding:0 14px 14px!important;width:min(340px,calc(100vw - 20px))!important;border-radius:12px!important;background:#0d1217fa!important;border:1px solid #ffffff26!important;box-shadow:0 18px 40px #000d!important}
#community-app .rich-more.rich-floating-panel:not(:popover-open){display:none!important}
#community-app .rich-floating-panel .rich-panel-handle{display:flex;align-items:center;justify-content:space-between;margin:0 -14px 2px;padding:9px 10px 9px 14px;border-bottom:1px solid #ffffff1a;cursor:move}
#community-app .rich-floating-panel .rich-panel-handle strong{font:800 10.5px/1 Consolas,monospace;letter-spacing:1.6px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
#community-app .rich-floating-panel .rich-panel-handle button{all:unset;width:24px;height:24px;display:grid;place-items:center;border-radius:6px;cursor:pointer;font-size:16px;color:#9aa3a8}
#community-app .rich-floating-panel .rich-panel-handle button:hover{background:#ffffff14;color:#fff}
#community-app .rich-floating-panel label{display:grid!important;gap:5px!important;font:800 10px/1 'Segoe UI',sans-serif!important;letter-spacing:1.2px;text-transform:uppercase;color:#9aa3a8!important}
#community-app .rich-floating-panel :is(input:not([type=color]):not([type=checkbox]),select){width:100%!important;height:32px!important;box-sizing:border-box;padding:0 10px!important;border-radius:7px!important;border:1px solid #ffffff2e!important;background:#0b0f14!important;color:#f1ece2!important;font:600 13px/1 'Segoe UI',sans-serif!important;text-transform:none;letter-spacing:0}
#community-app .rich-floating-panel>button,#community-app .rich-floating-panel .rich-row-controls>button{height:32px;padding:0 12px;border-radius:7px;border:1px solid #ffffff2e;background:#161c22;color:#e6e1d6;font:700 12.5px/1 'Segoe UI',sans-serif;cursor:pointer;text-align:left}
#community-app .rich-floating-panel>button:hover,#community-app .rich-floating-panel .rich-row-controls>button:hover{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b)}
#community-app .rich-floating-panel>button:disabled{opacity:.45;cursor:default}
#community-app .rich-floating-panel .rich-row{display:grid;grid-template-columns:78px minmax(0,1fr);align-items:center;gap:10px}
#community-app .rich-floating-panel .rich-row-label{font:800 10px/1 'Segoe UI',sans-serif;letter-spacing:1.2px;text-transform:uppercase;color:#9aa3a8}
#community-app .rich-floating-panel .rich-row-controls{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-width:0}
#community-app .rich-floating-panel .rich-row-controls>input[type=number]{width:78px!important;flex:none}
#community-app .rich-floating-panel .rich-row-controls>select{flex:1}
#community-app .rich-floating-panel .rich-swatches{display:flex;flex-wrap:wrap;gap:6px}
#community-app .rich-floating-panel .rich-swatch{all:unset;width:26px;height:26px;border-radius:6px;border:1px solid #ffffff40;cursor:pointer;box-shadow:inset 0 0 0 1px #0006}
#community-app .rich-floating-panel .rich-swatch:hover{outline:2px solid #fff;outline-offset:1px}
#community-app .rich-floating-panel .rich-dohtml-btn{font-family:Consolas,monospace!important}
#community-app .rich-toolbar .rich-floating-panel .rich-swatch{width:26px!important;height:26px!important;min-height:0!important;padding:0!important;border-radius:6px!important;background:var(--sw)!important;border:1px solid #ffffff40!important}
/* ==== APPLICATIONS: draft factions and pending characters ==== */
html body #community-app#community-app .fx-draft-tag,html body #community-app#community-app .fx-card .fx-draft-tag{display:inline-block;margin-right:7px;padding:2px 6px;border-radius:4px;background:#ffc45b;color:#12100b;font:800 9.5px/1.2 'Segoe UI',sans-serif;letter-spacing:1px;text-transform:uppercase;vertical-align:1px}
html body #community-app#community-app .fx-pending-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:16px 0 0;padding:12px 16px;border-radius:10px;background:#ffc45b1a;border:1px solid #ffc45b66;color:#f1e6cf;font-size:14px}
html body #community-app#community-app .fx-pending-actions{display:flex;gap:8px}
html body #community-app#community-app .fx-pending-actions button,html body #community-app#community-app .cast-app-actions button{height:32px;padding:0 13px;border-radius:8px;font:700 12.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer}
html body #community-app#community-app #fx-approve{background:#2e8a5a33!important;border:1px solid #4fbf84!important;color:#cfe9d6!important}
html body #community-app#community-app #fx-approve:hover{background:#2e8a5a66!important}
html body #community-app#community-app #fx-delete-app,html body #community-app#community-app [data-delete-application]{background:#e0544a1f!important;border:1px solid #e0544a80!important;color:#ffc2b8!important}
html body #community-app#community-app #fx-delete-app:hover,html body #community-app#community-app [data-delete-application]:hover{background:#e0544a40!important}
html body #community-app#community-app .fx-pending-toggle{display:inline-flex;align-items:center;gap:7px}
html body #community-app#community-app .fx-pending-toggle span{min-width:18px;height:18px;padding:0 5px;box-sizing:border-box;border-radius:9px;background:#ffffff26;font:800 11px/18px 'Segoe UI',sans-serif;text-align:center}
html body #community-app#community-app .fx-pending-toggle.has-waiting span{background:#ffc45b;color:#12100b}
html body #community-app#community-app .cast-pending{margin-top:26px;padding-top:16px;border-top:1px solid #ffc45b40}
html body #community-app#community-app .cast-pending[hidden]{display:none}
html body #community-app#community-app .cast-pending-head{display:flex;align-items:center;gap:10px;margin:0 0 14px}
html body #community-app#community-app .cast-pending-head h3{margin:0;font:800 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:2.4px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .cast-pending-head span{min-width:20px;height:20px;padding:0 6px;box-sizing:border-box;border-radius:10px;background:#ffc45b;color:#12100b;font:800 11px/20px 'Segoe UI',sans-serif;text-align:center}
html body #community-app#community-app .cast-app-actions{display:flex;justify-content:flex-end;margin-top:8px}
html body #community-app#community-app .cast-card-body:has(.cast-app-actions){flex-wrap:wrap}
html body #community-app#community-app .cast-card-body .cast-app-actions{flex:1 0 100%;width:100%;order:9}
/* ==== WANTED ADS ==== */
#community-app.open-layout[data-scene=wanted]{--open-art:url('/assets/backdrop-index-sdn-city.webp')}
html body #community-app.open-layout[data-scene=wanted] #site-backdrop{background-position:0 0,center top!important}
html body #community-app#community-app .wanted-box{display:flex;flex-direction:column;gap:0}
html body #community-app#community-app .wanted-box>.std-box-body,html body #community-app#community-app .wanted-box>:not(.box-bar){padding-left:22px;padding-right:22px}
html body #community-app#community-app .wanted-folders-wrap{padding-top:18px;padding-bottom:6px}
html body #community-app#community-app .wanted-list{padding-top:14px;padding-bottom:22px}
html body #community-app#community-app .wanted-label{margin:0 0 12px;font:800 11px/1 Consolas,monospace;letter-spacing:2.4px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .wanted-in{margin-left:6px;color:#9aa3a8;letter-spacing:1px}
html body #community-app#community-app .wanted-folders{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
html body #community-app#community-app .wanted-folder{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;min-height:132px;padding:16px 18px;border-radius:4px 12px 12px 12px;text-decoration:none!important;color:#f4efe5!important;background:linear-gradient(180deg,#05070a10 20%,#05070ae6),var(--folder-art) center/cover;border:1px solid #ffffff24;box-shadow:0 10px 24px #0009;transition:transform .18s ease,border-color .18s ease}
html body #community-app#community-app .wanted-folder:hover,html body #community-app#community-app .wanted-folder.is-here{border-color:var(--color-accent-default,#ffc45b);transform:translateY(-2px)}
html body #community-app#community-app .wanted-folder-tab{position:absolute;left:-1px;top:-14px;width:96px;height:14px;border-radius:8px 10px 0 0;background:#1a2027;border:1px solid #ffffff24;border-bottom:0}
html body #community-app#community-app .wanted-folder.is-here .wanted-folder-tab,html body #community-app#community-app .wanted-folder:hover .wanted-folder-tab{border-color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .wanted-folder strong{font:700 22px/1.1 var(--font-control-title,'Segoe UI'),sans-serif;text-transform:uppercase;letter-spacing:.04em;text-shadow:0 2px 8px #000}
html body #community-app#community-app .wanted-folder small{font:800 10.5px/1 Consolas,monospace;letter-spacing:1.6px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .wanted-folder em{font:italic 400 13px/1.35 var(--font-control-ui,'Segoe UI'),sans-serif;color:#d8d2c6}
html body #community-app#community-app .wanted-folders{padding-top:14px}
html body #community-app#community-app .wanted-empty{color:#a8a294;font-style:italic}
html body #community-app#community-app .wanted-box .forum-thread-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:16px}
/* the [wanted] ad block */
.bb-wanted{margin:10px 0;border-radius:12px;overflow:hidden;border:1px solid color-mix(in srgb,var(--character-color,#ffc45b) 45%,#ffffff1a);background:#0b0f14b3}
.bb-wanted-head{padding:16px 20px 12px;background:linear-gradient(90deg,color-mix(in srgb,var(--character-color,#ffc45b) 26%,transparent),transparent);border-bottom:1px solid #ffffff14}
.bb-wanted-head span{display:block;font:800 11px/1 Consolas,monospace;letter-spacing:3px;text-transform:uppercase;color:var(--character-color,#ffc45b)}
.bb-wanted-head h3{margin:6px 0 0!important;font:700 26px/1.1 var(--font-control-title,'Segoe UI'),sans-serif!important;text-transform:uppercase;color:#f6f1e7!important;letter-spacing:.03em}
.bb-wanted-intro{padding:14px 20px 0}
.bb-wanted-roles{display:grid;gap:14px;padding:16px 20px 20px}
.bb-wanted-role{display:grid;grid-template-columns:150px minmax(0,1fr);gap:18px;align-items:start;padding:14px;border-radius:10px;background:#ffffff08;border:1px solid #ffffff12}
.bb-wanted-role.is-flip{grid-template-columns:minmax(0,1fr) 150px}
.bb-wanted-role.is-flip .bb-wanted-pic{order:2}
.bb-wanted-role.is-flip .bb-wanted-text{text-align:right}
.bb-wanted-pic{margin:0;aspect-ratio:2/3;border-radius:8px;overflow:hidden;background:#161c22;border:2px solid color-mix(in srgb,var(--character-color,#ffc45b) 60%,transparent);display:grid;place-items:center}
.bb-wanted-pic img{width:100%;height:100%;object-fit:cover;object-position:top}
.bb-wanted-pic span{font:800 40px/1 Georgia,serif;color:#ffffff30}
.bb-wanted-text h4{display:flex;align-items:center;gap:10px;margin:2px 0 8px!important;font:700 19px/1.2 var(--font-control-title,'Segoe UI'),sans-serif!important;text-transform:uppercase;color:#f6f1e7!important}
.bb-wanted-role.is-flip .bb-wanted-text h4{justify-content:flex-end}
.bb-wanted-status{padding:3px 8px;border-radius:5px;font:800 10px/1.2 'Segoe UI',sans-serif!important;font-style:normal!important;letter-spacing:1px;text-transform:uppercase}
.bb-wanted-status.is-open{background:#2e8a5a40;color:#bff0cf;border:1px solid #4fbf84}
.bb-wanted-status.is-taken{background:#ffffff14;color:#aab1b8;border:1px solid #ffffff30}
.bb-wanted-status.is-reserved{background:#ffc45b26;color:#ffe3b0;border:1px solid #ffc45b99}
@media(max-width:700px){.bb-wanted-role,.bb-wanted-role.is-flip{grid-template-columns:1fr}.bb-wanted-role.is-flip .bb-wanted-pic{order:0}.bb-wanted-role.is-flip .bb-wanted-text{text-align:left}}
/* wanted ads list + builder */
html body #community-app#community-app .wanted-box .forum-thread-cards{margin:0!important;width:auto!important;max-width:none!important;padding:0!important}
html body #community-app#community-app .wanted-box .wanted-list{min-width:0}
#app-dialog .wb-roles{display:grid;gap:12px;margin:8px 0}
#app-dialog .wb-role{border:1px solid #ffffff24;border-radius:10px;padding:10px 14px 12px;margin:0}
#app-dialog .wb-role legend{padding:0 6px;font:800 10.5px/1 Consolas,monospace;letter-spacing:1.6px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
#app-dialog .wb-grid{display:grid;grid-template-columns:minmax(0,1fr) 140px;gap:10px 12px}
#app-dialog .wb-grid .wb-wide{grid-column:1/-1}
#app-dialog .wb-role-tools{display:flex;gap:6px;justify-content:flex-end;margin-top:8px}
#app-dialog .wb-role-tools button,#app-dialog .wb-add{height:30px;padding:0 12px;border-radius:7px;border:1px solid #ffffff2e;background:#161c22;color:#e6e1d6;font:700 12.5px/1 'Segoe UI',sans-serif;cursor:pointer}
#app-dialog .wb-role-tools [data-wb-remove]{border-color:#e0544a80;color:#ffc2b8;background:#e0544a1f}
#app-dialog .wb-add{justify-self:start;border-color:color-mix(in srgb,#ffc45b 60%,transparent);background:color-mix(in srgb,#ffc45b 16%,#161c22);color:#ffe3b0}
html body #community-app#community-app .composer-foot .wb-open{height:34px;padding:0 14px;border-radius:8px;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent);background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 14%,#161c22);color:#ffe3b0;font:700 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer}
html body #community-app#community-app .wanted-folder{background:linear-gradient(180deg,#05070a66 0%,#05070af0 72%),var(--folder-art) center/cover!important}
/* Wanted Ads: categories are tabs */
html body #community-app#community-app .wanted-tabbed>.wanted-tabs{display:flex;gap:4px;padding:16px 22px 0!important;border-bottom:1px solid #ffffff1f}
html body #community-app#community-app .wanted-tab{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border:1px solid #ffffff1f;border-bottom:0;border-radius:8px 8px 0 0;background:#0b0f14b3;color:#cfd6de!important;text-decoration:none!important;font:800 12px/1 Consolas,monospace;letter-spacing:1.6px;text-transform:uppercase;margin-bottom:-1px;transition:background .18s,color .18s,border-color .18s}
html body #community-app#community-app .wanted-tab small{font-size:10px;padding:2px 6px;border-radius:99px;background:#ffffff14;letter-spacing:0}
html body #community-app#community-app .wanted-tab:hover{color:#fff!important;background:#151b22}
html body #community-app#community-app .wanted-tab.is-active{color:var(--color-accent-default,#ffc45b)!important;background:#11161ccc;border-color:var(--color-accent-default,#ffc45b);border-bottom:1px solid #11161c}
html body #community-app#community-app .wanted-tab-panel{padding:18px 22px 22px!important}
html body #community-app#community-app .wanted-tab-banner{display:flex;flex-direction:column;justify-content:flex-end;gap:4px;min-height:96px;padding:14px 18px;margin-bottom:16px;border-radius:8px;background:linear-gradient(90deg,#05070af0 30%,#05070a40),var(--folder-art) center/cover;border:1px solid #ffffff1f;color:#f4efe5}
html body #community-app#community-app .wanted-tab-banner strong{font:800 20px/1.1 var(--font-heading,inherit);letter-spacing:1px;text-transform:uppercase}
html body #community-app#community-app .wanted-tab-banner em{font-style:normal;opacity:.8;font-size:13px}
html body #community-app#community-app .wanted-tab-panel .forum-thread-cards>*{margin:0}
/* Thread manage menu */
html body #community-app#community-app .thread-manage-menu{min-width:236px;gap:0;padding:6px;background:#0f1419f5;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 40%,#ffffff1a);border-radius:10px;box-shadow:0 14px 34px #000a;backdrop-filter:blur(6px);z-index:40}
html body #community-app#community-app .thread-manage-menu .tm-head{padding:8px 10px 6px;font:800 10px/1 Consolas,monospace;letter-spacing:2px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .thread-manage-menu .tm-section{padding:4px 8px 10px;border-bottom:1px solid #ffffff14}
html body #community-app#community-app .thread-manage-menu .tm-label{display:block;margin:0 2px 6px;font-size:11px;color:#9aa4ae}
html body #community-app#community-app .thread-manage-menu .tm-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid #ffffff22;border-radius:7px;overflow:hidden}
html body #community-app#community-app .thread-manage-menu .tm-seg button{padding:7px 4px!important;border:0!important;border-radius:0!important;background:transparent!important;color:#cbd3db!important;font-size:11px!important;text-align:center!important;min-height:0!important}
html body #community-app#community-app .thread-manage-menu .tm-seg button+button{border-left:1px solid #ffffff22!important}
html body #community-app#community-app .thread-manage-menu .tm-seg button:hover{background:#ffffff10!important}
html body #community-app#community-app .thread-manage-menu .tm-seg button.is-on{background:var(--color-accent-default,#ffc45b)!important;color:#15110b!important;font-weight:700}
html body #community-app#community-app .thread-manage-menu .tm-list{display:grid;padding:4px 0}
html body #community-app#community-app .thread-manage-menu .tm-list+.tm-list{border-top:1px solid #ffffff14}
html body #community-app#community-app .thread-manage-menu .tm-item{display:flex!important;align-items:center;gap:10px;width:100%;padding:8px 10px!important;border:0!important;border-radius:6px!important;background:transparent!important;color:#e3e8ed!important;font-size:13px!important;text-align:left;min-height:0!important;box-shadow:none!important}
html body #community-app#community-app .thread-manage-menu .tm-item svg{opacity:.75;flex:none}
html body #community-app#community-app .thread-manage-menu .tm-item:hover{background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 14%,transparent)!important;color:#fff!important}
html body #community-app#community-app .thread-manage-menu .tm-danger .tm-item{color:#ff9b9b!important}
html body #community-app#community-app .thread-manage-menu .tm-danger .tm-item:hover{background:#ff5a5a22!important;color:#ffc2c2!important}
/* Themed confirm */
html body dialog.ui-confirm{position:fixed!important;inset:0!important;margin:auto!important;height:fit-content!important;max-width:420px !important;width:calc(100vw - 32px) !important;padding:22px 24px 18px !important;border-radius:12px !important;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,#ffffff1a) !important;background:#0f1419 !important;color:#e8edf2 !important;box-shadow:0 24px 60px #000c !important;font-family:inherit !important}
html body dialog.ui-confirm::backdrop{background:#0009 !important;backdrop-filter:blur(2px) !important}
html body dialog.ui-confirm h3{margin:0 0 8px !important;font-size:17px !important;color:var(--color-accent-default,#ffc45b) !important}
html body dialog.ui-confirm.is-danger h3{color:#ff9b9b !important}
html body dialog.ui-confirm p{margin:0 0 18px !important;font-size:14px !important;line-height:1.5 !important;color:#c4ccd4 !important}
html body dialog.ui-confirm .ui-confirm-actions{display:flex !important;justify-content:flex-end !important;gap:8px !important}
html body dialog.ui-confirm button{padding:8px 16px !important;border-radius:7px !important;border:1px solid #ffffff2a !important;background:#ffffff0d !important;color:#e8edf2 !important;cursor:pointer !important;font:inherit !important;font-size:13px !important}
html body dialog.ui-confirm button:hover{background:#ffffff1a !important}
html body dialog.ui-confirm button.is-primary{background:var(--color-accent-default,#ffc45b) !important;border-color:transparent !important;color:#15110b !important;font-weight:700 !important}
html body dialog.ui-confirm.is-danger button.is-primary{background:#d9534f !important;color:#fff !important}
/* Review dialogs */
html body dialog.ui-confirm .ui-miss{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;margin:0 0 14px;max-height:50vh;overflow:auto}
html body dialog.ui-confirm .ui-miss strong{display:block;margin-bottom:4px;font-size:11px;letter-spacing:1.4px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body dialog.ui-confirm .ui-miss ul{margin:0;padding-left:18px;font-size:13px;color:#dfe5ea;line-height:1.5}
html body dialog.ui-confirm p.ui-miss-end{display:none}
html body dialog.ui-review{max-width:480px!important}
html body dialog.ui-review .ui-review-votes{display:flex;gap:8px;margin:0 0 14px}
html body dialog.ui-review .ui-vote{flex:1;padding:9px 10px;border-radius:8px;border:1px dashed #ffffff33;color:#8d97a1;font-size:12px;text-align:center}
html body dialog.ui-review .ui-vote.is-in{border-style:solid;border-color:#57d68a;color:#9ff0bd;background:#57d68a14}
html body dialog.ui-review .ui-review-note{font-size:12px!important;color:#9aa4ae!important;margin:-4px 0 12px!important}
html body dialog.ui-review .ui-review-actions{align-items:center}
html body dialog.ui-review .ui-spacer{flex:1}
html body dialog.ui-review button.ui-deny{border-color:#ff9b9b66!important;color:#ffb0b0!important}
html body dialog.ui-review button.ui-deny:hover{background:#ff5a5a22!important}
html body dialog.ui-review button.ui-admin{border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent)!important;color:var(--color-accent-default,#ffc45b)!important}
html body dialog.ui-review button.is-primary{background:#3fbf6e!important;color:#07130b!important}
html body dialog.ui-review button[disabled]{opacity:.55;cursor:default}
html body dialog.ui-confirm textarea.ui-deny-note{width:100%;box-sizing:border-box;margin:0 0 14px;padding:10px;border-radius:8px;border:1px solid #ffffff2a;background:#0a0d11;color:#e8edf2;font:inherit;font-size:13px;resize:vertical}
/* ---- Site music player ---- */
html body #community-app .dm-player{--dm-c:var(--color-accent-default,#ffc45b);position:fixed;z-index:120;width:340px;max-width:calc(100vw - 16px);display:flex;flex-direction:column;border-radius:14px;background:linear-gradient(180deg,color-mix(in srgb,var(--dm-c) 10%,#0d1116),#0a0d11 60%);border:1px solid color-mix(in srgb,var(--dm-c) 45%,#ffffff14);box-shadow:0 18px 44px #000c,0 0 0 1px #0008;color:#e6ebf0;overflow:hidden}
html body #community-app .dm-player[hidden]{display:none}
html body #community-app .dm-player.is-min{left:-9999px!important;top:-9999px!important;visibility:hidden}
html body #community-app .dm-player.is-dragging{cursor:grabbing;user-select:none}
html body #community-app .dm-head{display:flex;align-items:center;gap:10px;padding:10px 10px 10px 14px;cursor:grab;border-bottom:1px solid #ffffff12;touch-action:none}
html body #community-app .dm-title{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
html body #community-app .dm-title small{font:800 9px/1 Consolas,monospace;letter-spacing:2px;text-transform:uppercase;color:var(--dm-c)}
html body #community-app .dm-now{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app .dm-icon{display:grid;place-items:center;width:30px;height:30px;padding:6px!important;border-radius:8px!important;border:0!important;background:#ffffff0d!important;color:#cfd6de!important;cursor:pointer;min-height:0!important}
html body #community-app .dm-icon svg{width:100%;height:100%}
html body #community-app .dm-icon:hover{background:#ffffff1c!important;color:#fff!important}
html body #community-app .dm-stage{position:relative;padding:10px 10px 0}
html body #community-app .dm-embed{border-radius:12px;overflow:hidden;min-height:152px;background:#05070a;display:grid;place-items:center}
html body #community-app .dm-embed iframe,html body #community-app .dm-embed .dm-mount{display:block;width:100%;border:0}
html body #community-app .dm-empty{margin:0;padding:18px;font-size:12px;color:#8d97a1;text-align:center}
html body #community-app .dm-controls{display:flex;align-items:center;gap:6px;padding:10px 10px 6px}
html body #community-app .dm-pp{width:38px;height:38px;border-radius:50%!important;background:var(--dm-c)!important;color:#0b0d10!important}
html body #community-app .dm-src{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:11px;color:#9aa4ae}
html body #community-app .dm-src svg,html body #community-app .dm-kind svg{width:16px;height:16px;display:block}
html body #community-app .dm-tabs{display:flex;gap:4px;padding:6px 10px 0;border-bottom:1px solid #ffffff12}
html body #community-app .dm-tabs button{padding:7px 10px!important;border:0!important;border-bottom:2px solid transparent!important;border-radius:0!important;background:none!important;color:#9aa4ae!important;font:700 11px/1 inherit;letter-spacing:.6px;text-transform:uppercase;min-height:0!important}
html body #community-app .dm-tabs button[aria-selected=true]{color:var(--dm-c)!important;border-bottom-color:var(--dm-c)!important}
html body #community-app .dm-list{max-height:220px;overflow:auto;padding:6px;scrollbar-width:thin}
html body #community-app .dm-row{display:flex;align-items:center;gap:4px;border-radius:8px}
html body #community-app .dm-row.is-current{background:color-mix(in srgb,var(--dm-c) 12%,transparent)}
html body #community-app .dm-pick{flex:1;min-width:0;display:flex;align-items:center;gap:9px;padding:8px 8px!important;border:0!important;border-radius:8px!important;background:none!important;color:#e6ebf0!important;text-align:left;cursor:pointer;min-height:0!important}
html body #community-app .dm-pick:hover{background:#ffffff0d!important}
html body #community-app .dm-dot{flex:none;width:9px;height:9px;border-radius:50%;background:var(--dm-c);box-shadow:0 0 8px var(--dm-c)}
html body #community-app .dm-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
html body #community-app .dm-own{flex:none;margin-right:6px;padding:2px 7px;border-radius:99px;font-size:10px;color:#9aa4ae;border:1px solid #ffffff22}
html body #community-app .dm-star{flex:none;display:grid;place-items:center;width:30px;height:30px;padding:6px!important;border:0!important;background:none!important;color:#6d7780!important;cursor:pointer;min-height:0!important}
html body #community-app .dm-star svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
html body #community-app .dm-star:hover{color:#ffd35c!important}
html body #community-app .dm-star.is-on{color:#ffd35c!important}
html body #community-app .dm-star.is-on svg{fill:currentColor}
/* waveform bars: idle = low and still, playing = bouncing */
html body #community-app .dm-wave{display:inline-flex;align-items:flex-end;gap:2px;height:18px;flex:none}
html body #community-app .dm-wave i{width:3px;height:100%;border-radius:2px;background:var(--dm-c,var(--color-accent-default,#ffc45b));opacity:.75;transform-origin:center bottom;transform:scaleY(.22)}
html body #community-app .is-playing .dm-wave i,html body #community-app .dm-row.is-current .dm-wave i{animation:dm-bar var(--dm-bar-duration,.91s) linear infinite}
html body #community-app .dm-player:not(.is-playing) .dm-row.is-current .dm-wave i{animation:none}
html body #community-app .dm-wave i:nth-child(2){--dm-bar-duration:1.13s;animation-delay:-.2s!important}html body #community-app .dm-wave i:nth-child(3){--dm-bar-duration:.79s;animation-delay:-.55s!important}html body #community-app .dm-wave i:nth-child(4){--dm-bar-duration:1.27s;animation-delay:-.1s!important}html body #community-app .dm-wave i:nth-child(5){--dm-bar-duration:.97s;animation-delay:-.7s!important}html body #community-app .dm-wave i:nth-child(6){--dm-bar-duration:1.09s;animation-delay:-.35s!important}html body #community-app .dm-wave i:nth-child(7){--dm-bar-duration:.87s;animation-delay:-.85s!important}
@keyframes dm-bar{0%{transform:scaleY(0.5900)}3.125%{transform:scaleY(0.6622)}6.25%{transform:scaleY(0.7316)}9.375%{transform:scaleY(0.7956)}12.5%{transform:scaleY(0.8516)}15.625%{transform:scaleY(0.8976)}18.75%{transform:scaleY(0.9318)}21.875%{transform:scaleY(0.9529)}25%{transform:scaleY(0.9600)}28.125%{transform:scaleY(0.9529)}31.25%{transform:scaleY(0.9318)}34.375%{transform:scaleY(0.8976)}37.5%{transform:scaleY(0.8516)}40.625%{transform:scaleY(0.7956)}43.75%{transform:scaleY(0.7316)}46.875%{transform:scaleY(0.6622)}50%{transform:scaleY(0.5900)}53.125%{transform:scaleY(0.5178)}56.25%{transform:scaleY(0.4484)}59.375%{transform:scaleY(0.3844)}62.5%{transform:scaleY(0.3284)}65.625%{transform:scaleY(0.2824)}68.75%{transform:scaleY(0.2482)}71.875%{transform:scaleY(0.2271)}75%{transform:scaleY(0.2200)}78.125%{transform:scaleY(0.2271)}81.25%{transform:scaleY(0.2482)}84.375%{transform:scaleY(0.2824)}87.5%{transform:scaleY(0.3284)}90.625%{transform:scaleY(0.3844)}93.75%{transform:scaleY(0.4484)}96.875%{transform:scaleY(0.5178)}100%{transform:scaleY(0.5900)}}
/* "applying" a playlist: a waveform sweeps across the player once */
html body #community-app .dm-apply{position:absolute;inset:10px 10px 0;display:flex;align-items:center;justify-content:center;gap:3px;pointer-events:none;opacity:0}
html body #community-app .dm-apply i{width:4px;height:10%;border-radius:3px;background:var(--dm-c);box-shadow:0 0 10px var(--dm-c)}
html body #community-app .dm-player.is-applying .dm-apply{animation:dm-apply-fade 1.3s ease forwards}
html body #community-app .dm-player.is-applying .dm-apply i{animation:dm-apply-bar 1.3s ease forwards}
@keyframes dm-apply-fade{0%{opacity:0}12%{opacity:1}70%{opacity:1}100%{opacity:0}}
@keyframes dm-apply-bar{0%{height:6%}30%{height:calc(20% + var(--h,40%))}60%{height:calc(10% + var(--h,40%) / 2)}100%{height:4%}}
/* minimized pill in the bottom dock */
html body #community-app .dm-pill{--dm-c:var(--color-accent-default,#ffc45b);display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px 0 12px;margin-left:6px;border-radius:10px 10px 0 0;border:1px solid color-mix(in srgb,var(--dm-c) 55%,transparent);border-bottom:0;background:#0d1116f2;color:#e6ebf0;font-size:12px;cursor:pointer;box-shadow:0 -4px 16px #0008}
html body #community-app .dm-pill:hover{background:#141a21}
html body #community-app .dm-pill-name{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* sidebar Music entry shows it's live */
html body #community-app #sidebar-music.is-playing{color:var(--color-accent-default,#ffc45b)!important;box-shadow:0 0 0 1px color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent),0 0 14px color-mix(in srgb,var(--color-accent-default,#ffc45b) 40%,transparent)}
@media(prefers-reduced-motion:reduce){html body #community-app .dm-wave i,html body #community-app .dm-apply{animation:none!important}}
/* ---- Main Index: admin strip + info deck ---- */
html body #community-app .index-hero .ix-staff{justify-self:end;align-self:end;display:flex;align-items:center;gap:10px;margin-top:-34px;padding:6px 8px 6px 14px;border-radius:999px;background:#0a0d11b3;border:1px solid #ffffff14;backdrop-filter:blur(4px)}
html body #community-app .ix-staff-label{font:800 9px/1 Consolas,monospace;letter-spacing:2px;text-transform:uppercase;color:#9aa4ae}
html body #community-app .ix-staff-face{--staff-c:#ffc45b;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;overflow:hidden;background:#151a20;color:#fff;font:700 12px/1 inherit;text-decoration:none!important;box-shadow:0 0 0 2px var(--staff-c),0 0 14px 2px color-mix(in srgb,var(--staff-c) 70%,transparent);transition:transform .18s ease,box-shadow .18s ease}
html body #community-app .ix-staff-face img{width:100%;height:100%;object-fit:cover}
html body #community-app .ix-staff-face:hover{transform:translateY(-2px) scale(1.06);box-shadow:0 0 0 2px var(--staff-c),0 0 22px 5px color-mix(in srgb,var(--staff-c) 80%,transparent)}
html body #community-app #app-view>.forum-main-index>.ix-deck{display:grid;grid-template-columns:1.25fr 1fr .9fr;gap:16px;padding:0 var(--page-gap,32px);margin:0 0 6px}
@media(max-width:1100px){html body #community-app #app-view>.forum-main-index>.ix-deck{grid-template-columns:1fr 1fr}html body #community-app .ix-card-quick{grid-column:1/-1}}
@media(max-width:700px){html body #community-app #app-view>.forum-main-index>.ix-deck{grid-template-columns:1fr}}
html body #community-app .ix-card{display:flex;flex-direction:column;min-width:0;padding:14px 16px 16px;border-radius:12px;background:linear-gradient(180deg,#0d1116e6,#0a0d11d9);border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 28%,#ffffff10);box-shadow:0 10px 26px #0008;backdrop-filter:blur(4px)}
html body #community-app .ix-card header{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0 0 10px}
html body #community-app .ix-card h3{margin:0;font:800 11px/1 Consolas,monospace;letter-spacing:2.2px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app .ix-card header a{font-size:11px;color:#9aa4ae!important;text-decoration:none!important}
html body #community-app .ix-card header a:hover{color:#fff!important}
html body #community-app .ix-feed{display:grid;gap:2px}
html body #community-app .ix-feed-row{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:8px;text-decoration:none!important;color:#e6ebf0!important}
html body #community-app .ix-feed-row:hover{background:#ffffff0b}
html body #community-app .ix-feed-dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c)}
html body #community-app .ix-feed-main{min-width:0;display:flex;flex-direction:column;gap:2px}
html body #community-app .ix-feed-main strong{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app .ix-feed-main small{font-size:11px;color:#8d97a1}
html body #community-app .ix-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
html body #community-app .ix-stat{display:flex;flex-direction:column;align-items:center;padding:8px 4px;border-radius:8px;background:#ffffff08}
html body #community-app .ix-stat strong{font:800 20px/1 var(--font-heading,inherit);color:#fff}
html body #community-app .ix-stat span{margin-top:4px;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:#8d97a1}
html body #community-app .ix-online{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}
html body #community-app .ix-online-label{display:flex;align-items:center;gap:7px;font-size:12px;color:#cfd6de}
html body #community-app .ix-online-label i{width:8px;height:8px;border-radius:50%;background:#3ddc84;box-shadow:0 0 8px #3ddc84}
html body #community-app .ix-online-faces{display:flex}
html body #community-app .ix-online-face{display:grid;place-items:center;width:24px;height:24px;margin-left:-6px;border-radius:50%;overflow:hidden;border:2px solid #0b0e12;background:#1b2129;font-size:9px;color:#fff}
html body #community-app .ix-online-face img{width:100%;height:100%;object-fit:cover}
html body #community-app .ix-pend{color:#ffd37a!important;font-weight:700}
html body #community-app .ix-quick{display:grid;grid-template-columns:1fr 1fr;gap:6px}
html body #community-app .ix-quick-link{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;background:#ffffff08;border:1px solid transparent;color:#e6ebf0!important;text-decoration:none!important;transition:border-color .16s,background .16s}
html body #community-app .ix-quick-link svg{flex:none;color:var(--color-accent-default,#ffc45b)}
html body #community-app .ix-quick-link span{display:flex;flex-direction:column;min-width:0}
html body #community-app .ix-quick-link strong{font-size:13px}
html body #community-app .ix-quick-link small{font-size:11px;color:#8d97a1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app .ix-quick-link:hover{background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 10%,transparent);border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,transparent)}
html body #community-app .ix-deck-empty{margin:0;font-size:12px;color:#8d97a1}
/* ---- Ticker: newspaper name, event tint, grey filler, rumors, tools ---- */
html body #community-app .ix-alert .ixa-item.is-bulletin .ixa-kind{color:#7d8792!important}
html body #community-app .ix-alert .ixa-item.is-bulletin .ixa-detail{color:#8d97a1!important}
html body #community-app .ix-alert .ixa-item.is-event{align-items:center;padding:6px 12px;border-radius:6px;background:linear-gradient(90deg,color-mix(in srgb,var(--color-accent-default,#ffc45b) 38%,#0b0d10),color-mix(in srgb,var(--color-accent-default,#ffc45b) 18%,#0b0d10))!important;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--color-accent-default,#ffc45b) 75%,transparent),0 0 14px color-mix(in srgb,var(--color-accent-default,#ffc45b) 30%,transparent)}
html body #community-app .ix-alert .ixa-item.is-event b{color:#fff!important}
html body #community-app .ix-alert .ixa-item.is-event .ixa-kind{color:var(--color-accent-default,#ffc45b)!important}
html body #community-app .ix-alert .ixa-item.is-event .ixa-detail{color:#f1e7d3!important}
html body #community-app .ix-alert .ixa-item.is-event.is-priority{background:#ff5b4d2e;box-shadow:inset 0 0 0 1px #ff5b4d99}
html body #community-app .ix-alert .ixa-item.is-event.is-priority .ixa-kind{color:#ff7a6b!important}
html body #community-app .ix-alert .ixa-item.is-rumor .ixa-kind{color:#c9a4ff!important}
html body #community-app .ix-alert .ixa-item.is-rumor .ixa-detail{color:#ddd0f3!important;font-style:italic}
html body #community-app .ix-alert .ixa-item.is-rumor.is-important .ixa-kind{color:#ff9bd5!important}
html body #community-app .ix-alert .ixa-tools{flex:none;display:flex;align-items:center;gap:4px;padding:0 8px;border-left:1px solid #ffffff14}
html body #community-app .ix-alert .ixa-tool{position:relative;display:grid;place-items:center;width:30px;height:30px;padding:0!important;border-radius:7px!important;border:0!important;background:#ffffff0d!important;color:#cfd6de!important;cursor:pointer;min-height:0!important}
html body #community-app .ix-alert .ixa-tool:hover{background:#ffffff1f!important;color:#fff!important}
html body #community-app .ix-alert .ixa-count{position:absolute;top:-6px;right:-6px;min-width:17px;height:17px;padding:0 4px;border-radius:99px;background:#e5322d;color:#fff;font:800 10px/17px 'Segoe UI',sans-serif;text-align:center;box-shadow:0 0 0 2px #0b0d10}
/* rumor manager */
html body #app-dialog.is-rumors{width:min(620px,calc(100vw - 32px))}
html body #app-dialog.is-rumors .app-actions button[type=submit]{display:none}
html body #app-dialog .rm-sec{margin:0 0 16px}
html body #app-dialog .rm-sec h3{display:flex;align-items:center;gap:8px;margin:0 0 8px;font:800 11px/1 Consolas,monospace;letter-spacing:2px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #app-dialog .rm-sec h3 span{padding:2px 7px;border-radius:99px;background:#ffffff14;color:#cfd6de;letter-spacing:0}
html body #app-dialog .rm-list{list-style:none;margin:0;padding:0;display:grid;gap:6px;max-height:36vh;overflow:auto}
html body #app-dialog .rm-row{display:grid;grid-template-columns:28px minmax(80px,120px) 1fr auto;align-items:center;gap:10px;padding:8px 10px;border-radius:9px;background:#ffffff08;border:1px solid #ffffff10}
html body #app-dialog .rm-row.is-important{border-color:#ff9bd566}
html body #app-dialog .rm-face{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;overflow:hidden;background:#1b2129;color:#fff;font-size:10px}
html body #app-dialog .rm-face img{width:100%;height:100%;object-fit:cover}
html body #app-dialog .rm-who{font-size:12px;color:#cfd6de;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #app-dialog .rm-text{font-size:13px;font-style:italic;color:#e6ebf0}
html body #app-dialog .rm-acts{display:flex;gap:4px}
html body #app-dialog .rm-btn{display:grid;place-items:center;width:28px;height:28px;padding:0!important;border-radius:7px!important;border:1px solid #ffffff22!important;background:none!important;color:#cfd6de!important;font-weight:800;cursor:pointer;min-height:0!important}
html body #app-dialog .rm-ok:hover{border-color:#3fbf6e!important;color:#7df0a0!important;background:#3fbf6e1f!important}
html body #app-dialog .rm-no:hover{border-color:#ff6b6b!important;color:#ff9b9b!important;background:#ff5a5a1f!important}
html body #app-dialog .rm-imp.is-on{border-color:#ff9bd5!important;color:#ff9bd5!important;background:#ff9bd51f!important}

/* Main Index "Updates" panel: left-aligned with the DISPATCH title, sits in the band above the tiles */
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles.ix-tiles.has-deck{margin-top:22px!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-updates{display:block!important;box-sizing:border-box;width:min(560px,calc(100% - 2 * var(--page-gap,72px)));margin:max(8px,calc(47vh - 470px)) 0 0 var(--page-gap,72px)!important;padding:14px 18px 16px!important;border-radius:12px;background:linear-gradient(180deg,#0d1116e6,#0a0d11d9);border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 35%,#ffffff10);border-left:3px solid var(--color-accent-default,#ffc45b);box-shadow:0 10px 26px #0008;backdrop-filter:blur(4px)}
html body #community-app .ix-updates header{display:flex;align-items:center;gap:10px;margin:0 0 8px}
html body #community-app .ix-updates h3{margin:0;font:800 11px/1 Consolas,monospace;letter-spacing:2.4px;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app .ix-updates time{font-size:11px;color:#8d97a1}
html body #community-app .ix-updates-edit{margin-left:auto;display:grid;place-items:center;width:26px;height:26px;padding:0!important;border-radius:7px!important;border:0!important;background:#ffffff0d!important;color:#cfd6de!important;cursor:pointer;min-height:0!important}
html body #community-app .ix-updates-edit:hover{background:#ffffff1f!important;color:#fff!important}
html body #community-app .ix-updates-body{font-size:13.5px;line-height:1.55;color:#dfe5ea;max-height:132px;overflow:auto}
html body #community-app .ix-updates-body p{margin:0 0 6px}
html body #community-app .ix-deck-empty{margin:0;font-size:12px;color:#8d97a1}
html body #community-app .index-hero .ix-staff{gap:12px!important;padding:8px 10px 8px 18px!important}
html body #community-app .ix-staff-label{font-size:11px!important;letter-spacing:2.4px!important;color:#b7c0c9!important}
/* ticker: every piece of text vertically centred on the same line */
html body #community-app .ix-alert .ixa-run{align-items:center!important}
html body #community-app .ix-alert .ixa-item{align-items:center!important;line-height:1!important}
html body #community-app .ix-alert .ixa-item>*{display:inline-flex;align-items:center;line-height:1!important;padding:0!important;margin:0!important;vertical-align:middle}
html body #community-app .ix-alert .ixa-kind{position:relative;top:.5px}
html body #community-app .ix-alert .ixa-sep{display:inline-flex;align-items:center;line-height:1}
html body #community-app#community-app .index-hero .ix-title-row>.ix-alert-col{display:flex!important;flex-direction:column!important;align-items:flex-end!important;flex:1 1 0!important;min-width:0!important;width:auto!important;position:relative}
html body #community-app#community-app .index-hero .ix-alert-col>.ix-alert{align-self:stretch!important;width:auto!important;min-width:0!important;max-width:none!important}
html body #community-app#community-app .index-hero .ix-alert-col>.ix-staff{position:absolute!important;top:62px!important;right:-40px!important;margin:0!important}
/* no inner divider/outline lines inside the ticker: events keep only their background hue */
html body #community-app .ix-alert .ixa-tools{border-left:0!important}
html body #community-app .ix-alert .ixa-item.is-event,html body #community-app .ix-alert .ixa-item.is-event.is-priority{box-shadow:none!important;border:0!important}
/* ticker: no visible right edge - the right border is dropped and the gold underline fades out instead of curving up the corner */
html body #community-app#community-app .ix-alert{border-right-color:transparent!important;border-top-right-radius:0!important;border-bottom-right-radius:0!important;box-shadow:0 16px 36px rgb(0 0 0 / .6)!important;background:linear-gradient(90deg,color-mix(in srgb,var(--ixa-c) 45%,transparent) 0,color-mix(in srgb,var(--ixa-c) 45%,transparent) 70%,transparent 100%) bottom/100% 2px no-repeat,#06090dd9!important;border-top-color:#ffffff1f!important;border-bottom-color:#ffffff1f!important;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 60px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 60px),transparent)}
html body #community-app#community-app .ix-alert:has(.ixa-tools>*){-webkit-mask-image:none;mask-image:none}
/* ---- Main Index: Around the World stack ---- */
html body #community-app #app-view .ix-tiles>.ix-row.has-abroad{position:relative}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-main{position:relative;z-index:30;cursor:pointer}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-main .forum-entry-label :is(h2,h3) a{pointer-events:none}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-card{position:absolute!important;top:0;left:var(--abroad-x,0);width:218px!important;margin:0!important;cursor:pointer;
 transform:translate(calc((var(--i) + 1) * 9px),calc((var(--i) + 1) * -5px));opacity:calc(1 - var(--i) * .12);filter:brightness(calc(.75 - var(--i) * .06));pointer-events:auto;
 transition:transform .45s cubic-bezier(.2,.8,.2,1) calc(var(--i) * 30ms),width .35s ease,opacity .3s ease,filter .3s ease!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-card>*{visibility:hidden}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row.is-abroad-open>.ix-abroad-card{width:var(--abroad-w,218px)!important;transform:translateX(calc(var(--abroad-start,232px) + var(--i) * var(--abroad-step,232px)));opacity:1;filter:none;z-index:25!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row.is-abroad-open>.ix-abroad-card>*{visibility:visible}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-card:hover{width:var(--abroad-w,218px)!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row.is-abroad-open>.ix-abroad-card:hover{transform:translateX(calc(var(--abroad-start,232px) + var(--i) * var(--abroad-step,232px))) translateY(-4px)}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row.is-abroad-open>.ix-abroad-main{box-shadow:0 0 0 1px var(--color-accent-default,#ffc45b),0 0 22px color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,transparent)!important}
@media (prefers-reduced-motion:reduce){html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-card{transition:none!important}}
/* caps labels sit optically high next to mixed-case text: nudge them onto the same visual centre line */
html body #community-app#community-app .ix-alert .ixa-kind{position:relative;top:1.5px!important;line-height:1!important}
html body #community-app#community-app .ix-alert .ixa-sep{position:relative;top:1px}
html body #community-app#community-app .ix-alert .ixa-detail{line-height:1!important;position:relative;top:0}
html body #community-app#community-app .ix-alert .ixa-item>b{line-height:1!important;position:relative;top:2px}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-main{position:relative!important;z-index:40!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row:not(.is-abroad-open)>.ix-abroad-card{pointer-events:none!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row.is-abroad-open>.ix-abroad-card{z-index:45!important}
html body #community-app #app-view#app-view>.forum-main-index .index-category-children>.ix-abroad-card::before{display:none!important}
/* Sidebar world regions: the row navigates, the arrow box unfolds; open regions glow */
#community-app #sidebar-links .sidebar-region{border:1px solid transparent;border-radius:10px;transition:border-color .2s,box-shadow .2s,background .2s}
#community-app #sidebar-links .sidebar-region .sidebar-region-chev{width:26px;height:26px;border-radius:7px;border:1px solid rgb(255 255 255 / .16);background:rgb(255 255 255 / .05);opacity:1!important;cursor:pointer;color:#cfd6de;transition:transform .2s ease,border-color .2s,background .2s,box-shadow .2s}
#community-app #sidebar-links .sidebar-region .sidebar-region-chev:hover{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b);box-shadow:0 0 10px color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,transparent)}
#community-app #sidebar-links .sidebar-region.is-open{border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent);background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 9%,transparent);box-shadow:0 0 14px color-mix(in srgb,var(--color-accent-default,#ffc45b) 22%,transparent)}
#community-app #sidebar-links .sidebar-region.is-open .sidebar-region-chev{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b);background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 16%,transparent)}
#community-app #sidebar-links .sidebar-sublist:not([hidden]){margin:2px 0 8px 18px!important;padding:6px 6px 6px 12px!important;border-left:2px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)!important;border-radius:0 8px 8px 0;background:linear-gradient(90deg,color-mix(in srgb,var(--color-accent-default,#ffc45b) 7%,transparent),transparent 80%)}
/* Around the World stack v2: cards peek out to the RIGHT of the tile only (same top edge), and track the tile's width */
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-card{transform:translateX(calc(var(--abroad-mw,218px) - 218px + (var(--i) + 1) * 12px))!important;opacity:calc(1 - var(--i) * .1)!important;transition:transform .32s cubic-bezier(.2,.8,.2,1) calc(var(--i) * 25ms),width .3s ease,opacity .3s ease,filter .3s ease!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row.is-abroad-open>.ix-abroad-card{transform:translateX(calc(var(--abroad-mw,218px) + 14px + var(--i) * var(--abroad-step,232px)))!important;opacity:1!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row.is-abroad-open>.ix-abroad-card:hover{transform:translateX(calc(var(--abroad-mw,218px) + 14px + var(--i) * var(--abroad-step,232px))) translateY(-4px)!important}
/* Updates now lives under the ticker on the right (a tall panel); the admin strip sits under the ticker's left end */
html body #community-app#community-app .index-hero .ix-alert-col>.ix-staff{left:0!important;right:auto!important;top:calc(100% + 14px)!important}
html body #community-app#community-app .index-hero .ix-alert-col>.ix-updates{position:absolute!important;top:calc(100% + 14px)!important;right:-40px!important;z-index:6;width:320px!important;max-width:40vw;max-height:min(360px,calc(100vh - 360px))!important;display:flex!important;flex-direction:column;margin:0!important;box-sizing:border-box;padding:16px 18px 18px!important;border-radius:12px;background:linear-gradient(180deg,#0d1116eb,#0a0d11e0);border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 35%,#ffffff10);border-top:3px solid var(--color-accent-default,#ffc45b);border-left-width:1px;box-shadow:0 12px 30px #000a;backdrop-filter:blur(5px)}
html body #community-app#community-app .ix-updates h3{font-size:14px!important;letter-spacing:2.6px!important}
html body #community-app#community-app .ix-updates-body{flex:1;min-height:0;max-height:none!important;overflow:auto;font-family:var(--font-control-ui,'Segoe UI'),sans-serif!important;font-size:15px!important;line-height:1.55!important;color:#fff!important;scrollbar-width:thin}
html body #community-app#community-app .ix-updates-body *{font-family:inherit!important;color:inherit}
html body #community-app#community-app .ix-updates-body b,html body #community-app#community-app .ix-updates-body strong{color:var(--color-accent-default,#ffc45b)}
/* Updates panel v3 (TWAI-style): content left, a vertical title strip down the right-hand side */
html body #community-app#community-app .index-hero,html body #community-app#community-app .index-hero .ix-title-row,html body #community-app#community-app .index-hero .ix-alert-col{overflow:visible!important}
html body #community-app#community-app .index-hero .ix-alert-col>.ix-updates{flex-direction:row!important;padding:0!important;border-top-width:1px!important;border-right:3px solid var(--color-accent-default,#ffc45b)!important;overflow:hidden;height:auto}
html body #community-app#community-app .ix-updates .ixu-main{flex:1;min-width:0;display:flex;flex-direction:column;padding:16px 16px 14px 18px}
html body #community-app#community-app .ix-updates .ixu-headline{margin:0 0 10px;font:800 20px/1.1 var(--font-control-title,var(--font-heading,'Segoe UI')),sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .ix-updates .ixu-when{margin-top:10px;font:700 10px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#8d97a1}
html body #community-app#community-app .ix-updates .ixu-strip{flex:none;width:44px;display:flex;flex-direction:column;align-items:center;gap:12px;padding:14px 0 12px;background:linear-gradient(180deg,color-mix(in srgb,var(--color-accent-default,#ffc45b) 22%,#0b0d10),color-mix(in srgb,var(--color-accent-default,#ffc45b) 8%,#0b0d10));border-left:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 40%,transparent);color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .ix-updates .ixu-title{writing-mode:vertical-rl;font:800 14px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.34em;text-transform:uppercase}
html body #community-app#community-app .ix-updates .ixu-strip .ix-updates-edit{margin:auto 0 0!important}
/* Around the World v3: wider peeks, slower fluid fan, greyed fanned cards, edge arrow on the tile */
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-card{transform:translateX(calc(var(--abroad-mw,218px) - 218px + (var(--i) + 1) * 24px))!important;transition:transform .7s cubic-bezier(.16,1,.3,1) calc(var(--i) * 60ms),width .45s cubic-bezier(.16,1,.3,1),opacity .5s ease,filter .45s ease!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row:not(.is-abroad-open)>.ix-abroad-card{transition-delay:calc((5 - var(--i)) * 35ms)!important;transition-duration:.55s!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row.is-abroad-open>.ix-abroad-card{filter:grayscale(.75) brightness(.72)!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row.is-abroad-open>.ix-abroad-card:is(:hover,:focus-visible){filter:none!important}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-card>*{transition:visibility 0s linear .25s}
html body #community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row.is-abroad-open>.ix-abroad-card>*{transition-delay:.12s}
html body #community-app .ix-abroad-main .ix-abroad-arrow{position:absolute;top:50%;right:8px;z-index:4;display:grid;place-items:center;width:24px;height:44px;margin-top:-22px;border-radius:7px;background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 18%,#0b0d10);border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent);color:var(--color-accent-default,#ffc45b);opacity:0;transform:translateX(-4px);transition:opacity .25s ease,transform .35s cubic-bezier(.16,1,.3,1);pointer-events:none}
html body #community-app .ix-abroad-main .ix-abroad-arrow svg{transition:transform .45s cubic-bezier(.16,1,.3,1)}
html body #community-app .ix-abroad-main:is(:hover,:focus-visible) .ix-abroad-arrow{opacity:1;transform:none}
html body #community-app .ix-row.is-abroad-open>.ix-abroad-main .ix-abroad-arrow svg{transform:rotate(180deg)}
/* Updates v4: header bar on top (tag + title), smaller body, same glass as the ticker */
html body #community-app#community-app .index-hero .ix-alert-col>.ix-updates{flex-direction:column!important;width:380px!important;max-height:min(440px,calc(100vh - 300px))!important;border:1px solid #ffffff1f!important;border-top:1px solid #ffffff1f!important;border-right:1px solid #ffffff1f!important;border-radius:10px!important;background:#06090dd9!important;backdrop-filter:blur(8px)!important;box-shadow:0 16px 36px rgb(0 0 0 / .6)!important}
html body #community-app#community-app .ix-updates .ixu-strip{display:none!important}
html body #community-app#community-app .ix-updates .ixu-bar{flex:none;display:flex;align-items:stretch;min-height:40px;border-bottom:2px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,transparent)}
html body #community-app#community-app .ix-updates .ixu-tag{flex:none;display:flex;align-items:center;gap:8px;padding:0 16px 0 13px;background:var(--color-accent-default,#ffc45b);color:#0b0d10;font:800 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.24em;text-transform:uppercase;clip-path:polygon(0 0,100% 0,calc(100% - 10px) 100%,0 100%);padding-right:22px}
html body #community-app#community-app .ix-updates .ixu-headline{flex:1;min-width:0;display:flex;align-items:center;margin:0;padding:0 10px 0 8px;font:800 15px/1 var(--font-control-title,var(--font-heading,'Segoe UI')),sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app#community-app .ix-updates .ixu-bar .ix-updates-edit{align-self:center;margin:0 8px 0 0!important}
html body #community-app#community-app .ix-updates .ixu-main{padding:12px 16px 12px!important;min-height:0;flex:1;display:flex;flex-direction:column}
html body #community-app#community-app .ix-updates-body{font-size:13px!important;line-height:1.55!important}
html body #community-app#community-app .index-hero .ix-alert-col>.ix-updates{top:calc(100% + 28px)!important}
/* headers a touch larger (+1pt) */
html body #community-app#community-app .ix-alert .ixa-paper,html body #community-app#community-app .ix-alert .ixa-paper span{font-size:12.4px!important}
html body #community-app#community-app .ix-updates .ixu-tag{font-size:12.4px!important}
/* hard ceiling as a safety net: the panel can never reach the SDN sign */
html body #community-app#community-app .index-hero .ix-alert-col>.ix-updates{max-height:190px!important}
html body #community-app#community-app .ix-updates-body{overflow:hidden!important}
#app-dialog .ixu-count{display:block;margin-top:4px;text-align:right;font-size:11px}
/* Around the World v4: cards keep their stacking layer while they slide; the back card leaves first on open,
   the front card returns first on close; card contents fade instead of popping */
html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row.is-abroad-open>.ix-abroad-card{z-index:calc(30 - var(--i))!important}
html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-card{transition:transform .8s cubic-bezier(.22,1,.36,1) calc((5 - var(--i)) * 70ms),width .5s cubic-bezier(.22,1,.36,1),opacity .5s ease,filter .5s ease!important}
html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row:not(.is-abroad-open)>.ix-abroad-card{transition:transform .6s cubic-bezier(.22,1,.36,1) calc(var(--i) * 45ms),width .4s ease,opacity .4s ease,filter .4s ease!important;transition-delay:calc(var(--i) * 45ms)!important}
html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-card>*{visibility:visible!important;opacity:0;transition:opacity .25s ease!important}
html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row.is-abroad-open>.ix-abroad-card>*{opacity:1;transition:opacity .35s ease calc(.25s + (5 - var(--i)) * 70ms)!important}
html body #community-app#community-app .index-hero .ix-alert-col>.ix-updates{max-height:215px!important}
/* Around the World tile is always at its enlarged (hover) size, so the stack never has to chase a width change */
html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-main,html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-main:is(:hover,:focus-within){width:272px!important;transition:none!important}
/* Around the World arrow: no box; the tile's right edge takes a tint while the arrow shows */
html body #community-app#community-app .ix-abroad-main .ix-abroad-arrow{top:0!important;bottom:0!important;right:0!important;height:auto!important;width:46px!important;margin:0!important;border:0!important;border-radius:0 inherit inherit 0;border-top-right-radius:10px;border-bottom-right-radius:10px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--color-accent-default,#ffc45b) 30%,transparent))!important;box-shadow:none!important;justify-items:end;padding-right:8px;box-sizing:border-box;transform:none!important}
html body #community-app#community-app .ix-abroad-main .ix-abroad-arrow svg{filter:drop-shadow(0 0 4px #000a)}
/* admin strip: same gap under The Daily Signal as Updates, a little roomier */
html body #community-app#community-app .index-hero .ix-alert-col>.ix-staff{top:calc(100% + 28px)!important;padding:11px 14px 11px 22px!important;gap:14px!important}
/* Around the World timing: even ease-in-out (no long crawl at the end) */
html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-card{transition:transform .6s cubic-bezier(.45,.05,.3,1) calc((5 - var(--i)) * 55ms),width .45s cubic-bezier(.45,.05,.3,1),opacity .4s ease,filter .4s ease!important}
html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row:not(.is-abroad-open)>.ix-abroad-card{transition:transform .5s cubic-bezier(.45,.05,.3,1) calc(var(--i) * 40ms),width .4s ease,opacity .35s ease,filter .35s ease!important;transition-delay:calc(var(--i) * 40ms)!important}
html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row.is-abroad-open>.ix-abroad-card>*{transition:opacity .3s ease calc(.2s + (5 - var(--i)) * 55ms)!important}
/* continent / country silhouettes in place of the globe on the stacked location cards */
html body #community-app .ix-abroad-card .ix-symbol .ix-region-icon{display:block;width:40px;height:26px;background:currentColor;-webkit-mask:var(--region) left center/contain no-repeat;mask:var(--region) left center/contain no-repeat}
html body #community-app#community-app .ix-tiles .ix-abroad-card .ix-symbol:has(.ix-region-icon){width:48px!important;height:30px!important;max-width:none!important}
html body #community-app#community-app .ix-tiles .ix-abroad-card .ix-symbol .ix-region-icon{width:48px!important;height:30px!important}
/* The World: idle full-page drifting map (world-backdrop.js drives .world-pan; .pan-live only while the camera rests on it) */
#community-app .world-backdrop .world-pan{position:absolute;inset:0;z-index:2;overflow:hidden;background:#10232b;opacity:0;visibility:hidden;pointer-events:none}
#community-app .world-backdrop .world-pan-strip{position:absolute;top:0;left:0;height:100%;width:calc(var(--pan-w,1800px) * 3);background:url(/assets/world-geography.svg?v=4) 0 0/var(--pan-w,1800px) 100% repeat-x;will-change:transform;backface-visibility:hidden}
#community-app .world-backdrop.pan-live .world-pan{opacity:1;visibility:visible}
#community-app .world-backdrop.pan-live :is(.world-map-markers,.world-location-pin){opacity:0}
/* The World: location caption sits at the page's left edge (bottom-left), not bottom-right */
html body #community-app#community-app .world-focus-caption{position:fixed!important;left:calc(var(--navigation-gutter,64px) + 54px)!important;right:auto!important;bottom:48px!important;border-radius:0 8px 8px 0!important;z-index:5}
/* The World: directory pane sits further left, close to the sidebar */
html body #community-app#community-app .world-focus-caption{left:calc(var(--navigation-gutter,64px) + 14px)!important}
/* The World: movable directory pane (drag the title bar; double-click it to reset) */
html body #community-app#community-app .world-overview>.world-overview-box>.box-bar{cursor:grab;touch-action:none;user-select:none}
html body #community-app#community-app .world-overview>.world-overview-box.is-dragging{box-shadow:0 22px 50px #000c}
html body #community-app#community-app .world-overview>.world-overview-box.is-dragging>.box-bar{cursor:grabbing}
/* The World sidebar entry folds the whole region list */
#community-app #sidebar-links .sidebar-world.is-folded>:not(.sidebar-world-root){display:none!important}
#community-app #sidebar-links .sidebar-world-root .sidebar-world-chev{margin-left:auto;display:grid;place-items:center;width:26px;height:26px;border-radius:7px;border:1px solid rgb(255 255 255 / .16);background:rgb(255 255 255 / .05);font-style:normal;cursor:pointer;color:#cfd6de;transition:transform .2s ease,border-color .2s,box-shadow .2s}
#community-app #sidebar-links .sidebar-world-root .sidebar-world-chev:hover{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b);box-shadow:0 0 10px color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,transparent)}
#community-app #sidebar-links .sidebar-world-root.is-open .sidebar-world-chev{transform:rotate(90deg);border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b)}
#community-app.sidebar-collapsed #sidebar-links .sidebar-world-chev{display:none!important}
/* bigger expand/collapse symbols in The World directory and the sidebar */
html body #community-app#community-app .world-overview .territory-expand{width:32px!important;height:32px!important;font-size:18px!important;line-height:1!important;display:grid!important;place-items:center!important;padding:0!important}
#community-app #sidebar-links :is(.sidebar-region,.sidebar-world-root) .sidebar-region-chev svg{width:18px!important;height:18px!important;stroke-width:2.6}
html body #community-app .world-overview-region-title[data-map-preview]{cursor:pointer}
html body #community-app .world-overview-region-title[data-map-preview]:hover>span{color:var(--color-accent-default,#ffc45b)}
/* drifting map matches the canvas map exactly (same ocean colour, same 80% opacity over the layer background) */
#community-app .world-backdrop .world-pan{background:var(--sdn-142a35,#142a35)!important}
#community-app .world-backdrop .world-pan-strip{background-color:#10232b!important;opacity:.8}
/* World pane v2: fixed to the viewport, positioned by --wp-left/--wp-top (set in JS, always on screen) */
/* The World: no floating location caption */
html body #community-app#community-app .world-focus-caption,#community-app .world-backdrop .world-map-caption{display:none!important}
/* location cards (region pages): a little larger, bigger text */
html body #community-app#community-app .location-strip .location-side-card{flex:0 0 270px!important;min-height:100px!important}
html body #community-app#community-app .location-strip .location-side-card>span{min-height:100px!important;padding:14px 16px!important}
html body #community-app#community-app .location-strip .location-side-card strong{font-size:20px!important}
html body #community-app#community-app .location-strip .location-side-card>span>:not(strong){font-size:13.5px!important}
/* location cards on region/thread pages: one more step up */
html body #community-app#community-app .location-strip .location-side-card{flex:0 0 300px!important;min-height:116px!important}
html body #community-app#community-app .location-strip .location-side-card>span{min-height:116px!important;padding:16px 18px!important}
html body #community-app#community-app .location-strip .location-side-card strong{font-size:23px!important;letter-spacing:.01em}
html body #community-app#community-app .location-strip .location-side-card>span>:not(strong){font-size:14.5px!important}
/* ---- Wanted Ads v2: categories as tabs down the left side, roomy content on the right ---- */
html body #community-app#community-app .wanted-box.wanted-tabbed{display:grid!important;grid-template-columns:280px minmax(0,1fr);grid-template-rows:auto 1fr;align-items:start}
html body #community-app#community-app .wanted-box.wanted-tabbed>.box-bar{grid-column:1/-1}
html body #community-app#community-app .wanted-tabbed>.wanted-tabs{grid-column:1;display:flex!important;flex-direction:column;gap:10px;padding:22px 0 22px 22px!important;border:0!important;border-right:1px solid #ffffff14!important;align-self:stretch}
html body #community-app#community-app .wanted-tabbed .wanted-tab{position:relative;display:grid!important;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:12px;margin:0 -1px 0 0!important;padding:12px 14px!important;border:1px solid #ffffff14!important;border-right:0!important;border-radius:10px 0 0 10px!important;background:#0b0f14b3!important;text-transform:none!important;letter-spacing:0!important;font:inherit!important;color:#cfd6de!important}
html body #community-app#community-app .wanted-tabbed .wanted-tab-art{width:44px;height:44px;border-radius:8px;background:var(--folder-art) center/cover;box-shadow:inset 0 0 0 1px #ffffff1f;filter:grayscale(.6) brightness(.8);transition:filter .2s}
html body #community-app#community-app .wanted-tabbed .wanted-tab-text{display:flex;flex-direction:column;gap:3px;min-width:0}
html body #community-app#community-app .wanted-tabbed .wanted-tab-text strong{font:800 13px/1.15 Consolas,monospace;letter-spacing:1.4px;text-transform:uppercase}
html body #community-app#community-app .wanted-tabbed .wanted-tab-text em{font-style:normal;font-size:11.5px;line-height:1.35;color:#8d97a1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html body #community-app#community-app .wanted-tabbed .wanted-tab small{font-size:11px;padding:3px 8px;border-radius:99px;background:#ffffff14;color:#cfd6de}
html body #community-app#community-app .wanted-tabbed .wanted-tab:hover{background:#121820!important;color:#fff!important}
html body #community-app#community-app .wanted-tabbed .wanted-tab:hover .wanted-tab-art{filter:none}
html body #community-app#community-app .wanted-tabbed .wanted-tab.is-active{background:#11161c!important;border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)!important;color:#fff!important;box-shadow:inset 3px 0 0 var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .wanted-tabbed .wanted-tab.is-active .wanted-tab-art{filter:none}
html body #community-app#community-app .wanted-tabbed .wanted-tab.is-active strong{color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .wanted-tabbed .wanted-tab.is-active small{background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 25%,transparent);color:#fff}
html body #community-app#community-app .wanted-tabbed>.wanted-tab-panel{grid-column:2;padding:22px 26px 28px!important;min-width:0}
html body #community-app#community-app .wanted-tabbed .wanted-tab-banner{min-height:140px!important;padding:20px 24px!important;margin-bottom:22px!important;border-radius:12px!important}
html body #community-app#community-app .wanted-tabbed .wanted-tab-banner strong{font-size:26px!important}
html body #community-app#community-app .wanted-tabbed .wanted-tab-banner em{font-size:14px!important;max-width:560px}
html body #community-app#community-app .wanted-tabbed .wanted-tab-panel .forum-thread-cards{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:18px!important}
@media(max-width:900px){html body #community-app#community-app .wanted-box.wanted-tabbed{grid-template-columns:1fr}html body #community-app#community-app .wanted-tabbed>.wanted-tabs{flex-direction:row;overflow-x:auto;border-right:0!important;border-bottom:1px solid #ffffff14!important;padding:16px 16px 0!important}html body #community-app#community-app .wanted-tabbed>.wanted-tab-panel{grid-column:1}}
html body #community-app#community-app .world-overview>.world-overview-box{position:relative;z-index:4;transform:translate(var(--wp-x,0px),var(--wp-y,0px))}
/* ---- Rules gate (guests / "hasn't read the rules" role) ---- */
/* locked items stay visible but greyed out; clicking one explains why (see rules gate in community-app.js) */
#community-app.rules-locked .is-locked,#community-app.rules-locked :is(#sidebar-music,.header-watching,.notify-bell,.trail-bookmark,.page-bookmark,#sidebar-links>.bookmarks-menu){opacity:.38!important;filter:grayscale(1)!important;cursor:not-allowed!important;box-shadow:none!important}
#community-app.rules-locked .is-locked *{cursor:not-allowed!important}
#community-app.rules-locked :is(.card-bookmark,.minimized-sheet-dock){display:none!important}
#community-app:not(.is-admin) #sidebar-manage-links{display:none!important}
html body #community-app .index-hero .ix-rules-banner{grid-column:1/-1;justify-self:center;align-self:center;display:flex;align-items:center;gap:14px;margin:34px auto 0;padding:16px 26px;max-width:760px;border-radius:12px;background:#06090de6;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent);box-shadow:0 16px 36px #0009,0 0 22px color-mix(in srgb,var(--color-accent-default,#ffc45b) 20%,transparent);color:#fff;font:600 16px/1.4 var(--font-control-ui,'Segoe UI'),sans-serif;text-align:left;backdrop-filter:blur(8px)}
html body #community-app .index-hero .ix-rules-banner svg{flex:none;color:var(--color-accent-default,#ffc45b)}
html body #community-app .rules-locked-page{max-width:640px;margin:40px auto!important}
html body #community-app .rules-locked-page .rlp-body{display:flex;flex-direction:column;align-items:center;gap:10px;padding:40px 30px;text-align:center;color:#dfe5ea}
html body #community-app .rules-locked-page svg{color:var(--color-accent-default,#ffc45b)}
html body #community-app .rules-locked-page h2{margin:6px 0 0;font-size:20px;color:#fff}
html body #community-app .rules-locked-page p{margin:0;color:#aab4be}
html body #community-app .rules-locked-page .rlp-back{margin-top:12px;padding:8px 16px;border-radius:8px;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent);color:var(--color-accent-default,#ffc45b)!important;text-decoration:none!important}
html body #community-app .index-hero .ix-rules-banner{margin:120px auto 0!important;position:relative;z-index:7}
/* rules banner floats in the band above the tiles without pushing them down */
html body #community-app .index-hero .ix-rules-banner{position:absolute!important;left:50%;top:calc(100% + 118px);transform:translateX(-50%);margin:0!important;width:max-content;max-width:min(760px,calc(100% - 48px))}
/* ---- Main Index responsiveness ---- */
/* tiles never show post / character counts, last-post blocks or sub-location badges */
html body #community-app#community-app #app-view>.forum-main-index .ix-tiles .ix-row>* :is(.basic-forum-counts,.basic-forum-latest,.subcategory-badge-scroller,.forum-card-description){display:none!important}
@media (max-width:760px),(hover:none){html body #community-app#community-app #app-view>.forum-main-index .ix-tiles .ix-row>* .forum-entry-label>:not(h2,h3){display:none!important}}
/* narrower screens: tile rows wrap instead of running off the edge, and drop the staircase offset */
@media (max-width:1320px){
 html body #community-app#community-app #app-view .ix-tiles>.ix-row{flex-wrap:wrap!important;margin-left:0!important;row-gap:14px!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles.ix-tiles{margin-right:var(--page-gap,32px)!important;display:flex!important;flex-direction:column!important}
}
@media (max-width:760px){html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry):not(.ix-abroad-card){flex:1 1 calc(50% - 14px)!important;width:auto!important;min-width:150px}}
/* narrower screens: admins + updates stop floating and sit in the normal flow under the ticker */
@media (max-width:1100px){
 html body #community-app#community-app .index-hero .ix-alert-col{position:static!important;align-items:stretch!important;gap:14px}
 html body #community-app#community-app .index-hero .ix-alert-col>:is(.ix-staff,.ix-updates){position:static!important;left:auto!important;right:auto!important;top:auto!important;margin:0!important}
 html body #community-app#community-app .index-hero .ix-alert-col>.ix-staff{align-self:flex-start}
 html body #community-app#community-app .index-hero .ix-alert-col>.ix-updates{width:auto!important;max-width:560px!important;max-height:none!important}
 html body #community-app#community-app .index-hero .ix-alert{margin-right:0!important}
 html body #community-app .index-hero .ix-rules-banner{position:static!important;transform:none!important;margin:18px 0 0!important;max-width:none}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles.ix-tiles{margin-top:28px!important}
}
@media (max-width:1100px){
 html body #community-app#community-app .index-hero .index-hero-copy{display:flex!important;flex-direction:column}
 html body #community-app#community-app .index-hero .ix-title-row{display:contents!important}
 html body #community-app#community-app .index-hero .index-hero-copy>.index-hero-kicker{order:0}
 html body #community-app#community-app .index-hero .ix-title-row>h2{order:1}
 html body #community-app#community-app .index-hero .index-hero-copy>p{order:2;margin-bottom:18px!important}
 html body #community-app#community-app .index-hero .ix-alert-col{order:3}
 html body #community-app#community-app .index-hero .ix-alert-col>.ix-updates{align-self:flex-start}
}
/* locked tiles keep a solid body (so stacked cards don't show through); only their contents dim */
#community-app.rules-locked .ix-tiles article.is-locked{opacity:1!important;filter:grayscale(1) brightness(.75)!important}
#community-app.rules-locked .ix-tiles article.is-locked>*{opacity:.45}

/* =====================================================================================================
   PHONE LAYOUT (max-width:640px). Desktop styles above are untouched; everything here only applies on phones.
   ===================================================================================================== */
#community-app .phone-fab{display:none}
@media (max-width:640px){
 html body #community-app#community-app{--navigation-gutter:0px;--page-gap:12px;--phone-bar:0px}
 /* ---- chrome: no rail, drawer sidebar, bottom tab bar ---- */
 html body #community-app#community-app .app-content{margin-left:0!important}
 html body #community-app#community-app .world-backdrop{left:0!important;bottom:var(--phone-bar)!important}
 html body #community-app#community-app #app-sidebar{position:fixed!important;top:0!important;bottom:var(--phone-bar)!important;left:0!important;height:auto!important;width:min(300px,84vw)!important;padding-top:14px!important;transform:translateX(-102%);transition:transform .28s cubic-bezier(.2,.8,.2,1)!important;background:#070a0ef7!important;border-right:1px solid #ffffff1a!important;overflow-y:auto!important;z-index:10200!important}
 html body #community-app#community-app.phone-drawer-open #app-sidebar{transform:none}
 html body #community-app#community-app #sidebar-toggle{display:none!important}
 html body #community-app#community-app.phone-drawer-open #sidebar-dismiss{display:block!important;opacity:1!important;pointer-events:auto!important;position:fixed!important;inset:0 0 var(--phone-bar) 0!important;left:0!important;height:auto!important;background:#000a!important;z-index:10190!important}
 html body #community-app#community-app.phone-drawer-open #sidebar-dismiss::before{display:none}
 html body #community-app#community-app:not(.phone-drawer-open) #sidebar-dismiss{display:none!important}
 html body #community-app#community-app #sidebar-links a{min-height:44px}
 /* ---- header: one slim row ---- */
 html body #community-app#community-app .app-header{height:52px!important;min-height:0!important;padding:0 10px!important;display:flex!important;align-items:center;gap:8px;background:#06090de6!important;backdrop-filter:blur(8px)!important;pointer-events:auto}
 html body #community-app#community-app .app-brand small{display:none!important}
 html body #community-app#community-app .app-brand span{font-size:18px!important}
 html body #community-app#community-app .header-forum-trail{display:none!important}
 html body #community-app#community-app .app-header :is(#page-settings-toggle,.header-watching,.notify-bell,.account-link){transform:scale(.88)}
 /* ---- page area: full width, room for the tab bar ---- */
 html body #community-app#community-app #app-view#app-view{padding-top:62px!important;padding-bottom:84px!important}
 html body #community-app#community-app #app-view,html body #community-app#community-app #app-frame{padding:0 10px!important;left:0!important;right:0!important;margin:0!important;width:auto!important;max-width:none!important}
 html body #community-app#community-app #app-view>:is(.std-box,section,.world-overview,.forum-main-index){margin-left:0!important;margin-right:0!important;max-width:none!important;width:auto!important}
 html body #community-app#community-app .box-bar{padding:10px 12px!important;gap:8px}
 html body #community-app#community-app .box-bar-title{font-size:15px!important;letter-spacing:.18em!important}
 html body #community-app#community-app .corner-pill,html body #community-app#community-app .box-bar-tools button{font-size:11px!important;padding:6px 10px!important}
 html body #community-app#community-app :is(.std-box-body,.location-content-panel)>*{min-width:0}
 /* ---- Main Index ---- */
 html body #community-app#community-app #app-view>.forum-main-index>.index-hero{padding:4px 2px 0!important;min-height:0!important;background:none!important}
 html body #community-app#community-app .index-hero .index-hero-kicker{font-size:9px!important;letter-spacing:.22em!important}
 html body #community-app#community-app .index-hero .ix-title-row>h2{font-size:40px!important;line-height:1!important;margin:4px 0!important;word-break:normal}
 html body #community-app#community-app .index-hero .index-hero-copy>p{font-size:12px!important;letter-spacing:.08em;margin:0 0 12px!important}
 html body #community-app#community-app .index-hero .ix-alert{height:40px!important}
 html body #community-app#community-app .index-hero .ix-alert .ixa-paper{padding:0 10px!important;font-size:0!important;gap:0!important}
 html body #community-app#community-app .index-hero .ix-alert .ixa-paper svg{width:18px;height:18px}
 html body #community-app#community-app .index-hero .ix-alert .ixa-item{font-size:13px!important}
 html body #community-app#community-app .index-hero .ix-alert-col>.ix-staff{padding:6px 10px 6px 14px!important;gap:8px!important}
 html body #community-app#community-app .index-hero .ix-staff-face{width:32px;height:32px}
 html body #community-app#community-app .index-hero .ix-alert-col>.ix-updates{max-width:none!important;width:100%!important}
 html body #community-app#community-app .ix-updates .ixu-headline{font-size:13px!important}
 html body #community-app .index-hero .ix-rules-banner{font-size:13.5px!important;padding:12px 14px!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles.ix-tiles{margin:18px 0 0!important;padding:0!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important}
 html body #community-app#community-app #app-view .ix-tiles>.ix-row{display:contents!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry){width:auto!important;height:92px!important;min-width:0!important;flex:none!important;position:relative!important;transform:none!important;left:auto!important;top:auto!important;opacity:1!important;filter:none!important;visibility:visible!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>*>*{visibility:visible!important;opacity:1!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>* :is(h2,h3){font-size:15px!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>*::before{font-size:10px!important;top:8px!important;right:10px!important}
 html body #community-app#community-app .ix-tiles .ix-abroad-main{display:none!important}
 html body #community-app#community-app .ix-tiles .ix-abroad-card{pointer-events:auto!important}
 html body #community-app#community-app.rules-locked .ix-tiles article.is-locked{filter:grayscale(1) brightness(.75)!important}
 /* ---- The World: directory fills the width, no dragging, map behind ---- */
 html body #community-app#community-app .world-overview{display:block!important}
 html body #community-app#community-app .world-overview>.world-overview-box{transform:none!important;width:auto!important;max-height:none!important;background:#080b10eb!important}
 html body #community-app#community-app .world-overview>.world-overview-box>.box-bar{cursor:default!important}
 html body #community-app#community-app .world-overview .world-focus{display:none!important}
 html body #community-app#community-app .world-overview-intro{display:none!important}
 /* ---- Characters: filters fold into a compact bar above the cards ---- */
 html body #community-app#community-app .cast-directory{display:flex!important;flex-direction:column!important;gap:12px!important}
 html body #community-app#community-app .cast-sidebar{position:static!important;width:auto!important;max-height:none!important;padding:10px!important}
 html body #community-app#community-app .cast-sidebar:not(.phone-filters-open)>:not(.cast-search){display:none!important}
 html body #community-app#community-app .cast-grid{grid-template-columns:1fr!important;gap:12px!important}
 /* ---- Wanted Ads: tabs become a swipeable chip row ---- */
 html body #community-app#community-app .wanted-box.wanted-tabbed{display:block!important}
 html body #community-app#community-app .wanted-tabbed>.wanted-tabs{flex-direction:row!important;overflow-x:auto!important;gap:8px!important;padding:12px!important;border:0!important;border-bottom:1px solid #ffffff14!important;scrollbar-width:none}
 html body #community-app#community-app .wanted-tabbed .wanted-tab{flex:0 0 auto;grid-template-columns:auto auto!important;border-right:1px solid #ffffff14!important;border-radius:99px!important;padding:8px 14px!important;margin:0!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab.is-active{box-shadow:none!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab :is(.wanted-tab-art,.wanted-tab-text em){display:none!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-text strong{font-size:12px!important;white-space:nowrap}
 html body #community-app#community-app .wanted-tabbed>.wanted-tab-panel{padding:12px!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-banner{min-height:88px!important;padding:14px!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-banner strong{font-size:19px!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-panel .forum-thread-cards{grid-template-columns:1fr!important}
 /* ---- generic grids / lists collapse to one column ---- */
 html body #community-app#community-app :is(.forum-thread-cards,.fx-grid,.ooc-grid,.ooc-directory-grid,.location-side-items){grid-template-columns:1fr!important}
 html body #community-app#community-app .location-strip .location-side-card{flex:0 0 78%!important;min-height:84px!important}
 html body #community-app#community-app .location-strip .location-side-card>span{min-height:84px!important}
 html body #community-app#community-app .location-strip .location-side-card strong{font-size:18px!important}
 /* ---- threads ---- */
 html body #community-app#community-app .forum-post{display:block!important;padding:0!important}
 html body #community-app#community-app .forum-post .post-author{width:auto!important;max-width:none!important;display:flex!important;align-items:center;gap:10px;padding:10px!important;border-bottom:1px solid #ffffff14}
 html body #community-app#community-app .forum-post .post-author .post-author-pin{display:flex!important;align-items:center;gap:10px;position:static!important;width:auto!important}
 html body #community-app#community-app .forum-post .post-portrait-reveal{width:52px!important;height:78px!important;flex:none;border-radius:8px;overflow:hidden}
 html body #community-app#community-app .forum-post .post-portrait-facts{display:none!important}
 html body #community-app#community-app .forum-post .post-body{padding:12px!important}
 html body #community-app#community-app .thread-view-heading{padding:12px!important}
 html body #community-app#community-app .thread-view-heading h1{font-size:20px!important}
 /* ---- dialogs / floating things fit the screen ---- */
 html body #community-app#community-app dialog,html body dialog.ui-confirm{max-width:calc(100vw - 20px)!important;width:calc(100vw - 20px)!important}
 html body #community-app#community-app .dm-player{left:8px!important;right:8px!important;width:auto!important;top:auto!important;bottom:calc(var(--phone-bar) + 8px)!important}
 html body #community-app#community-app .minimized-sheet-dock{bottom:var(--phone-bar)!important;left:0!important}
 html body #community-app#community-app #profile-views{left:0!important;right:0!important;top:52px!important;bottom:var(--phone-bar)!important;width:auto!important;height:auto!important;max-width:none!important;transform:none!important;border-radius:0!important}
}
#community-app .phone-filter-toggle{display:none}
@media (max-width:640px){html body #community-app#community-app .phone-filter-toggle{display:block;float:right;margin:-2px 0 6px;padding:5px 12px!important;border-radius:99px!important;border:1px solid #ffffff2a!important;background:#ffffff0d!important;color:#e6ebf0!important;font-size:11px!important;min-height:0!important}
 html body #community-app#community-app .cast-sidebar.phone-filters-open .phone-filter-toggle{border-color:var(--color-accent-default,#ffc45b)!important;color:var(--color-accent-default,#ffc45b)!important}}
@media (max-width:640px){
 html body #dev-control-toggle,html body #dev-control-panel{display:none!important}
 html body #community-app#community-app .phone-fab{display:grid;place-items:center;position:fixed;z-index:10220;width:52px;height:52px;padding:0!important;border-radius:50%!important;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 70%,transparent)!important;background:#0b0f14f0!important;color:var(--color-accent-default,#ffc45b)!important;box-shadow:0 8px 24px #000c,0 0 16px color-mix(in srgb,var(--color-accent-default,#ffc45b) 30%,transparent);touch-action:none;transition:left .25s cubic-bezier(.2,.8,.2,1),top .25s cubic-bezier(.2,.8,.2,1),transform .15s;-webkit-tap-highlight-color:transparent;min-height:0!important}
 html body #community-app#community-app .phone-fab.is-dragging{transition:none;transform:scale(1.08)}
 html body #community-app .phone-fab path{transition:transform .25s ease,opacity .2s ease;transform-origin:12px 12px}
 html body #community-app.phone-drawer-open .phone-fab .fab-a{transform:translateY(6px) rotate(45deg)}
 html body #community-app.phone-drawer-open .phone-fab .fab-b{opacity:0}
 html body #community-app.phone-drawer-open .phone-fab .fab-c{transform:translateY(-6px) rotate(-45deg)}
 html body #community-app#community-app #app-sidebar{top:0!important;bottom:0!important}
 html body #community-app#community-app.phone-drawer-open #sidebar-dismiss{inset:0!important}
 html body #community-app#community-app .index-hero .ix-alert .ixa-tools{flex:none}
 html body #community-app#community-app .index-hero .ix-alert-col,html body #community-app#community-app .index-hero .ix-alert{min-width:0!important;max-width:100%!important;width:100%!important}
 html body #community-app#community-app .index-hero{width:auto!important;max-width:100%!important;box-sizing:border-box}
 html body #community-app#community-app .cast-card{max-width:100%!important;min-width:0!important}
 html body #community-app#community-app #page-corner-actions{position:fixed!important;top:52px!important;left:0!important;right:0!important;display:flex!important;gap:8px;padding:8px 10px!important;overflow-x:auto;scrollbar-width:none;background:#06090de0;border-bottom:1px solid #ffffff12;z-index:10140;transform:none!important}
 html body #community-app#community-app #page-corner-actions:empty{display:none!important}
 html body #community-app#community-app #page-corner-actions>*{flex:none;font-size:11px!important;padding:6px 12px!important;white-space:nowrap}
 html body #community-app#community-app.hz-corner-full #app-view#app-view{padding-top:104px!important}
}
@media (max-width:640px){
 html body #community-app#community-app .app-header{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#06090df5!important;transform:none!important;filter:none!important}
 html body #community-app#community-app :is(#app-workspace,#app-frame){padding-left:0!important;padding-right:0!important}
 html body #community-app#community-app #app-view#app-view{padding-left:8px!important;padding-right:8px!important}
 html body #community-app#community-app .std-box-body{padding-left:12px!important;padding-right:12px!important}
 html body #community-app#community-app :is(.cast-results,.cast-directory){padding-left:0!important;padding-right:0!important;min-width:0!important}
 html body #community-app#community-app .cast-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important}
 html body #community-app#community-app .cast-card{width:100%!important;box-sizing:border-box}
 html body #community-app#community-app .guide-panel,html body #community-app#community-app .handbook-article{padding-left:14px!important;padding-right:14px!important}
}
@media (max-width:640px){
 html body #community-app#community-app .guide-body{display:flex!important;flex-direction:column!important;gap:10px!important}
 html body #community-app#community-app .guide-body>*{width:auto!important;max-width:none!important;min-width:0!important;position:static!important}
 html body #community-app#community-app .guide-side{order:-1;display:block!important;height:auto!important;max-height:none!important;padding:0!important;background:none!important;border:0!important}
 html body #community-app#community-app .guide-side .guide-tabs{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;overflow-x:auto!important;gap:6px!important;padding:2px 0 6px!important;scrollbar-width:none}
 html body #community-app#community-app .guide-side .guide-tab{flex:none!important;width:auto!important;min-height:0!important;height:auto!important;padding:7px 12px!important;border-radius:99px!important;font-size:12px!important;white-space:nowrap}
 html body #community-app#community-app .guide-side .guide-tab *{font-size:12px!important}
 html body #community-app#community-app .guide-side :is(img,.guide-tab-art,.guide-tab-image){display:none!important}
 html body #community-app#community-app .guide-panel{padding:0!important}
 html body #community-app#community-app .app-header #page-corner-actions#page-corner-actions,html body #community-app#community-app #page-corner-actions#page-corner-actions{position:fixed!important;top:52px!important;left:0!important;right:0!important;width:auto!important;margin:0!important}
 html body #community-app#community-app #character-cards#character-cards{grid-template-columns:minmax(0,1fr)!important}
 html body #community-app#community-app .cast-sidebar{width:100%!important;box-sizing:border-box;flex:none!important}
}
@media (max-width:640px){
 html body #community-app#community-app .location-telemetry{display:none!important}
 html body #community-app#community-app :is(.dispatch-navigation,.box-bar):has(.dispatch-actions){flex-wrap:wrap!important;row-gap:8px!important;height:auto!important}
 html body #community-app#community-app .dispatch-actions{flex:1 1 100%!important;justify-content:flex-start!important;flex-wrap:wrap;gap:6px!important;margin:0!important}
 html body #community-app#community-app .dispatch-navigation :is(h1,h2,.box-bar-title){white-space:nowrap;overflow:visible!important;text-overflow:clip!important;max-width:none!important}
 html body #community-app#community-app .guide-side .guide-tab{background:#0d1217!important;border:1px solid #ffffff22!important;color:#cfd6de!important;filter:none!important;opacity:1!important;backdrop-filter:none!important}
 html body #community-app#community-app .guide-side .guide-tab.is-active{border-color:var(--color-accent-default,#ffc45b)!important;color:var(--color-accent-default,#ffc45b)!important}
 html body #community-app#community-app .guide-side .guide-tab::before,html body #community-app#community-app .guide-side .guide-tab::after{display:none!important}
 html body #community-app#community-app.hz-corner-full #app-view#app-view{padding-top:98px!important}
 html body #community-app#community-app #app-view#app-view>*:first-child{margin-top:0!important}
}
@media (max-width:640px){
 html body #community-app#community-app :is(.guide-volume,.guide-body,.guide-layout)::before,html body #community-app#community-app :is(.guide-volume,.guide-body,.guide-layout)::after{display:none!important}
 html body #community-app#community-app .guide-side{position:relative!important;z-index:5!important}
 html body #community-app#community-app .guide-volume{padding:0!important;background:none!important;box-shadow:none!important;border:0!important}
 html body #community-app#community-app .guide-panes,html body #community-app#community-app .guide-pane,html body #community-app#community-app .handbook-article{padding-left:14px!important;padding-right:14px!important;margin-left:0!important;margin-right:0!important;width:auto!important;max-width:none!important}
}
@media (max-width:640px){html body #community-app#community-app #app-view .guide-panel .guide-panes.guide-panes{padding:12px 4px 20px!important}
 html body #community-app#community-app #app-view .guide-panel .guide-pane.guide-pane{padding:0 10px!important;width:auto!important}}
/* phone: thread page is a full-width reading column (desktop parks it as a right-hand panel over the map) */
@media (max-width:640px){
 html body #community-app#community-app #app-view#app-view.hz-thread{display:block!important;padding-left:8px!important;padding-right:8px!important}
 html body #community-app#community-app #app-view#app-view>:is(.thread-view-heading,.thread-panel-backdrop,.thread-reading-area){width:auto!important;max-width:none!important;margin:0!important;justify-self:stretch!important;left:auto!important;right:auto!important}
 html body #community-app#community-app #app-view#app-view>.thread-panel-backdrop{display:none!important}
 html body #community-app#community-app #app-view#app-view>.thread-reading-area{height:auto!important;max-height:none!important;overflow:visible!important;background:#080b10eb;border-radius:0 0 12px 12px}
 html body #community-app#community-app #app-view#app-view>.thread-view-heading{border-radius:12px 12px 0 0!important;background:#0d1115f2!important}
 html body #community-app#community-app .thread-heading-actions{flex:none}
}
@media (max-width:640px){
 html body #community-app#community-app #app-view>.thread-view-heading{flex-wrap:wrap!important;gap:10px!important;padding:12px!important}
 html body #community-app#community-app #app-view>.thread-view-heading>*{min-width:0}
 html body #community-app#community-app #app-view>.thread-view-heading>div:not(.thread-heading-actions){flex:1 1 100%!important;order:2;display:flex!important;flex-direction:column!important;gap:6px!important}
 html body #community-app#community-app #app-view>.thread-view-heading :is(h1,.th-title){font-size:20px!important;line-height:1.2!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;max-width:none!important;width:auto!important}
 html body #community-app#community-app #app-view>.thread-view-heading>.thread-heading-actions{order:1;margin-left:auto}
 html body #community-app#community-app .thread-reading-area .forum-post{margin:10px 0!important}
}
/* =====================================================================================================
   PHONE: traditional forum layout — boxed category lists, one-line topic rows, stacked posts
   ===================================================================================================== */
@media (max-width:640px){
 /* Main Index: tiles become a boxed forum list (icon · name · chevron), one row each */
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles.ix-tiles{display:flex!important;flex-direction:column!important;gap:0!important;margin-top:16px!important;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 30%,#ffffff12);border-radius:12px;overflow:hidden;background:#080b10ee}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles::before{content:'Forums';display:block;padding:10px 14px;font:800 11px/1 Consolas,monospace;letter-spacing:.22em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b);background:#0d1217;border-bottom:1px solid #ffffff14}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry){display:flex!important;flex-direction:row!important;align-items:center!important;gap:12px!important;height:auto!important;min-height:54px!important;padding:10px 40px 10px 14px!important;border:0!important;border-bottom:1px solid #ffffff10!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>*::before{display:none!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>*::after{content:'›'!important;display:block!important;position:absolute!important;right:14px!important;top:50%!important;transform:translateY(-50%)!important;font-size:22px;line-height:1;color:#6d7780;background:none!important;width:auto!important;height:auto!important;inset:auto 14px auto auto!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>* .ix-symbol{position:static!important;flex:none;width:34px!important;height:34px!important;display:grid!important;place-items:center;border-radius:9px;background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 12%,transparent);color:var(--color-accent-default,#ffc45b)}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>* .ix-symbol svg{width:19px!important;height:19px!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>* .forum-entry-portrait{display:none!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>* :is(.basic-forum-identity,.forum-entry-label){position:static!important;display:block!important;margin:0!important;padding:0!important;min-width:0}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>* .forum-entry-label::before{display:none!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>* :is(h2,h3){margin:0!important;font:700 15.5px/1.2 var(--font-control-title,'Segoe UI'),sans-serif!important;letter-spacing:.01em!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>* :is(h2,h3) a{color:#eef2f5!important}
 html body #community-app#community-app .ix-tiles .ix-abroad-card .ix-region-icon{width:22px!important;height:16px!important}
 html body #community-app#community-app .ix-tiles .ix-abroad-card .ix-symbol:has(.ix-region-icon){width:34px!important;height:34px!important}
 html body #community-app#community-app .ix-tiles article:active{background:#ffffff0a!important}

 /* Topic lists: one compact row per thread (title, started by, status, replies) */
 html body #community-app#community-app .forum-thread-cards{display:flex!important;flex-direction:column!important;gap:0!important;border:1px solid #ffffff14;border-radius:12px;overflow:hidden;background:#080b10ee}
 html body #community-app#community-app .dispatch-thread-card{display:grid!important;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"main main" "foot foot";gap:6px 10px!important;min-height:0!important;height:auto!important;margin:0!important;padding:12px 14px!important;border:0!important;border-bottom:1px solid #ffffff10!important;border-left:3px solid var(--thread-accent,var(--character-color,#ffc45b))!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;transform:none!important}
 html body #community-app#community-app .dispatch-thread-card::before,html body #community-app#community-app .dispatch-thread-card::after{display:none!important}
 html body #community-app#community-app .dispatch-thread-card .thread-latest{display:none!important}
 html body #community-app#community-app .dispatch-thread-card .thread-card-main{grid-area:main;padding:0!important;min-height:0!important;display:flex!important;flex-direction:column;gap:3px}
 html body #community-app#community-app .dispatch-thread-card .thread-card-title{font:700 15.5px/1.25 var(--font-control-title,'Segoe UI'),sans-serif!important;font-style:normal!important;text-transform:none!important;letter-spacing:0!important;color:#eef2f5!important;white-space:normal!important}
 html body #community-app#community-app .dispatch-thread-card :is(.thread-started-by,time){font-size:11.5px!important;color:#8d97a1!important;letter-spacing:0!important}
 html body #community-app#community-app .dispatch-thread-card .thread-card-footer{grid-area:foot;display:flex!important;flex-wrap:wrap;align-items:center;gap:6px!important;padding:0!important;margin:0!important;border:0!important;background:none!important}
 html body #community-app#community-app .dispatch-thread-card .thread-card-footer *{font-size:10.5px!important}
 html body #community-app#community-app .dispatch-thread-card .thread-card-counts{margin-left:auto}
 html body #community-app#community-app .dispatch-thread-card .card-bookmark{top:10px!important;right:10px!important;transform:none!important;width:24px!important;height:24px!important}
 html body #community-app#community-app .dispatch-thread-card.thread-unread .thread-card-title::before{content:'';display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;background:var(--color-accent-default,#ffc45b);vertical-align:2px}

 /* Sub-forum strip on location pages: a list of rows instead of a swipe carousel */
 html body #community-app#community-app .location-strip .location-side-items{display:flex!important;flex-direction:column!important;gap:0!important;overflow:visible!important;transform:none!important}
 html body #community-app#community-app .location-strip .location-side-card{flex:none!important;width:auto!important;min-height:0!important;border-radius:0!important;border:0!important;border-bottom:1px solid #ffffff10!important}
 html body #community-app#community-app .location-strip .location-side-card>span{min-height:48px!important;padding:10px 12px!important}
 html body #community-app#community-app .location-strip .location-side-card strong{font-size:15.5px!important}
 html body #community-app#community-app .location-strip .location-side-card>img{opacity:.35!important}
 html body #community-app#community-app .location-strip :is(.location-carousel-arrow,.location-strip-arrow,button[aria-label*=Scroll],button[aria-label*=scroll],.location-side-next,.location-side-prev){display:none!important}

 /* Faction page: badge + title stacked, full width */
 html body #community-app#community-app .fx-detail-head{flex-direction:column!important;align-items:flex-start!important;gap:12px!important;height:auto!important;min-height:0!important}
 html body #community-app#community-app .fx-detail-head .fx-detail-badge{width:84px!important;height:auto!important}
 html body #community-app#community-app .fx-detail-title{width:auto!important;max-width:none!important;flex:none!important}
 html body #community-app#community-app .fx-detail-title :is(h1,h2,h3){font-size:24px!important;line-height:1.15!important;word-break:normal!important}
 html body #community-app#community-app .fx-notes-box{display:block!important}
 html body #community-app#community-app .fx-role :is(.fx-members,.fx-member-grid){grid-template-columns:1fr!important}

 /* Plotters: members as a plain list with avatar */
 html body #community-app#community-app .ooc-member-card{height:auto!important;min-height:58px!important;margin:0!important}
 html body #community-app#community-app .ooc-member-card :is(.of-shape,.of-edges){display:none!important}
 html body #community-app#community-app .ooc-member-card .of-clip{position:absolute!important;left:12px!important;top:50%!important;transform:translateY(-50%)!important;width:40px!important;height:40px!important;clip-path:none!important;overflow:visible!important;right:auto!important}
 html body #community-app#community-app .ooc-member-card .of-disc{width:40px!important;height:40px!important;font-size:14px!important}
 html body #community-app#community-app .ooc-member-card .of-disc img{width:40px!important;height:40px!important}
 html body #community-app#community-app .ooc-member-card .of-body{position:relative!important;min-height:58px!important;padding:8px 14px 8px 64px!important;background:transparent!important;border:0!important;border-bottom:1px solid #ffffff10!important;clip-path:none!important}
 html body #community-app#community-app .ooc-member-card .of-name{font-size:15.5px!important}
 html body #community-app#community-app :is(.ooc-directory,.ooc-grid){gap:0!important}
}
@media (max-width:640px){
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>*::after{display:none!important;content:none!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry){background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236d7780' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") right 12px center/18px no-repeat!important}
 html body #community-app#community-app .box-bar{flex-wrap:wrap!important;height:auto!important}
 html body #community-app#community-app :is(.box-bar-title,.dispatch-navigation h1,.dispatch-navigation h2){white-space:nowrap!important;overflow:visible!important;text-overflow:clip!important;max-width:none!important;flex:1 1 auto!important;min-width:0}
 html body #community-app#community-app .location-strip .location-side-card{position:relative!important;left:auto!important;transform:none!important;margin:0!important;display:block!important}
 html body #community-app#community-app .location-strip .location-side-card>span{position:relative!important;left:0!important;width:100%!important;box-sizing:border-box!important;margin:0!important;display:flex!important;justify-content:space-between!important;align-items:center!important}
 html body #community-app#community-app .location-strip .location-side-card>img{left:auto!important;right:0!important;width:55%!important}
 html body #community-app#community-app .location-strip{padding-left:0!important;padding-right:0!important}
 html body #community-app#community-app .location-strip :is(.location-side-items,.location-carousel,.location-side-directory){padding:0!important;margin:0!important;mask-image:none!important;-webkit-mask-image:none!important;width:100%!important}
 /* Plotters rows */
 html body #community-app#community-app .ooc-member-card{display:flex!important;align-items:center!important;gap:12px!important;padding:8px 14px!important;border-bottom:1px solid #ffffff10!important;background:transparent!important;width:auto!important}
 html body #community-app#community-app .ooc-member-card .of-clip{position:static!important;transform:none!important;flex:none;order:0}
 html body #community-app#community-app .ooc-member-card .of-body{position:static!important;order:1;flex:1;min-height:0!important;padding:0!important;border:0!important;display:flex!important;align-items:center;gap:8px;width:auto!important;height:auto!important;transform:none!important;left:auto!important;top:auto!important}
 html body #community-app#community-app .ooc-member-card .of-body>*{position:static!important;transform:none!important}
 html body #community-app#community-app .ooc-member-card .of-star{order:3;margin-left:auto}
 html body #community-app#community-app :is(.ooc-directory,.ooc-grid,.ooc-directory-grid){display:flex!important;flex-direction:column!important;border:1px solid #ffffff14;border-radius:12px;overflow:hidden;background:#080b10ee;padding:0!important}
}
/* Wanted Ads desktop polish: larger tab text; the open category's header is a clean band */
@media (min-width:641px){
 html body #community-app#community-app .wanted-tabbed>.wanted-tabs{padding:24px 0 24px 24px!important;gap:12px!important}
 html body #community-app#community-app .wanted-box.wanted-tabbed{grid-template-columns:320px minmax(0,1fr)!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab{grid-template-columns:54px minmax(0,1fr) auto!important;padding:14px 16px!important;gap:14px!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-art{width:54px!important;height:54px!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-text strong{font-size:16px!important;letter-spacing:1.6px!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-text em{font-size:13px!important;line-height:1.4!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab small{font-size:12.5px!important;padding:4px 10px!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-banner{position:relative;display:flex!important;flex-direction:column!important;justify-content:center!important;min-height:150px!important;padding:24px 30px!important;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 35%,#ffffff12)!important;border-radius:12px!important;background:linear-gradient(90deg,#070a0e 0%,#070a0ef2 42%,#070a0e66 72%,#070a0e10),var(--folder-art) right center/auto 135% no-repeat,#070a0e!important;overflow:hidden}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-banner::before{content:'Wanted Ads';display:block;margin-bottom:8px;font:800 11px/1 Consolas,monospace;letter-spacing:.28em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-banner strong{font:800 30px/1.05 var(--font-control-title,var(--font-heading,'Segoe UI')),sans-serif!important;letter-spacing:.04em!important;text-transform:uppercase;color:#fff!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-banner em{margin-top:8px;font-size:15px!important;color:#c9d1d9!important;max-width:520px!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-banner::after{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--color-accent-default,#ffc45b)}
}
@media (max-width:640px){
 html body #community-app#community-app #app-view>.dispatch-navigation::before{flex:1 1 auto!important;max-width:none!important;overflow:visible!important;text-overflow:clip!important;white-space:normal!important;font-size:16px!important;letter-spacing:2px!important;line-height:1.2!important}
 html body #community-app#community-app #app-view>.dispatch-navigation{position:relative!important;top:auto!important;flex-wrap:wrap!important;height:auto!important}
 /* Plotters rows: avatar left, name left */
 html body #community-app#community-app .ooc-member-card{display:grid!important;grid-template-columns:40px 1fr!important;align-items:center!important;text-align:left!important}
 html body #community-app#community-app .ooc-member-card .of-clip{grid-column:1;grid-row:1;position:relative!important;inset:auto!important;width:40px!important;height:40px!important;margin:0!important}
 html body #community-app#community-app .ooc-member-card .of-body{grid-column:2;grid-row:1;justify-content:flex-start!important;text-align:left!important}
 html body #community-app#community-app .ooc-member-card .of-name{text-align:left!important}
 html body #community-app#community-app .ooc-member-card .of-disc{position:static!important;margin:0!important}
}
@media (max-width:640px){
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>.ix-abroad-main{display:none!important}
 html body #community-app#community-app .ix-tiles article :is(.forum-entry-icon,.ix-abroad-arrow){display:none!important}
 html body #community-app#community-app .ooc-member-card .of-body{flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:2px!important}
 html body #community-app#community-app .ooc-member-card .of-body *{text-align:left!important;margin-left:0!important}
 html body #community-app#community-app .ooc-member-card .of-star{position:absolute!important;right:14px!important;top:50%!important;transform:translateY(-50%)!important;margin:0!important}
}
@media (max-width:640px){
 html body #community-app#community-app .ix-tiles .ix-abroad-card .ix-symbol .ix-region-icon{width:26px!important;height:20px!important;-webkit-mask-position:center!important;mask-position:center!important}
 html body #community-app#community-app .ooc-member-card{height:auto!important;min-height:0!important;max-height:none!important;padding:10px 14px!important;margin:0!important}
 html body #community-app#community-app .ooc-member-card .of-body{min-height:40px!important}
 html body #community-app#community-app :is(.ooc-directory,.ooc-grid,.ooc-directory-grid)>*{margin:0!important}
}
@media (max-width:640px){
 html body #community-app#community-app .ooc-directory{padding:0!important}
 html body #community-app#community-app .ooc-member-list.ooc-folders{gap:0!important;padding:0!important;display:flex!important;flex-direction:column!important}
 html body #community-app#community-app .ooc-member-card::before,html body #community-app#community-app .ooc-member-card::after{display:none!important}
}
html body #community-app#community-app .wanted-tab-banner>.wanted-copy-link{position:absolute;top:14px;right:14px;z-index:2;display:grid;place-items:center;width:34px;height:34px;padding:0!important;border-radius:9px!important;border:1px solid #ffffff26!important;background:#07090ccc!important;color:#dfe5ea!important;cursor:pointer;min-height:0!important}
html body #community-app#community-app .wanted-tab-banner>.wanted-copy-link:hover{border-color:var(--color-accent-default,#ffc45b)!important;color:var(--color-accent-default,#ffc45b)!important}
@media (max-width:640px){html body #community-app#community-app.hz-prof #page-corner-actions#page-corner-actions{display:none!important}
 html body #community-app#community-app #profile-views{top:52px!important}}
@media (max-width:640px){
 html body #community-app#community-app #app-view#app-view.hz-thread{overflow-y:auto!important;height:100%!important}
 html body #community-app#community-app .fx-sec-head{flex-wrap:wrap!important;gap:8px!important}
 html body #community-app#community-app .fx-sec-head>*{flex:none}
 html body #community-app#community-app .archive-tree :is(ul,ol,details>div,.archive-children),html body #community-app#community-app [class*=archive] details>:not(summary){margin-left:8px!important;padding-left:8px!important}
}
/* ---- Announcements: tab list on the left, the selected announcement on the right ---- */
html body #community-app#community-app .ann-box{display:grid!important;grid-template-columns:320px minmax(0,1fr);align-items:stretch;min-height:420px}
html body #community-app#community-app .ann-box>.box-bar{grid-column:1/-1}
html body #community-app#community-app .ann-tabs{grid-column:1;display:flex;flex-direction:column;gap:10px;padding:24px 0 24px 24px!important;border-right:1px solid #ffffff14;max-height:70vh;overflow-y:auto;scrollbar-width:thin}
html body #community-app#community-app .ann-tab{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin-right:-1px;padding:14px 18px!important;border:1px solid #ffffff14!important;border-right:0!important;border-radius:10px 0 0 10px!important;background:#0b0f14b3!important;color:#cfd6de!important;text-align:left;cursor:pointer;min-height:0!important;font:inherit!important}
html body #community-app#community-app .ann-tab strong{font:700 15.5px/1.3 var(--font-control-title,'Segoe UI'),sans-serif;color:#eef2f5}
html body #community-app#community-app .ann-tab small{font-size:12px;color:#8d97a1}
html body #community-app#community-app .ann-tab .ann-pin{position:absolute;top:10px;right:12px;font-size:12px}
html body #community-app#community-app .ann-tab:hover{background:#121820!important}
html body #community-app#community-app .ann-tab.is-active{background:#11161c!important;border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)!important;box-shadow:inset 3px 0 0 var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .ann-tab.is-active strong{color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .ann-panel{grid-column:2;min-width:0;padding:28px 34px 30px!important}
html body #community-app#community-app .ann-head{padding:0 0 18px;margin:0 0 20px;border-bottom:1px solid #ffffff14}
html body #community-app#community-app .ann-kicker{font:800 11px/1 Consolas,monospace;letter-spacing:.28em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .ann-head h2{margin:10px 0 6px;font:800 30px/1.1 var(--font-control-title,var(--font-heading,'Segoe UI')),sans-serif;color:#fff}
html body #community-app#community-app .ann-sub{margin:0 0 6px;color:#c9d1d9;font-size:15px}
html body #community-app#community-app .ann-meta{font-size:12.5px;color:#8d97a1}
html body #community-app#community-app .ann-body{font-size:15px;line-height:1.65;color:#e6ebf0}
html body #community-app#community-app .ann-foot{display:flex;align-items:center;gap:10px;margin-top:26px;padding-top:16px;border-top:1px solid #ffffff14}
html body #community-app#community-app .ann-open{padding:8px 16px;border-radius:8px;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent);color:var(--color-accent-default,#ffc45b)!important;text-decoration:none!important;font-size:13px}
html body #community-app#community-app .ann-copy{display:grid;place-items:center;width:34px;height:34px;padding:0!important;border-radius:8px!important;border:1px solid #ffffff26!important;background:none!important;color:#cfd6de!important;min-height:0!important}
html body #community-app#community-app .ann-empty{color:#8d97a1;font-style:italic}
@media (max-width:900px){html body #community-app#community-app .ann-box{display:block!important}html body #community-app#community-app .ann-tabs{flex-direction:row;overflow-x:auto;max-height:none;padding:12px!important;border-right:0;border-bottom:1px solid #ffffff14}html body #community-app#community-app .ann-tab{flex:0 0 auto;max-width:240px;border-right:1px solid #ffffff14!important;border-radius:10px!important;margin:0}html body #community-app#community-app .ann-panel{padding:18px 16px!important}html body #community-app#community-app .ann-head h2{font-size:22px}}
/* ---- Breadcrumb trail inside the page's own bar ---- */
html body #community-app#community-app .header-forum-trail.is-parked{display:none!important}
html body #community-app#community-app .box-bar.has-box-trail>.box-bar-title{display:none!important}
html body #community-app#community-app .header-forum-trail.in-box{display:flex!important;align-items:center;flex:1 1 auto;min-width:0;margin:0!important;padding:0!important;background:none!important;border:0!important;overflow:hidden}
html body #community-app#community-app .header-forum-trail:is(.in-box,.in-heading) ol{display:flex;align-items:center;flex-wrap:nowrap;gap:0;margin:0;padding:0;list-style:none;min-width:0}
html body #community-app#community-app .header-forum-trail:is(.in-box,.in-heading) li{display:flex;align-items:center;min-width:0;white-space:nowrap}
html body #community-app#community-app .header-forum-trail:is(.in-box,.in-heading) li+li::before{content:'›';margin:0 10px;color:#6d7780;font-size:15px}
html body #community-app#community-app .header-forum-trail:is(.in-box,.in-heading) li a{font:600 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.02em;text-transform:none;color:#9aa4ae!important;text-decoration:none!important}
html body #community-app#community-app .header-forum-trail:is(.in-box,.in-heading) li a:hover{color:#fff!important}
html body #community-app#community-app .header-forum-trail.in-box li:last-child>span{font:800 18px/1 Consolas,monospace;letter-spacing:.24em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b);overflow:hidden;text-overflow:ellipsis}
html body #community-app#community-app .header-forum-trail.in-box .trail-bookmark{margin-left:10px;transform:scale(.85)}
html body #community-app#community-app .header-forum-trail.in-heading{display:flex!important;flex:1 1 100%;order:-1;margin:0 0 8px!important;padding:0!important;background:none!important;border:0!important}
html body #community-app#community-app .header-forum-trail.in-heading li:last-child>span{display:none}
html body #community-app#community-app .header-forum-trail.in-heading li:nth-last-child(2)>a::after{content:''}
html body #community-app#community-app .header-forum-trail.in-heading li:last-child{display:none}
html body #community-app#community-app .header-forum-trail.in-heading li:last-child:has(.trail-bookmark){display:flex}
html body #community-app#community-app .header-forum-trail.in-heading li:last-child:has(.trail-bookmark)::before{display:none}
html body #community-app#community-app .thread-view-heading.has-box-trail{flex-wrap:wrap!important}
@media (max-width:640px){html body #community-app#community-app .header-forum-trail.in-box li:not(:last-child){display:none}html body #community-app#community-app .header-forum-trail.in-box li:last-child::before{display:none}html body #community-app#community-app .header-forum-trail.in-box li:last-child>span{font-size:15px}html body #community-app#community-app .header-forum-trail:is(.in-box,.in-heading){display:flex!important}}
html body #community-app#community-app #app-view>.dispatch-navigation.has-box-trail::before{display:none!important;content:none!important}
html body #community-app#community-app .dispatch-navigation>.header-forum-trail.in-box{flex:0 1 auto;margin-right:auto!important}
html body #community-app#community-app .header-forum-trail.in-box li:last-child>span{background:none!important;padding:0!important;border:0!important;box-shadow:none!important;border-radius:0!important}
html body #community-app#community-app #page-corner-actions.in-bar{position:static!important;inset:auto!important;transform:none!important;display:flex!important;gap:8px;margin:0 0 0 8px!important;padding:0!important;background:none!important;border:0!important}
html body #community-app#community-app #page-corner-actions.in-bar:empty{display:none!important}
@media (max-width:640px){html body #community-app#community-app #page-corner-actions.in-bar{position:static!important;width:auto!important;overflow:visible}html body #community-app#community-app.hz-corner-inbar #app-view#app-view{padding-top:62px!important}}
html body #community-app#community-app .wanted-tab-banner{position:relative}
@media (max-width:640px){html body #community-app#community-app .wanted-tab-banner>.wanted-copy-link{top:10px;right:10px;width:30px;height:30px}
 html body #community-app#community-app .box-bar #page-corner-actions.in-bar{flex:1 1 100%;margin:4px 0 0!important;flex-wrap:wrap}}
/* The World pane v3: pinned by CSS alone (no JS placement, so no jump) against the map's top-left edge,
   right beside the sidebar; wider. Dragging still offsets it via --wp-x/--wp-y. */
@media (min-width:641px){
 html body #community-app#community-app .world-overview>.world-overview-box{position:fixed!important;left:calc(204px + 22px)!important;top:calc(58px + 22px)!important;margin:0!important;width:520px!important;max-width:calc(100vw - 260px)!important;max-height:calc(100vh - 110px)!important;z-index:6}
 html body #community-app#community-app.sidebar-collapsed .world-overview>.world-overview-box{left:calc(var(--navigation-gutter,64px) + 22px)!important}
}
html body #community-app#community-app .header-forum-trail:is(.in-box,.in-heading) li+li::before{display:inline-block!important;content:'›'!important;margin:0 8px!important;color:#6d7780!important;opacity:1!important;width:auto!important;height:auto!important;position:static!important;background:none!important}
@media (max-width:640px){
 html body #community-app#community-app .header-forum-trail.in-heading li a{font-size:12px!important}
 html body #community-app#community-app .thread-view-heading>.app-history-controls{position:absolute!important;top:12px!important;right:12px!important;left:auto!important;width:auto!important}
 html body #community-app#community-app .thread-view-heading{position:relative!important}
 html body #community-app#community-app .thread-view-heading>.header-forum-trail.in-heading{padding-right:44px!important}
}
/* The World directory: text inset from the card edge */
html body #community-app#community-app .world-overview-region-title{padding-left:16px!important;padding-right:10px!important}
html body #community-app#community-app .world-overview-label{padding-left:16px!important;padding-right:10px!important}
html body #community-app#community-app .territory-child-cards{padding-left:12px!important}
@media (max-width:640px){
 html body #community-app#community-app .application-columns{display:flex!important;flex-direction:column!important;gap:14px!important}
 html body #community-app#community-app .application-columns>*{width:auto!important;max-width:none!important;min-width:0!important;margin:0!important;transform:none!important;position:relative!important;left:auto!important;top:auto!important}
 html body #community-app#community-app .application-intro.interview-clipboard{padding:20px 18px!important;background:#e9dfc8!important;border-radius:10px!important;color:#2b2419!important;box-shadow:0 10px 24px #0008}
 html body #community-app#community-app .application-intro.interview-clipboard::before,html body #community-app#community-app .application-intro.interview-clipboard::after{display:none!important}
 html body #community-app#community-app .application-intro.interview-clipboard>*{width:auto!important;max-width:none!important;writing-mode:horizontal-tb!important;transform:none!important;position:static!important}
 html body #community-app#community-app .application-intro h1{font-size:28px!important;line-height:1.1!important}
 html body #community-app#community-app .application-files{padding:16px!important}
}
@media (max-width:640px){
 html body #community-app#community-app .header-forum-trail.in-box li:last-child::before{display:none!important;content:none!important}
 html body #community-app#community-app .box-bar.has-box-trail{height:auto!important;min-height:0!important;flex-wrap:wrap!important;row-gap:8px!important}
 html body #community-app#community-app .box-bar.has-box-trail>.box-bar-tools{flex:1 1 100%!important;justify-content:flex-start!important;position:static!important}
 html body #community-app#community-app .thread-view-heading>.app-history-controls{position:static!important;order:0!important;flex:none!important}
 html body #community-app#community-app .thread-view-heading>.header-forum-trail.in-heading{order:0!important;flex:1 1 0!important;min-width:0;margin:0!important;padding-right:0!important;overflow:hidden}
 html body #community-app#community-app .thread-view-heading>.header-forum-trail.in-heading li{min-width:0;flex-shrink:1}
 html body #community-app#community-app .thread-view-heading>.header-forum-trail.in-heading li a{overflow:hidden;text-overflow:ellipsis}
 html body #community-app#community-app .thread-view-heading>.th-head-main{order:2!important;flex:1 1 100%!important}
 html body #community-app#community-app .thread-view-heading>.th-right{order:3!important;flex:1 1 100%!important}
}
@media (max-width:640px){
 html body #community-app#community-app .box-bar #page-corner-actions#page-corner-actions.in-bar{position:static!important;top:auto!important;left:auto!important;right:auto!important;transform:none!important;border:0!important;background:none!important;padding:0!important}
 html body #community-app#community-app #app-view>.thread-view-heading>div.app-history-controls{flex:0 0 auto!important;order:0!important;width:auto!important}
}
@media (max-width:640px){html body #community-app#community-app #app-view>.thread-view-heading>div.app-history-controls{order:-1!important}}
html body #community-app#community-app .dispatch-thread-card.location-empty-threads{grid-column:1/-1!important;justify-self:stretch!important;width:auto!important;max-width:none!important}
/* collapsed sidebar: regions show a two-letter badge instead of the pin */
#community-app #sidebar-links .sidebar-region .sidebar-abbr{display:none}
#community-app.sidebar-collapsed #sidebar-links .sidebar-region>svg{display:none!important}
#community-app.sidebar-collapsed #sidebar-links .sidebar-region .sidebar-abbr{display:grid;place-items:center;width:26px;height:26px;margin:0 auto;border-radius:7px;border:1px solid rgb(255 255 255 / .22);font:800 11px/1 Consolas,monospace;letter-spacing:.06em;color:#cfd6de}
#community-app.sidebar-collapsed #sidebar-links .sidebar-region:hover .sidebar-abbr{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b)}
#community-app.sidebar-collapsed #sidebar-links .sidebar-region.is-here .sidebar-abbr{border-color:var(--color-accent-default,#ffc45b);background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 18%,transparent);color:var(--color-accent-default,#ffc45b)}

/* Header: right-side cluster (corner pills, gear, eye, bell, account) stays right now that the trail lives in page bars */
html body #community-app .app-header>.app-brand{margin-right:auto}
html body #community-app .app-header>:is(#page-corner-actions,#page-settings-toggle,.header-watching,.notify-bell,.account-link){margin-left:0}

/* ===== Mobile cleanup pass (Oct 1) ===== */
@media (max-width:640px){
 /* Location pages: full-width box like every other page */
 html body #community-app#community-app[data-scene=world] #app-frame #app-view>.dispatch-navigation{margin:0!important;width:auto!important;max-width:none!important}
 html body #community-app#community-app[data-scene=world] #app-frame #app-view .thread-grid-pagination:not(.dispatch-navigation){margin:0!important;width:auto!important;max-width:none!important}
 html body #community-app#community-app[data-scene=world] #app-frame #app-view .location-side-directory{margin:0 0 14px!important}
 html body #community-app #app-view .location-side-directory summary{padding-left:12px!important}
}
@media (max-width:640px){
 /* Threads: posts align with the thread header */
 html body #community-app#community-app[data-scene] #app-frame #app-view.hz-thread>.thread-reading-area:not(.dispatch-navigation){padding:12px 0 28px!important;margin:0!important;max-width:none!important;width:auto!important}
 /* Post author bar: designation pill never stacks letter-by-letter */
 html body #community-app#community-app .forum-post .post-author-pin{flex-wrap:wrap!important;row-gap:8px}
 html body #community-app#community-app .forum-post .post-identity{flex:1 1 0!important;min-width:0!important}
 html body #community-app#community-app .thread-reading-area .forum-post>.post-author{padding-left:12px!important;padding-right:12px!important}
 html body #community-app#community-app .forum-post .post-author-pin{padding-left:0!important;margin-left:0!important}
 html body #community-app#community-app .forum-post .post-memberships{flex:0 0 auto!important;max-width:100%}
 html body #community-app#community-app .forum-post .post-memberships .post-group-pill{white-space:nowrap!important;overflow-wrap:normal!important;height:auto!important;width:auto!important}
}
@media (max-width:640px){
 html body #community-app#community-app .forum-post .post-author-pin{justify-content:flex-start!important}
 /* Index hero: ticker, admins and updates use the same width as the forum list */
 html body #community-app#community-app:is([data-scene=welcome],[data-scene=index]) #app-view#app-view>.forum-main-index>.index-hero .index-hero-copy{padding:12px 2px 0!important;box-sizing:border-box}
 /* Faction roster: member cards fit the box */
 html body #community-app#community-app .fx-members{grid-template-columns:minmax(0,1fr)!important}
 html body #community-app#community-app .fx-member{min-width:0!important;max-width:100%!important;box-sizing:border-box}
 html body #community-app#community-app .fx-pending-toggle{white-space:nowrap!important}
 /* Archive: one arrow, shallower nesting so names don't break into three lines */
 html body #community-app .recycle-folder>summary{list-style:none!important}
 html body #community-app .recycle-folder>summary::-webkit-details-marker{display:none}
 html body #community-app#community-app .recycle-list{padding:10px!important}
 html body #community-app#community-app .recycle-folder{padding:10px 0 10px 8px!important}
 html body #community-app#community-app .recycle-folder .recycle-folder{margin-left:0!important}
 html body #community-app#community-app .recycle-folder article{padding:12px 8px!important;flex-wrap:wrap;gap:8px 12px}
 html body #community-app#community-app .recycle-folder article>:first-child{flex:1 1 100%!important;min-width:0}
 html body #community-app#community-app .recycle-folder{border-left-width:1px!important;padding-left:6px!important}
 /* Character cards: bookmark ribbon sits inside the card */
 html body #community-app#community-app .cast-card .card-bookmark{right:8px!important;left:auto!important}
 /* Guidebook: no empty band above the tabs */
 html body #community-app#community-app[data-scene=guidebook] #app-view#app-view{padding-top:12px!important}
}
@media (max-width:640px){
 /* Wanted banner: art fades under the text instead of competing with it */
 html body #community-app#community-app .wanted-tabbed .wanted-tab-banner{background:linear-gradient(90deg,#05070af5 0%,#05070aeb 50%,#05070ad6 100%),var(--folder-art) right center/cover no-repeat,#05070a!important;padding:18px 54px 18px 18px!important;min-height:0!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-banner strong{font-size:24px!important}
 html body #community-app#community-app .wanted-tabbed .wanted-tab-banner em{font-size:14px!important}
}
@media (max-width:640px){
 /* Post author bar: portrait always starts at the left edge */
 html body #community-app#community-app .thread-reading-area .forum-post>.post-author{justify-content:flex-start!important}
 html body #community-app#community-app .thread-reading-area .forum-post .post-author-pin{width:100%!important;flex:1 1 auto!important;max-width:none!important}
}
/* Thread "Manage" menu opens above the posts */
html body #community-app#community-app .thread-view-heading:has(details.thread-manage[open]){z-index:30!important}
@media (max-width:640px){
 /* Rumor review: the rumor gets the full width under its author */
 html body #community-app#community-app .rm-row{grid-template-columns:28px minmax(0,1fr) auto auto!important;row-gap:8px}
 html body #community-app#community-app .rm-row .rm-text{grid-column:1 / -1!important;grid-row:2!important;width:auto!important}
}
/* Main Index (desktop/laptop): the sign-in banner sits in the page flow between the hero and the tiles, never on top of them */
@media (min-width:641px){
 html body #community-app#community-app .index-hero .ix-rules-banner{position:relative!important;left:auto!important;top:auto!important;transform:none!important;grid-column:1/-1;margin:24px auto 0!important;width:max-content;max-width:min(760px,calc(100% - 48px))}
 html body #community-app#community-app:is([data-scene=welcome],[data-scene=index]) #app-view#app-view>.forum-main-index:has(.ix-rules-banner)>.ix-tiles{margin-top:30px!important}
}
/* Main Index Updates panel: slightly larger, easier-to-read text */
html body #community-app#community-app .ix-updates .ix-updates-body,html body #community-app#community-app .ix-updates .ix-updates-body *{font-size:15px!important;line-height:1.5!important}
html body #community-app#community-app .ix-updates .ixu-when{font-size:11px!important}

/* ===== Member Area cards ===== */
html body #community-app#community-app .ooc-member-list.ma-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:26px 20px;padding:6px 2px 40px;overflow:visible}
#community-app .ma-card{--rc:var(--role-color,var(--color-accent-default,#ffc45b));position:relative;border-radius:14px;background:linear-gradient(160deg,color-mix(in srgb,var(--rc) 10%,#10151b) 0%,#0b0f14 60%);border:1px solid color-mix(in srgb,var(--rc) 26%,#ffffff12);box-shadow:0 10px 26px #00000059;transition:transform .25s cubic-bezier(.2,.8,.2,1),border-color .25s,box-shadow .25s,border-radius .25s;z-index:1}
#community-app .ma-card.is-me{border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)}
#community-app .ma-card:is(:hover,:focus-within){z-index:20;transform:translateY(-2px);border-color:color-mix(in srgb,var(--rc) 60%,#ffffff22);box-shadow:0 16px 34px #0000008c,0 0 0 1px color-mix(in srgb,var(--rc) 25%,transparent);border-bottom-left-radius:4px;border-bottom-right-radius:4px}
#community-app .ma-main{display:grid;grid-template-columns:68px minmax(0,1fr);gap:4px 14px;padding:16px 16px 14px;color:inherit;text-decoration:none!important}
#community-app .ma-av{position:relative;width:64px;height:64px;grid-row:span 1}
#community-app .ma-pic{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;overflow:hidden;background:#1a2129;box-shadow:0 0 0 2px var(--rc),0 0 16px color-mix(in srgb,var(--rc) 35%,transparent)}
#community-app .ma-pic img{width:100%;height:100%;object-fit:cover}
#community-app .ma-pic b{font:800 20px/1 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff}
#community-app .ma-dot{position:absolute;right:1px;bottom:1px;width:15px;height:15px;border-radius:50%;border:3px solid #0d1217;background:#6b7280}
#community-app .ma-dot.is-online{background:#3fd27b}#community-app .ma-dot.is-idle{background:#f0b232}#community-app .ma-dot.is-dnd{background:#f04747}
#community-app .ma-id{display:flex;flex-direction:column;justify-content:center;min-width:0;gap:3px}
#community-app .ma-name{display:flex;align-items:center;gap:7px;font:750 18px/1.15 var(--font-control-title,'Segoe UI'),sans-serif;color:var(--role-color,#f3f5f7);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#community-app .ma-you svg{width:15px;height:15px;fill:var(--color-accent-default,#ffc45b)}
#community-app .ma-handle{font:500 12.5px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;color:#9aa6b2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#community-app .ma-role{align-self:flex-start;margin-top:3px;padding:2px 8px;border-radius:999px;font:700 10.5px/1.5 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--rc);background:color-mix(in srgb,var(--rc) 14%,transparent);border:1px solid color-mix(in srgb,var(--rc) 35%,transparent)}
#community-app .ma-example{position:absolute;top:12px;right:14px;font:700 9.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#7d8894}
#community-app .ma-stats{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);margin-top:10px;border-top:1px solid #ffffff10;border-bottom:1px solid #ffffff10}
#community-app .ma-stats>span{display:flex;flex-direction:column;align-items:center;gap:1px;padding:8px 4px;font:600 10.5px/1.3 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#8793a0}
#community-app .ma-stats>span+span{border-left:1px solid #ffffff10}
#community-app .ma-stats b{font:750 16px/1.2 var(--font-control-title,'Segoe UI'),sans-serif;letter-spacing:0;text-transform:none;color:#eef1f4}
#community-app .ma-foot{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:28px;margin-top:8px}
#community-app .ma-foot .of-chars{display:flex;gap:4px}
#community-app .ma-foot .of-chars i{width:24px;height:24px}
#community-app .ma-foot .of-handle{font-size:12px;color:#6f7b87}
#community-app .ma-seen{margin-left:auto;font:500 11.5px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;color:#8793a0;white-space:nowrap}
/* hover: an action strip slides out from under the card */
#community-app .ma-actions{position:absolute;left:-1px;right:-1px;top:calc(100% - 1px);display:flex;justify-content:center;gap:10px;padding:10px 12px 12px;background:linear-gradient(180deg,#0d1218,#0a0e13);border:1px solid color-mix(in srgb,var(--rc) 60%,#ffffff22);border-top-color:#ffffff10;border-radius:0 0 14px 14px;box-shadow:0 18px 28px #0000008c;clip-path:inset(0 -40px 100% -40px);opacity:0;transform:translateY(-6px);pointer-events:none;transition:clip-path .32s cubic-bezier(.2,.8,.2,1),opacity .2s ease,transform .32s cubic-bezier(.2,.8,.2,1)}
#community-app .ma-card:is(:hover,:focus-within) .ma-actions{clip-path:inset(0 -40px -60px -40px);opacity:1;transform:none;pointer-events:auto}
#community-app .ma-act{position:relative;display:grid;place-items:center;width:42px;height:38px;padding:0!important;border-radius:10px!important;border:1px solid #ffffff1c!important;background:#ffffff08!important;color:#d6dde4!important;cursor:pointer;transition:background .18s,color .18s,border-color .18s,transform .18s}
#community-app .ma-act:is(:hover,:focus-visible){transform:translateY(-1px);color:#fff!important;border-color:color-mix(in srgb,var(--rc) 70%,transparent)!important;background:color-mix(in srgb,var(--rc) 20%,transparent)!important}
#community-app .ma-act-discord:is(:hover,:focus-visible){border-color:#5865f2!important;background:#5865f233!important}
#community-app .ma-act[aria-disabled=true]{opacity:.4;cursor:not-allowed}
#community-app .ma-act[aria-disabled=true]:hover{transform:none;background:#ffffff08!important;border-color:#ffffff1c!important;color:#d6dde4!important}
/* hover helper text under each button */
#community-app .ma-act::after{content:attr(data-label);position:absolute;top:calc(100% + 9px);left:50%;transform:translate(-50%,-4px);padding:5px 9px;border-radius:7px;background:#05080bf2;border:1px solid #ffffff1f;font:600 11.5px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.02em;color:#e9edf1;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .16s ease,transform .16s ease;z-index:30}
#community-app .ma-act:is(:hover,:focus-visible)::after{opacity:1;transform:translate(-50%,0);transition-delay:.18s}
@media (prefers-reduced-motion:reduce){#community-app .ma-card,#community-app .ma-actions,#community-app .ma-act,#community-app .ma-act::after{transition:none}}
/* touch screens and phones: actions sit in the card, always visible */
@media (hover:none),(max-width:640px){
 html body #community-app#community-app .ooc-member-list.ma-grid{grid-template-columns:1fr;gap:12px}
 #community-app .ma-actions{position:static;clip-path:none;opacity:1;transform:none;pointer-events:auto;border:0;border-top:1px solid #ffffff10;border-radius:0 0 14px 14px;box-shadow:none;background:transparent;padding:8px 12px 10px}
 #community-app .ma-card:is(:hover,:focus-within){transform:none;border-radius:14px}
 #community-app .ma-act::after{display:none}
}
#community-app .ma-foot .of-handle{white-space:nowrap}
#community-app .ma-id{min-height:64px}

/* ===== Member Area: grouped directory ===== */
#community-app .ma-directory .ma-results{min-width:0;display:flex;flex-direction:column;gap:30px}
#community-app .ma-group-title{display:flex;align-items:center;gap:12px;margin:0 0 16px;font:800 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--group-color,var(--color-accent-default,#ffc45b))}
#community-app .ma-group-title::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,color-mix(in srgb,var(--group-color,#ffc45b) 45%,transparent),transparent)}
#community-app .ma-group-title b{order:0;display:grid;place-items:center;min-width:22px;height:20px;padding:0 6px;border-radius:999px;font-size:11px;letter-spacing:0;color:#0b0f14;background:var(--group-color,var(--color-accent-default,#ffc45b))}
#community-app .ma-directory .ma-grid{padding:0 2px 8px!important}
#community-app .ma-pill-dot{display:inline-block;width:8px;height:8px;margin-right:6px;border-radius:50%;background:var(--pill-dot,#8a95a1);vertical-align:1px;box-shadow:0 0 6px var(--pill-dot,transparent)}
/* admin dialog: grouping order + filter roles */
.ma-config{width:min(560px,calc(100vw - 32px))}
.ma-config .ma-config-help{margin:0 0 14px;color:#a9b3bd;font-size:13.5px;line-height:1.5}
.ma-config .ma-config-list{list-style:none;margin:0 0 16px;padding:0;max-height:52vh;overflow:auto;border:1px solid #ffffff14;border-radius:10px}
.ma-config li{display:grid;grid-template-columns:auto 1fr auto auto auto;align-items:center;gap:12px;padding:9px 12px;border-bottom:1px solid #ffffff0d;font-size:14px;color:#dde3e8}
.ma-config li:last-child{border-bottom:0}
.ma-config li.is-group{background:#ffc45b0d}
.ma-config .ma-config-order{display:flex;gap:4px;min-width:62px}
.ma-config .ma-config-order button{width:28px;height:26px;padding:0;border-radius:6px;border:1px solid #ffffff22;background:#ffffff0a;color:#e8edf1;cursor:pointer}
.ma-config .ma-config-order button:disabled{opacity:.3;cursor:default}
.ma-config label{display:flex;align-items:center;gap:6px;font-size:12.5px;color:#aeb8c2;white-space:nowrap}

/* ===== Plotters page: folder cards with a banner ===== */
#community-app .pl-page{padding:22px 24px 30px!important}
#community-app .pl-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:26px;flex-wrap:wrap}
#community-app .pl-intro{margin:0;color:#a9b3bd;font-size:14px}
#community-app .pl-search{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:10px;border:1px solid #ffffff1c;background:#05080b99;color:#8e99a5;min-width:260px}
#community-app .pl-search input{flex:1;border:0!important;background:transparent!important;color:#eef1f4;font-size:14px;outline:0;padding:0!important;min-height:0!important}
#community-app .pl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:30px 22px;padding-top:14px}
#community-app .pl-card{--rc:var(--role-color,var(--color-accent-default,#ffc45b));position:relative;display:flex;flex-direction:column;border-radius:4px 14px 14px 14px;background:#0c1116;border:1px solid color-mix(in srgb,var(--rc) 28%,#ffffff12);box-shadow:0 12px 28px #00000066;color:inherit;text-decoration:none!important;transition:transform .25s cubic-bezier(.2,.8,.2,1),border-color .25s,box-shadow .25s}
#community-app .pl-card:is(:hover,:focus-visible){transform:translateY(-3px);border-color:color-mix(in srgb,var(--rc) 65%,#ffffff22);box-shadow:0 18px 36px #0000008c,0 0 0 1px color-mix(in srgb,var(--rc) 25%,transparent)}
/* folder tab */
#community-app .pl-tab{position:absolute;left:-1px;top:-15px;width:42%;height:16px;border:1px solid color-mix(in srgb,var(--rc) 28%,#ffffff12);border-bottom:0;border-radius:9px 12px 0 0;background:#0c1116;clip-path:polygon(0 0,86% 0,100% 100%,0 100%);transition:border-color .25s}
#community-app .pl-card:is(:hover,:focus-visible) .pl-tab{border-color:color-mix(in srgb,var(--rc) 65%,#ffffff22)}
#community-app .pl-banner{display:block;height:118px;margin:6px 6px 0;border-radius:2px 10px 0 0;background:linear-gradient(135deg,color-mix(in srgb,var(--rc) 35%,#111821),#0b0f14) center/cover no-repeat;position:relative;overflow:hidden}
#community-app .pl-banner::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,#0c1116f2)}
#community-app .pl-body{display:flex;align-items:flex-end;gap:12px;margin:-30px 16px 0;position:relative;z-index:1}
#community-app .pl-av{flex:none;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;overflow:hidden;background:#1a2129;box-shadow:0 0 0 3px #0c1116,0 0 0 5px var(--rc)}
#community-app .pl-av img{width:100%;height:100%;object-fit:cover}
#community-app .pl-av b{color:#fff;font:800 18px/1 var(--font-control-title,'Segoe UI'),sans-serif}
#community-app .pl-id{display:flex;flex-direction:column;min-width:0;flex:1;padding-bottom:2px}
#community-app .pl-name{font:750 18px/1.2 var(--font-control-title,'Segoe UI'),sans-serif;color:var(--role-color,#f2f4f6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#community-app .pl-name em{font-style:normal;font-size:12px;color:#8f9aa6}
#community-app .pl-handle{font-size:12.5px;color:#93a0ac}
#community-app .pl-meta{display:flex;flex-direction:column;align-items:flex-end;font:600 10.5px/1.3 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#8793a0;padding-bottom:2px;white-space:nowrap}
#community-app .pl-meta b{font:750 18px/1 var(--font-control-title,'Segoe UI'),sans-serif;letter-spacing:0;color:#eef1f4}
#community-app .pl-meta span{margin-top:3px;text-transform:none;letter-spacing:.02em;font-size:11.5px}
#community-app .pl-sub{margin:12px 16px 16px;padding-top:11px;border-top:1px solid #ffffff10;font-size:13.5px;line-height:1.45;color:#b4bec8}
#community-app .pl-card:not(:has(.pl-sub)) .pl-body{margin-bottom:16px}
#community-app .pl-example{position:absolute;top:14px;right:14px;z-index:2;padding:3px 8px;border-radius:999px;background:#05080bcc;font:700 9.5px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#aab4be}
@media (max-width:640px){
 #community-app .pl-page{padding:14px 12px 22px!important}
 #community-app .pl-search{min-width:0;width:100%}
 #community-app .pl-grid{grid-template-columns:1fr;gap:28px}
}

/* ===== A member's plotter (location-style, reskinned) ===== */
#community-app .pls{--rc:var(--role-color,var(--color-accent-default,#ffc45b))}
#community-app .pls .pls-hero{position:relative;display:flex!important;align-items:flex-end;justify-content:space-between;gap:16px;min-height:190px;padding:0 22px 18px!important;margin:0 0 4px!important;border-radius:12px;overflow:hidden;border:1px solid color-mix(in srgb,var(--rc) 30%,#ffffff12)}
#community-app .pls .pls-banner{position:absolute;inset:0;background:linear-gradient(135deg,color-mix(in srgb,var(--rc) 30%,#111821),#0b0f14) center/cover no-repeat}
#community-app .pls .pls-banner::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0b0f1400 25%,#0b0f14e6 100%)}
#community-app .pls .pls-id{position:relative;display:flex;align-items:flex-end;gap:16px;min-width:0}
#community-app .pls .pls-av{flex:none;display:grid;place-items:center;width:84px;height:84px;border-radius:50%;overflow:hidden;background:#1a2129;box-shadow:0 0 0 3px #0b0f14,0 0 0 5px var(--rc),0 8px 22px #000a}
#community-app .pls .pls-av img{width:100%;height:100%;object-fit:cover}
#community-app .pls .pls-av b{color:#fff;font:800 26px/1 var(--font-control-title,'Segoe UI'),sans-serif}
#community-app .pls .pls-kicker{display:block;font:800 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--rc)}
#community-app .pls .pls-id h2{margin:6px 0 2px;font:800 30px/1.05 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff;text-shadow:0 2px 12px #000}
#community-app .pls .pls-handle{font-size:13px;color:#b8c2cc}
#community-app .pls .pls-hero .ooc-space-actions{position:relative}
#community-app .pls .pls-sub{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 18px;padding:14px 4px 4px}
#community-app .pls .pls-sub p{margin:0;font-size:14.5px;color:#c4cdd6}
#community-app .pls .pls-perms{display:flex;flex-wrap:wrap;gap:8px}
#community-app .pls .pls-perm{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;border:1px solid #ffffff1f;background:#ffffff08;font-size:12px;color:#aeb8c2}
#community-app .pl-missing{padding:40px 24px!important;text-align:center;color:#b4bec8}
#community-app .pl-missing a{color:var(--color-accent-default,#ffc45b)}
.pl-perms-dialog{width:min(520px,calc(100vw - 32px))}
.pl-perms-dialog .plp-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid #ffffff10}
.pl-perms-dialog .plp-row span{display:flex;flex-direction:column;gap:2px}
.pl-perms-dialog .plp-row b{font-size:14.5px;color:#eef1f4}
.pl-perms-dialog .plp-row small{font-size:12.5px;color:#9aa5b0}
.pl-perms-dialog select{min-width:140px}
@media (max-width:640px){
 #community-app .pls .pls-hero{min-height:160px;flex-direction:column;align-items:flex-start;padding:0 14px 14px!important}
 #community-app .pls .pls-av{width:64px;height:64px}
 #community-app .pls .pls-id h2{font-size:23px}
}

/* Window title bar buttons (character sheets): a little bigger, with a crisp black outline */
html body #community-app .sheet-traffic-control,html body .sheet-traffic-control{width:22px!important;height:22px!important;min-width:22px!important;border:1.5px solid #000!important;box-shadow:0 0 0 1px #ffffff14,inset 0 1px 0 #ffffff55!important;border-radius:6px!important}
/* Page action pills (＋ New character, Pending approval…): slightly larger text */
html body #community-app#community-app .corner-pill{font-size:14px!important;padding:7px 14px!important}
html body #community-app#community-app .corner-pill span{font-size:12.5px!important}

/* ===== Music: floating player (orb / full / mini / put away in the sidebar) ===== */
html body #community-app #sidebar-music{display:none!important}
html body #community-app.music-docked #sidebar-music{display:flex!important;align-items:center}
html body #community-app .dm-dock{--dm-c:var(--color-accent-default,#ffc45b);position:fixed;right:24px;bottom:24px;z-index:10350;display:flex;align-items:flex-end;justify-content:flex-end}
html body #community-app .dm-dock:is([data-mode=full],[data-mode=docked]){display:none}
html body #community-app .dm-dock[data-mode=orb] .dm-mini,html body #community-app .dm-dock[data-mode=mini] :is(.dm-orb,.dm-orb-x){display:none}
/* the round button */
html body #community-app .dm-orb{position:relative;display:grid;place-items:center;width:58px;height:58px;padding:0!important;border-radius:50%!important;border:1.5px solid color-mix(in srgb,var(--dm-c) 70%,#000)!important;background:radial-gradient(circle at 35% 30%,#1d242d,#0a0d11)!important;color:var(--dm-c)!important;cursor:pointer;box-shadow:0 10px 26px #000a,0 0 0 1px #000;transition:box-shadow .25s ease,transform .2s ease}
html body #community-app .dm-orb .dm-note{width:24px;height:24px}
html body #community-app .dm-orb .dm-wave{display:none}
html body #community-app .dm-dock.is-playing .dm-orb .dm-note{display:none}
html body #community-app .dm-dock.is-playing .dm-orb .dm-wave{display:flex}
html body #community-app .dm-dock.is-playing .dm-orb::before{content:'';position:absolute;inset:-5px;border-radius:50%;border:1.5px solid color-mix(in srgb,var(--dm-c) 55%,transparent);animation:dmPulse 2.2s ease-out infinite}
@keyframes dmPulse{0%{transform:scale(.92);opacity:.9}100%{transform:scale(1.25);opacity:0}}
/* hover: a soft glow around the edge, and the ✕ fades in */
html body #community-app .dm-dock:hover .dm-orb,html body #community-app .dm-orb:focus-visible{transform:translateY(-1px);box-shadow:0 10px 26px #000a,0 0 0 1px #000,0 0 18px 2px color-mix(in srgb,var(--dm-c) 55%,transparent)}
html body #community-app .dm-dock:hover .dm-mini,html body #community-app .dm-player:not(.is-min):hover{box-shadow:0 16px 36px #000b,0 0 0 1px #000,0 0 20px 2px color-mix(in srgb,var(--dm-c) 45%,transparent)!important}
html body #community-app .dm-x{position:absolute;top:-8px;right:-8px;z-index:3;display:grid;place-items:center;width:22px;height:22px;padding:0!important;border-radius:50%!important;border:1.5px solid #000!important;background:#e9edf1!important;color:#0b0f14!important;cursor:pointer;opacity:0;transform:scale(.6);pointer-events:none;transition:opacity .2s ease,transform .2s cubic-bezier(.2,.9,.3,1.4),background .15s}
html body #community-app .dm-x svg{width:13px;height:13px}
html body #community-app .dm-x:hover{background:#ff6b6b!important;color:#fff!important}
html body #community-app :is(.dm-dock[data-mode=orb]:hover .dm-orb-x,.dm-mini:hover>.dm-x,.dm-player:not(.is-min):hover>.dm-x),html body #community-app .dm-x:focus-visible{opacity:1;transform:none;pointer-events:auto}
html body #community-app .dm-orb-x{top:-4px;right:-4px}
/* mini player */
html body #community-app .dm-mini{position:relative;display:flex;align-items:center;gap:6px;width:min(400px,calc(100vw - 32px));padding:8px 10px 8px 8px;border-radius:16px;border:1.5px solid color-mix(in srgb,var(--dm-c) 55%,#000);background:linear-gradient(135deg,#141a21f5,#0a0d11f5);box-shadow:0 16px 36px #000b,0 0 0 1px #000;transition:box-shadow .25s ease}
html body #community-app .dm-mini-art{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:color-mix(in srgb,var(--dm-c) 22%,#0b0f14);color:var(--dm-c)}
html body #community-app .dm-mini-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;padding:0 4px}
html body #community-app .dm-mini-title{font:700 13.5px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;color:#eef1f4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app .dm-mini-time{font:600 11px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;color:#9aa5b0;font-variant-numeric:tabular-nums}
html body #community-app .dm-mini-bar{display:block;height:3px;border-radius:2px;background:#ffffff18;overflow:hidden;margin-top:2px}
html body #community-app .dm-mini-bar i{display:block;height:100%;width:0;background:var(--dm-c);transition:width 1s linear}
html body #community-app .dm-mini .dm-icon{flex:none;width:32px;height:32px}
html body #community-app .dm-mini .dm-pp{width:36px;height:36px;border-radius:50%!important;background:var(--dm-c)!important;color:#0b0f14!important}
/* full player: anchored in the bottom-right corner, grows out of the button */
html body #community-app .dm-player{left:auto!important;top:auto!important;right:24px!important;bottom:24px!important;transform-origin:100% 100%;z-index:10350!important;transition:box-shadow .25s ease}
html body #community-app .dm-player .dm-head{cursor:default!important}
html body #community-app .dm-player>.dm-x{top:-8px;right:-8px}
/* helper text on the small buttons */
html body #community-app :is(.dm-dock,.dm-player) [data-label]{position:relative}
html body #community-app :is(.dm-mini,.dm-player) .dm-icon[data-label]::after,html body #community-app .dm-x[data-label]::after{content:attr(data-label);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%,4px);padding:4px 8px;border-radius:6px;background:#05080bf2;border:1px solid #ffffff22;font:600 11px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;color:#e9edf1;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s ease,transform .15s ease;z-index:5}
html body #community-app :is(.dm-mini,.dm-player) .dm-icon[data-label]:hover::after,html body #community-app .dm-x[data-label]:hover::after{opacity:1;transform:translate(-50%,0);transition-delay:.25s}
/* the flight into the sidebar */
html body #community-app .dm-fly{position:fixed;left:0;top:0;z-index:10400;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#1d242d,#0a0d11);border:1.5px solid var(--dm-c);color:var(--dm-c);box-shadow:0 0 22px color-mix(in srgb,var(--dm-c) 55%,transparent);pointer-events:none}
html body #community-app .dm-fly svg{width:22px;height:22px}
html body #community-app #sidebar-music.is-arriving{color:var(--color-accent-default,#ffc45b)!important}
@media (prefers-reduced-motion:reduce){html body #community-app .dm-dock.is-playing .dm-orb::before{animation:none}}
/* phones: sit above the ☰ menu button */
@media (max-width:640px){
 html body #community-app .dm-dock{right:16px;bottom:96px}
 html body #community-app .dm-player{right:8px!important;bottom:88px!important;width:calc(100vw - 16px)!important}
 html body #community-app .dm-orb{width:50px;height:50px}
}

/* ===== Member cards v2: wide & short, max three per row; hover swaps the counts for role + actions ===== */
html body #community-app#community-app .ma-directory .ooc-member-list.ma-grid{grid-template-columns:repeat(auto-fill,minmax(max(300px,calc((100% - 44px) / 3)),1fr))!important;gap:18px 22px!important}
#community-app .ma-card.mc{display:flex;flex-direction:column;gap:12px;padding:14px 16px 12px;border-radius:14px!important;cursor:default}
#community-app .ma-card.mc:is(:hover,:focus-within){transform:translateY(-2px);border-radius:14px!important}
#community-app .mc-top{display:grid;grid-template-columns:56px minmax(0,1fr) auto;align-items:center;gap:14px}
#community-app .mc .ma-av,#community-app .mc .ma-pic{width:56px;height:56px}
#community-app .mc .ma-dot{width:14px;height:14px}
#community-app .mc-id{display:flex;flex-direction:column;gap:2px;min-width:0}
#community-app .mc .ma-name{font-size:17.5px}
/* the swapping corner: counts by default, role + actions on hover / keyboard focus */
#community-app .mc-swap{display:grid;justify-items:end;align-items:center;min-width:132px}
#community-app .mc-swap>*{grid-area:1/1;transition:opacity .22s ease,transform .26s cubic-bezier(.2,.8,.2,1)}
#community-app .mc-stats{display:flex;gap:16px}
#community-app .mc-stats>span{display:flex;flex-direction:column;align-items:center;font:600 10px/1.3 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#8793a0}
#community-app .mc-stats b{font:750 17px/1.15 var(--font-control-title,'Segoe UI'),sans-serif;letter-spacing:0;color:#eef1f4}
#community-app .mc-hover{display:flex;flex-direction:column;align-items:flex-end;gap:6px;opacity:0;transform:translateX(8px);pointer-events:none}
#community-app .mc-hover .ma-role{margin:0;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#community-app .mc-acts{display:flex;gap:6px}
#community-app .mc .ma-act{width:34px;height:30px;border-radius:9px!important}
#community-app .mc .ma-act::after{top:auto;bottom:calc(100% + 8px);transform:translate(-50%,4px)}
#community-app .mc .ma-act:is(:hover,:focus-visible)::after{transform:translate(-50%,0)}
#community-app .ma-card.mc:is(:hover,:focus-within) .mc-stats{opacity:0;transform:translateX(-8px)}
#community-app .ma-card.mc:is(:hover,:focus-within) .mc-hover{opacity:1;transform:none;pointer-events:auto}
/* bottom row: character portraits (circles, scroll sideways) + joined date */
#community-app .mc-bottom{display:flex;align-items:center;gap:12px;min-height:34px;padding-top:10px;border-top:1px solid #ffffff10}
#community-app .mc-strip{position:relative;flex:1;min-width:0;display:flex;align-items:center;gap:4px}
#community-app .mc-chars{display:flex;gap:6px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px;min-width:0;flex:1;mask-image:linear-gradient(90deg,#000 88%,transparent)}
#community-app .mc-strip:not(.is-overflowing) .mc-chars{mask-image:none}
#community-app .mc-chars::-webkit-scrollbar{display:none}
#community-app .mc-char{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;overflow:hidden;scroll-snap-align:start;background:#1a2129;box-shadow:0 0 0 2px var(--c);text-decoration:none!important;transition:transform .18s ease,box-shadow .18s ease}
#community-app .mc-char:hover{transform:translateY(-2px);box-shadow:0 0 0 2px var(--c),0 0 10px var(--c)}
#community-app .mc-char img{width:100%;height:100%;object-fit:cover}
#community-app .mc-char b{font:800 13px/1 var(--font-control-title,'Segoe UI'),sans-serif;color:#fff}
#community-app .mc-arrow{flex:none;display:grid;place-items:center;width:22px;height:22px;padding:0!important;border-radius:50%!important;border:1px solid #ffffff26!important;background:#ffffff0d!important;color:#d6dde4!important;cursor:pointer}
#community-app .mc-arrow svg{width:13px;height:13px}
#community-app .mc-arrow:disabled{opacity:.3;cursor:default}
#community-app .mc-arrow[hidden]{display:none}
#community-app .mc-nochars{flex:1;font-size:12px;color:#6f7b87}
#community-app .mc-joined{flex:none;font:500 11.5px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;color:#8793a0;white-space:nowrap}
#community-app .mc .ma-example{top:auto;bottom:-9px;right:14px;padding:2px 7px;border-radius:999px;background:#0b0f14;border:1px solid #ffffff1c}
/* touch screens / phones: role + actions always shown under the counts */
@media (hover:none),(max-width:640px){
 #community-app .mc-swap{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
 #community-app .mc-swap>*{grid-area:auto}
 #community-app .mc-hover{opacity:1;transform:none;pointer-events:auto}
 #community-app .ma-card.mc:is(:hover,:focus-within) .mc-stats{opacity:1;transform:none}
 #community-app .mc .ma-act::after{display:none}
}
@media (max-width:640px){
 #community-app .mc-top{grid-template-columns:48px minmax(0,1fr);}
 #community-app .mc .ma-av,#community-app .mc .ma-pic{width:48px;height:48px}
 #community-app .mc-swap{grid-column:1/-1;flex-direction:row;justify-content:space-between;align-items:center;min-width:0}
}
/* music player fixes: the ✕ on the full player sits on its top corner; dev control button moves out of the orb's way */
html body #community-app .dm-player>.dm-x{position:absolute!important;top:-8px!important;right:-8px!important;left:auto!important;bottom:auto!important;margin:0!important}
html body #dev-control-toggle{right:auto!important;left:76px!important;bottom:12px!important}
/* member cards: names get the full width; counts sit under the handle; role + actions fade in over the top-right corner */
#community-app .mc-top{grid-template-columns:56px minmax(0,1fr)!important;position:relative}
#community-app .mc-counts{margin-top:3px;font:600 11.5px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;color:#8793a0;white-space:nowrap}
#community-app .mc-counts b{color:#e6ebef;font-weight:750}
#community-app .mc-counts i{font-style:normal;margin:0 6px;color:#5d6873}
#community-app .mc-swap{position:absolute;top:-6px;right:-8px;bottom:-6px;display:flex!important;align-items:center;min-width:0!important;padding:0 8px 0 46px;border-radius:10px;background:linear-gradient(90deg,transparent,#0d1218 38px);opacity:0;transform:translateX(10px);pointer-events:none;transition:opacity .22s ease,transform .26s cubic-bezier(.2,.8,.2,1)}
#community-app .ma-card.mc:is(:hover,:focus-within) .mc-swap{opacity:1;transform:none;pointer-events:auto}
#community-app .mc-swap .mc-hover{opacity:1!important;transform:none!important;pointer-events:auto}
@media (hover:none),(max-width:640px){
 #community-app .mc-swap{position:static;opacity:1;transform:none;pointer-events:auto;background:none;padding:0;grid-column:1/-1;justify-content:space-between}
 #community-app .mc-swap .mc-hover{flex-direction:row;align-items:center;justify-content:space-between;width:100%}
}
/* Search in the top bar: a round magnifier button, icon dead-centre; it widens into a field when opened */
html body #community-app#community-app .box-bar :is(.corner-search,.dn-search).in-bar{padding:0!important;gap:0!important;min-width:0!important;border-radius:999px!important;align-items:center!important;margin-left:auto}
html body #community-app#community-app .box-bar :is(.corner-search,.dn-search).in-bar:not(.is-open){width:30px!important;height:30px!important;justify-content:center!important}
html body #community-app#community-app .box-bar :is(.corner-search-btn,.dn-search-btn,.corner-search>button,.dn-search>button){display:grid!important;place-items:center!important;width:30px!important;height:30px!important;padding:0!important;margin:0!important;flex:none!important}
html body #community-app#community-app .box-bar :is(.corner-search,.dn-search).in-bar button svg{display:block;width:16px!important;height:16px!important;margin:0!important;flex:none}
html body #community-app#community-app .box-bar :is(.corner-search,.dn-search).in-bar:not(.is-open) input{width:0!important;padding:0!important;opacity:0}
#community-app .pl-page{padding:6px 4px 10px!important;background:none!important;border:0!important;box-shadow:none!important}
html body #community-app#community-app .box-bar :is(.corner-search,.dn-search).in-bar.is-open{padding-right:2px!important;margin-right:2px}
/* Member Area: the member list scrolls inside the page frame (same as Characters) */
#community-app .ma-directory .ma-results{min-height:0;max-height:100%;overflow-y:auto;padding:14px 14px 28px 4px;scrollbar-width:thin;scrollbar-color:#e9b35a66 transparent;scrollbar-gutter:stable}
/* About me: floating panel beside a member card */
#community-app .ma-about-pop{--rc:var(--role-color,var(--color-accent-default,#ffc45b));position:fixed;z-index:10300;width:min(320px,calc(100vw - 16px));border-radius:14px;background:linear-gradient(160deg,color-mix(in srgb,var(--rc) 12%,#121820),#0a0e13);border:1px solid color-mix(in srgb,var(--rc) 55%,#ffffff1c);box-shadow:0 18px 40px #000c,0 0 0 1px #000;animation:mapIn .26s cubic-bezier(.2,.9,.25,1.05)}
#community-app .ma-about-pop::before{content:'';position:absolute;top:26px;left:-7px;width:12px;height:12px;background:color-mix(in srgb,var(--rc) 12%,#121820);border-left:1px solid color-mix(in srgb,var(--rc) 55%,#ffffff1c);border-bottom:1px solid color-mix(in srgb,var(--rc) 55%,#ffffff1c);transform:rotate(45deg)}
#community-app .ma-about-pop.is-left::before{left:auto;right:-7px;transform:rotate(-135deg)}
#community-app .ma-about-pop.is-left{animation-name:mapInLeft}
#community-app .ma-about-pop.is-closing{animation:mapOut .18s ease-in forwards}
@keyframes mapIn{from{opacity:0;transform:translateX(-10px) scale(.97)}to{opacity:1;transform:none}}
@keyframes mapInLeft{from{opacity:0;transform:translateX(10px) scale(.97)}to{opacity:1;transform:none}}
@keyframes mapOut{to{opacity:0;transform:scale(.97)}}
#community-app .ma-about-pop header{position:relative;padding:14px 44px 6px 16px}
#community-app .ma-about-pop .map-kicker{font:800 10.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--rc)}
#community-app .ma-about-pop h3{margin:5px 0 0;font:750 17px/1.2 var(--font-control-title,'Segoe UI'),sans-serif;color:#f1f4f6}
#community-app .ma-about-pop .map-x{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:26px;height:26px;padding:0!important;border-radius:50%!important;border:1px solid #ffffff22!important;background:#ffffff0a!important;color:#d6dde4!important;font-size:12px;cursor:pointer}
#community-app .ma-about-pop .map-x:hover{background:#ff6b6b!important;border-color:#ff6b6b!important;color:#fff!important}
#community-app .ma-about-pop .map-body{padding:4px 16px 14px;position:relative}
#community-app .ma-about-pop .map-body p{margin:0;font-size:14px;line-height:1.55;color:#cdd5dc;overflow-wrap:anywhere}
#community-app .ma-about-pop .map-empty{color:#7d8894!important;font-style:italic}
#community-app .ma-about-pop textarea{width:100%;box-sizing:border-box;min-height:110px;padding:10px 12px;border-radius:10px;border:1px solid #ffffff22;background:#05080bcc;color:#eef1f4;font:14px/1.5 inherit;resize:vertical}
#community-app .ma-about-pop .map-count{display:block;text-align:right;margin-top:4px;font-size:11.5px;color:#7d8894;font-variant-numeric:tabular-nums}
#community-app .ma-about-pop .map-count.is-full{color:#ffb35a}
#community-app .ma-about-pop footer{display:flex;justify-content:flex-end;gap:8px;padding:0 16px 14px}
#community-app .ma-about-pop footer button{padding:6px 14px;border-radius:8px;font-size:13px}
#community-app .ma-about-pop .map-tools{display:flex;gap:4px;margin-bottom:6px}
#community-app .ma-about-pop .map-tools button{width:30px;height:28px;padding:0!important;border-radius:7px!important;border:1px solid #ffffff22!important;background:#ffffff0a!important;color:#e6ebef!important;font:14px/1 Georgia,serif;cursor:pointer}
#community-app .ma-about-pop .map-tools button:hover{border-color:var(--rc)!important;color:var(--rc)!important}
#community-app .ma-about-pop .map-edit{display:inline-flex;align-items:center;gap:6px}
#community-app .ma-about-pop .map-body strong{color:#fff}
/* Sidebar: regions nested under The World get the same guide line + indent as a region's own sub-locations */
html body #community-app:not(.sidebar-collapsed) #sidebar-links .sidebar-world:not(.is-folded){position:relative}
html body #community-app:not(.sidebar-collapsed) #sidebar-links .sidebar-world:not(.is-folded)>:is(.sidebar-region,.sidebar-sublist){margin-left:20px!important;width:calc(100% - 20px)!important}
html body #community-app:not(.sidebar-collapsed) #sidebar-links .sidebar-world:not(.is-folded)>.sidebar-region{padding-left:12px!important}
html body #community-app:not(.sidebar-collapsed) #sidebar-links .sidebar-world:not(.is-folded)::before{content:'';position:absolute;left:20px;top:var(--world-line-top,52px);bottom:6px;width:1px;background:rgb(53,68,91);pointer-events:none}
html body #community-app:not(.sidebar-collapsed) #sidebar-links .sidebar-world:not(.is-folded)>.sidebar-sublist{margin-left:44px!important;width:calc(100% - 44px)!important}
/* Post author cards */
html body #community-app#community-app .forum-post .post-author .post-last-online{display:none!important}
html body #community-app#community-app .forum-post .post-stat-tiles .pst{height:64px!important;min-height:0!important;max-height:64px;box-sizing:border-box;overflow:hidden}
html body #community-app#community-app .forum-post .post-stat-tiles .pst.is-designation .pst-mark{transform:scale(.88)}
/* the whole picture turns the card over; on the back, anything that isn't a button turns it back */
html body #community-app#community-app .forum-post .post-flip-card:not(.is-flipped),html body #community-app#community-app .forum-post .post-flip-card:not(.is-flipped) *,html body #community-app#community-app .forum-post .post-flip-card.is-flipped .post-flip-back,html body #community-app#community-app .forum-post .post-flip-card.is-flipped .post-flip-back *{cursor:var(--flip-cursor),pointer!important}
html body #community-app#community-app .forum-post .post-flip-card.is-flipped :is(.dossier-icon-btn:not(.is-off),.dossier-id-btn,.dossier-dm-btn,.dossier-player,a)>*,html body #community-app#community-app .forum-post .post-flip-card.is-flipped :is(.dossier-icon-btn:not(.is-off),.dossier-id-btn,.dossier-dm-btn,.dossier-player,a){cursor:pointer!important}
html body #community-app#community-app .forum-post .post-flip-card.is-flipped .dossier-icon-btn.is-off,html body #community-app#community-app .forum-post .post-flip-card.is-flipped .dossier-icon-btn.is-off *{cursor:not-allowed!important}
html body #community-app#community-app .forum-post .post-flip-card .post-card-radar,html body #community-app#community-app .forum-post .post-flip-card .post-card-radar *{cursor:default!important}
html body #community-app#community-app .post-flip-card.is-flipped .dossier-player{border-radius:10px;transition:background .15s}
html body #community-app#community-app .post-flip-card.is-flipped .dossier-player:hover{background:#ffffff12}
/* just flipped: no corner fold until the pointer leaves or 3 seconds pass */
html body #community-app#community-app .post-flip-card.peek-hold:not(.is-flipped):not(.is-unpeeling){--peel:0px!important}
html body #community-app#community-app .post-flip-card.peek-hold.is-flipped:not(.is-unpeeling){--bpeel:0px!important}
html body #community-app#community-app .post-flip-card.peek-hold:not(.is-unpeeling) .post-flip-front::after,html body #community-app#community-app .post-flip-card.peek-hold.is-flipped:not(.is-unpeeling) .post-flip-back::after{opacity:0!important}
/* "Played by" → the member's card, floating */
#community-app .mc-pop{position:fixed;z-index:10300;width:min(420px,calc(100vw - 16px));animation:mapIn .24s cubic-bezier(.2,.9,.25,1.05)}
#community-app .mc-pop.is-closing{animation:mapOut .16s ease-in forwards}
#community-app .mc-pop .ma-card{margin:0;box-shadow:0 20px 44px #000d,0 0 0 1px #000}
#community-app .mc-pop .mc-swap{opacity:1;transform:none;pointer-events:auto}
#community-app .mc-pop .mc-pop-x{position:absolute;top:-10px;right:-10px;z-index:5;display:grid;place-items:center;width:26px;height:26px;padding:0!important;border-radius:50%!important;border:1.5px solid #000!important;background:#e9edf1!important;color:#0b0f14!important;font-size:12px;cursor:pointer}
#community-app .mc-pop .mc-pop-x:hover{background:#ff6b6b!important;color:#fff!important}

/* ===== Page type: Offset content (left). On wide screens the container hugs the left edge and leaves a
   deliberate gap on the right; it goes full width once there isn't room for the gap. ===== */
@media (min-width:1200px){
 html body #community-app#community-app #app-view>.std-box.page-offset-left{width:min(1080px,74%)!important;max-width:none!important;margin-left:0!important;margin-right:auto!important}
 html body #community-app#community-app #app-view>.std-box.page-offset-right{width:min(1080px,74%)!important;max-width:none!important;margin-left:auto!important;margin-right:0!important}
}

/* Plotters: two folders per row; folder outline drawn as one continuous, thicker line (tab included) */
#community-app .pl-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:34px 26px!important;padding-top:18px!important}
#community-app .pl-card{border-width:2px!important;border-radius:0 14px 14px 14px!important}
#community-app .pl-tab{top:-18px!important;left:-2px!important;width:40%!important;height:18px!important;border:2px solid color-mix(in srgb,var(--rc) 40%,#ffffff18)!important;border-bottom:0!important;border-radius:10px 14px 0 0!important;clip-path:none!important;background:#0c1116!important;box-sizing:border-box}
#community-app .pl-card:is(:hover,:focus-visible) .pl-tab{border-color:color-mix(in srgb,var(--rc) 65%,#ffffff22)!important}
#community-app .pl-card{border-color:color-mix(in srgb,var(--rc) 40%,#ffffff18)!important}
/* hide the card's own top edge under the tab so the outline runs tab → side without a seam */
#community-app .pl-tab::after{content:'';position:absolute;left:0;right:0;bottom:-2px;height:2px;background:#0c1116}
#community-app .pl-banner{margin:4px 4px 0!important;border-radius:0 10px 0 0!important}
@media (max-width:760px){#community-app .pl-grid{grid-template-columns:1fr!important}}
/* Character cards: Threads / Posts join Played by / Approved; the portrait grows with the card but keeps its 3:5 shape */
@media (min-width:641px){
html body #community-app#community-app .cast-directory .cast-card:not(.cast-card-leaving){grid-template-columns:clamp(118px,28%,140px) minmax(0,1fr)!important;align-items:stretch}
html body #community-app#community-app .cast-directory .cast-card .character-card-portrait{position:relative!important;width:100%!important;height:auto!important;min-height:197px;max-width:100%!important;overflow:hidden!important}}
/* the photo never sizes the card: it fills whatever the column and the text beside it allow */
html body #community-app#community-app .cast-directory .cast-card .character-card-portrait img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover;object-position:center top}
html body #community-app#community-app .cast-directory .cast-threads{display:none!important}

/* Plotters: use most of the width; cards fill it (no description line) */
@media (min-width:1200px){html body #community-app#community-app #app-view>.std-box.page-offset-left{width:min(1500px,88%)!important}}
#community-app .pl-sub{display:none!important}
#community-app .pl-card .pl-body{margin-bottom:16px!important}
#community-app .pl-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
#community-app .pl-banner{height:clamp(120px,11vw,190px)!important}

/* ===== Replying: Quick reply / Add Reply buttons, the Add Reply page, draft status ===== */
#community-app .reply-bar{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 12px}
#community-app .reply-bar>*{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;font:750 14px/1 var(--font-control-ui,'Segoe UI'),sans-serif;cursor:pointer;text-decoration:none!important;transition:background .18s,border-color .18s,color .18s,transform .18s}
#community-app .reply-bar .reply-bar-quick{border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,#ffffff1a);background:#ffffff0a;color:#e9edf1}
#community-app .reply-bar .reply-bar-quick:hover,#community-app .reply-bar.is-open .reply-bar-quick{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b)}
#community-app .reply-bar .reply-bar-full{border:1px solid var(--color-accent-default,#ffc45b);background:var(--color-accent-default,#ffc45b);color:#0b0f14}
#community-app .reply-bar .reply-bar-full:hover{transform:translateY(-1px);filter:brightness(1.08)}
#community-app .quick-reply[hidden]{display:none!important}
#community-app .quick-reply{animation:qrIn .22s cubic-bezier(.2,.8,.2,1)}
@keyframes qrIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
#community-app .draft-status{font:500 12px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;color:#8793a0;margin-left:auto}
#community-app .reply-page .std-box-body{padding:18px 22px 26px}
#community-app .reply-page .reply-to{margin:0 0 14px;color:#a9b3bd;font-size:14px}
#community-app .reply-page .reply-to a{color:var(--color-accent-default,#ffc45b);font-weight:700}
#community-app .reply-page .forum-rich[contenteditable]{min-height:280px}
#community-app .reply-page-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:14px}
#community-app .reply-page-actions .draft-status{margin-right:auto;margin-left:0}
#community-app .reply-page-actions .reply-cancel{color:#aeb8c2;font-size:14px}
#community-app .reply-page-actions button{padding:9px 20px;border-radius:999px;font-weight:750}
#community-app .reply-review{margin-top:28px;border-top:1px solid #ffffff12;padding-top:14px}
#community-app .reply-review>summary{cursor:pointer;font:800 12px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b);margin-bottom:12px}
#community-app .reply-review>summary small{margin-left:10px;letter-spacing:.04em;text-transform:none;color:#8793a0;font-weight:600}
#community-app .reply-review-post{margin:0 0 12px;padding:12px 16px;border-radius:10px;border:1px solid #ffffff12;background:#ffffff05;max-height:240px;overflow:auto}
#community-app .reply-review-post header{display:flex;justify-content:space-between;gap:10px;margin-bottom:6px}
#community-app .reply-review-post strong{color:var(--character-color)}
#community-app .reply-review-post time{font-size:12px;color:#8793a0}
#community-app .reply-review-post .forum-rich{font-size:14px;line-height:1.55}

/* ===== Music player v2: hugs the window edge, smaller, secondary-colour fill, draggable, window-style buttons ===== */
html body #community-app .dm-dock{right:var(--dm-r,10px)!important;bottom:var(--dm-b,10px)!important}
html body #community-app .dm-player{right:var(--dm-r,10px)!important;bottom:var(--dm-b,10px)!important}
html body #community-app .dm-orb{width:46px!important;height:46px!important;border:1.5px solid #000!important;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--color-accent-secondary,#713219) 70%,#fff),var(--color-accent-secondary,#713219) 70%)!important;color:#fff4e0!important;cursor:grab;touch-action:none;box-shadow:0 8px 20px #0009,0 0 0 1px #ffffff1a inset}
html body #community-app .dm-orb .dm-note{width:20px!important;height:20px!important}
html body #community-app .dm-dock.is-playing .dm-orb::before{border-color:color-mix(in srgb,var(--color-accent-secondary,#713219) 70%,#fff)}
html body #community-app .dm-dock:hover .dm-orb{box-shadow:0 8px 20px #0009,0 0 16px 3px color-mix(in srgb,var(--color-accent-secondary,#713219) 70%,transparent)!important}
html body #community-app .dm-player .dm-head,html body #community-app .dm-mini{cursor:grab;touch-action:none}
html body #community-app.dm-dragging,html body #community-app.dm-dragging *{cursor:grabbing!important;user-select:none!important}
html body #community-app.dm-dragging :is(.dm-dock,.dm-player){transition:none!important}
/* window buttons: same colours, size and outline as the character sheet windows */
html body #community-app .dm-lights{display:flex;align-items:center;gap:7px;margin-left:auto;flex:none}
html body #community-app .dm-light{position:relative;width:20px!important;height:20px!important;min-width:20px;padding:0!important;border-radius:6px!important;border:1.5px solid #000!important;box-shadow:0 0 0 1px #ffffff14,inset 0 1px 0 #ffffff55;cursor:pointer;transition:filter .15s,transform .15s}
html body #community-app .dm-light:hover{filter:brightness(1.12);transform:translateY(-1px)}
html body #community-app .dm-light-min{background:#ffbd44!important}
html body #community-app .dm-light-mid{background:#30c85a!important}
html body #community-app .dm-light-close{background:#ff6058!important}
html body #community-app .dm-light::before{content:'';position:absolute;inset:0;margin:auto;opacity:0;transition:opacity .15s}
html body #community-app .dm-lights:hover .dm-light::before{opacity:.75}
html body #community-app .dm-light-min::before{width:9px;height:2px;background:#5a3b00}
html body #community-app .dm-light-mid::before{width:8px;height:8px;border:2px solid #0b4820;border-radius:2px;box-sizing:border-box}
html body #community-app .dm-light-close::before{width:10px;height:10px;background:linear-gradient(45deg,transparent 43%,#61130f 43% 57%,transparent 57%),linear-gradient(-45deg,transparent 43%,#61130f 43% 57%,transparent 57%)}
html body #community-app .dm-light::after{content:attr(data-label);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%,4px);padding:4px 8px;border-radius:6px;background:#05080bf2;border:1px solid #ffffff22;font:600 11px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;color:#e9edf1;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s;z-index:5}
html body #community-app .dm-light:hover::after{opacity:1;transform:translate(-50%,0);transition-delay:.25s}
html body #community-app .dm-player>.dm-x{display:none!important}
html body #community-app .dm-mini .dm-lights{margin-left:4px}
@media (max-width:640px){html body #community-app .dm-dock{bottom:max(var(--dm-b,10px),90px)!important}}
html body #community-app .dm-dock>.dm-orb-x{position:absolute!important;top:-6px!important;right:-6px!important}
html body #community-app #sidebar-links .sidebar-region-chev{flex:none!important;width:26px!important;min-width:26px!important}
html body #community-app .dm-fly{width:46px!important;height:46px!important;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--color-accent-secondary,#713219) 70%,#fff),var(--color-accent-secondary,#713219) 70%)!important;border:1.5px solid #000!important;color:#fff4e0!important;box-shadow:0 8px 22px #0009!important}
html body #community-app #sidebar-music.is-arriving{visibility:hidden}
/* opened from the sidebar: the player appears right beside it (minimizing sends it back to its corner) */
html body #community-app .dm-player.from-sidebar{left:var(--dm-sl,240px)!important;top:var(--dm-st,120px)!important;right:auto!important;bottom:auto!important;transform-origin:0 50%}

/* Sidebar sizes itself to its contents (see fitSidebar in community-app.js): widens smoothly when a nested
   entry needs room, shrinks back when it doesn't */
@media (min-width:641px){html body #community-app:not(.sidebar-collapsed){--navigation-gutter:var(--sidebar-fit,204px)}
 html body #community-app:not(.sidebar-collapsed) #app-sidebar{width:var(--sidebar-fit,204px)}
 html body #community-app #app-sidebar{transition:width .3s cubic-bezier(.2,.7,.2,1),top var(--hdr-dur,.3s) ease,height var(--hdr-dur,.3s) ease,padding .25s ease,background .35s ease!important}}
html body #community-app #sidebar-links :is(a,.sidebar-region,.sidebar-world-root){box-sizing:border-box;max-width:100%}
/* Stylized pages never scroll sideways */
html body #community-app#community-app #app-view,html body #community-app#community-app #app-view>.std-box,html body #community-app#community-app #app-view .std-box-body,html body #community-app#community-app :is(.ma-directory,.ma-results,.cast-directory,.cast-results,.pl-page,.pl-grid,.ma-grid){overflow-x:hidden!important}
/* hovering anywhere on a post portrait: pentagon lights up and the corner lifts (same as hovering the corner) */
html body #community-app#community-app .post-flip-card.is-peeking:not(.is-flipped) .post-card-radar{opacity:1!important}
html body #community-app#community-app .post-flip-card.is-peeking:not(.is-flipped) .post-flip-front>img{filter:none!important}

/* Thread cards: NEW sits on the card's top-right corner instead of taking a line; meta text a little larger */
html body #community-app#community-app .dispatch-thread-card{position:relative;overflow:visible!important}
html body #community-app#community-app .dispatch-thread-card .thread-unread-badge{position:absolute!important;top:-9px;right:-7px;z-index:6;margin:0!important;padding:3px 9px!important;border-radius:6px!important;font-size:11px!important;letter-spacing:.12em;transform:rotate(3deg);box-shadow:0 4px 12px #0009,0 0 0 1.5px #000}
html body #community-app#community-app .dispatch-thread-card .thread-started-by,html body #community-app#community-app .dispatch-thread-card .thread-started-by *{font-size:13.5px!important}
html body #community-app#community-app .dispatch-thread-card .thread-card-main time{font-size:12px!important}
html body #community-app#community-app .dispatch-thread-card small{font-size:10.5px!important}
html body #community-app#community-app .dispatch-thread-card small+time,html body #community-app#community-app .dispatch-thread-card .thread-card-last time{font-size:12px!important}
html body #community-app#community-app .dispatch-thread-card .thread-last-author{font-size:13px!important}
html body #community-app#community-app .dispatch-thread-card footer span:not(.thread-card-status){font-size:12px!important}

/* codenames use Clarity City at medium weight */
html body #community-app :is(.character-codename,.post-codename span,.post-codename,.cast-aka+.character-codename){font-weight:500}

/* ---- Thread view: the trail is the title bar (same bar as every other page) ---- */
html body #community-app#community-app #app-view>.thread-view-heading.has-th-bar{flex-wrap:wrap!important;row-gap:12px!important;align-items:flex-start!important}
html body #community-app#community-app .thread-view-heading>.th-bar{order:-1;flex:0 0 calc(100% + 40px);display:flex;align-items:center;gap:10px;min-width:0;min-height:48px;box-sizing:border-box;margin:-18px -22px 0 -18px;padding:7px 16px;background:rgba(8,10,11,.55);border-bottom:1px solid #ffffff14;border-radius:0 10px 0 0}
html body #community-app#community-app .th-bar>.app-history-controls.in-bar{position:static!important;margin:0!important;align-self:center!important;flex:none;display:flex;gap:6px}
html body #community-app#community-app .th-bar>.app-history-controls.in-bar .app-back-control{width:30px!important;height:30px!important;font-size:14px!important}
html body #community-app#community-app .th-bar>.header-forum-trail.in-box{flex:1 1 auto;min-width:0;overflow:hidden}
html body #community-app#community-app .th-bar>.header-forum-trail li:last-child{min-width:0}
html body #community-app#community-app .th-bar>.header-forum-trail li:last-child>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app#community-app .th-head-main>h1.th-title-sr{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}
html body #community-app#community-app .thread-view-heading.has-th-bar>.th-head-main{order:2;flex:1 1 0;align-self:center}
html body #community-app#community-app .thread-view-heading.has-th-bar>.th-right{order:3}
@media (max-width:640px){
 html body #community-app#community-app .thread-view-heading>.th-bar{flex-basis:calc(100% + 28px);margin:-14px -14px 0 -14px;padding:6px 10px;min-height:44px}
 html body #community-app#community-app #app-view>.thread-view-heading>div.th-bar.th-bar{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:flex-start!important;order:-1!important;flex:0 0 calc(100% + 28px)!important;max-width:none!important;margin:-14px -14px 0 -14px!important}
 html body #community-app#community-app .th-bar>.app-history-controls.in-bar{flex:none!important;width:auto!important;order:0!important}
 html body #community-app#community-app .th-bar>.header-forum-trail.in-box{flex:1 1 auto!important;width:auto!important;justify-content:flex-start!important;order:1!important}
 html body #community-app#community-app .th-bar>.header-forum-trail li:last-child>span{font-size:15px!important;text-align:left}
 html body #community-app#community-app .thread-view-heading.has-th-bar>.th-head-main,html body #community-app#community-app .thread-view-heading.has-th-bar>.th-right{flex:1 1 100%!important}
}
/* post buttons: Edit, Quote, then the link */
#community-app .post-controls [data-quote-post]{order:1}
#community-app .post-controls .post-copy-link{order:2}
/* The three tiles under the portrait line up exactly with the portrait's left and right edges */
html body #community-app#community-app .post-author-pin>.post-stat-tiles{margin-left:0!important;margin-right:0!important;width:100%!important;box-sizing:border-box;gap:5px!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
html body #community-app#community-app .post-author-pin>.post-stat-tiles>.pst{padding:9px 2px 8px!important;min-width:0!important;width:auto!important;max-width:none!important;aspect-ratio:auto!important;box-sizing:border-box!important}
html body #community-app#community-app .post-author-pin>.post-stat-tiles .pst>small{letter-spacing:.08em!important;font-size:8.5px!important;white-space:nowrap}
html body #community-app#community-app .post-author-pin>.post-stat-tiles .pst-faction>.pst-badge{width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important}
html body #community-app#community-app .post-controls>[data-quote-post]{order:1!important}
html body #community-app#community-app .post-controls>.post-copy-link{order:2!important}
/* Music, one set of controls: the playlist's own compact player does play / skip; the header says where it's from */
html body #community-app .dm-embed{min-height:80px!important;border-radius:12px}
html body #community-app .dm-player.is-video .dm-embed{min-height:150px!important}
html body #community-app .dm-title small{display:flex;align-items:center;gap:0;white-space:nowrap}
html body #community-app .dm-title .dm-src{margin:0!important;display:inline-flex;align-items:center;gap:4px;font:inherit;color:inherit}
html body #community-app .dm-title .dm-src svg{width:11px!important;height:11px!important}
html body #community-app .dm-title .dm-src:empty{display:none}
html body #community-app .dm-list{max-height:150px!important}
html body #community-app .dm-title .dm-src{margin-left:5px!important}
/* ---- Guidebook: same scale as the rest of the site (it was reading a size up on laptops) ---- */
@media (min-width:641px){
html body #community-app#community-app .guide-tabs .guide-tab{white-space:normal!important;overflow-wrap:anywhere}
html body #community-app#community-app .guide-tabs{width:100%!important;gap:6px!important}
html body #community-app#community-app .guide-tabs .guide-tab{height:auto!important;min-height:0!important;padding:9px 14px!important;font-size:15px!important;line-height:1!important;letter-spacing:.12em!important;border-width:1.5px!important;border-radius:7px!important}
html body #community-app#community-app .guide-panel h2:not(.box-bar-title){font-size:clamp(24px,2vw,30px)!important;line-height:1.12!important}
html body #community-app#community-app .guide-panel h3{font-size:clamp(18px,1.4vw,21px)!important;line-height:1.2!important}
html body #community-app#community-app .guide-panel .welcome-lead{font-size:15.5px!important;line-height:1.7!important}
html body #community-app#community-app .guide-panel h4{font-size:19px!important;line-height:1.2!important}
html body #community-app#community-app .guide-panel .hb-tab span,html body #community-app#community-app .guide-panel .hb-tab{font-size:15px!important}
html body #community-app#community-app .guide-panel .hb-band-range{font-size:21px!important}
html body #community-app#community-app .guide-panel .hb-rung-range{font-size:17px!important}
html body #community-app#community-app .guide-panel p:not(.welcome-lead),html body #community-app#community-app .guide-panel li{font-size:14.5px!important;line-height:1.7!important}
}

/* ---- Main Index: custom cards + the Arrange tiles editor ---- */
html body #community-app .ix-upload-icon{display:block;width:100%;height:100%;background:currentColor;-webkit-mask:var(--ix-icon) center/contain no-repeat;mask:var(--ix-icon) center/contain no-repeat}
html body #community-app .ix-tiles .ix-symbol.ix-symbol-upload{display:block}
html body #community-app .ix-tiles .ix-symbol-upload .ix-upload-icon{width:24px;height:24px}
html body #community-app .ixa-row>header{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
html body #community-app .ixa-start{display:inline-flex!important;align-items:center;gap:8px;margin:0!important;font-size:12px!important;color:#9aa4ae;text-transform:none!important;letter-spacing:0!important;flex-direction:row!important}
html body #community-app .ixa-start input{width:58px!important;height:28px;padding:2px 8px!important;margin:0!important}
html body #community-app .ixa-drop>li.is-custom{border-style:dashed!important}
html body #community-app .ixa-drop>li .ixa-kind{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b);opacity:.85;margin-left:6px}
html body #community-app .ixa-drop>li .ixa-edit{display:inline-grid;place-items:center;width:24px;height:24px;padding:0!important;margin-left:6px;min-height:0!important}
html body #community-app .ixa-foot{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
html body #community-app .ixc{display:grid;gap:14px}
html body #community-app .ixc h3{margin:0;font-size:18px}
html body #community-app .ixc-back{justify-self:start}
html body #community-app .ixc-type{display:grid;gap:6px;border:1px solid #ffffff1a;border-radius:8px;padding:10px 12px}
html body #community-app .ixc-type label{display:flex!important;flex-direction:row!important;align-items:center;gap:8px;margin:0!important;text-transform:none!important;letter-spacing:0!important;font-size:13.5px!important}
html body #community-app .ixc-icon{display:grid;gap:10px}
html body #community-app .ixc-upload{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
html body #community-app .ixc-upload small{flex:1 1 100%;color:#9aa4ae}
html body #community-app .ixc-upload-preview{display:inline-grid;place-items:center;width:40px;height:40px;border:1px dashed #ffffff2a;border-radius:8px;color:var(--color-accent-default,#ffc45b)}
html body #community-app .ixc-upload-preview .ix-upload-icon{width:26px;height:26px}
html body #community-app .ixc-kids-box{border:1px solid #ffffff1a;border-radius:10px;padding:12px}
html body #community-app .ixc-kids-box h4{margin:0 0 4px;font-size:14px}
html body #community-app .ixc-kids{list-style:none;margin:8px 0;padding:0;display:grid;gap:6px}
html body #community-app .ixc-kids>li{display:flex;align-items:center;gap:10px;padding:6px 8px;border:1px solid #ffffff14;border-radius:8px;background:#ffffff06}
html body #community-app .ixc-kids>li small{color:#7d8790;margin-left:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:40%}
html body #community-app .ixc-kids>li button{padding:4px 10px!important;min-height:0!important;font-size:12px!important}
html body #community-app .ixc-kid-icon{display:inline-grid;place-items:center;width:22px;height:22px;color:var(--color-accent-default,#ffc45b)}
html body #community-app .ixc-kid-icon svg,html body #community-app .ixc-kid-icon .ix-upload-icon{width:20px;height:20px}
html body #community-app .ixc-err{color:#ff8b8b;margin:0;min-height:1em}
html body #community-app .ixc-actions{display:flex;justify-content:flex-end;gap:10px}
html body #community-app .ixc-delete{margin-right:auto;color:#ff9b9b!important;border-color:#ff9b9b55!important}

/* ---- Standard bar buttons: copy link + bookmark, top right of every navigation bar ---- */
html body #community-app .trail-tools{display:inline-flex;align-items:center;gap:6px;margin-left:auto;flex:none;order:99}
html body #community-app :is(.box-bar-tools,.dispatch-actions)>.trail-tools{margin-left:0}
html body #community-app .trail-tools>button{display:inline-grid!important;place-items:center;width:30px!important;height:30px!important;min-width:0!important;min-height:0!important;padding:0!important;margin:0!important;border-radius:8px!important;border:1px solid #ffffff22!important;background:#ffffff0a!important;color:#c9d1d9!important;cursor:pointer;transform:none!important;transition:color .15s ease,border-color .15s ease,background .15s ease}
html body #community-app .trail-tools>button:hover{color:#fff!important;border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)!important;background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 12%,transparent)!important}
html body #community-app .trail-tools>.page-bookmark>span{display:none!important}
html body #community-app .trail-tools>.page-bookmark svg{width:16px;height:16px}
html body #community-app .trail-tools>.page-bookmark[aria-pressed="true"]{color:var(--color-accent-default,#ffc45b)!important}
/* threads: the bar's link button replaces the one that sat with the thread's own buttons */
html body #community-app .thread-view-heading.has-th-bar .thread-heading-actions .thread-copy-link{display:none!important}

/* ---- Scrollbars stay visible on every scrolling window (macOS hides "overlay" scrollbars until you scroll).
   In Chrome/Safari, setting scrollbar-width/scrollbar-color switches off the custom ::-webkit-scrollbar below
   and falls back to the system's disappearing one, so those two are reset here; Firefox keeps them. */
@supports selector(::-webkit-scrollbar){
 html body #community-app#community-app,html body #community-app#community-app *{scrollbar-width:auto!important;scrollbar-color:auto!important}
 html body #community-app ::-webkit-scrollbar{width:8px;height:6px}
 html body #community-app ::-webkit-scrollbar-thumb{background:var(--scrollbar-accent,color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,#3a3f41));border-radius:8px}
 html body #community-app ::-webkit-scrollbar-track{background:#ffffff0d;border-radius:8px}
 html body #community-app ::-webkit-scrollbar-corner{background:transparent}
 /* sideways tab strips and chip rows scroll by swipe/arrows and keep their scrollbar hidden, as before */
 html body #community-app :is(.wanted-tabbed>.wanted-tabs,#page-corner-actions,.guide-side .guide-tabs,.mc-chars,.location-strip .location-side-items,.subcategory-badge-scroller nav)::-webkit-scrollbar{display:none}
}
#community-app[data-scene] .guide-layout .guide-side::-webkit-scrollbar{display:block}

/* guidebook tab column: a fixed, modest width beside the page (wide screens) */
@media (min-width:901px){
html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-body{grid-template-columns:minmax(0,1fr) clamp(180px,17vw,236px)!important}
html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-side{width:auto!important;min-width:0!important;max-width:100%!important;overflow-x:hidden!important}
html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-side .guide-tab{white-space:normal!important;padding-right:14px!important}
}

/* tablets (641-900px): the guidebook tabs sit in a row above the page, like on phones */
@media (min-width:641px) and (max-width:900px){
 html body #community-app#community-app .guide-body{display:flex!important;flex-direction:column!important;gap:10px!important}
 html body #community-app#community-app .guide-body>*{width:auto!important;max-width:none!important;min-width:0!important;position:static!important}
 html body #community-app#community-app .guide-side{order:-1;display:block!important;height:auto!important;max-height:none!important;padding:0!important;background:none!important;border:0!important}
 html body #community-app#community-app .guide-side .guide-tabs{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;overflow-x:auto!important;gap:6px!important;padding:2px 0 6px!important;scrollbar-width:none}
 html body #community-app#community-app .guide-side .guide-tab{flex:none!important;width:auto!important;min-height:0!important;height:auto!important;padding:7px 12px!important;border-radius:99px!important;font-size:12px!important;white-space:nowrap}
 html body #community-app#community-app .guide-side .guide-tab *{font-size:12px!important}
 html body #community-app#community-app .guide-side :is(img,.guide-tab-art,.guide-tab-image){display:none!important}
 html body #community-app#community-app .guide-panel{padding:0!important}
 html body #community-app#community-app .guide-side .guide-tab{background:#0d1217!important;border:1px solid #ffffff22!important;color:#cfd6de!important;filter:none!important;opacity:1!important;backdrop-filter:none!important}
 html body #community-app#community-app .guide-side .guide-tab.is-active{border-color:var(--color-accent-default,#ffc45b)!important;color:var(--color-accent-default,#ffc45b)!important}
 html body #community-app#community-app .guide-side .guide-tab::before,html body #community-app#community-app .guide-side .guide-tab::after{display:none!important}
 html body #community-app#community-app :is(.guide-volume,.guide-body,.guide-layout)::before,html body #community-app#community-app :is(.guide-volume,.guide-body,.guide-layout)::after{display:none!important}
 html body #community-app#community-app .guide-side{position:relative!important;z-index:5!important}
 html body #community-app#community-app .guide-side .guide-tab{font-size:13px!important}
}
@media (min-width:641px) and (max-width:900px){
 html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-body{display:flex!important;flex-direction:column!important;gap:10px!important}
 html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-side{order:-1;display:block!important;flex:none!important;width:auto!important;max-width:100%!important;height:auto!important;padding:0!important;border:0!important;overflow:visible!important}
 html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-side .guide-tabs{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;overflow-x:auto!important;width:auto!important;gap:6px!important;padding:2px 0 6px!important}
 html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-side .guide-tab{flex:none!important;width:auto!important;height:auto!important;padding:7px 12px!important;border-radius:99px!important;font-size:12px!important;white-space:nowrap!important}
 html body #community-app#community-app[data-scene=guidebook] .guide-layout:not(.event-guide) .guide-panel-col{width:auto!important;min-width:0!important}
}
/* thread header: who's in the thread */
html body #community-app .th-cast{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px}
html body #community-app .th-cast-label{font:800 10.5px/1 Consolas,monospace;letter-spacing:.16em;text-transform:uppercase;color:#8d97a1}
html body #community-app .th-faces{display:flex;align-items:center}
html body #community-app .th-face{position:relative;display:grid;place-items:center;width:28px;height:28px;margin-left:-6px;border-radius:50%;overflow:hidden;border:2px solid var(--fc);background:#0d1217;color:var(--fc);font:800 12px/1 var(--font-control-ui,'Segoe UI'),sans-serif;text-decoration:none!important;transition:transform .15s ease,z-index 0s}
html body #community-app .th-face:first-child{margin-left:0}
html body #community-app .th-face:hover,html body #community-app .th-face:focus-visible{transform:translateY(-2px) scale(1.12);z-index:3}
html body #community-app .th-face.is-starter{box-shadow:0 0 0 2px #0d1217,0 0 0 3px var(--fc)}
html body #community-app .th-face img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
html body #community-app .th-more{margin-left:6px;font-size:12px;color:#9aa4ae}
html body #community-app .th-cast-count{font-size:12px;color:#9aa4ae}

/* ---- Compose window (new thread): same window language as the character sheet ---- */
html body #community-app .dw-layer{position:fixed;inset:0;z-index:10300;display:grid;place-items:center;padding:24px 16px;background:rgb(3 6 9 / .62);backdrop-filter:blur(3px)}
html body #community-app .dw-layer.is-min{inset:auto 16px 16px auto;padding:0;background:none;backdrop-filter:none;display:block}
html body #community-app .dw-window{display:flex;flex-direction:column;width:min(980px,100%);max-height:min(92dvh,1100px);border-radius:12px;overflow:hidden;background:#0c1116;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent);box-shadow:0 30px 80px rgb(0 0 0 / .7),0 0 0 1px #000}
html body #community-app .dw-window.is-max{width:100%;max-height:100%;height:100%}
html body #community-app .dw-bar{flex:none;display:flex;align-items:center;gap:12px;height:40px;padding:0 10px 0 16px;background:var(--color-accent-default,#ffc45b);color:#182024}
html body #community-app .dw-title{flex:1 1 auto;min-width:0;display:flex;align-items:baseline;gap:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:700 14px/1 var(--font-control-ui,'Segoe UI'),sans-serif}
html body #community-app .dw-title b{font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:12.5px}
html body #community-app .dw-title span{opacity:.75;overflow:hidden;text-overflow:ellipsis}
html body #community-app .dw-lights{flex:none;display:flex;gap:8px}
html body #community-app .dw-light{width:22px!important;height:22px!important;min-width:0!important;min-height:0!important;padding:0!important;margin:0!important;border-radius:6px!important;border:1.5px solid #000!important;box-shadow:inset 0 1px 0 #ffffff55!important;cursor:pointer;transition:filter .15s ease,transform .15s ease}
html body #community-app .dw-light:hover{filter:brightness(1.12);transform:translateY(-1px)}
html body #community-app .dw-min{background:#ffbd44!important}
html body #community-app .dw-max{background:#30c85a!important}
html body #community-app .dw-close{background:#ff6058!important}
html body #community-app .dw-body{flex:1 1 auto;min-height:0;overflow:auto;padding:18px 20px}
html body #community-app .dw-body>.thread-create{margin:0!important;max-width:none!important;border:0!important;box-shadow:none!important;background:none!important;padding:0!important}
html body #community-app .dw-pill{display:inline-flex;align-items:center;gap:8px;padding:10px 16px!important;border-radius:999px!important;background:#0c1116!important;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)!important;color:#f1f3f5!important;box-shadow:0 14px 34px rgb(0 0 0 / .6)!important;font:700 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;cursor:pointer}
html body #community-app .dw-pill-dot{width:8px;height:8px;border-radius:50%;background:var(--color-accent-default,#ffc45b);box-shadow:0 0 8px var(--color-accent-default,#ffc45b)}
@media (max-width:640px){html body #community-app .dw-layer{padding:8px}html body #community-app .dw-body{padding:12px}html body #community-app .dw-window{max-height:96dvh}}
html body #community-app .dw-body .tc-kicker{display:none!important}

/* ===================== Page types (data-page-type on #community-app) ===================== */
/* Filter sidebar on the right: same filter column, other side */
@media (min-width:641px){
 html body #community-app#community-app[data-page-type=right-filter] .cast-directory{grid-template-columns:minmax(0,1fr) 250px!important}
 html body #community-app#community-app[data-page-type=right-filter] .cast-directory>.cast-sidebar{grid-column:2!important;grid-row:1!important}
 html body #community-app#community-app[data-page-type=right-filter] .cast-directory>:not(.cast-sidebar){grid-column:1!important;grid-row:1!important}
}
/* Panel pages: full width, or a narrower panel offset to one side (wide screens) */
@media (min-width:1200px){
 html body #community-app#community-app:is([data-page-type=offset-left],[data-page-type=offset-right]) #app-view>.std-box{width:min(1500px,88%)!important;max-width:none!important}
 html body #community-app#community-app[data-page-type=offset-left] #app-view>.std-box{margin-left:0!important;margin-right:auto!important}
 html body #community-app#community-app[data-page-type=offset-right] #app-view>.std-box{margin-left:auto!important;margin-right:0!important}
}
html body #community-app#community-app[data-page-type=full] #app-view>.std-box.page-offset-left{width:auto!important;max-width:none!important;margin-left:0!important;margin-right:0!important}
/* Card grid: a card marked wide takes two columns */
@media (min-width:641px){
 html body #community-app#community-app[data-page-type=grid] .fx-grid>.fx-card.is-wide{grid-column:span 2}
}
/* Guidebook tabs: beside the page on the left, or across the top */
@media (min-width:901px){
 html body #community-app#community-app[data-scene=guidebook][data-page-type=tabbed-offset-left] .guide-layout:not(.event-guide) .guide-body{grid-template-columns:clamp(180px,17vw,236px) minmax(0,1fr)!important}
 html body #community-app#community-app[data-scene=guidebook][data-page-type=tabbed-offset-left] .guide-layout:not(.event-guide) .guide-side{grid-column:1!important;grid-row:1!important}
 html body #community-app#community-app[data-scene=guidebook][data-page-type=tabbed-offset-left] .guide-layout:not(.event-guide) .guide-panel-col{grid-column:2!important;grid-row:1!important}
 html body #community-app#community-app[data-scene=guidebook][data-page-type=tabbed-full] .guide-layout:not(.event-guide) .guide-body{display:flex!important;flex-direction:column!important;gap:10px!important}
 html body #community-app#community-app[data-scene=guidebook][data-page-type=tabbed-full] .guide-layout:not(.event-guide) .guide-side{order:-1;flex:none!important;width:auto!important;max-width:100%!important;height:auto!important;padding:0!important;border:0!important;overflow:visible!important;display:block!important}
 html body #community-app#community-app[data-scene=guidebook][data-page-type=tabbed-full] .guide-layout:not(.event-guide) .guide-side .guide-tabs{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;gap:6px!important;width:auto!important}
 html body #community-app#community-app[data-scene=guidebook][data-page-type=tabbed-full] .guide-layout:not(.event-guide) .guide-side .guide-tab{width:auto!important;padding:7px 14px!important;border-radius:99px!important;font-size:13px!important;white-space:nowrap!important}
 html body #community-app#community-app[data-scene=guidebook][data-page-type=tabbed-full] .guide-layout:not(.event-guide) .guide-panel-col{flex:1 1 auto;min-height:0}
}
/* gear > Page layout */
html body #community-app .page-layout-setting{display:grid;gap:6px;margin-top:12px;padding-top:12px;border-top:1px solid #ffffff14}
html body #community-app .page-layout-setting label{display:grid;gap:6px}
/* Subfolders shown as static cards above the threads (instead of the scrolling strip) */
html body #community-app#community-app .location-strip.location-static .location-side-items{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))!important;gap:10px!important;overflow:visible!important;transform:none!important;-webkit-mask-image:none!important;mask-image:none!important}
html body #community-app#community-app .location-strip.location-static .location-side-card{flex:none!important;width:auto!important}
html body #community-app#community-app .location-strip.location-static .location-strip-arrow{display:none!important}
/* Plotter requests (staff window) */
html body #community-app .plr-list{list-style:none;margin:0;padding:0;display:grid;gap:10px;min-width:min(560px,80vw)}
html body #community-app .plr-list>li{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px;border:1px solid #ffffff1a;border-radius:10px;background:#ffffff06}
html body #community-app .plr-av{width:44px;height:44px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#1a2129;color:#dfe5ea;font-weight:800}
html body #community-app .plr-av img{width:100%;height:100%;object-fit:cover}
html body #community-app .plr-who{display:grid;gap:3px;min-width:0}
html body #community-app .plr-who small{color:#8d97a1;font-size:12px}
html body #community-app .plr-note{font-size:13.5px;color:#cfd6de;line-height:1.45;overflow-wrap:anywhere}
html body #community-app .plr-acts{display:flex;gap:8px}
html body #community-app .plr-deny{grid-column:1/-1;display:flex;gap:8px}
html body #community-app .plr-deny input{flex:1 1 auto}
html body #community-app .plr-request.is-pending{opacity:.8}
@media (max-width:640px){html body #community-app .plr-list>li{grid-template-columns:44px minmax(0,1fr)}html body #community-app .plr-acts{grid-column:1/-1}}
/* while a compose window is open (not tucked away), the floating phone menu and music button step aside */
html body #community-app.hz-dw :is(.phone-fab,.dm-orb,#dev-control-toggle){opacity:0!important;pointer-events:none!important}
/* Bar icon buttons (search, copy link, bookmark): one round style, side by side at the end of the bar */
html body #community-app#community-app .trail-tools{gap:6px!important}
html body #community-app#community-app .trail-tools>:is(button,.corner-search:not(.is-open)){display:inline-grid!important;place-items:center!important;width:30px!important;height:30px!important;min-width:30px!important;min-height:0!important;padding:0!important;margin:0!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.15)!important;background:#161c22!important;color:#edf1f7!important;box-sizing:border-box!important;line-height:0!important;flex:none!important}
html body #community-app#community-app .trail-tools>button>svg{display:block;margin:0!important;width:15px!important;height:15px!important}
html body #community-app#community-app .trail-tools>:is(button,.corner-search):hover{border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)!important;background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 12%,#161c22)!important}
html body #community-app#community-app .trail-tools>.corner-search .corner-search-btn{width:100%!important;height:100%!important;border-radius:999px!important}
html body #community-app#community-app .trail-tools>.corner-search.is-open{height:30px!important;border-radius:999px!important;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)!important;background:#161c22!important;display:flex!important;align-items:center!important;margin:0!important}
html body #community-app#community-app .trail-tools>.corner-search.is-open .corner-search-btn{width:30px!important;height:30px!important;flex:none}
html body #community-app#community-app#community-app .trail-tools>button{padding:0!important;width:30px!important;min-width:30px!important}
html body #community-app#community-app#community-app .trail-tools>.corner-search:not(.is-open){position:relative}
html body #community-app#community-app#community-app .trail-tools>.corner-search:not(.is-open) input{position:absolute!important;inset:0!important;width:0!important;opacity:0!important;pointer-events:none!important}
html body #community-app#community-app#community-app .trail-tools>.corner-search:not(.is-open) .corner-search-btn{width:28px!important;height:28px!important;display:grid!important;place-items:center!important;padding:0!important;margin:0!important;background:none!important}
html body #community-app#community-app#community-app .trail-tools>.corner-search .corner-search-btn svg{width:15px!important;height:15px!important}
html body #community-app#community-app#community-app .trail-tools>button{border-radius:999px!important;height:30px!important}
html body #community-app#community-app#community-app .trail-tools>.dn-search:not(.is-open){display:inline-grid!important;place-items:center!important;width:30px!important;height:30px!important;padding:0!important;margin:0!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.15)!important;background:#161c22!important;position:relative}
html body #community-app#community-app#community-app .trail-tools>.dn-search:not(.is-open) input{position:absolute!important;inset:0!important;width:0!important;opacity:0!important;pointer-events:none!important}
html body #community-app#community-app#community-app .trail-tools>.dn-search:not(.is-open) .dn-search-btn{width:28px!important;height:28px!important;display:grid!important;place-items:center!important;padding:0!important;margin:0!important;background:none!important}
/* Member Area: room for a hovered card to lift and glow without its top edge being clipped */
html body #community-app#community-app .ooc-member-list{padding:8px 8px 14px!important;box-sizing:border-box!important}
html body #community-app#community-app .ma-card.mc{transition:transform .18s ease,box-shadow .2s ease,border-color .2s ease!important}
html body #community-app#community-app .ma-card.mc:is(:hover,:focus-within){border-color:color-mix(in srgb,var(--role-color,var(--color-accent-default,#ffc45b)) 75%,#fff 0%)!important;box-shadow:0 14px 30px rgb(0 0 0 / .55),0 0 0 1px color-mix(in srgb,var(--role-color,var(--color-accent-default,#ffc45b)) 45%,transparent),0 0 22px color-mix(in srgb,var(--role-color,var(--color-accent-default,#ffc45b)) 32%,transparent)!important}
/* Main Index Updates: the text scrolls inside the box when there's more than fits */
html body #community-app#community-app .ix-updates{display:flex!important;flex-direction:column!important;min-height:0!important}
html body #community-app#community-app .ix-updates>.ixu-bar{flex:none!important}
html body #community-app#community-app .ix-updates>.ixu-main{flex:1 1 auto!important;min-height:0!important;display:flex!important;flex-direction:column!important}
html body #community-app#community-app .ix-updates .ix-updates-body{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;padding-right:6px!important;overscroll-behavior:contain}
html body #community-app#community-app .ix-updates .ixu-when{flex:none!important}
/* Main Index when the rows had to be re-spread: evenly sized rows, no stepped offsets */
html body #community-app #app-view .ix-tiles.is-flowing>.ix-row{margin-left:0!important}
/* Main Index rows (tablet and up): always one line per row; the script re-spreads tiles when a row won't fit */
@media (min-width:641px){
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles>.ix-row{display:flex!important;flex-wrap:nowrap!important;grid-template-columns:none!important}
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles .ix-row>:is(.basic-forum-entry,.index-page-entry):not(.ix-abroad-main):not(.ix-abroad-card){width:218px!important;min-width:218px!important;flex:none!important}
}
@media (min-width:641px) and (max-width:1000px){
 html body #community-app#community-app #app-view#app-view>.forum-main-index>.ix-tiles.ix-tiles{margin-left:16px!important;margin-right:16px!important}
}
/* the Updates text box never grows past this; longer notes scroll inside it */
html body #community-app#community-app .ix-updates .ix-updates-body{max-height:220px!important}

/* ===================== Wanted Ads (filter sidebar + ad cards) ===================== */
html body #community-app#community-app .wanted-v2{padding:0!important}
html body #community-app#community-app .wa-directory{min-height:0}
html body #community-app#community-app .wa-cats .wanted-tab{display:inline-flex!important;align-items:center;gap:7px;text-decoration:none!important}
html body #community-app#community-app .wa-cats .wanted-tab b{font:800 10.5px/1 Consolas,monospace;padding:2px 6px;border-radius:99px;background:#ffffff14;color:#cfd6de}
html body #community-app#community-app .wa-cats .wanted-tab[aria-pressed=true] b{background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 30%,transparent);color:#fff}
html body #community-app#community-app .wa-results{min-width:0;display:flex;flex-direction:column;gap:16px;overflow:auto;padding:2px 6px 16px 2px}
html body #community-app#community-app .wa-strip{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:16px;min-height:64px;padding:12px 18px;border-radius:12px;border:1px solid #ffffff14;overflow:hidden;background:linear-gradient(90deg,#0c1116 38%,rgb(12 17 22 / .55)),var(--folder-art) right center/auto 140% no-repeat,#0c1116}
html body #community-app#community-app .wa-strip-text{display:grid;gap:4px;min-width:0}
html body #community-app#community-app .wa-strip-text strong{font:700 20px/1.1 var(--font-control-title,'Segoe UI'),sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#f3efe6}
html body #community-app#community-app .wa-strip-text em{font-style:normal;font-size:13px;color:#9aa4ae}
html body #community-app#community-app .wa-strip-count{flex:none;font:800 11px/1 Consolas,monospace;letter-spacing:.14em;text-transform:uppercase;color:#9aa4ae}
/* up to three cards per row, depending on the width available */
html body #community-app#community-app .wa-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(max(260px,calc((100% - 28px) / 3)),1fr))}
html body #community-app#community-app .wa-card{position:relative;display:flex;flex-direction:column;gap:10px;min-width:0;padding:14px 16px 12px 18px;border-radius:12px;border:1px solid #ffffff17;background:linear-gradient(180deg,color-mix(in srgb,var(--wa-c) 7%,#0e1318),#0b1014);color:#e9edf1!important;text-decoration:none!important;transition:transform .18s ease,box-shadow .2s ease,border-color .2s ease}
html body #community-app#community-app .wa-card::before{content:'';position:absolute;left:0;top:12px;bottom:12px;width:3px;border-radius:0 3px 3px 0;background:var(--wa-c)}
html body #community-app#community-app .wa-card:is(:hover,:focus-visible){transform:translateY(-2px);border-color:color-mix(in srgb,var(--wa-c) 55%,transparent);box-shadow:0 14px 30px rgb(0 0 0 / .5),0 0 18px color-mix(in srgb,var(--wa-c) 25%,transparent)}
html body #community-app#community-app .wa-card.is-filled{opacity:.62}
html body #community-app#community-app .wa-card.is-filled:hover{opacity:.9}
html body #community-app#community-app .wa-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
html body #community-app#community-app .wa-cat{font:800 10.5px/1 Consolas,monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .wa-open{font:700 11px/1 var(--font-control-ui,'Segoe UI'),sans-serif;padding:4px 8px;border-radius:99px;background:rgb(48 200 90 / .14);border:1px solid rgb(48 200 90 / .45);color:#8ff0ad}
html body #community-app#community-app .wa-open.is-none{background:#ffffff0d;border-color:#ffffff26;color:#9aa4ae}
html body #community-app#community-app .wa-title{font:700 18px/1.2 var(--font-control-title,'Segoe UI'),sans-serif;letter-spacing:.02em;color:#f6f2ea;overflow-wrap:anywhere}
html body #community-app#community-app .wa-intro{font-size:13.5px;line-height:1.5;color:#b9c2cb;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
html body #community-app#community-app .wa-roles{display:flex;flex-wrap:wrap;gap:6px}
html body #community-app#community-app .wa-role{font:700 11.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;padding:5px 9px;border-radius:7px;border:1px solid #ffffff22;background:#ffffff08;color:#dfe5ea}
html body #community-app#community-app .wa-role.is-open{border-color:rgb(48 200 90 / .5);color:#a6f3bf}
html body #community-app#community-app .wa-role.is-reserved{border-color:rgb(255 189 68 / .5);color:#ffd894}
html body #community-app#community-app .wa-role.is-taken{color:#7d8790;text-decoration:line-through;text-decoration-color:#ffffff40}
html body #community-app#community-app .wa-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:10px;border-top:1px solid #ffffff10;font-size:12px;color:#9aa4ae}
html body #community-app#community-app .wa-by{display:inline-flex;align-items:center;gap:8px;min-width:0;color:#dfe5ea;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app#community-app .wa-av{flex:none;width:24px;height:24px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#1a2129;border:1.5px solid var(--wa-c);font-size:11px}
html body #community-app#community-app .wa-av img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
html body #community-app#community-app .wa-meta{flex:none}
html body #community-app#community-app .wa-empty{display:grid;justify-items:center;gap:8px;padding:40px 20px;border:1px dashed #ffffff22;border-radius:12px;text-align:center;color:#9aa4ae}
html body #community-app#community-app .wa-empty strong{font-size:17px;color:#e9edf1}
/* inside an ad: compact role rows */
html body #community-app#community-app .bb-wanted-role{display:grid!important;grid-template-columns:72px minmax(0,1fr)!important;gap:14px!important;align-items:start!important;padding:12px!important;min-height:0!important}
html body #community-app#community-app .bb-wanted-role.is-flip{grid-template-columns:72px minmax(0,1fr)!important}
html body #community-app#community-app .bb-wanted-role.is-flip>.bb-wanted-pic{order:0!important}
html body #community-app#community-app .bb-wanted-role.is-flip .bb-wanted-text{text-align:left!important}
html body #community-app#community-app .bb-wanted-role.is-flip .bb-wanted-text h4{justify-content:flex-start!important}
html body #community-app#community-app .bb-wanted-pic{width:72px!important;height:96px!important;margin:0!important;border-radius:8px!important;overflow:hidden;display:grid;place-items:center}
html body #community-app#community-app .bb-wanted-pic img{width:100%;height:100%;object-fit:cover}
html body #community-app#community-app .bb-wanted-role.is-taken{opacity:.7}
html body #community-app#community-app .bb-wanted-apply{margin-top:10px;padding:7px 14px!important;border-radius:8px!important;font:700 12.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;border:1px solid rgb(48 200 90 / .55)!important;background:rgb(48 200 90 / .12)!important;color:#a6f3bf!important;cursor:pointer}
html body #community-app#community-app .bb-wanted-apply:hover{background:rgb(48 200 90 / .22)!important;color:#fff!important}
@media (max-width:640px){html body #community-app#community-app .wa-grid{grid-template-columns:minmax(0,1fr)}html body #community-app#community-app .wa-strip{min-height:52px}}
/* Wanted Ads tabs: one row across the top, one selected at a time */
html body #community-app#community-app .wanted-v2{display:flex!important;flex-direction:column!important;gap:14px!important;padding:16px 18px 18px!important}
html body #community-app#community-app .wa-tabs{display:flex;flex-wrap:wrap;gap:8px;padding:0 0 12px;border-bottom:1px solid #ffffff14}
html body #community-app#community-app .wa-tab{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid #ffffff22;background:#0d1217;color:#cfd6de!important;text-decoration:none!important;font:700 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.06em;text-transform:uppercase;transition:border-color .15s ease,color .15s ease,background .15s ease}
html body #community-app#community-app .wa-tab b{font:800 10.5px/1 Consolas,monospace;padding:2px 6px;border-radius:99px;background:#ffffff14;color:#cfd6de}
html body #community-app#community-app .wa-tab:hover{border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent);color:#fff!important}
html body #community-app#community-app .wa-tab.is-active{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b)!important;background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 10%,#0d1217)}
html body #community-app#community-app .wa-tab.is-active b{background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 30%,transparent);color:#fff}
html body #community-app#community-app .wanted-v2 .wa-results{overflow:visible;padding:0}
html body #community-app#community-app .wa-pick{display:grid;gap:8px}
html body #community-app#community-app .wa-pick-item{display:flex!important;flex-direction:row!important;align-items:center;gap:12px;padding:10px 12px;border:1px solid #ffffff1a;border-radius:10px;cursor:pointer;text-transform:none!important;letter-spacing:0!important}
html body #community-app#community-app .wa-pick-item span{display:grid;gap:2px}
html body #community-app#community-app .wa-pick-item em{font-style:normal;font-size:12.5px;color:#9aa4ae}
html body #community-app#community-app .wa-pick-item:has(input:checked){border-color:var(--color-accent-default,#ffc45b)}
/* every text button in a page's bar uses the same type as "＋ New character" */
html body #community-app#community-app :is(.box-bar,.dispatch-navigation,.th-bar) :is(.box-bar-tools,.dispatch-actions)>:is(button,a):not(.trail-link):not(.page-bookmark):not(.app-back-control),html body #community-app#community-app #page-corner-actions>:is(button,a){font-family:Overpass,"Segoe UI",sans-serif!important;font-weight:700!important;font-size:12.5px!important;letter-spacing:.5px!important}
/* Wanted Ads: the bar keeps the standard edge-to-edge position; only the content below it is padded */
html body #community-app#community-app .wanted-v2{padding:0!important;gap:0!important}
html body #community-app#community-app .wanted-v2>.wa-tabs{margin:16px 20px 0;padding:0 0 14px}
html body #community-app#community-app .wanted-v2>.wa-results.wa-results{margin:16px 20px 20px!important;padding:0!important}
/* Guidebook on wide screens: the reading panel is the same width as offset-left pages; the tabs sit outside it,
   pinned to the right edge */
@media (min-width:1200px){
 html body #community-app#community-app[data-scene=guidebook][data-page-type=tabbed-offset-right] .guide-layout:not(.event-guide) .guide-body{grid-template-columns:minmax(0,min(1500px,88%,calc(100% - 236px - 24px))) minmax(0,1fr)!important}
 html body #community-app#community-app[data-scene=guidebook][data-page-type=tabbed-offset-right] .guide-layout:not(.event-guide) .guide-side{justify-self:start!important;width:236px!important}
}
/* signed-out Main Index: the "Sign in with Discord" banner sits as close to the tiles as it does to Updates */
html body #community-app#community-app #app-view .forum-main-index>.index-hero:has(>.ix-rules-banner){padding-bottom:0!important}
html body #community-app#community-app #app-view#app-view .forum-main-index>.index-hero:has(>.ix-rules-banner)~.ix-tiles.ix-tiles{margin-top:0!important}
@media (max-width:1100px){html body #community-app#community-app .index-hero>.ix-rules-banner{margin-top:2px!important}}
/* Faction page: settings cog + edit pencil live beside the link button; the pencil turns on inline editing. */
html body #community-app#community-app#community-app .trail-tools>.fx-tool-edit[aria-pressed="true"]{color:var(--color-accent-default,#ffc45b)!important;border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 70%,transparent)!important;background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 16%,#161c22)!important}
html body #community-app#community-app .fx-edit-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:14px 0 0;padding:10px 14px;border-radius:10px;border:1px solid color-mix(in srgb,var(--faction-color,#ffc45b) 55%,transparent);background:color-mix(in srgb,var(--faction-color,#ffc45b) 10%,#0b0f14);font-size:13px;color:#d6dde6}
html body #community-app#community-app .fx-edit-bar b{color:#fff}
html body #community-app#community-app .fx-edit-actions{display:flex;gap:8px;margin-left:auto}
html body #community-app#community-app .fx-edit-actions>button{font-family:Overpass,"Segoe UI",sans-serif!important;font-weight:700!important;font-size:12.5px!important;letter-spacing:.5px!important;padding:7px 14px!important;border-radius:var(--btn-radius,8px)!important;border:1px solid #ffffff26!important;background:#161c22!important;color:#edf1f7!important;cursor:pointer}
html body #community-app#community-app .fx-edit-actions>#fx-edit-save{background:var(--faction-color,#ffc45b)!important;border-color:transparent!important;color:var(--badge-ink,#10141a)!important}
html body #community-app#community-app .fx-detail-title{flex:1 1 auto;min-width:0}
html body #community-app#community-app :is(.fx-inline-name,.fx-inline-summary){display:block;width:100%;box-sizing:border-box;margin:4px 0 0;padding:6px 10px;border-radius:8px;border:1px dashed color-mix(in srgb,var(--faction-color,#ffc45b) 60%,transparent);background:#0b0f14b3;color:#fff;font:inherit}
html body #community-app#community-app .fx-inline-name{font-size:26px;font-weight:700;line-height:1.2}
html body #community-app#community-app .fx-inline-summary{font-size:14px;resize:vertical;min-height:44px}
html body #community-app#community-app .fx-inline-desc .forum-rich{min-height:180px;max-height:none}
/* ---- Main Index panels (staff-made boxes in the open space between header and cards) ---- */
html body #community-app #app-view>.forum-main-index{position:relative}
html body #community-app#community-app .forum-main-index>.ix-panels{position:absolute;z-index:4;pointer-events:none;margin:0}
html body #community-app#community-app .ix-panels>.ix-panel{position:absolute;pointer-events:auto;display:flex;flex-direction:column;box-sizing:border-box;min-width:0;min-height:0;overflow:hidden;border:1px solid #ffffff1f;border-radius:10px;background:#06090dd9;backdrop-filter:blur(8px);box-shadow:0 16px 36px #000a;margin:0;padding:0}
html body #community-app#community-app .ix-panels>.ix-panel.is-draft{opacity:.62;border-style:dashed}
html body #community-app#community-app .ix-panel .ixp-bar{flex:none;display:flex;align-items:stretch;min-height:36px;border-bottom:2px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,transparent);user-select:none}
html body #community-app#community-app .ix-panels.is-staff:not(.is-stacked) .ix-panel .ixp-bar{cursor:grab}
html body #community-app#community-app .ix-panel.is-moving{box-shadow:0 0 0 2px var(--color-accent-default,#ffc45b),0 20px 44px #000c;transition:none}
html body #community-app#community-app .ix-panel.is-moving .ixp-bar{cursor:grabbing}
html body #community-app#community-app .ix-panel .ixu-tag{flex:none;display:flex;align-items:center;padding:0 22px 0 13px;background:var(--color-accent-default,#ffc45b);color:#0b0d10;font:800 11.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.24em;text-transform:uppercase;clip-path:polygon(0 0,100% 0,calc(100% - 10px) 100%,0 100%)}
html body #community-app#community-app .ix-panel .ixu-headline{flex:1;min-width:0;display:flex;align-items:center;margin:0;padding:0 10px;font:800 14px/1 var(--font-control-title,var(--font-heading,'Segoe UI')),sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app#community-app .ix-panel .ix-updates-edit{align-self:center;margin:0 8px 0 0!important;flex:none}
html body #community-app#community-app .ixp-live{align-self:center;margin-left:10px;padding:3px 7px 3px 18px;border-radius:4px;background:#d8232a;color:#fff;font:800 10.5px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.16em;position:relative}
html body #community-app#community-app .ixp-live::before{content:"";position:absolute;left:7px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:#fff;animation:ixpBlink 1.2s steps(2,start) infinite}
@keyframes ixpBlink{to{visibility:hidden}}
html body #community-app#community-app .ixp-draft-tag{align-self:center;margin-right:8px;font:700 10px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#9aa4b1}
html body #community-app#community-app .ix-panel .ixp-main{flex:1 1 auto;min-height:0;display:flex;gap:12px;padding:10px 12px}
html body #community-app#community-app .ix-panel.media-top .ixp-main{flex-direction:column}
html body #community-app#community-app .ix-panel .ixp-media{flex:0 0 var(--ixp-mw,40%);min-width:0;border-radius:6px;overflow:hidden;background:#000;position:relative}
html body #community-app#community-app .ix-panel.media-top .ixp-media{flex:0 0 auto;max-height:55%;aspect-ratio:16/9;align-self:stretch}
html body #community-app#community-app .ix-panel .ixp-media>:is(video,img){position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
html body #community-app#community-app .ixp-nosignal{position:absolute;inset:0;display:flex}
html body #community-app#community-app .ixp-nosignal>i{flex:1;opacity:.75}
html body #community-app#community-app .ixp-nosignal>i:nth-child(1){background:#c0c0c0}html body #community-app#community-app .ixp-nosignal>i:nth-child(2){background:#c0c000}html body #community-app#community-app .ixp-nosignal>i:nth-child(3){background:#00c0c0}html body #community-app#community-app .ixp-nosignal>i:nth-child(4){background:#00c000}html body #community-app#community-app .ixp-nosignal>i:nth-child(5){background:#c000c0}html body #community-app#community-app .ixp-nosignal>i:nth-child(6){background:#c00000}html body #community-app#community-app .ixp-nosignal>i:nth-child(7){background:#0000c0}
html body #community-app#community-app .ixp-nosignal>b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:5px 10px;background:#000c;color:#fff;font:800 12px/1 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.2em;white-space:nowrap}
html body #community-app#community-app .ix-panel :is(.ixp-static,.ixp-scroll){flex:1 1 auto;min-width:0;min-height:0}
html body #community-app#community-app .ix-panel .ixp-static{overflow-y:auto;overflow-x:hidden;padding-right:6px;overscroll-behavior:contain}
html body #community-app#community-app .ix-panel .ixp-copy,html body #community-app#community-app .ix-panel .ixp-copy *{font-size:14px;line-height:1.5}
html body #community-app#community-app .ix-panel .ixp-copy>:first-child{margin-top:0}
html body #community-app#community-app .ix-panel .ixp-scroll{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(180deg,transparent,#000 14%,#000 86%,transparent)}
html body #community-app#community-app .ix-panel .ixp-scroll.is-up .ixp-roll{animation:ixpUp var(--ixp-dur,20s) linear infinite}
html body #community-app#community-app .ix-panel .ixp-scroll.is-up .ixp-copy{padding-bottom:28px}
html body #community-app#community-app .ix-panel .ixp-scroll.is-left{display:flex;align-items:center;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
html body #community-app#community-app .ix-panel .ixp-scroll.is-left .ixp-roll{display:flex;width:max-content;animation:ixpLeft var(--ixp-dur,20s) linear infinite}
html body #community-app#community-app .ix-panel .ixp-scroll.is-left .ixp-copy{display:flex;align-items:center;gap:2.5em;white-space:nowrap;padding-right:2.5em}
html body #community-app#community-app .ix-panel .ixp-scroll.is-left .ixp-copy>*{margin:0}
html body #community-app#community-app .ix-panel .ixp-scroll:hover .ixp-roll{animation-play-state:paused}
@keyframes ixpUp{to{transform:translateY(-50%)}}
@keyframes ixpLeft{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){html body #community-app#community-app .ix-panel .ixp-roll{animation:none!important}html body #community-app#community-app .ix-panel .ixp-scroll{overflow-y:auto;-webkit-mask-image:none;mask-image:none}html body #community-app#community-app .ix-panel .ixp-roll>.ixp-copy+.ixp-copy{display:none}}
html body #community-app#community-app .ix-panel .ixp-resize{position:absolute;right:0;bottom:0;width:16px;height:16px;cursor:nwse-resize;background:linear-gradient(135deg,transparent 50%,color-mix(in srgb,var(--color-accent-default,#ffc45b) 70%,transparent) 50%,color-mix(in srgb,var(--color-accent-default,#ffc45b) 70%,transparent) 60%,transparent 60%,transparent 72%,color-mix(in srgb,var(--color-accent-default,#ffc45b) 70%,transparent) 72%,color-mix(in srgb,var(--color-accent-default,#ffc45b) 70%,transparent) 82%,transparent 82%);opacity:.7}
html body #community-app#community-app .ix-panels .ixp-add{position:absolute;left:0;bottom:0;pointer-events:auto;padding:6px 12px!important;border-radius:999px!important;border:1px dashed color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent)!important;background:#06090dcc!important;color:#cfd6df!important;font:700 12px/1 Overpass,"Segoe UI",sans-serif!important;letter-spacing:.5px;cursor:pointer;opacity:.55;transition:opacity .15s}
html body #community-app#community-app .ix-panels .ixp-add:hover{opacity:1;color:#fff!important}
/* small screens / no room: panels marked "show on small screens" stack between the header and the cards */
html body #community-app#community-app .forum-main-index>.ix-panels.is-stacked{position:static;pointer-events:auto;display:grid;gap:14px;margin:16px var(--page-gap,20px) 6px!important}
html body #community-app#community-app .ix-panels.is-stacked>.ix-panel{position:relative;left:auto!important;top:auto!important;width:auto!important;height:auto!important;max-height:320px}
html body #community-app#community-app .ix-panels.is-stacked>.ix-panel:not(.is-narrow-ok),html body #community-app#community-app .ix-panels.is-stacked>.ixp-add,html body #community-app#community-app .ix-panels.is-stacked .ixp-resize{display:none}
html body #community-app#community-app .ix-panels.is-stacked>.ix-panel .ixp-main{min-height:150px}
html body #community-app#community-app .ix-panels.is-stacked:not(:has(>.is-narrow-ok)){display:none}
@media(max-width:640px){html body #community-app#community-app .ix-panels.is-stacked>.ix-panel .ixp-main{flex-direction:column}html body #community-app#community-app .ix-panels.is-stacked>.ix-panel .ixp-media{flex:none;aspect-ratio:16/9}}
/* panel editor */
#app-dialog .ixp-presets{display:flex;align-items:center;gap:8px;margin:0 0 14px}
#app-dialog .ixp-presets>span{font-size:12px;color:#9aa4b1;margin-right:4px}
#app-dialog .ixp-presets>button{padding:6px 12px;border-radius:999px;border:1px solid #ffffff26;background:#161c22;color:#edf1f7;cursor:pointer}
#app-dialog .ixp-presets>button.is-on{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b)}
#app-dialog .ixp-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){#app-dialog .ixp-form-row{grid-template-columns:1fr}}
#app-dialog .ixp-checks{display:flex;flex-wrap:wrap;gap:8px 18px;margin:8px 0}
#app-dialog .ixp-checks>label{display:inline-flex;align-items:center;gap:6px;margin:0}
#app-dialog .ixp-media-set{margin:10px 0;border:1px solid #ffffff1a;border-radius:8px;padding:8px 12px 10px}
html body #community-app#community-app .ix-panel .ixp-copy{font-family:Overpass,"Segoe UI",sans-serif!important;color:#e9edf2}
html body #community-app#community-app .ix-panel .ixp-scroll.is-left .ixp-sep{color:var(--color-accent-default,#ffc45b);font-size:10px!important;margin:0 1.4em}
html body #community-app#community-app .ix-panel .ixp-scroll.is-left .ixp-copy>p{display:inline}
/* The World pane follows the sidebar's real width (it grows when The World is unfolded), like every other page box. */
@media (min-width:641px){
 html body #community-app#community-app .world-overview>.world-overview-box{left:calc(var(--navigation-gutter,204px) + 22px)!important;max-width:calc(100vw - var(--navigation-gutter,204px) - 56px)!important}
}
/* World tree: children sit 8px inside the guide line, so a highlighted child's border never lands on the line */
html body #community-app:not(.sidebar-collapsed) #sidebar-links .sidebar-world:not(.is-folded)>:is(.sidebar-region,.sidebar-sublist){margin-left:28px!important;width:calc(100% - 28px)!important}
/* ==== Post controls (JCink-style): B I U S group, Alignment / Lists dropdowns, LINK, DOHTML, HR, B-BOX, NB-BOX ==== */
#community-app .rich-toolbar .rich-letter-btn[data-cmd=strikeThrough]{text-decoration:line-through!important}
#community-app .rich-toolbar .rich-dd{position:relative;display:inline-flex}
#community-app .rich-toolbar .rich-dd-btn.is-active{border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)!important;color:var(--color-accent-default,#ffc45b)!important}
#community-app .rich-toolbar .rich-dd-btn[aria-expanded=true]{border-color:var(--color-accent-default,#ffc45b)!important;color:var(--color-accent-default,#ffc45b)!important}
#community-app .rich-dd-menu{position:fixed;inset:auto;margin:0;padding:6px;min-width:180px;display:grid;gap:2px;border-radius:10px;background:#0d1217fa;border:1px solid #ffffff26;box-shadow:0 18px 40px #000d}
#community-app .rich-dd-menu:not(:popover-open){display:none}
#community-app .rich-dd-menu.rich-dd-grid{grid-template-columns:repeat(2,minmax(150px,1fr));min-width:330px}
#community-app .rich-toolbar .rich-dd-menu .rich-dd-item{justify-content:flex-start!important;gap:10px!important;width:100%;height:34px!important;padding:0 10px!important;border:1px solid transparent!important;background:transparent!important;color:#e6e1d6!important;font:600 13px/1 var(--font-control-ui,'Segoe UI'),sans-serif!important;text-align:left}
#community-app .rich-toolbar .rich-dd-menu .rich-dd-item:hover{background:#ffffff0f!important;border-color:#ffffff1f!important;color:#fff!important}
#community-app .rich-toolbar .rich-dd-menu .rich-dd-item.is-on{color:var(--color-accent-default,#ffc45b)!important;background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 12%,transparent)!important}
#community-app .rich-toolbar .rich-dd-menu .rich-dd-wide{grid-column:1/-1;border-top:1px solid #ffffff14!important;border-radius:0 0 7px 7px!important;margin-top:2px}
#community-app .rich-dd-menu .rich-list-mark{display:inline-grid;place-items:center;width:22px;font:800 14px/1 Georgia,serif;color:var(--color-accent-default,#ffc45b)}
#community-app .rich-toolbar .rich-insert-row{display:inline-flex;gap:0}
#community-app .rich-toolbar .rich-insert-row>button{border-radius:0!important;margin-left:-1px!important;letter-spacing:.06em}
#community-app .rich-toolbar .rich-insert-row>button:first-child{border-radius:7px 0 0 7px!important;margin-left:0!important}
#community-app .rich-toolbar .rich-insert-row>button:last-child{border-radius:0 7px 7px 0!important}
#community-app .rich-toolbar .rich-text-btn.is-mono{font-family:Consolas,monospace!important}
#community-app .rich-toolbar .composer-template-picker.in-toolbar{position:relative;margin:0!important}
#community-app .rich-toolbar .composer-template-picker.in-toolbar>.composer-template-menu{z-index:60}
/* list styles (stored as classes so they survive the sanitizer) */
#community-app :is(.forum-rich,.handbook-prose) ul.rich-list-circle{list-style-type:circle}
#community-app :is(.forum-rich,.handbook-prose) ul.rich-list-square{list-style-type:square}
#community-app :is(.forum-rich,.handbook-prose) ul.rich-list-arrow{list-style-type:"➔  "}
#community-app :is(.forum-rich,.handbook-prose) ul.rich-list-dash{list-style-type:"–  "}
#community-app :is(.forum-rich,.handbook-prose) ul.rich-list-check{list-style-type:"✓  "}
#community-app :is(.forum-rich,.handbook-prose) ul.rich-list-star{list-style-type:"★  "}
#community-app :is(.forum-rich,.handbook-prose) ul:is(.rich-list-arrow,.rich-list-dash,.rich-list-check,.rich-list-star)>li::marker{color:var(--color-accent-default,#ffc45b)}
#community-app :is(.forum-rich,.handbook-prose) ol.rich-list-upper-alpha{list-style-type:upper-alpha}
#community-app :is(.forum-rich,.handbook-prose) ol.rich-list-lower-alpha{list-style-type:lower-alpha}
#community-app :is(.forum-rich,.handbook-prose) ol.rich-list-upper-roman{list-style-type:upper-roman}
#community-app :is(.forum-rich,.handbook-prose) ol.rich-list-lower-roman{list-style-type:lower-roman}
/* B-BOX / NB-BOX: Guardians of Light's two post boxes, in this site's dark palette.
   B-box: centred, 5px accent frame, roomy padding. NB-box: centred, hairline edge, smaller text. */
#community-app :is(.forum-rich,.handbook-prose,.welcome-widget-copy) .rich-box.rich-box-bbox{max-width:360px;margin:12px auto;padding:30px;box-sizing:border-box;text-align:justify;background:#0b1015e6;border:0;box-shadow:0 0 0 5px var(--character-color,var(--color-accent-default,#ffc45b))}
#community-app :is(.forum-rich,.handbook-prose,.welcome-widget-copy) .rich-box.rich-box-nbbox{max-width:375px;margin:12px auto;padding:25px;box-sizing:border-box;text-align:justify;background:#0b1015e6;border:0;box-shadow:0 0 0 1px #ffffff26;font-size:.86em;line-height:1.6}
#community-app :is(.forum-rich,.handbook-prose) .rich-box:is(.rich-box-bbox,.rich-box-nbbox)>:first-child{margin-top:0}
#community-app :is(.forum-rich,.handbook-prose) .rich-box:is(.rich-box-bbox,.rich-box-nbbox)>:last-child{margin-bottom:0}
#community-app [contenteditable=true] .rich-box-nbbox{outline:1px dashed #8a897c;outline-offset:2px;min-height:32px}
/* thread header: "In this thread" faces sit left of the watch (eye) button */
#community-app#community-app .thread-heading-actions>.th-cast{display:inline-flex;align-items:center;gap:10px;margin:0 6px 0 0;padding:0}
#community-app#community-app .thread-heading-actions{align-items:center}
/* reply buttons on the right of the thread box */
#community-app#community-app .reply-bar{justify-content:flex-end!important}
/* Add Reply page: same frame as a thread (heading + body in the location's box) */
#community-app#community-app .reply-view-heading .reply-to{margin:6px 0 0;color:#a9b3bd;font-size:14px}
#community-app#community-app .reply-view-heading .reply-to a{color:var(--color-accent-default,#ffc45b);font-weight:700}
#community-app#community-app .reply-view-heading .th-status.is-reply{color:var(--color-accent-default,#ffc45b);border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 50%,transparent)}
#community-app#community-app .reply-page .reply-review{margin-top:22px}
/* ---- Drafts: countdown, manual save, delete; New Thread chooser ---- */
#community-app .draft-status.is-counting{color:#9fb0c0}
#community-app .draft-status.is-blocked{color:#ff6b6b!important;font-weight:700}
#community-app#community-app .tc-actions{display:flex;align-items:center;gap:8px}
#community-app#community-app .tc-actions>.tc-draft-status{margin-right:auto;font-size:12.5px;color:#9aa4b1}
#community-app#community-app .tc-actions>.tc-draft-delete{display:inline-grid;place-items:center;width:34px;padding:0!important;color:#e8a0a0}
#community-app#community-app .tc-actions>.tc-draft-delete:hover{color:#ff6b6b;border-color:#ff6b6b}
#community-app#community-app .tc-actions>.tc-draft-delete[hidden]{display:none}
#community-app .reply-page-actions .reply-save-draft{background:#161c22;border:1px solid #ffffff2e;color:#e6e1d6;cursor:pointer}
#community-app .reply-page-actions .reply-save-draft:hover{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b)}
#community-app .nt-choice{position:fixed;inset:auto;margin:0;width:min(340px,calc(100vw - 16px));padding:10px;display:grid;gap:10px;border-radius:12px;background:#0d1217fa;border:1px solid #ffffff26;box-shadow:0 18px 40px #000d;color:#e6e1d6}
#community-app .nt-choice:not(:popover-open){display:none}
#community-app .nt-choice .nt-fresh{display:flex;align-items:center;gap:8px;height:38px;padding:0 12px;border-radius:8px;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent);background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 14%,#161c22);color:#fff;font:700 13px/1 Overpass,'Segoe UI',sans-serif;cursor:pointer}
#community-app .nt-choice .nt-fresh:hover{background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 24%,#161c22)}
#community-app .nt-choice .nt-load{display:grid;gap:6px;padding-top:8px;border-top:1px solid #ffffff14}
#community-app .nt-choice .nt-load-label{font:800 10px/1 'Segoe UI',sans-serif;letter-spacing:1.2px;text-transform:uppercase;color:#9aa3a8}
#community-app .nt-choice .nt-load-row{display:flex;gap:6px}
#community-app .nt-choice select{flex:1;min-width:0;height:34px;padding:0 8px;border-radius:7px;border:1px solid #ffffff2e;background:#0b0f14;color:#f1ece2;font:600 13px/1 'Segoe UI',sans-serif}
#community-app .nt-choice .nt-load-go{height:34px;padding:0 14px;border-radius:7px;border:1px solid #ffffff2e;background:#161c22;color:#e6e1d6;font:700 12.5px/1 'Segoe UI',sans-serif;cursor:pointer}
#community-app .nt-choice .nt-load-go:hover{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b)}
/* thread: watch + manage buttons in the top bar after the link button, same round 30px shape */
html body #community-app#community-app#community-app .trail-tools>details.thread-manage{position:relative;display:inline-flex;margin:0}
html body #community-app#community-app#community-app .trail-tools>details.thread-manage>summary{display:inline-grid!important;place-items:center!important;width:30px!important;height:30px!important;min-width:30px!important;padding:0!important;margin:0!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.15)!important;background:#161c22!important;color:#edf1f7!important;box-sizing:border-box!important;line-height:0!important;list-style:none;cursor:pointer}
html body #community-app#community-app#community-app .trail-tools>details.thread-manage>summary::-webkit-details-marker{display:none}
html body #community-app#community-app#community-app .trail-tools>details.thread-manage>summary::after{display:none!important}
html body #community-app#community-app#community-app .trail-tools>details.thread-manage>summary:hover,html body #community-app#community-app#community-app .trail-tools>details.thread-manage[open]>summary{border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)!important;background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 12%,#161c22)!important}
html body #community-app#community-app#community-app .trail-tools>details.thread-manage>summary svg,html body #community-app#community-app#community-app .trail-tools>#toggle-watch-thread svg{width:15px!important;height:15px!important}
html body #community-app#community-app#community-app .trail-tools>details.thread-manage>.thread-manage-menu{position:absolute!important;right:0!important;left:auto!important;top:calc(100% + 8px)!important;z-index:40}
html body #community-app#community-app#community-app .trail-tools>#toggle-watch-thread[aria-pressed=true]{color:var(--color-accent-default,#ffc45b)!important;border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent)!important}
/* Main Index: admin strip sits under the tagline, left aligned */
html body #community-app#community-app .index-hero .index-hero-copy>.ix-staff{position:static!important;display:inline-flex!important;width:max-content;max-width:100%;justify-self:start!important;align-self:flex-start!important;margin:14px 0 0!important;left:auto!important;right:auto!important;top:auto!important}
html body #community-app#community-app .ixa-tool[data-rumor-add] svg{width:18px;height:18px}
/* panel slots + collapse stack */
html body #community-app#community-app .ix-panels>.ix-panel[hidden],html body #community-app#community-app .ix-panels-stack>.ix-panel[hidden]{display:none!important}
html body #community-app#community-app .ix-panels>.ix-panel .ixp-bar{cursor:default!important}
html body #community-app#community-app .ix-panels>.ixp-slot-guide{position:absolute;box-sizing:border-box;border:1px dashed #ffffff26;border-radius:10px;pointer-events:none;z-index:-1}
html body #community-app#community-app .ix-panels>.ixp-slot-guide>span{position:absolute;right:8px;bottom:6px;font:800 10px/1 Consolas,monospace;letter-spacing:1.4px;text-transform:uppercase;color:#ffffff4d}
html body #community-app#community-app .ix-panels>.ixp-slot-guide[hidden]{display:none}
html body #community-app#community-app .ix-panels.is-collapsed>.ixp-add{display:none}
html body #community-app#community-app .forum-main-index>.ix-panels-stack{display:none}
html body #community-app#community-app .forum-main-index>.ix-panels-stack.has-panels{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:14px;margin:18px 72px 4px;position:relative;z-index:4}
@media (max-width:1100px){html body #community-app#community-app .forum-main-index>.ix-panels-stack.has-panels{margin:16px var(--page-gap,20px) 4px}}
html body #community-app#community-app .ix-panels-stack>.ix-panel{position:relative;display:flex;flex-direction:column;box-sizing:border-box;min-width:0;max-height:320px;overflow:hidden;border:1px solid #ffffff1f;border-radius:10px;background:#06090dd9;backdrop-filter:blur(8px);box-shadow:0 16px 36px #000a;margin:0;padding:0}
html body #community-app#community-app .ix-panels-stack>.ix-panel .ixp-main{min-height:150px}
@media(max-width:640px){html body #community-app#community-app .ix-panels-stack>.ix-panel .ixp-main{flex-direction:column}html body #community-app#community-app .ix-panels-stack>.ix-panel .ixp-media{flex:none;aspect-ratio:16/9}}
html body #community-app#community-app .ix-panels-stack>.ix-panel .ixp-main{min-height:0}
html body #community-app#community-app .ix-panels-stack>.ix-panel.has-media .ixp-main{min-height:150px}
html body #community-app#community-app .ix-panels-stack>.ix-panel{max-height:260px}
html body #community-app#community-app .index-hero-copy>.ix-copy-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px}
html body #community-app#community-app .index-hero-copy>.ix-copy-row>.ix-staff{margin:0!important;position:static!important}
html body #community-app#community-app .ix-copy-row>.ixp-add{position:static;pointer-events:auto;padding:7px 13px!important;border-radius:999px!important;border:1px dashed color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent)!important;background:#06090dcc!important;color:#cfd6df!important;font:700 12px/1 Overpass,"Segoe UI",sans-serif!important;letter-spacing:.5px;cursor:pointer;opacity:.7}
html body #community-app#community-app .ix-copy-row>.ixp-add:hover{opacity:1;color:#fff!important}
/* panel grid outlines: only while a panel is being added or edited */
html body #community-app#community-app .ix-panels>.ixp-cell-guide{position:absolute;box-sizing:border-box;border:1px dashed #ffffff40;border-radius:10px;pointer-events:none;z-index:6;display:none}
html body #community-app#community-app .ix-panels.is-placing>.ixp-cell-guide:not([hidden]){display:block}
html body #community-app#community-app .ix-panels>.ixp-cell-guide>span{position:absolute;left:10px;top:8px;padding:3px 7px;border-radius:5px;background:#000b;font:800 11px/1 Consolas,monospace;letter-spacing:1.4px;color:#ffffffb3}
html body #community-app#community-app .ix-panels>.ixp-cell-guide.is-picked{border:2px solid var(--color-accent-default,#ffc45b);background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 16%,transparent)}
html body #community-app#community-app .ix-panels>.ixp-cell-guide.is-picked>span{color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .ix-panels>.ixp-slot-guide{display:none!important}
/* picker in the editor */
#app-dialog .ixp-place{margin:12px 0;border:1px solid #ffffff1a;border-radius:8px;padding:8px 12px 10px}
#app-dialog .ixp-size{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 10px}
#app-dialog .ixp-size>button,#app-dialog .ixp-map button{height:32px;padding:0 12px;border-radius:7px;border:1px solid #ffffff2e;background:#161c22;color:#e6e1d6;font:700 12.5px/1 'Segoe UI',sans-serif;cursor:pointer}
#app-dialog .ixp-size>button.is-on{border-color:var(--color-accent-default,#ffc45b);color:var(--color-accent-default,#ffc45b);background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 12%,#161c22)}
#app-dialog .ixp-size>button:disabled{opacity:.35;cursor:default}
#app-dialog .ixp-map{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,1.2fr);gap:10px;max-width:520px}
#app-dialog .ixp-map-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,44px);gap:6px;padding:6px;border-radius:8px;background:#0b0f14;border:1px solid #ffffff14}
#app-dialog .ixp-map-grid>button:nth-child(4n+2){margin-right:6px}
#app-dialog .ixp-map-side{display:grid;grid-template-rows:auto 44px;gap:6px;padding:6px;border-radius:8px;background:#0b0f14;border:1px solid #ffffff14}
#app-dialog .ixp-map-upd{display:grid;place-items:center;min-height:30px;border-radius:6px;background:repeating-linear-gradient(45deg,#ffffff10 0 6px,transparent 6px 12px);font:700 10px/1 'Segoe UI',sans-serif;letter-spacing:1px;text-transform:uppercase;color:#8a949e}
#app-dialog .ixp-map button{height:auto;width:100%;font-family:Consolas,monospace}
#app-dialog .ixp-map button.is-taken{background:repeating-linear-gradient(45deg,#ff6b6b22 0 6px,transparent 6px 12px);color:#9aa3a8}
#app-dialog .ixp-map button.is-on{border-color:var(--color-accent-default,#ffc45b);background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 22%,#161c22);color:#fff}
#app-dialog .ixp-map button.is-bad{border-color:#ff6b6b;background:#ff6b6b22}
#app-dialog .ixp-place-msg{min-height:1em;margin:8px 0 0;font-size:12.5px}
#app-dialog .ixp-place-msg.is-bad{color:#ff6b6b;font-weight:700}
#app-dialog:has(.ixp-place)::backdrop{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#00000059!important}
#app-dialog .ixp-drag-handle{cursor:move;user-select:none}
#app-dialog .ixp-drag-handle::after{content:'  ⠿ drag';font:600 11px/1 'Segoe UI',sans-serif;letter-spacing:.5px;color:#7f8a95;vertical-align:middle}
/* ==== Post portrait, Guardians-of-Light style: hover zooms the picture away to reveal the dossier ==== */
@media (min-width:1200px){
 html body #community-app#community-app .post-flip-card.gol-reveal{overflow:hidden}
 html body #community-app#community-app .post-flip-card.gol-reveal :is(.post-peel-flap,.post-peel-back-flap){display:none!important}
 html body #community-app#community-app .post-flip-card.gol-reveal .post-flip-front{clip-path:none!important;filter:none!important;transform-origin:50% 45%;transition:transform .7s ease-in-out,opacity .7s ease-in-out!important}
 html body #community-app#community-app .post-flip-card.gol-reveal .post-flip-back{clip-path:none!important;opacity:0;transform:scale(.55)!important;transition:transform .5s linear,opacity .5s linear!important}
 html body #community-app#community-app .post-flip-card.gol-reveal .post-flip-back .dossier-btn-row{display:none!important}
 html body #community-app#community-app .post-flip-card.gol-reveal:is(:hover,:focus-visible):not(.hv-folder) .post-flip-front{transform:scale(2.4);opacity:0;pointer-events:none}
 html body #community-app#community-app .post-flip-card.gol-reveal:is(:hover,:focus-visible):not(.hv-folder) .post-flip-back{opacity:1;transform:scale(1)!important}
 /* the folder: pulses in the lower-left corner; hovering it opens a ring of link buttons */
 html body #community-app#community-app .post-flip-card.gol-reveal .post-folder{position:absolute;left:12px;bottom:12px;z-index:6;width:38px;height:38px}
 html body #community-app#community-app .post-folder-icon{position:relative;z-index:2;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#0b0f14d9;border:2px solid #fff;color:#fff;cursor:pointer;animation:postFolderPulse 2s ease-in-out infinite;box-shadow:0 2px 10px #000a}
 @keyframes postFolderPulse{0%,100%{transform:scale(1);box-shadow:0 0 0 0 color-mix(in srgb,var(--character-color,#ffc45b) 60%,transparent)}50%{transform:scale(1.1);box-shadow:0 0 0 8px transparent}}
 html body #community-app#community-app .post-folder-ring{position:absolute;left:50%;bottom:50%;width:112px;height:112px;margin:0 0 -56px -56px;border-radius:50%;background:color-mix(in srgb,var(--character-color,#ffc45b) 85%,#000);border:2px solid #fff;transform:scale(0) rotate(-45deg);transition:transform .35s cubic-bezier(.2,.8,.2,1);display:grid;grid-template-columns:repeat(2,34px);grid-template-rows:repeat(2,34px);gap:4px;place-content:center;box-shadow:0 8px 24px #000b}
 html body #community-app#community-app .post-folder:is(:hover,:focus-within) .post-folder-ring{transform:scale(1) rotate(0deg)}
 html body #community-app#community-app .post-folder:is(:hover,:focus-within) .post-folder-icon{animation:none;opacity:0}
 html body #community-app#community-app .post-folder-ring>.dossier-icon-btn{display:grid!important;place-items:center;width:34px!important;height:34px!important;margin:0!important;padding:0!important;border-radius:50%!important;background:#0b0f14!important;border:1px solid #ffffff55!important;color:#fff!important;transition:transform .35s cubic-bezier(.2,.8,.2,1),background .15s}
 html body #community-app#community-app .post-folder-ring>.dossier-icon-btn:nth-child(1){transform:translate(-30px,-30px)}
 html body #community-app#community-app .post-folder-ring>.dossier-icon-btn:nth-child(2){transform:translate(30px,-30px)}
 html body #community-app#community-app .post-folder-ring>.dossier-icon-btn:nth-child(3){transform:translate(-30px,30px)}
 html body #community-app#community-app .post-folder-ring>.dossier-icon-btn:nth-child(4){transform:translate(30px,30px)}
 html body #community-app#community-app .post-folder:is(:hover,:focus-within) .post-folder-ring>.dossier-icon-btn{transform:none}
 html body #community-app#community-app .post-folder-ring>.dossier-icon-btn:not(.is-off):hover{background:#fff!important;color:#0b0f14!important}
 html body #community-app#community-app .post-folder-ring>.dossier-icon-btn.is-off{opacity:.4;cursor:default}
}
@media (max-width:1199px){html body #community-app#community-app .post-folder{display:none!important}}
/* RP rating on the dossier: GoL's "3 / 2 / 3" box */
html body #community-app#community-app .dossier-rp{align-self:flex-start;display:inline-flex;align-items:center;gap:7px;padding:5px 10px;border:1px solid #fff;background:#0b0f14e6;color:#fff;border-radius:3px}
html body #community-app#community-app .dossier-rp b{font:700 17px/1 'Oswald','Fjalla One','Arial Narrow',sans-serif;letter-spacing:2px}
html body #community-app#community-app .dossier-rp svg{color:var(--character-color,#ffc45b)}
html body #community-app#community-app .post-flip-card.gol-reveal .post-flip-back .dossier-player{margin-left:46px}
/* Plotters: up to three columns, slimmer cards (banner no longer dominates) */
html body #community-app#community-app .pl-grid{grid-template-columns:repeat(auto-fill,minmax(max(280px,calc((100% - 44px) / 3)),1fr))!important;gap:26px 22px!important}
html body #community-app#community-app .pl-banner{height:clamp(70px,5.2vw,96px)!important}
@media (max-width:760px){html body #community-app#community-app .pl-grid{grid-template-columns:1fr!important}}
/* Characters: at most three cards per row (two, then one as the page narrows) */
html body #community-app #app-view #character-cards.cast-grid{grid-template-columns:repeat(auto-fill,minmax(max(340px,calc((100% - 36px) / 3)),1fr))!important}
/* Reply buttons, Guardians-of-Light style: short uppercase labels, squared corners */
html body #community-app#community-app .reply-bar>:is(.reply-bar-quick,.reply-bar-full){height:36px!important;padding:0 18px!important;border-radius:4px!important;font:800 12px/1 Overpass,"Segoe UI",sans-serif!important;letter-spacing:1.6px!important;text-transform:uppercase!important;gap:8px!important}
html body #community-app#community-app .reply-bar>.reply-bar-quick{background:#0b0f14d9!important;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 55%,transparent)!important;color:#f1ece2!important}
html body #community-app#community-app .reply-bar>.reply-bar-quick:hover,html body #community-app#community-app .reply-bar>.reply-bar-quick[aria-expanded=true]{background:#161c22!important;border-color:var(--color-accent-default,#ffc45b)!important;color:var(--color-accent-default,#ffc45b)!important}
html body #community-app#community-app .reply-bar>.reply-bar-full{background:var(--color-accent-default,#ffc45b)!important;border:1px solid var(--color-accent-default,#ffc45b)!important;color:#12100b!important}
html body #community-app#community-app .reply-bar>.reply-bar-full:hover{background:#12100b!important;color:var(--color-accent-default,#ffc45b)!important}
/* Overpass sits high in its line box: nudge bar text buttons so labels are visually centred */
html body #community-app#community-app :is(.box-bar,.dispatch-navigation,.th-bar) :is(.box-bar-tools,.dispatch-actions)>:is(button,a):not(.trail-link):not(.page-bookmark):not(.app-back-control),html body #community-app#community-app #page-corner-actions>:is(button,a){line-height:1!important;padding-top:2px!important;padding-bottom:0!important}
/* header: bookmarks icon (between Watching and the bell) and Dev Control (left of the page lock) */
html body #community-app#community-app .app-header .bookmarks-menu.header-bookmarks{position:relative;display:grid;place-items:center;width:34px;height:34px;min-height:0;margin-right:8px;padding:0;border:1px solid #ffffff1f;border-radius:7px;color:#c9d2dc;background:transparent;cursor:pointer;gap:0}
html body #community-app#community-app .app-header .bookmarks-menu.header-bookmarks:hover{border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent);color:var(--color-accent-default,#ffc45b)}
html body #community-app#community-app .app-header .bookmarks-menu.header-bookmarks svg{width:18px;height:18px}
html body #community-app#community-app .app-header .bookmarks-menu.header-bookmarks>span{display:none}
html body #community-app.rules-locked .app-header .bookmarks-menu{opacity:.38!important}
#dev-control-toggle.in-header{position:static!important;right:auto!important;bottom:auto!important;margin-right:8px;padding:0 12px!important;height:34px;box-sizing:border-box;border-radius:7px!important;box-shadow:none!important;font-size:11px!important;flex:none}
/* Every page except The World (and its locations) uses the Main Index's SDN building backdrop */
html body #community-app#community-app[data-scene]:not([data-scene=world]){--section-scene:url('/assets/backdrop-index-sdn-city.webp');--open-art:url('/assets/backdrop-index-sdn-city.webp');--scene-focus-x:50%;--scene-focus-y:35%}
html body #community-app#community-app[data-scene=ooc]{--open-art:var(--ooc-art,url('/assets/backdrop-index-sdn-city.webp'))}
html body #community-app#community-app[data-scene]:not([data-scene=world]):not([data-scene=index]):not([data-scene=welcome]) #site-backdrop{background-image:linear-gradient(180deg,#05070a99,#05070a33 30%,#05070a66),var(--section-scene)!important;background-size:100% 100%,cover!important;background-position:0 0,center top!important;background-repeat:no-repeat!important}
html body #community-app#community-app[data-scene=ooc] #site-backdrop{background-image:linear-gradient(180deg,#05070a99,#05070a33 30%,#05070a66),var(--ooc-art,url('/assets/backdrop-index-sdn-city.webp'))!important}
/* plotter page: settings cog in the title header */
html body #community-app#community-app .pls-cog-wrap{position:relative;display:inline-flex}
html body #community-app#community-app .pls-cog{display:grid!important;place-items:center;width:34px!important;height:34px!important;padding:0!important;border-radius:999px!important;border:1px solid #ffffff2e!important;background:#161c22!important;color:#edf1f7!important;cursor:pointer}
html body #community-app#community-app .pls-cog:hover,html body #community-app#community-app .pls-cog[aria-expanded=true]{border-color:var(--color-accent-default,#ffc45b)!important;color:var(--color-accent-default,#ffc45b)!important}
html body #community-app#community-app .pls-cog-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:40;display:grid;gap:2px;min-width:210px;padding:6px;border-radius:10px;background:#0f1419f5;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 40%,#ffffff1a);box-shadow:0 14px 34px #000a}
html body #community-app#community-app .pls-cog-menu[hidden]{display:none}
html body #community-app#community-app .pls-cog-menu>button{all:unset;padding:9px 12px;border-radius:7px;font:600 13px/1.2 'Segoe UI',sans-serif;color:#e6e1d6;cursor:pointer}
html body #community-app#community-app .pls-cog-menu>button:hover{background:#ffffff10;color:#fff}
html body #community-app#community-app .plr-request:disabled{opacity:.45;cursor:not-allowed}
/* Wanted Ads: categories as larger tiles (like sub-locations); the chosen one is outlined */
html body #community-app#community-app .wanted-v2 .wa-cats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:14px;margin:18px 20px 0}
html body #community-app#community-app .wa-cat{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;min-height:104px;padding:14px 16px;border-radius:12px;overflow:hidden;text-decoration:none;color:#f1ece2;border:1px solid #ffffff1f;background:#0b0f14;box-shadow:0 8px 20px #0007;transition:border-color .15s,transform .15s,box-shadow .15s;isolation:isolate}
html body #community-app#community-app .wa-cat .wa-cat-art{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#0b0f1433 0%,#0b0f14e6 72%),var(--cat-art) center/cover no-repeat;opacity:.9;transition:transform .3s}
html body #community-app#community-app .wa-cat:hover{border-color:color-mix(in srgb,var(--color-accent-default,#ffc45b) 60%,transparent);transform:translateY(-2px)}
html body #community-app#community-app .wa-cat:hover .wa-cat-art{transform:scale(1.04)}
html body #community-app#community-app .wa-cat.is-active{border:2px solid var(--color-accent-default,#ffc45b);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-accent-default,#ffc45b) 22%,transparent),0 10px 24px #000a}
html body #community-app#community-app .wa-cat-text{display:grid;gap:3px}
html body #community-app#community-app .wa-cat-text strong{font:800 16px/1.15 Overpass,'Segoe UI',sans-serif;letter-spacing:.3px;color:#fff}
html body #community-app#community-app .wa-cat-text em{font:500 12px/1.35 'Segoe UI',sans-serif;font-style:normal;color:#c3cbd3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html body #community-app#community-app .wa-cat-count{position:absolute;top:10px;right:10px;padding:4px 9px;border-radius:999px;background:#0b0f14d9;border:1px solid #ffffff26;font:800 11px/1 Overpass,'Segoe UI',sans-serif;letter-spacing:.5px;color:#fff}
html body #community-app#community-app .wa-cat.is-active .wa-cat-count{background:var(--color-accent-default,#ffc45b);border-color:transparent;color:#12100b}
html body #community-app#community-app .wanted-v2 .wa-strip{display:none!important}
@media (max-width:640px){html body #community-app#community-app .wanted-v2 .wa-cats{grid-template-columns:1fr 1fr;margin:14px 12px 0;gap:10px}html body #community-app#community-app .wa-cat{min-height:86px;padding:12px}}
html body #community-app#community-app .wanted-v2 .wa-cats>.wa-cat.wanted-tab{text-align:left!important;text-transform:none!important;letter-spacing:normal!important;align-items:stretch!important;justify-content:flex-end!important;padding:14px 16px!important;height:auto!important;font-size:inherit!important}
html body #community-app#community-app .wanted-v2 .wa-cats>.wa-cat.wanted-tab .wa-cat-text strong{text-transform:none!important;letter-spacing:.3px!important}
html body #community-app#community-app .wanted-v2 .wa-cats>.wa-cat.wanted-tab .wa-cat-text em{text-transform:none!important;letter-spacing:normal!important}
html body #community-app#community-app .wanted-v2 .wa-cats>.wa-cat.wanted-tab .wa-cat-count{text-transform:uppercase;letter-spacing:.5px!important}
html body #community-app#community-app .wanted-v2 .wa-cats>.wa-cat.wanted-tab::before,html body #community-app#community-app .wanted-v2 .wa-cats>.wa-cat.wanted-tab::after{display:none!important}
/* bookmarks window: centred close button */
html body #community-app#community-app .bookmarks-dialog .close-bookmarks{display:grid!important;place-items:center!important;width:32px!important;height:32px!important;padding:0!important;line-height:1!important;font-size:20px!important;border-radius:8px!important;border:1px solid #ffffff2e!important;background:#161c22!important;color:#e6e1d6!important;cursor:pointer}
html body #community-app#community-app .bookmarks-dialog .close-bookmarks:hover{border-color:var(--color-accent-default,#ffc45b)!important;color:var(--color-accent-default,#ffc45b)!important}
/* Music: the orb, the flying ball and the window take the colour of the character whose playlist is loaded */
html body #community-app#community-app .dm-orb{background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--dm-c) 55%,#fff),color-mix(in srgb,var(--dm-c) 82%,#000) 70%)!important;color:#fff!important}
html body #community-app#community-app .dm-dock.is-playing .dm-orb::before{border-color:color-mix(in srgb,var(--dm-c) 70%,#fff)!important}
html body #community-app#community-app .dm-dock:hover .dm-orb{box-shadow:0 8px 20px #0009,0 0 16px 3px color-mix(in srgb,var(--dm-c) 65%,transparent)!important}
html body #community-app#community-app .dm-fly{background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--dm-c,#ffc45b) 55%,#fff),color-mix(in srgb,var(--dm-c,#ffc45b) 82%,#000) 70%)!important}
html body #community-app#community-app .dm-player{border-color:color-mix(in srgb,var(--dm-c) 55%,transparent)!important;box-shadow:0 18px 44px #000c,0 0 0 1px color-mix(in srgb,var(--dm-c) 25%,transparent),0 0 24px -6px color-mix(in srgb,var(--dm-c) 60%,transparent)!important}
html body #community-app#community-app .dm-player .dm-head{background:linear-gradient(180deg,color-mix(in srgb,var(--dm-c) 26%,#0d1116),color-mix(in srgb,var(--dm-c) 8%,#0d1116))!important;border-bottom:1px solid color-mix(in srgb,var(--dm-c) 40%,transparent)!important}
html body #community-app#community-app .dm-player .dm-head .dm-title small{color:color-mix(in srgb,var(--dm-c) 75%,#fff)!important}
html body #community-app#community-app .dm-player :is(.dm-tabs [aria-selected=true],.dm-row.is-current .dm-pick){border-color:var(--dm-c)!important;color:color-mix(in srgb,var(--dm-c) 70%,#fff)!important}
html body #community-app#community-app .dm-player:not(.is-video) .dm-embed{min-height:352px!important}
/* the song list (YouTube playlists) */
html body #community-app#community-app .dm-tracks{list-style:none;margin:8px 12px 0;padding:4px;max-height:132px;overflow-y:auto;border-radius:10px;background:#05070acc;border:1px solid color-mix(in srgb,var(--dm-c) 25%,#ffffff14)}
html body #community-app#community-app .dm-tracks[hidden]{display:none}
html body #community-app#community-app .dm-tracks button{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:8px;width:100%;padding:5px 8px;border-radius:6px;font:500 12.5px/1.25 'Segoe UI',sans-serif;color:#d6dce2;cursor:pointer}
html body #community-app#community-app .dm-tracks button:hover{background:#ffffff10;color:#fff}
html body #community-app#community-app .dm-tracks .dm-tn{flex:none;width:20px;text-align:right;font:700 10.5px/1 Consolas,monospace;color:#7d8791}
html body #community-app#community-app .dm-tracks .dm-tt{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #community-app#community-app .dm-tracks li.is-now button{background:color-mix(in srgb,var(--dm-c) 22%,transparent);color:#fff}
html body #community-app#community-app .dm-tracks li.is-now .dm-tn{color:var(--dm-c)}
/* Updates paired with a panel under it: both the same height; the text area scrolls inside */
html body #community-app#community-app .ix-updates.is-paired .ix-updates-body{max-height:none!important;flex:1 1 auto!important;min-height:0!important}
/* Characters: room above the first row so card bookmarks (and the hover lift) aren't clipped */
html body #community-app#community-app #app-view #character-cards.cast-grid{padding-top:14px!important}
/* minimized windows: room above the tabs so a tab lifted while dragging (or its glow) isn't clipped by the scrolling dock */
html body #community-app#community-app .minimized-sheet-dock{padding-top:10px!important;overflow-y:hidden}
/* Member Area character chips: room above/below inside the scrolling strip so the hover lift + glow aren't clipped */
#community-app .mc-chars{padding:10px 6px!important;margin:-10px -6px!important;scroll-padding-inline:6px}
#community-app .mc-char{position:relative}
#community-app .mc-char:is(:hover,:focus-visible){z-index:1;transform:translateY(-2px);box-shadow:0 0 0 2px var(--c),0 0 8px 1px color-mix(in srgb,var(--c) 75%,transparent);filter:brightness(1.08);outline:none}
/* Character cards: the name gets its own line; "aka Alias" sits on the line below it */
html body #community-app .cast-directory .character-card-name-row{display:flex!important;flex-wrap:wrap!important;align-items:baseline!important;column-gap:7px!important;row-gap:3px!important}
html body #community-app .cast-directory .character-card-name-row h2{flex:0 0 100%!important;min-width:0;overflow-wrap:anywhere}
html body #community-app .cast-directory .character-card-name-row .character-codename{min-width:0;overflow-wrap:anywhere}
/* Wanted Ads: card category label (was sharing .wa-cat with the tiles) */
html body #community-app#community-app .wa-card .wa-kind{font:800 10.5px/1 Consolas,monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
/* Category tiles: art stays behind the text and count, with a darker band under the text */
html body #community-app#community-app .wanted-v2 .wa-cats>.wa-cat{isolation:isolate}
html body #community-app#community-app .wanted-v2 .wa-cat .wa-cat-art{z-index:0!important;background:linear-gradient(180deg,#0b0f1426 0%,#0b0f14b3 48%,#0b0f14f2 78%),var(--cat-art) center/cover no-repeat!important}
html body #community-app#community-app .wanted-v2 .wa-cat :is(.wa-cat-text,.wa-cat-count){position:relative;z-index:1}
html body #community-app#community-app .wanted-v2 .wa-cat .wa-cat-count{position:absolute}
html body #community-app#community-app .wanted-v2 .wa-cat-text strong{text-shadow:0 1px 3px #000}
html body #community-app#community-app .wanted-v2 .wa-cat .wa-cat-count{background:#0b0f14!important}
html body #community-app#community-app .wanted-v2 .wa-cat.is-active .wa-cat-count{background:var(--color-accent-default,#ffc45b)!important;color:#12100b!important}
/* Wanted ad cards: optional image at the left edge, fading out by about a third of the way across */
html body #community-app#community-app .wa-card{isolation:isolate;overflow:hidden}
html body #community-app#community-app .wa-card>.wa-bg{position:absolute;inset:0;z-index:-1;background:center left/cover no-repeat;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,#000 0%,rgb(0 0 0 / .85) 10%,rgb(0 0 0 / .45) 22%,transparent 34%);mask-image:linear-gradient(90deg,#000 0%,rgb(0 0 0 / .85) 10%,rgb(0 0 0 / .45) 22%,transparent 34%);opacity:.9}
html body #community-app#community-app .wa-card.has-bg :is(.wa-title,.wa-intro,.wa-by){text-shadow:0 1px 3px #000,0 0 10px #000c}
html body #community-app#community-app .wa-card>.wa-top{justify-content:flex-end}
html body #community-app#community-app .wa-card::before{z-index:1}
/* ---- Alerts: read/unread, popout footer, the "View all alerts" window ---- */
#community-app :is(.notify-popout,.alerts-window) li{position:relative}
#community-app :is(.notify-popout,.alerts-window) li.is-unread>a{background:color-mix(in srgb,var(--ui-accent,#ffc45b) 7%,transparent)}
#community-app :is(.notify-popout,.alerts-window) li.is-unread>a::before{content:'';position:absolute;left:3px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--ui-accent,#ffc45b)}
#community-app :is(.notify-popout,.alerts-window) li.is-read .notify-line{color:#aeb7c0}
#community-app :is(.notify-popout,.alerts-window) li.is-read .notify-line b{color:#d6dce1}
#community-app>.notify-popout footer{position:sticky;bottom:0;padding:8px;border-top:1px solid #ffffff12;background:inherit}
#community-app>.notify-popout .notify-all{display:block;width:100%;padding:8px 10px;border-radius:8px;border:1px solid color-mix(in srgb,var(--ui-accent,#ffc45b) 40%,transparent);background:color-mix(in srgb,var(--ui-accent,#ffc45b) 10%,transparent);color:#f3e7cc;font:700 12.5px/1 'Segoe UI',sans-serif;cursor:pointer}
#community-app>.notify-popout .notify-all:hover{background:color-mix(in srgb,var(--ui-accent,#ffc45b) 20%,transparent);color:#fff}
#community-app .alert-robot{display:inline-grid;vertical-align:-3px;margin-right:5px;color:#ff6b6b}
#community-app>.alerts-window{position:fixed;inset:0;z-index:10400;display:grid;place-items:center;padding:24px 16px;background:rgb(4 6 9 / .62);backdrop-filter:blur(2px)}
#community-app>.alerts-window .aw-panel{display:flex;flex-direction:column;width:min(760px,100%);max-height:min(82vh,900px);min-height:0;box-sizing:border-box;border-radius:14px;background:rgb(10 13 17 / .98);border:1px solid color-mix(in srgb,var(--ui-accent,#ffc45b) 35%,#ffffff1a);box-shadow:0 24px 60px #000c}
#community-app>.alerts-window .aw-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 18px 12px;border-bottom:1px solid #ffffff12}
#community-app>.alerts-window .aw-head h2{margin:0;font:700 15px/1.2 'Segoe UI',sans-serif;letter-spacing:1.8px;text-transform:uppercase;color:var(--ui-accent,#ffc45b)}
#community-app>.alerts-window .aw-head p{margin:4px 0 0;font:500 12px 'Segoe UI',sans-serif;color:#8f9aa6}
#community-app>.alerts-window .aw-head-actions{display:flex;gap:8px;align-items:center}
#community-app>.alerts-window .aw-markread{padding:6px 11px;border-radius:7px;border:1px solid #ffffff22;background:transparent;color:#c8cfd2;font:600 12px 'Segoe UI',sans-serif;cursor:pointer}
#community-app>.alerts-window .aw-markread:hover{color:#fff;border-color:#ffffff44}
#community-app>.alerts-window .aw-close{display:grid;place-items:center;width:30px;height:30px;padding:0;border-radius:8px;border:1px solid #ffffff22;background:transparent;color:#c8cfd2;cursor:pointer}
#community-app>.alerts-window .aw-close:hover{color:#fff;border-color:#ff6b6b}
#community-app>.alerts-window .aw-tabs{display:flex;flex-wrap:wrap;gap:6px;padding:10px 18px;border-bottom:1px solid #ffffff10}
#community-app>.alerts-window .aw-tabs button{padding:6px 11px;border-radius:999px;border:1px solid #ffffff1c;background:#ffffff08;color:#c8cfd2;font:600 12px/1 'Segoe UI',sans-serif;cursor:pointer}
#community-app>.alerts-window .aw-tabs button.is-on{background:color-mix(in srgb,var(--ui-accent,#ffc45b) 22%,transparent);border-color:color-mix(in srgb,var(--ui-accent,#ffc45b) 60%,transparent);color:#fff}
#community-app>.alerts-window .aw-list{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#ffffff40 transparent;padding:6px 8px 10px}
#community-app>.alerts-window .aw-list::-webkit-scrollbar{width:9px}
#community-app>.alerts-window .aw-list::-webkit-scrollbar-thumb{background:#ffffff38;border-radius:9px}
#community-app>.alerts-window ol{list-style:none;margin:0;padding:0}
#community-app>.alerts-window li+li{border-top:1px solid #ffffff0a}
#community-app>.alerts-window li a{display:grid;gap:4px;padding:11px 14px;border-radius:8px;color:#dfe5ea;text-decoration:none}
#community-app>.alerts-window li a:hover{background:#ffffff0d}
#community-app>.alerts-window .notify-line{font:500 14px/1.4 'Segoe UI',sans-serif;overflow-wrap:anywhere}
#community-app>.alerts-window .notify-line b{color:#fff}
#community-app>.alerts-window .notify-detail{font:400 13px/1.45 'Segoe UI',sans-serif;color:#9eaab5;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
#community-app>.alerts-window small{font:500 11.5px 'Segoe UI',sans-serif;color:#8f9aa6}
#community-app>.alerts-window .aw-empty{margin:0;padding:30px 16px;text-align:center;font:500 13px 'Segoe UI',sans-serif;color:#8f9aa6}
@media (max-width:640px){#community-app>.alerts-window{padding:10px}#community-app>.alerts-window .aw-panel{max-height:92vh}}
/* a post opened from an alert glows briefly */
#community-app .forum-post.is-linked{box-shadow:0 0 0 2px var(--ui-accent,#ffc45b),0 0 28px color-mix(in srgb,var(--ui-accent,#ffc45b) 35%,transparent)!important;transition:box-shadow .4s}
/* ---- AI writing check (staff only) ---- */
@keyframes ai-flash{0%,100%{box-shadow:0 0 0 0 #ff4d4d00,0 0 0 2px #ff4d4d;background:#3a0e12}50%{box-shadow:0 0 16px 4px #ff4d4d99,0 0 0 2px #ff8a8a;background:#5c1419}}
#community-app .ai-flag{display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 9px 0 7px!important;border-radius:999px!important;border:0!important;color:#ffd6d6!important;font:800 12px/1 'Segoe UI',sans-serif;cursor:pointer;animation:ai-flash 1.4s ease-in-out infinite;z-index:6}
#community-app .ai-flag svg{width:17px;height:17px}
#community-app .ai-flag:focus-visible{outline:2px solid #fff;outline-offset:2px}
#community-app .forum-post>.ai-flag{position:absolute;top:10px;right:12px}
#community-app .forum-post{position:relative}
#community-app .sheet-window-bar .ai-flag{height:24px;margin-left:10px;flex:none}
@media (prefers-reduced-motion:reduce){#community-app .ai-flag{animation:none;background:#5c1419;box-shadow:0 0 0 2px #ff6b6b}}
#community-app>.ai-pop{position:fixed;z-index:10450;width:320px;max-width:calc(100vw - 16px);max-height:min(560px,calc(100vh - 24px));overflow-y:auto;overflow-x:hidden;box-sizing:border-box;border-radius:12px;background:rgb(12 14 18 / .98);border:1px solid #ff6b6b66;box-shadow:0 18px 44px #000c;color:#dfe5ea;font:500 13px/1.4 'Segoe UI',sans-serif}
#community-app>.ai-pop header{display:flex;align-items:center;gap:8px;padding:11px 12px;border-bottom:1px solid #ffffff12;position:sticky;top:0;background:inherit}
#community-app>.ai-pop .ai-pop-robot{display:grid;color:#ff6b6b}
#community-app>.ai-pop header strong{flex:1;font:700 12px/1 'Segoe UI',sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:#ffb3b3}
#community-app>.ai-pop .ai-pop-close{width:26px;height:26px;padding:0;border-radius:7px;border:1px solid #ffffff22;background:transparent;color:#c8cfd2;font-size:17px;line-height:1;cursor:pointer}
#community-app>.ai-pop section{padding:10px 12px;border-bottom:1px solid #ffffff0d}
#community-app>.ai-pop h4{margin:0 0 6px;font:700 12px 'Segoe UI',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#f0d9a8}
#community-app>.ai-pop ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
#community-app>.ai-pop li{display:grid;grid-template-columns:96px 1fr 40px;align-items:center;gap:8px}
#community-app>.ai-pop li span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#c8cfd2}
#community-app>.ai-pop li i{height:7px;border-radius:9px;background:linear-gradient(90deg,#e8b04a var(--p),#ffffff14 var(--p))}
#community-app>.ai-pop li i.is-high{background:linear-gradient(90deg,#ff5c5c var(--p),#ffffff14 var(--p))}
#community-app>.ai-pop li b{text-align:right;color:#fff}
#community-app>.ai-pop li.is-error em{grid-column:2/-1;font-style:normal;color:#8f9aa6}
#community-app>.ai-pop .ai-pop-avg{margin:9px 0 2px;color:#e7ecef}
#community-app>.ai-pop .ai-pop-avg b{color:#ff8a8a}
#community-app>.ai-pop .ai-pop-meta{margin:0 0 8px;font-size:11.5px;color:#8f9aa6}
#community-app>.ai-pop .ai-pop-dismiss{padding:6px 10px;border-radius:7px;border:1px solid #ffffff26;background:#ffffff08;color:#dfe5ea;font:600 12px 'Segoe UI',sans-serif;cursor:pointer}
#community-app>.ai-pop .ai-pop-dismiss:hover{border-color:#ffffff55;color:#fff}
#community-app>.ai-pop .ai-pop-note{margin:0;padding:10px 12px;font-size:11.5px;color:#8f9aa6}
/* ---- Wanted ad builder: rich text boxes ---- */
#community-app .wb-rich{display:grid;gap:6px;margin:10px 0;min-width:0}
#community-app .wb-rich-label{font:600 13px 'Segoe UI',sans-serif;color:#dfe5ea}
#community-app .wb-composer .forum-rich{min-height:90px;max-height:320px;overflow-y:auto}
#community-app .wb-dialog .wb-none{margin:8px 0}
/* ad card image sits with the title fields, above the editor */
#community-app .thread-create header .img-field{margin-top:12px}
#community-app .forum-post .post-controls>.ai-flag{position:static;align-self:center;margin-right:4px}
/* the robot keeps its red look inside the post's button row (whose buttons are styled with !important) */
@keyframes ai-flash2{0%,100%{box-shadow:0 0 0 2px #ff4d4d;filter:brightness(1)}50%{box-shadow:0 0 16px 4px #ff4d4d99,0 0 0 2px #ff9a9a;filter:brightness(1.35)}}
html body #community-app#community-app .ai-flag{background:#4a1116!important;color:#ffd6d6!important;border:0!important;animation:ai-flash2 1.4s ease-in-out infinite!important}
html body #community-app#community-app .ai-flag b{color:#fff!important}
@media (prefers-reduced-motion:reduce){html body #community-app#community-app .ai-flag{animation:none!important;box-shadow:0 0 0 2px #ff6b6b}}
html body #community-app#community-app#community-app .forum-post .post-controls>.ai-flag,html body #community-app#community-app#community-app .forum-post .post-controls>.ai-flag:is(:hover,:focus-visible){background:#4a1116!important;color:#ffd6d6!important;border:0!important;border-radius:999px!important;padding:0 9px 0 7px!important;height:26px!important;animation:ai-flash2 1.4s ease-in-out infinite!important}
@keyframes ai-flash3{0%,100%{filter:drop-shadow(0 0 0 #ff4d4d00) brightness(1)}50%{filter:drop-shadow(0 0 7px #ff4d4d) brightness(1.4)}}
html body #community-app#community-app#community-app .ai-flag{outline:2px solid #ff5c5c!important;outline-offset:0;animation:ai-flash3 1.4s ease-in-out infinite!important}
html body #community-app#community-app#community-app .forum-post .post-controls>.ai-flag{animation:ai-flash3 1.4s ease-in-out infinite!important}
@media (prefers-reduced-motion:reduce){html body #community-app#community-app#community-app .ai-flag,html body #community-app#community-app#community-app .forum-post .post-controls>.ai-flag{animation:none!important}}
/* builder dialog: keep the rich toolbar looking like the composer's (dialog form styles don't apply inside it) */
html body #community-app#community-app#community-app #app-dialog .wb-rich .rich-tools label{flex-direction:row!important;align-items:center!important;margin:0!important}
html body #community-app#community-app#community-app #app-dialog #app-dialog-content .wb-rich .rich-tools select{padding:0 8px!important;font-size:12.5px!important;height:32px!important;min-height:32px!important}
html body #community-app#community-app#community-app #app-dialog #app-dialog-content .wb-rich .rich-tools select{padding-top:0!important;padding-bottom:0!important;line-height:30px!important;font-size:12.5px!important}
html body #community-app#community-app#community-app #app-dialog #app-dialog-content .wb-rich .rich-tools select{width:auto!important;border-radius:6px!important;font-family:Overpass,'Segoe UI',sans-serif!important;font-weight:700!important}
/* Wanted ad builder: picture address + upload on one line; role pictures are square */
#community-app .wb-pic{display:grid;gap:6px;min-width:0}
#community-app .wb-pic-label{font:700 11px/1.3 'Segoe UI',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#c8cfd2}
#community-app .wb-pic-label .app-muted{letter-spacing:.06em;text-transform:none;font-weight:500;color:#8f9aa6}
#community-app .wb-pic-row{display:flex;align-items:center;gap:8px;min-width:0}
#community-app .wb-pic-prev{flex:none;width:42px;height:42px;border-radius:8px;overflow:hidden;background:#161c22;border:1px dashed #ffffff2a}
#community-app .wb-pic-prev:has(img){border-style:solid;border-color:#ffffff3a}
#community-app .wb-pic-prev img{width:100%;height:100%;object-fit:cover;display:block}
html body #community-app#community-app#community-app #app-dialog #app-dialog-content .wb-pic-row input[name=ri]{flex:1;min-width:0;width:auto!important}
#community-app .wb-pic-upload{flex:none;display:inline-flex;align-items:center;height:40px;padding:0 14px;border-radius:9px;border:1px solid color-mix(in srgb,var(--ui-accent,#ffc45b) 45%,transparent);background:color-mix(in srgb,var(--ui-accent,#ffc45b) 14%,transparent);color:#f3e7cc;font:700 13px/1 'Segoe UI',sans-serif;letter-spacing:0;text-transform:none;cursor:pointer;white-space:nowrap}
#community-app .wb-pic-upload:hover{background:color-mix(in srgb,var(--ui-accent,#ffc45b) 24%,transparent);color:#fff}
#community-app .wb-pic-msg{margin:0;min-height:0;font:500 12px 'Segoe UI',sans-serif;color:#9aa6b2}
#community-app .wb-pic-msg:empty{display:none}
html body #community-app#community-app .bb-wanted-pic{width:84px!important;height:84px!important;aspect-ratio:1/1!important;border-radius:10px!important}
html body #community-app#community-app .bb-wanted-role,html body #community-app#community-app .bb-wanted-role.is-flip{grid-template-columns:84px minmax(0,1fr)!important}
/* Wanted ad cards: the accent edge follows the rounded corners */
html body #community-app#community-app .wa-card::before{display:none!important}
html body #community-app#community-app .wa-card{border-left:3px solid var(--wa-c)!important}
/* divider between the category tiles and the ads */
html body #community-app#community-app .wanted-v2>.wa-sep{height:1px;margin:20px 20px 0;border:0;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,#ffffff22) 15%,color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,#ffffff22) 85%,transparent)}
@media (max-width:640px){html body #community-app#community-app .wanted-v2>.wa-sep{margin:14px 12px 0}}
/* compose windows move by their title bar */
html body #community-app .dw-window:not(.is-max) .dw-bar{cursor:move;user-select:none;touch-action:none}
html body #community-app .dw-window.is-dragging{transition:none!important}
/* New Wanted Ad: "Post in" category picker under the subtitle */
#community-app .tc-postin{display:flex;align-items:center;gap:10px;margin:6px 0 2px;font:700 11px/1 'Segoe UI',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#8f9aa6}
#community-app .tc-postin select{height:32px;padding:0 30px 0 10px;border-radius:8px;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 40%,#ffffff22);background:#10161c;color:#f1ece2;font:700 13px/1 'Segoe UI',sans-serif;letter-spacing:0;text-transform:none;cursor:pointer;max-width:100%}
/* Wanted Ads: no bookmark button in the bar */
#community-app.hz-wanted .trail-tools .page-bookmark{display:none!important}
html body #community-app#community-app#community-app #app-dialog #app-dialog-content .wb-pic-row .wb-pic-upload{margin:0!important;height:40px!important}
html body #community-app#community-app#community-app #app-dialog #app-dialog-content .wb-pic-row .wb-pic-upload{display:inline-flex!important;flex-direction:row!important;align-items:center!important;justify-content:center;padding:0 16px!important;font:700 13px/1 'Segoe UI',sans-serif!important;letter-spacing:0!important;text-transform:none!important;color:#f3e7cc!important}
html body #community-app#community-app#community-app #app-dialog #app-dialog-content .wb-pic{gap:8px}
/* Wanted Ads: ad cards line up with the category tiles; double the space around the divider */
html body #community-app#community-app .wanted-v2>.wa-results.wa-results.wanted-tab-panel{margin-top:40px!important;padding-left:22px!important;padding-right:22px!important}
html body #community-app#community-app .wanted-v2>.wa-sep{margin-top:40px!important}
@media (max-width:640px){html body #community-app#community-app .wanted-v2>.wa-results.wa-results.wanted-tab-panel{margin-left:12px!important;margin-right:12px!important;padding-left:22px!important;padding-right:22px!important}}
/* Wanted Ads: bigger category titles */
html body #community-app#community-app .wanted-v2 .wa-cats>.wa-cat.wanted-tab .wa-cat-text strong{font-size:22px!important;line-height:1.1!important}
/* New Wanted Ad window: the builder replaces the post editor */
#community-app .thread-create .wb-hidden-editor .forum-toolbar-host,#community-app .thread-create .wb-hidden-editor>.forum-rich{display:none!important}
#community-app .thread-create .wb-inline{display:grid;gap:4px;margin:14px 0 6px;min-width:0}
#community-app .thread-create .wb-inline .wb-role{margin:10px 0 0;padding:12px 14px 14px;border-radius:10px;border:1px solid #ffffff1c;background:#ffffff05;min-width:0}
#community-app .thread-create .wb-inline .wb-role legend{padding:0 6px;font:700 11px/1 'Segoe UI',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--color-accent-default,#ffc45b)}
#community-app .thread-create .wb-inline .wb-grid{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:10px 12px}
#community-app .thread-create .wb-inline .wb-grid>label{display:grid;gap:6px;font:700 11px/1.3 'Segoe UI',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#c8cfd2}
#community-app .thread-create .wb-inline .wb-grid :is(input:not([type=file]),select){height:38px;padding:0 10px;border-radius:8px;border:1px solid #ffffff24;background:#0a0f13;color:#eef1f4;font:500 14px 'Segoe UI',sans-serif;letter-spacing:0;text-transform:none;box-sizing:border-box;width:100%}
#community-app .thread-create .wb-inline .wb-wide{grid-column:1/-1}
#community-app .thread-create .wb-inline .wb-pic-upload{height:38px}
#community-app .thread-create .wb-inline .wb-role-tools{display:flex;justify-content:flex-end;gap:6px;margin-top:10px}
#community-app .thread-create .wb-inline .wb-role-tools button{height:30px;padding:0 10px;border-radius:7px;border:1px solid #ffffff22;background:transparent;color:#c8cfd2;font:600 12px 'Segoe UI',sans-serif;cursor:pointer}
#community-app .thread-create .wb-inline .wb-role-tools [data-wb-remove]{color:#ff9a9a;border-color:#ff6b6b55}
#community-app .thread-create .wb-inline .wb-add{justify-self:start;margin-top:10px;height:34px;padding:0 14px;border-radius:8px;border:1px solid color-mix(in srgb,var(--color-accent-default,#ffc45b) 45%,transparent);background:color-mix(in srgb,var(--color-accent-default,#ffc45b) 12%,transparent);color:#f3e7cc;font:700 13px 'Segoe UI',sans-serif;cursor:pointer}
#community-app .thread-create .wb-inline .wb-none{margin:8px 0 0}
@media (max-width:640px){#community-app .thread-create .wb-inline .wb-grid{grid-template-columns:1fr}}
/* builder text boxes keep only the basics: bold/italic/underline/strike, lists, link, undo */
#community-app .wb-rich.is-compact .rich-tools>:is(label,.rich-dd-align,.rich-insert-row,details:not(.rich-link-menu),.rich-mention-btn,.rich-bbcode-btn){display:none!important}
#community-app .wb-rich.is-compact .rich-tools{display:flex!important;flex-wrap:wrap;gap:6px;padding:8px!important}
#community-app .wb-rich.is-compact .rich-history-group{margin-left:auto}
/* category art: shown brighter on the right, darkened behind the title on the left */
html body #community-app#community-app .wanted-v2 .wa-cat .wa-cat-art{background:linear-gradient(90deg,#0b0f14f0 0%,#0b0f14b8 38%,#0b0f1433 72%,#0b0f1414 100%),linear-gradient(0deg,#0b0f14b3 0%,transparent 55%),var(--cat-art) 70% 45%/cover no-repeat!important;opacity:1!important}
/* music: Spotify preview note, disabled skip on Spotify */
#community-app .dm-player .dm-sp-note{margin:8px 12px 0;padding:8px 10px;border-radius:8px;background:#ffffff0a;border:1px solid #ffffff1a;font:500 12px/1.45 'Segoe UI',sans-serif;color:#c8cfd2}
#community-app .dm-player .dm-sp-note[hidden]{display:none}
#community-app .dm-player .dm-sp-note a,#community-app .dm-player .dm-sp-reload{color:var(--dm-c,#ffc45b);font:inherit;font-weight:700;background:none;border:0;padding:0;cursor:pointer;text-decoration:underline}
#community-app .dm-dock .dm-icon:disabled{opacity:.35;cursor:not-allowed}
/* ---- Wanted ad page: reads like a faction page, replies underneath ---- */
html body #community-app#community-app .ad-page{position:relative;margin:0 0 22px;padding:6px 26px 24px;border-radius:14px;background:linear-gradient(160deg,color-mix(in srgb,var(--faction-color) 12%,#0e1318),#0b0f14 55%);border:1px solid color-mix(in srgb,var(--faction-color) 35%,#ffffff14);box-shadow:0 14px 36px #0007}
html body #community-app#community-app .ad-page .ad-head{align-items:flex-start;margin-bottom:6px}
html body #community-app#community-app .ad-page .ad-badge{width:120px;aspect-ratio:1/1;object-fit:cover}
html body #community-app#community-app .ad-page .ad-badge.is-text{display:grid;place-items:center;font:800 34px/1 var(--font-control-title,'Segoe UI'),sans-serif;color:var(--faction-color);background:#0b0f14}
html body #community-app#community-app .ad-page .ad-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:12px;font:500 13px/1.4 'Segoe UI',sans-serif;color:#9aa6b2}
html body #community-app#community-app .ad-page .ad-meta b{color:#e8edf1}
html body #community-app#community-app .ad-page .ad-av{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;overflow:hidden;background:#1a2129;box-shadow:0 0 0 2px var(--c)}
html body #community-app#community-app .ad-page .ad-av img{width:100%;height:100%;object-fit:cover}
html body #community-app#community-app .ad-page .ad-av b{font:800 11px/1 'Segoe UI',sans-serif;color:#fff}
html body #community-app#community-app .ad-page .ad-open{padding:2px 9px;border-radius:999px;background:#1f3b2c;color:#9ff0bf;font-weight:700}
html body #community-app#community-app .ad-page .ad-open.is-none{background:#2a2f36;color:#aab4be}
html body #community-app#community-app .ad-page .ad-actions{display:flex;align-items:center;gap:6px;flex:none;align-self:flex-start;margin-top:4px}
html body #community-app#community-app .ad-page .ad-actions .post-controls{display:flex;gap:6px;position:static!important}
html body #community-app#community-app .ad-page .ad-intro{margin:18px 0 26px;font:400 16px/1.65 'Segoe UI',sans-serif;color:#dfe5ea;background:none!important;padding:0!important;min-height:0!important}
html body #community-app#community-app .ad-page .fx-members.ad-roles{padding:6px 0 0}
html body #community-app#community-app .ad-page .ad-role .ad-role-pic{width:84px;aspect-ratio:1/1;height:auto;align-self:flex-start}
html body #community-app#community-app .ad-page .ad-role-pic img{object-position:center}
html body #community-app#community-app .ad-page .ad-role-status{display:inline-block;padding:3px 9px;border-radius:5px;font:800 11px/1.2 var(--font-control-ui,'Segoe UI'),sans-serif;letter-spacing:.12em;text-transform:uppercase}
html body #community-app#community-app .ad-page .ad-role-status.is-open{background:#1f3b2c;color:#9ff0bf}
html body #community-app#community-app .ad-page .ad-role-status.is-reserved{background:#3b311a;color:#ffd98a}
html body #community-app#community-app .ad-page .ad-role-status.is-taken{background:#2a2f36;color:#aab4be}
html body #community-app#community-app .ad-page .ad-role.is-taken{opacity:.7}
html body #community-app#community-app .ad-page .ad-role-desc{font:400 14px/1.5 'Segoe UI',sans-serif;color:#c8cfd2}
html body #community-app#community-app .ad-page .ad-role-desc p{margin:0 0 6px}
html body #community-app#community-app .ad-page .bb-wanted-apply{margin-top:2px}
html body #community-app#community-app .is-wanted-ad .ad-replies-head{--faction-color:var(--color-accent-default,#ffc45b);margin:6px 0 18px;flex-wrap:wrap}
html body #community-app#community-app .is-wanted-ad .ad-no-replies{flex-basis:100%;margin:2px 0 0;font:500 13px 'Segoe UI',sans-serif;color:#8f9aa6}
@media (max-width:640px){html body #community-app#community-app .ad-page{padding:4px 14px 18px}html body #community-app#community-app .ad-page .ad-head{flex-direction:column}html body #community-app#community-app .ad-page .ad-badge{width:84px}}
/* ads have role status instead of a thread status */
html body #community-app#community-app #app-view.is-wanted-ad .thread-view-heading .th-status{display:none!important}
/* Wanted ad: the header bar and the ad are one panel, like a faction page */
html body #community-app#community-app #app-view.is-wanted-ad>.thread-view-heading :is(.th-head-main,.th-cast,.th-facts){display:none!important}
html body #community-app#community-app #app-view.is-wanted-ad>.thread-view-heading .th-right:not(:has(.thread-post-pager)){display:none!important}
html body #community-app#community-app #app-view.is-wanted-ad>.thread-view-heading{min-height:0!important;padding-bottom:0!important}
html body #community-app#community-app #app-view.is-wanted-ad.has-ad-head>.thread-view-heading{margin-bottom:0!important;border-bottom:0!important;border-bottom-left-radius:0!important;border-bottom-right-radius:0!important;border-left-color:var(--ad-color,#ffc45b)!important;border-color:color-mix(in srgb,var(--ad-color,#ffc45b) 35%,#ffffff14)!important;border-left:1px solid color-mix(in srgb,var(--ad-color,#ffc45b) 35%,#ffffff14)!important;background:color-mix(in srgb,var(--ad-color,#ffc45b) 12%,#0e1318)!important;box-shadow:none!important}
html body #community-app#community-app #app-view.is-wanted-ad.has-ad-head>.thread-view-heading::before,html body #community-app#community-app #app-view.is-wanted-ad.has-ad-head>.thread-view-heading::after{display:none!important}
html body #community-app#community-app #app-view.is-wanted-ad.has-ad-head>.thread-view-heading .th-bar{border-bottom:1px solid color-mix(in srgb,var(--ad-color,#ffc45b) 25%,#ffffff10)!important}
html body #community-app#community-app #app-view.is-wanted-ad.has-ad-head>.thread-reading-area{margin-top:0!important;padding-top:0!important}
html body #community-app#community-app #app-view.is-wanted-ad.has-ad-head .ad-page{margin-top:0!important;border-top:0!important;border-top-left-radius:0!important;border-top-right-radius:0!important;background:linear-gradient(180deg,color-mix(in srgb,var(--faction-color) 12%,#0e1318),#0b0f14 70%)!important}
html body #community-app#community-app .is-wanted-ad .ad-replies-head .thread-post-pager.in-replies{margin-left:auto}
/* Post cards: the links folder only appears with the back of the card (on hover), in the character's colour */
html body #community-app#community-app .post-flip-card.gol-reveal .post-folder{opacity:0;pointer-events:none;transform:scale(.6);transition:opacity .35s ease .15s,transform .35s ease .15s}
html body #community-app#community-app .post-flip-card.gol-reveal:is(:hover,:focus-within) .post-folder{opacity:1;pointer-events:auto;transform:none}
html body #community-app#community-app .post-flip-card.gol-reveal:is(:hover,:focus-visible,:focus-within) .post-flip-front{transform:scale(2.4)!important;opacity:0!important;pointer-events:none}
html body #community-app#community-app .post-flip-card.gol-reveal:is(:hover,:focus-visible,:focus-within) .post-flip-back{opacity:1!important;transform:scale(1)!important}
html body #community-app#community-app .post-folder-icon{background:color-mix(in srgb,var(--character-color,#ffc45b) 30%,#0b0f14)!important;border-color:var(--character-color,#ffc45b)!important;color:color-mix(in srgb,var(--character-color,#ffc45b) 40%,#fff)!important;--pulse:var(--character-color,#ffc45b)}
html body #community-app#community-app .post-folder-ring{border-color:color-mix(in srgb,var(--character-color,#ffc45b) 60%,#fff)!important}
/* stat bars on the back of the card */
html body #community-app#community-app .post-flip-back .dossier-stats{display:block;margin:8px 0 2px;padding:8px 0 0;border-top:1px solid color-mix(in srgb,var(--character-color,#ffc45b) 30%,transparent)}
html body #community-app#community-app .post-flip-back .dossier-stats .post-stat-bars{padding:0;gap:5px}
html body #community-app#community-app .post-card-radar{display:none!important}
/* back of the card: tighter fact rows so the stat bars and "Played by" all fit */
html body #community-app#community-app .post-flip-card.gol-reveal .post-flip-back .df-row{padding-top:4px!important;padding-bottom:4px!important;min-height:0!important}
html body #community-app#community-app .post-flip-card.gol-reveal .post-flip-back .dossier-facts{gap:0!important}
html body #community-app#community-app .post-flip-back .dossier-stats{margin:6px 0 0!important;padding-top:6px!important}
html body #community-app#community-app .post-flip-back .dossier-stats .post-stat-bars{gap:3px!important}
html body #community-app#community-app .post-flip-back .dossier-stats .post-stat-bar{grid-template-columns:16px minmax(0,1fr) 14px!important;gap:7px!important}
html body #community-app#community-app .post-flip-back .dossier-stats .post-stat-bar-icon svg{width:15px!important;height:15px!important}
html body #community-app#community-app .post-flip-back .dossier-stats .post-stat-bar-track{height:5px}
html body #community-app#community-app .post-flip-back .dossier-stats .post-stat-bar>b{font-size:10.5px}

/* Character profile header: mobile keeps the dossier subtitle centered in its
   black title bar and removes the redundant directory return control. */
@media (max-width:640px){
 html body #community-app#community-app #app-view.hz-thread:has(.character-played-by) #character-page-back{display:none!important}
 html body #community-app#community-app #app-view.hz-thread>.thread-view-heading:has(.character-played-by) .thread-view-subtitle{display:block!important;box-sizing:border-box!important;flex:0 0 100%!important;width:100%!important;margin-inline:0!important;text-align:center!important}
}

/* Thread header actions: keep the manage popout anchored to its gear and expose clear saved/watching states. */
html body #community-app#community-app#community-app .gth-tools{position:relative!important;isolation:isolate}
html body #community-app#community-app#community-app .gth-tools>details.thread-manage{position:relative!important;flex:none}
html body #community-app#community-app#community-app .gth-tools>details.thread-manage>.thread-manage-menu{position:absolute!important;inset:calc(100% + 8px) 0 auto auto!important;left:auto!important;right:0!important;width:max-content!important;min-width:236px!important;max-width:min(320px,calc(100vw - 24px))!important;z-index:1000!important}
html body #community-app#community-app#community-app #gol-fab-sheet .gfs-body>details.thread-manage{position:static!important;display:block!important;width:100%!important}
html body #community-app#community-app#community-app #gol-fab-sheet .gfs-body>details.thread-manage>summary{display:none!important}
html body #community-app#community-app#community-app #gol-fab-sheet .gfs-body>details.thread-manage>.thread-manage-menu{position:static!important;inset:auto!important;left:auto!important;right:auto!important;display:grid!important;width:100%!important;min-width:0!important;max-width:none!important;margin:0!important;box-shadow:none!important;backdrop-filter:none!important}
html body #community-app#community-app#community-app .thread-manage-menu .tm-status-row{display:grid;grid-template-columns:auto minmax(130px,1fr);align-items:center;gap:12px;border-bottom:1px solid #ffffff14}
html body #community-app#community-app#community-app .thread-manage-menu .tm-status-row .tm-label{margin:0;white-space:nowrap}
html body #community-app#community-app#community-app .thread-manage-menu .tm-status-row select{min-width:0;width:100%;padding:7px 26px 7px 9px;border:1px solid #ffffff2b;border-radius:6px;background:#151b21;color:#f1f4f7;font-family:inherit;font-size:12px;font-weight:600}
html body #community-app#community-app#community-app .thread-view-heading .thread-header-bookmark[aria-pressed=true]{color:#fff!important}
html body #community-app#community-app#community-app .thread-view-heading .thread-header-bookmark[aria-pressed=true] svg path{fill:#fff!important}
html body #community-app#community-app#community-app #toggle-watch-thread[aria-pressed=true] svg path{fill:#fff!important}
html body #community-app#community-app#community-app #toggle-watch-thread[aria-pressed=true] svg circle{fill:#161c22!important;stroke:#161c22!important}
@media(max-width:1199px){html body #community-app#community-app#community-app .thread-view-heading .thread-header-bookmark{display:none!important}}