/* One owner for brand, header, dropdowns, notifications, breadcrumb and footer. */
/* Header owner. Pages retain only their scene-specific positioning. */
.site-header { background:var(--forest-night); border-bottom:1px solid var(--editorial-line); position:sticky; top:0; z-index:1030; }
.site-header .navbar { padding-block:22px; min-height:76px; }
.site-header .navbar > .container { gap:8px; width:100%; max-width:none; padding-inline:var(--forest-gutter); }
.site-brand { display:inline-flex; align-items:center; gap:8px; color:var(--forest-gold); text-decoration:none; font-family:var(--forest-serif); font-weight:700; font-size:20px; letter-spacing:.12em; line-height:1.2; min-width:0; }
.site-brand:hover { color:var(--forest-cream); }
.brand-mark { display:block; width:1em; height:1.25em; font-size:30px; flex:0 0 30px; background:currentColor; mask:url("/img/brand/rhinoceros-beetle.svg?v=70ed4fe4b63a") center / contain no-repeat; }
.brand-en { display:block; font:500 8px/1.2 var(--font-sans); letter-spacing:.16em; text-transform:uppercase; color:var(--forest-gold); }
.header-tools { display:flex; align-items:center; gap:var(--header-icon-gap); margin-inline-start:auto; flex-shrink:0; }
.header-action { display:inline-flex; align-items:center; justify-content:center; width:var(--header-icon-size); height:var(--header-icon-size); min-width:var(--header-icon-size); min-height:var(--header-icon-size); flex:0 0 var(--header-icon-size); padding:0; border:1px solid transparent; border-radius:2px; box-sizing:border-box; color:var(--editorial-ink); background:transparent; line-height:1; text-decoration:none; position:relative; }
.header-action > .bi { display:inline-flex; align-items:center; justify-content:center; width:var(--header-icon-slot); height:var(--header-icon-slot); flex:0 0 var(--header-icon-slot); font-size:var(--header-icon-slot); line-height:1; }
.header-action > .bi::before { display:block; }
.header-action:hover,.header-action[aria-expanded="true"] { background:var(--editorial-paper); color:var(--editorial-ink); }
.navbar-toggler.header-action:focus { box-shadow:none; }
.header-action:focus-visible { outline:2px solid var(--editorial-ink); outline-offset:3px; box-shadow:none; }
.header-action[aria-busy="true"] { opacity:.65; }
.site-header .nav-link { color:var(--editorial-ink); min-height:44px; display:flex; align-items:center; gap:8px; padding:8px .55rem; font-size:14px; font-weight:500; }
.site-header button.nav-link { background:transparent; border:0; text-align:left; }
.site-header .nav-link:hover { color:var(--forest-gold); }
.site-header .nav-link.active { color:var(--editorial-ink); text-decoration:underline; text-underline-offset:8px; }
.site-header .nav-link:focus-visible { outline:2px solid var(--editorial-ink); outline-offset:2px; }
.site-header .dropdown-menu { --bs-dropdown-bg:var(--editorial-white); --bs-dropdown-color:var(--forest-cream); --bs-dropdown-header-color:var(--forest-muted); --bs-dropdown-border-color:var(--editorial-line); --bs-dropdown-link-color:var(--editorial-ink); --bs-dropdown-link-hover-bg:var(--editorial-paper); --bs-dropdown-link-hover-color:var(--editorial-ink); border-radius:2px; box-shadow:none; }
.site-header .dropdown-item { min-height:44px; display:flex; align-items:center; white-space:normal; overflow-wrap:anywhere; }
.site-header .dropdown-toggle::after { margin:0; }
.site-header .btn-amber { --bs-btn-color:var(--forest-night); --bs-btn-bg:var(--forest-gold); --bs-btn-border-color:var(--forest-gold); }
.header-search-panel { position:absolute; top:100%; left:0; right:0; background:var(--editorial-white); border-bottom:1px solid var(--editorial-line); }
.header-badge,.notification-badge { position:absolute; top:-5px; right:-5px; display:flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 4px; border-radius:2px; background:var(--forest-gold); color:var(--forest-night); font:700 11px/1 var(--font-sans); white-space:nowrap; }
.notification-badge { background:var(--editorial-danger); color:white; }
.account-menu { min-width:220px; max-width:calc(100vw - 32px); max-height:calc(100dvh - var(--header-h) - 16px); overflow-y:auto; }
.account-menu .dropdown-header { color:var(--editorial-ink); font-weight:500; white-space:normal; overflow-wrap:anywhere; }
.account-menu form { margin:0; } .account-menu button.dropdown-item { width:100%; text-align:left; border:0; }
@media(min-width:1200px) { .header-tools { order:1; margin-inline-start:16px; } .site-header .site-brand { flex-shrink:0; } }
@media(max-width:1199.98px) { .site-header .navbar { padding-block:16px; } .site-brand { font-size:18px; } .site-nav { max-height:calc(100dvh - var(--header-h)); overflow-y:auto; } }
@media(max-width:575.98px) { .site-header .navbar { padding-block:12px; min-height:60px; } .site-header .site-brand { font-size:14px; letter-spacing:0; gap:4px; } .site-header .brand-en { font-size:8px; letter-spacing:0; } .site-header .brand-mark { font-size:24px; flex-basis:24px; } }
/* Footer and page furniture */
.site-footer { background:var(--editorial-paper); color:var(--editorial-muted); border-top:1px solid var(--editorial-line); }
.site-footer > .container > .row { --bs-gutter-x:min(1.5rem,32px); }
.site-footer .site-brand { color:var(--forest-gold); }
.site-footer p,.site-footer a { color:var(--editorial-muted); } .site-footer a { text-decoration:none; }
.site-footer h4 { color:var(--editorial-ink); font-size:1rem; margin-bottom:1rem; }
.site-footer a:hover { color:var(--editorial-ink); text-decoration:underline; }
.site-footer .footer-bottom { border-top:1px solid var(--editorial-line); padding-block:1.25rem; font-size:.875rem; }
.footer-description { max-width:34ch; } .site-footer li a { display:inline-flex; align-items:center; min-height:44px; }
.breadcrumb-bar { background:var(--editorial-paper); border-bottom:1px solid var(--editorial-line); }
.breadcrumb { --bs-breadcrumb-divider-color:var(--editorial-muted); margin:0; padding-block:.85rem; font-size:.875rem; }
.breadcrumb-item { min-width:0; overflow-wrap:anywhere; }
.breadcrumb a { color:var(--editorial-muted); text-decoration:none; }
.breadcrumb .breadcrumb-item.active { color:var(--editorial-ink); font-weight:500; }
.back-to-top { position:fixed; right:20px; bottom:20px; width:44px; height:44px; padding:0; border:1px solid var(--editorial-line); border-radius:2px; background:var(--editorial-white); color:var(--editorial-ink); display:grid; place-items:center; opacity:0; visibility:hidden; transition:opacity .2s,visibility .2s; z-index:1020; }
.back-to-top.is-visible { opacity:1; visibility:visible; } .back-to-top:hover { background:var(--editorial-paper); }

/* Header notifications are shared across all pages, independent of forum.css. */
.notification-dropdown-menu { width:320px; max-width:calc(100vw - 32px); max-height:min(420px,calc(100dvh - var(--header-h) - 16px)); overflow-y:auto; border-radius:2px; padding:0; box-shadow:none; }
.notification-item { display:block; padding:14px 16px; border-bottom:1px solid var(--editorial-line); font-size:14px; text-decoration:none; color:var(--editorial-ink); }
.notification-item.unread { background:var(--editorial-paper); border-left:2px solid var(--editorial-forest); }
.notification-item:hover { background:var(--editorial-paper); }
@media(max-width:575.98px) { .site-header .notification-dropdown-menu { position:fixed; inset:var(--header-h) 16px auto 16px; width:auto; max-height:calc(100dvh - var(--header-h) - 16px); } }


.notification-time { font-size:.75rem; }
.notification-item { overflow-wrap:anywhere; }

/* The homepage shares the shell; only its background overlays the photograph. */
.forest-home > .site-header { grid-area:1 / 1; align-self:start; border:0; background:linear-gradient(180deg,rgba(5,16,8,.85),rgba(5,16,8,.25)); }
.forest-home > .site-footer { grid-column:1; }
.forest-home .site-header.is-solid,.forest-home .site-header:has(.site-nav.show) { background:var(--forest-night); }

.site-header .btn-outline-sand { --bs-btn-color:var(--forest-cream); --bs-btn-border-color:var(--forest-hairline); --bs-btn-hover-bg:var(--forest-gold); --bs-btn-hover-border-color:var(--forest-gold); --bs-btn-hover-color:var(--forest-night); --bs-btn-active-bg:var(--forest-gold); --bs-btn-active-color:var(--forest-night); }