/* Shared urban DA for community pages and secondary components.
 * Presentation only: retain layouts, avatar shapes, status colours and behaviour.
 * Loaded with the existing JRPGFR_URBAN_DA visual layer.
 */
:root {
    --urban-surface: #141417;
    --urban-border: #ffffff24;
    --urban-shadow: 4px 4px 0 #0005;
    --urban-panel-radius: 12px;
    --urban-control-radius: 5px;
}

/* Keep the navigation's treatment consistent outside the homepage. */
#masthead .yuki-navbar-shell {
    border-color: var(--urban-border);
    border-radius: 14px;
    box-shadow: none;
}
#masthead #primary-menu > li > a { font-weight: 900; letter-spacing: .025em; }
#masthead .yuki-navbar-profile > div > div {
    background: var(--urban-surface);
    border-color: var(--urban-border);
    border-radius: 8px;
    box-shadow: var(--urban-shadow);
    backdrop-filter: none;
}
#masthead .yuki-navbar-profile > div > div > a { border-radius: var(--urban-control-radius); }

/* Public and account profile panels; leave avatar wrappers untouched. */
:is(.yuki-public-profile, .yuki-account-profile) { --community-accent: var(--yuki-accent, #ff3e3e); }
:is(.yuki-public-profile, .yuki-account-profile) section,
.yuki-public-profile [class~="rounded-[2rem]"],
.yuki-account-profile [class~="rounded-2xl"] {
    background-color: var(--urban-surface);
    border-color: var(--urban-border);
    border-radius: var(--urban-panel-radius);
    box-shadow: var(--urban-shadow);
}
:is(.yuki-public-profile, .yuki-account-profile) > div > section:first-of-type {
    border-top: 3px solid var(--community-accent);
}
:is(.yuki-public-profile, .yuki-account-profile) h1 { font-weight: 900; letter-spacing: -.035em; }
:is(.yuki-public-profile, .yuki-account-profile) h2 {
    color: #d4d4dc;
    letter-spacing: .1em;
    font-weight: 800;
}
.yuki-public-profile .glass { background: var(--urban-surface); backdrop-filter: none; border-radius: 8px; }
.yuki-public-profile a[class~="rounded-2xl"],
.yuki-account-profile :is(button, a, input:not([type="checkbox"]):not([type="radio"]), select, textarea)[class*="rounded-"] {
    border-radius: var(--urban-control-radius);
}
/* Preserve circular controls attached to avatars. */
.yuki-account-profile button[class~="rounded-full"][class~="absolute"] { border-radius: 9999px; }
.yuki-account-profile > div > nav {
    background: var(--urban-surface);
    border-color: var(--urban-border);
    border-radius: 8px;
    box-shadow: var(--urban-shadow);
    backdrop-filter: none;
}
.yuki-account-profile [data-profile-tab-trigger] { border-radius: var(--urban-control-radius); }
.yuki-account-profile [data-profile-tab-trigger][class~="bg-yuki-accent/15"] {
    border-color: var(--community-accent);
    box-shadow: inset 0 -2px 0 var(--community-accent);
}

/* Collection cards and filter bar use the encyclopedia's blue accent. */
.collection-container { --community-accent: var(--ui-accent, #00a8ff); }
.collection-container .yuki-collection-heading {
    padding-bottom: 24px;
    border-bottom: 1px solid var(--urban-border);
}
.collection-container .yuki-collection-heading h1 { letter-spacing: -.035em; }
.collection-container .yuki-collection-heading h1 > div { border-radius: 0; background: var(--community-accent); }
.collection-container .yuki-collection-filters {
    background: var(--urban-surface);
    border: 1px solid var(--urban-border);
    border-radius: 8px;
    box-shadow: 3px 3px 0 #0005;
}
.collection-container .yuki-collection-filters a { border: 1px solid transparent; border-radius: var(--urban-control-radius); }
.collection-container .yuki-collection-filters a:is([class~="bg-white/10"], [class~="bg-yuki-accent/20"]) {
    color: var(--community-accent);
    background: rgba(var(--ui-rgb, 0,168,255), .12);
    border-color: var(--community-accent);
    box-shadow: inset 0 -2px 0 var(--community-accent);
}
.collection-container :is(.collection-grid-item, .yuki-collection-empty) {
    border-radius: var(--urban-panel-radius);
    border-color: var(--urban-border);
    background: var(--urban-surface);
    box-shadow: var(--urban-shadow);
}
.collection-container .collection-grid-item:hover { border-color: var(--community-accent); }
.collection-container :is(.collection-grid-item, .yuki-collection-empty) :is(button, a)[class*="rounded-"] { border-radius: var(--urban-control-radius); }

/* Classic comments retain their thread structure and form behaviour. */
.yuki-editorial-comments { --community-accent: var(--ui-accent, var(--yuki-accent, #ff3e3e)); }
.yuki-editorial-comments > h3 {
    padding: 16px 0;
    border-bottom: 1px solid var(--urban-border);
    letter-spacing: .12em;
    font-weight: 800;
}
.yuki-editorial-comments .yuki-comment-login {
    background: var(--urban-surface);
    border: 1px solid var(--urban-border);
    border-top: 3px solid var(--community-accent);
    border-radius: var(--urban-panel-radius);
    box-shadow: var(--urban-shadow);
    backdrop-filter: none;
}
.yuki-editorial-comments .yuki-comment-login > div:first-child { border-radius: 8px; }
.yuki-editorial-comments .yuki-comment-login a { border-radius: var(--urban-control-radius) !important; }
.yuki-editorial-comments .x-comment { border-bottom: 1px solid #ffffff12; }
.yuki-live-comments > div[class~="h-[600px]"] {
    background: var(--urban-surface);
    border-color: var(--urban-border);
    border-top: 3px solid var(--ui-accent, var(--yuki-accent, #ff3e3e));
    border-radius: var(--urban-panel-radius);
    box-shadow: var(--urban-shadow);
}
.yuki-live-comments [class~="rounded-r-2xl"] { border-radius: 0 8px 8px 0; }

/* Saved articles, including cards inserted by reading-list.js. */
#reading-list-drawer { background: var(--urban-surface); border-color: var(--urban-border); }
#reading-list-drawer > div:first-child { border-bottom: 3px solid var(--yuki-accent, #ff3e3e); background: #19191d; }
#reading-list-drawer h2 { font-weight: 900; letter-spacing: -.025em; }
#reading-list-drawer :is(button, a)[class*="rounded-"] { border-radius: var(--urban-control-radius) !important; }
#reading-list-items > div > div {
    border-radius: 8px;
    border-color: var(--urban-border);
    background: #ffffff04;
    box-shadow: 2px 2px 0 #0004;
}

/* Error pages share the editorial panel and control treatment. */
.yuki-error-page .glass {
    background: var(--urban-surface);
    border-color: var(--urban-border);
    border-radius: var(--urban-panel-radius);
    box-shadow: var(--urban-shadow);
    backdrop-filter: none;
}
.yuki-error-page > .glass { border-top: 3px solid var(--yuki-accent, #ff3e3e); }
.yuki-error-page :is(input, button, a)[class*="rounded-"] { border-radius: var(--urban-control-radius); }
.yuki-error-page h2 { letter-spacing: .1em; font-weight: 800; }