/* GSC Liquid Glass — shared visual system. Loaded after legacy component geometry. */
:root {
  --app-width: 1320px; --app-gutter: 20px;
  --brand: #283968; --brand-dark: #1d294f; --brand-mid: #5368ad;
  --gold: #efb33f; --muted: #596780; --line: #dce2ef;
  --glass: rgba(255,255,255,.86); --glass-border: rgba(255,255,255,.95);
  --glass-shadow: 0 12px 40px #26365e0c, inset 0 1px 0 #fff;
}
html { font-size: 16px; scroll-padding-top: 110px; }
body { color: #26334d; line-height: 1.65; background: radial-gradient(ellipse at 0 0,#dfe6fa 0,transparent 48%),radial-gradient(ellipse at 100% 20%,#ebe3f4 0,transparent 42%),#f3f5fa; background-attachment: fixed; }
body:before,body:after { display: none; }
a { color: #40599a; text-underline-offset: 4px; }
h1,h2,h3 { color: var(--brand-dark); font-weight: 700; line-height: 1.4; }
.text-muted,.stat-meta,.notification-meta { color: var(--muted)!important; }
.skip-link { position: fixed; top: -100px; left: 24px; z-index: 3000; padding: 12px 20px; background: white; border-radius: 12px; }
.skip-link:focus { top: 12px; }
:focus-visible { outline: 3px solid #5368ad; outline-offset: 4px; }
.brand-nav { margin: 16px auto 0; width: calc(100% - var(--app-gutter) * 2); max-width: var(--app-width); top: 12px; border: 1px solid #ffffff40; border-radius: 22px; background: linear-gradient(120deg,#202d55f5,#405183ed); box-shadow: 0 14px 36px #23335b24!important; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); padding: 12px 8px; }
.brand-nav>.container { max-width: 100%; gap: 10px; }
.navbar-brand { gap: 12px!important; font-size: 1.05rem; }
.brand-nav .navbar-nav a.nav-link { font-size: .84rem; padding: 10px 12px; border-radius: 12px; white-space: nowrap; }
.brand-nav .navbar-nav a.nav-link[aria-current=page] { background: #ffffff20; box-shadow: inset 0 -2px var(--gold),inset 0 1px #ffffff25; }
.brand-nav span.nav-profile { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .8rem; border: 0; background: #ffffff0c; }
.lang-btn:not(.active) { opacity: 1; }
.language-switcher { margin: 0; flex-shrink: 0; }
body:not(.login-page) main.container { width: calc(100% - var(--app-gutter) * 2); max-width: var(--app-width); padding-left: 0; padding-right: 0; }
main.container { max-width: var(--app-width); padding-top: 38px!important; padding-bottom: 24px!important; }
.page-heading,.community-hero,.inbox-header { padding: 12px 0 24px; margin-bottom: 24px; border-bottom: 1px solid #cbd4e680; }
.page-heading h1,.inbox-header h1,.community-hero h1 { font-size: clamp(1.65rem,2.6vw,2.2rem); letter-spacing: -.035em; }
.eyebrow { color: #63749a; font-size: .68rem; letter-spacing: .16em; }
.card { border: 1px solid var(--glass-border); border-radius: 22px; background: var(--glass); box-shadow: var(--glass-shadow); backdrop-filter: none; -webkit-backdrop-filter: none; transition: box-shadow .2s; }
.card:before { display: none; }
.card:hover { transform: none; box-shadow: var(--glass-shadow); }
.card-header,.card-footer { background: #ffffff40!important; border-color: var(--line); padding: 20px 24px; }
.card-body { padding: 24px; }
.stat-card { min-height: 164px; background: linear-gradient(135deg,#ffffffed,#eef1fbbf); }
.stat-card:before { display: block; width: 4px; inset: 28px auto 28px 0; background: var(--gold); border-radius: 0 6px 6px 0; }
.stat-value { font-size: clamp(2rem,3.2vw,2.8rem); letter-spacing: -.055em; font-variant-numeric: tabular-nums; }
.stat-label { font-size: .88rem; color: #52617e; }
.stat-meta { font-size: .77rem; }
.btn { border-radius: 12px; padding: 10px 18px; min-height: 44px; font-size: .88rem; }
.btn-sm { padding: 7px 12px; min-height: 36px; font-size: .79rem; }
.btn:before { display: none; }
.btn:hover { transform: none; }
.btn-primary { background: linear-gradient(135deg,#304377,#4c609e); border: 1px solid #41578c; box-shadow: 0 5px 12px #30437720,inset 0 1px #ffffff30; }
.btn-primary:hover { background: #263968; }
.btn-light,.btn-outline-secondary,.btn-outline-primary { background: #ffffffa6; border-color: #d2daeb; color: #354a79; }
.btn-outline-danger:hover { color: white; }
.btn:disabled { cursor: default; }
.form-label { font-weight: 600; color: #425372; font-size: .88rem; }
.form-control,.form-select { background-color: #ffffffdf; border: 1px solid #ced7e9; border-radius: 12px; min-height: 46px; padding: 11px 14px; backdrop-filter: none; -webkit-backdrop-filter: none; }
.form-control::placeholder { color: #738099; }
.form-control:focus,.form-select:focus { background-color: white; border-color: #6d80b5; box-shadow: 0 0 0 4px #5368ad15; }
input[type=checkbox] { accent-color: var(--brand); width: 17px; height: 17px; vertical-align: middle; }
.table { --bs-table-bg: transparent; color: #34415c; font-size: .86rem; }
.table thead th { background: #edf1f8; color: #52617e; font-size: .77rem; padding: 15px 20px; }
.table td { padding: 18px 20px; border-color: #e4e9f2; overflow-wrap: anywhere; }
.table-hover tbody tr:hover { --bs-table-bg-state: #eef2fa; }
.table-controls { padding: 20px 24px; gap: 16px; background: #f9faff90; border-color: var(--line); }
.table-controls label:first-child { flex: 2; min-width: 190px; }
.table-pagination { padding: 18px 24px; flex-wrap: wrap; border-top: 1px solid var(--line); }
.badge { border-radius: 8px; padding: .45em .7em; font-weight: 600; }
.badge.text-bg-secondary { background: #e9edf6!important; color: #415477!important; }
.inbox { width: 100%; max-width: none; min-height: 440px; }
.inbox-header p { color: var(--muted); margin: 8px 0 0; }
.inbox-header h1 .badge { vertical-align: middle; font-size: .5em; background: #e4eaf8!important; color: #3e528b; }
.inbox-tabs { display: inline-flex; padding: 5px; gap: 4px; border: 1px solid white; border-radius: 16px; background: #e6ebf5a0; margin: 0 0 22px; }
.inbox-tabs a { background: transparent; color: #50617f; border-radius: 12px; padding: 9px 22px; font-size: .88rem; }
.inbox-tabs .active { background: white; color: var(--brand); box-shadow: 0 3px 10px #28396812; font-weight: 700; }
.inbox-search { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 16px; border: 1px solid white; border-radius: 18px; background: #ffffff65; margin-bottom: 20px; }
.inbox-search .form-control { flex: 1 1 240px; width: auto; }
.notification-row { padding: 24px; gap: 18px; }
.notification-row a { font-size: .96rem; overflow-wrap: anywhere; }
.notification-row a:hover { text-decoration: underline; }
.notification-row .flex-grow-1 { min-width: 0; }
.notification-row.unread { background: #edf1fc; border-left: 3px solid #5269ac; }
.notification-icon { width: 48px; height: 48px; border-radius: 16px; background: linear-gradient(135deg,#e3e9fa,#f1edfa); color: #5269ac; font-size: 1.15rem; }
.notification-meta { font-size: .76rem; margin-top: 8px; }
.topic-card,.forum-article,.forum-reply { border-radius: 20px; }
.comment-bubble,.reply-context,.comment-preview { border-radius: 14px; }
.wolf-login-card { max-width: 520px; border-top: 1px solid white; box-shadow: 0 26px 70px #26365e16,inset 0 1px white; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
.wolf-login-card h1 { margin-top: 14px; }
.site-footer { margin-top: 40px!important; padding: 24px 8px 0; background: #ffffff55!important; border: 1px solid #ffffffb0!important; border-radius: 20px; box-shadow: none; }
.site-footer .footer-brand { display: flex; align-items: center; gap: 16px; }
.site-footer .footer-brand img { width: 112px!important; margin: 0; }
.footer-description { font-size: .78rem; max-width: 390px; margin-top: 8px; }
.site-footer address,.site-footer a { font-size: .77rem; }
.site-footer h2 { font-size: .8rem; margin-bottom: 10px; }
.footer-brand strong { font-size: .82rem; }
.footer-brand span { font-size: .64rem; }
.footer-bottom { margin: 20px -8px 0; padding: 12px 24px; background: #ffffff40; font-size: .7rem; }
@media (min-width:992px) and (max-width:1250px) { .brand-nav .navbar-nav a.nav-link { padding: 9px 7px; font-size: .76rem; } .brand-nav span.nav-profile { max-width: 100px; padding: 7px; } .navbar-brand span { display: none; } }
@media (max-width:991.98px) { :root { --app-gutter: 12px; } .brand-nav { top: 8px; margin-top: 8px; border-radius: 18px; } .brand-nav>.container { flex-wrap: wrap; } .navbar-collapse { order: 4; width: 100%; } .navbar-toggler { margin-left: auto; } .language-switcher { margin: 0; } .brand-nav .nav-profile { max-width: 100%; } }
@media (max-width:767.98px) { main.container { padding-top: 26px!important; } .page-heading { flex-wrap: wrap; } .card-body { padding: 20px; } .stat-card { min-height: 148px; } .responsive-table td { padding: 8px 0; } .notification-row { padding: 18px; align-items: flex-start; } .inbox-header { flex-wrap: wrap; } .site-footer .footer-brand { flex-wrap: wrap; } .table-controls { padding: 16px; } }
@media (max-width:420px) { .navbar-brand span { display: none; } .navbar-brand img { width: 120px!important; height: 36px!important; } .lang-btn { min-width: 2.3rem; } .inbox-tabs a { padding: 8px 16px; } .inbox-search .form-control { flex-basis: 100%; min-width: 0; } .inbox-search .btn { flex: 1; min-width: 90px; } .notification-icon { width: 36px; height: 36px; border-radius: 12px; } }
@supports not (backdrop-filter:blur(1px)) { .brand-nav { background: #2c3d70; } .card { background: #fff; } }
@media (prefers-reduced-motion:reduce) { *,*:before,*:after { animation: none!important; transition: none!important; scroll-behavior: auto!important; } }
@media print { body { background: white!important; } .brand-nav,.skip-link,.site-footer { display: none!important; } .card { background: white!important; backdrop-filter: none; } main.container { padding: 0!important; } }
