:root{
    --bg:#050505;
    --bg2:#0e0e10;
    --panel:#0f1012;
    --panel2:#17191d;
    --text:#f3efe9;
    --muted:#c8b19c;
    --line:#675346;
    --steel1:#31343a;
    --steel2:#111316;
    --orange:#ff7c26;
    --orange2:#ff4512;
    --gold:#ffd08c;
    --shadow:0 18px 50px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08), inset 0 0 0 1px rgba(255,130,53,.08);
    --glow:0 0 0 1px rgba(255,130,53,.30), 0 0 18px rgba(255,111,44,.15), inset 0 0 24px rgba(255,111,44,.08);
    --bevel:polygon(18px 0, calc(100% - 18px) 0, 100% 18px, 100% calc(100% - 18px), calc(100% - 18px) 100%, 18px 100%, 0 calc(100% - 18px), 0 18px);
    --bevel-sm:polygon(12px 0, calc(100% - 12px) 0, 100% 12px, 100% calc(100% - 12px), calc(100% - 12px) 100%, 12px 100%, 0 calc(100% - 12px), 0 12px);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
    color:var(--text);
    font:16px/1.45 Inter,Segoe UI,Arial,sans-serif;
    background:
      radial-gradient(circle at top center, rgba(255,110,36,.18), transparent 24%),
      linear-gradient(180deg, rgba(0,0,0,.28), rgba(0,0,0,.64)),
      #050505;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.site-bg{
    position:fixed;inset:0;z-index:-2;
    background:
      linear-gradient(180deg, rgba(5,5,6,.18), rgba(5,5,6,.78) 22%, rgba(5,5,6,.96) 100%),
      url('/assets/bg-ambience.png') center top/cover no-repeat;
    opacity:.95;
}
body::before{
    content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
    background:
      linear-gradient(180deg, rgba(255,130,53,.04), transparent 260px),
      radial-gradient(circle at 50% 0, rgba(255,112,40,.08), transparent 30%);
}
.wrap{width:min(1260px, calc(100% - 32px));margin:0 auto}
.page{padding:12px 0 34px}
.topbar{
    position:sticky;top:0;z-index:30;
    background:linear-gradient(180deg, rgba(10,10,12,.86), rgba(10,10,12,.72));
    border-bottom:1px solid rgba(255,130,53,.18);
    backdrop-filter:blur(8px);
    box-shadow:0 10px 28px rgba(0,0,0,.34);
}
.nav-row{min-height:78px;display:flex;align-items:center;gap:18px}
.brand{display:flex;align-items:center;gap:14px;min-width:250px}
.brand-mark{
    width:54px;height:54px;border-radius:10px;
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 30%),
      linear-gradient(180deg, rgba(255,130,53,.06), rgba(255,130,53,0)),
      url('/assets/emblem-fire.png') center/cover no-repeat;
    border:1px solid rgba(255,130,53,.26);
    box-shadow:var(--glow);
}
.brand-name{font-size:1.85rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;line-height:1;text-shadow:0 0 16px rgba(255,114,26,.18)}
.brand-tagline{color:var(--muted);font-size:.84rem;margin-top:3px}
.nav{display:flex;flex:1;justify-content:center;gap:10px;flex-wrap:wrap}
.nav a,.btn,.btn-muted,.quick-link,.status-chip,.role-badge,.tag,.user-chip,.mini-card,.forum-row,.topic-row,.message-row,.stat-card,.server-card,.panel,.admin-tile,.admin-user-item,.checkbox-card,.admin-form-box,.auth-card,.simple-box{position:relative}
.nav a,.btn,.btn-muted{
    clip-path:var(--bevel-sm);
    border:1px solid rgba(255,130,53,.30);
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 28%),
      linear-gradient(180deg, rgba(40,44,50,.95), rgba(15,16,18,.98));
    box-shadow:var(--glow), inset 0 1px 0 rgba(255,255,255,.07);
}
.nav a{padding:10px 16px;color:#f2d9c6;font-weight:800;font-size:.95rem}
.nav a:hover,.btn:hover,.btn-muted:hover,.quick-link:hover{filter:brightness(1.08)}
.nav-actions{display:flex;align-items:center;gap:12px}
.user-pill{
    display:inline-flex;flex-direction:column;gap:2px;padding:10px 14px 9px;
    border-radius:10px;border:1px solid rgba(255,130,53,.24);
    background:rgba(14,15,18,.82);box-shadow:var(--glow)
}
.user-pill small{color:var(--muted)}
.btn,.btn-muted{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 18px;font-weight:800;color:#f7dfd1}
.btn{
    background:
      linear-gradient(180deg, rgba(255,170,99,.18), rgba(255,255,255,0) 28%),
      linear-gradient(180deg, #4a2b1a, #1e1512),
      linear-gradient(135deg, var(--orange), var(--orange2));
}
.btn-muted{
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 32%),
      linear-gradient(180deg, #2b2f36, #15171b)
}
.notice{
    clip-path:var(--bevel-sm);
    padding:14px 16px;margin-bottom:16px;border:1px solid rgba(255,130,53,.18);
    background:linear-gradient(180deg, rgba(30,21,16,.94), rgba(14,14,16,.96));
    box-shadow:var(--glow)
}
.notice-warning{color:#ffd18f}.notice-success{color:#abff9f}.notice-error{color:#ffb0a5}

.hero-card{
    display:grid;
    gap:14px;
    margin-bottom:18px;
    padding:12px;
    clip-path:var(--bevel);
    background:
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 18%),
      linear-gradient(180deg, rgba(255,113,26,.10), rgba(255,113,26,0) 40%),
      linear-gradient(180deg, rgba(40,44,50,.98), rgba(12,13,15,.98));
    border:1px solid rgba(255,130,53,.28);
    box-shadow:var(--shadow), 0 0 36px rgba(255,103,37,.12);
}
.hero-banner{
    min-height:420px;
    clip-path:var(--bevel);
    border:1px solid rgba(255,130,53,.30);
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.03), inset 0 0 34px rgba(255,115,30,.12), 0 0 28px rgba(255,90,20,.08);
    background:
      linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.08)),
      url('/assets/hero-fire.png') center/cover no-repeat;
}
.server-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.server-card,.panel,.stat-card,.auth-card,.simple-box,.admin-tile,.admin-user-item,.checkbox-card,.admin-form-box,.mini-card{
    clip-path:var(--bevel-sm);
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 16%),
      linear-gradient(180deg, rgba(255,115,30,.08), rgba(255,115,30,0) 36%),
      linear-gradient(180deg, rgba(41,46,52,.98), rgba(12,13,15,.99));
    border:1px solid rgba(255,130,53,.28);
    box-shadow:var(--shadow), var(--glow);
    overflow:hidden;
}
.server-card::before,.panel::before,.stat-card::before,.mini-card::before,.quick-link::before{
    content:"";position:absolute;inset:1px;clip-path:inherit;pointer-events:none;
    border:1px solid rgba(255,255,255,.03);
}
.server-card::after,.panel::after,.stat-card::after,.quick-link::after,.mini-card::after{
    content:"";position:absolute;left:12px;right:12px;bottom:10px;height:1px;
    background:linear-gradient(90deg, transparent, rgba(255,130,53,.72), transparent);
    pointer-events:none;
}
.server-card{
    padding:16px 18px 18px;
    display:grid;gap:6px;min-height:108px;
    background:
      linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,0) 16%),
      linear-gradient(180deg, rgba(255,115,30,.11), rgba(255,115,30,0) 40%),
      linear-gradient(180deg, rgba(28,31,36,.98), rgba(8,9,11,.99));
}
.server-title{font-size:1.18rem;font-weight:900;color:#fff2e8}
.server-meta{color:#ceb39d;font-size:.94rem}
.status-chip{
    display:inline-flex;justify-self:start;padding:8px 14px;font-size:.83rem;font-weight:900;letter-spacing:.04em;text-transform:uppercase;
    clip-path:var(--bevel-sm);
    background:
      linear-gradient(180deg, rgba(255,200,145,.14), rgba(255,255,255,0) 30%),
      linear-gradient(180deg, #552615, #261511);
    border:1px solid rgba(255,130,53,.35);
    color:#ffd7b3;
    box-shadow:0 0 0 1px rgba(255,130,53,.12), inset 0 0 16px rgba(255,86,22,.12);
}

.content-grid{
    display:grid;
    grid-template-columns:minmax(0,1.95fr) minmax(290px,.92fr);
    gap:18px;
    align-items:start;
}
.main-column,.sidebar{display:grid;gap:18px}
.panel{padding:18px}
.panel-lg{padding:20px}
.panel-head{
    display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;
    padding-bottom:10px;border-bottom:1px solid rgba(255,130,53,.18)
}
.panel-head h2{margin:0;font-size:2rem;font-weight:900;letter-spacing:.01em}
.panel-head a{color:#ffd8ba;font-weight:800}
.visually-hidden{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}

.shoutbox-form{
    display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;margin-bottom:12px
}
.shoutbox-form input,.auth-form input,.auth-form textarea,.admin-form-box input,.admin-form-box textarea,.admin-form-box select{
    width:100%;min-height:48px;padding:0 16px;color:#fff;border:none;outline:none;clip-path:var(--bevel-sm);
    background:
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 28%),
      linear-gradient(180deg, rgba(28,31,36,.96), rgba(9,10,12,.98));
    border:1px solid rgba(255,130,53,.22);
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.02), inset 0 0 16px rgba(255,115,30,.06);
}
.muted-box{
    padding:14px 16px;
    clip-path:var(--bevel-sm);
    color:#dfc8b4;
    background:linear-gradient(180deg, rgba(29,31,35,.92), rgba(12,13,15,.96));
    border:1px solid rgba(255,130,53,.18);
}
.shoutbox-list{display:grid;gap:10px}
.message-row{
    display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:12px;align-items:start;
    padding:14px;
}
.avatar{
    width:56px;height:56px;display:grid;place-items:center;font-weight:900;font-size:1.1rem;
    clip-path:var(--bevel-sm);
    background:
      radial-gradient(circle at 30% 30%, rgba(255,130,53,.20), transparent 40%),
      linear-gradient(180deg, #343841, #171a1f);
    border:1px solid rgba(255,130,53,.25);
    box-shadow:var(--glow);
}
.message-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.role-badge{
    display:inline-flex;padding:5px 9px;font-size:.74rem;font-weight:900;border-radius:999px;
    background:rgba(0,0,0,.36);border:1px solid color-mix(in srgb, var(--role-color, #fff) 42%, transparent);color:var(--role-color,#fff)
}
.message-text{color:#efe1d2}
.message-side{text-align:right;color:#b99e8b;font-size:.87rem}
.link-button{background:none;border:none;color:#ffd0a8;font-weight:800;cursor:pointer;padding:0}

.forum-home-list{display:grid;gap:10px}
.forum-row{
    display:grid;grid-template-columns:minmax(0,1.2fr) .55fr .8fr;gap:14px;align-items:center;padding:16px
}
.forum-row h3{margin:0 0 5px;font-size:1.18rem}
.forum-row h3 a{color:#fff2e9}
.forum-row p{margin:0;color:#caaf99}
.forum-row-stats{display:grid;gap:4px;color:#dbc1a8}
.forum-row-latest{color:#dbc1a8}
.forum-row-latest strong{display:block;color:#fff2e8;margin-bottom:4px}
.forum-row-latest small{color:#bf9f86}

.stats-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.stat-card{
    min-height:106px;display:grid;place-items:center;padding:18px;text-align:center;
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 20%),
      linear-gradient(180deg, rgba(255,113,26,.11), rgba(255,113,26,0) 40%),
      linear-gradient(180deg, rgba(28,31,36,.98), rgba(9,10,12,.99));
}
.stat-value{font-size:2.15rem;font-weight:900;color:#fff4ea;line-height:1}
.stat-label{margin-top:8px;color:#d5b79f;font-weight:800}

.online-line{margin:0 0 12px;color:#edd5bf;font-weight:700}
.online-users{display:flex;flex-wrap:wrap;gap:8px}
.user-chip{
    display:inline-flex;padding:8px 12px;font-size:.86rem;font-weight:800;
    clip-path:var(--bevel-sm);
    background:linear-gradient(180deg, #2e3239, #14161a);
    border:1px solid rgba(255,130,53,.18);
    color:#f0ddce;
}
.roles-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.role-group-card{
    clip-path:var(--bevel-sm);
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 16%),
      linear-gradient(180deg, color-mix(in srgb, var(--group-start) 28%, transparent), rgba(255,115,30,0) 40%),
      linear-gradient(180deg, rgba(35,38,44,.98), rgba(10,11,13,.99));
    border:1px solid rgba(255,130,53,.24);
    box-shadow:var(--shadow), inset 0 0 0 1px rgba(255,255,255,.03);
    overflow:hidden;
}
.role-group-card summary{
    list-style:none;cursor:pointer;padding:14px 14px 12px;display:flex;align-items:center;gap:8px;
    font-weight:900;color:#fff1e6;border-bottom:1px solid rgba(255,130,53,.15)
}
.role-group-card summary::-webkit-details-marker{display:none}
.role-list{display:grid;gap:8px;padding:12px}
.role-item{
    display:flex;gap:8px;align-items:center;padding:10px 12px;
    clip-path:var(--bevel-sm);
    background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0) 18%), linear-gradient(180deg, rgba(31,34,39,.96), rgba(12,13,15,.98));
    border:1px solid rgba(255,130,53,.14);
    color:var(--role-color,#fff);
    font-weight:800;
}

.sidebar-card{
    padding:0;overflow:hidden;
    background:
      linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)),
      linear-gradient(180deg, rgba(255,115,30,.10), rgba(255,115,30,0) 42%),
      linear-gradient(180deg, rgba(28,31,36,.98), rgba(9,10,12,.99));
}
.contact-avatar{
    min-height:360px;
    background:
      linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,.10)),
      url('/assets/admin-avatar-fire.png') center/cover no-repeat;
    border-bottom:1px solid rgba(255,130,53,.18);
}
.contact-name{
    margin:16px 18px 4px;font-size:2rem;font-weight:900;color:#ff6f39;text-shadow:0 0 16px rgba(255,111,57,.18)
}
.contact-role{
    margin:0 18px 18px;color:#f6eadf;font-weight:900;letter-spacing:.05em;text-transform:uppercase
}
.quick-links{display:grid;gap:10px}
.quick-link{
    display:flex;align-items:center;min-height:52px;padding:0 16px;font-weight:900;color:#f4ddca;
    clip-path:var(--bevel-sm);
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 16%),
      linear-gradient(180deg, rgba(31,34,39,.98), rgba(10,11,13,.99));
    border:1px solid rgba(255,130,53,.22);
}
.mini-card{
    display:grid;gap:4px;padding:14px 16px;color:#f4e4d6
}
.mini-card strong{font-size:1rem}
.mini-card small,.mini-card p{margin:0;color:#c6ab94}

.footer{
    border-top:1px solid rgba(255,130,53,.16);
    background:linear-gradient(180deg, rgba(8,8,10,.2), rgba(8,8,10,.82))
}
.footer-row{min-height:64px;display:flex;align-items:center;justify-content:space-between;color:#d0b49c}

@media (max-width:1100px){
    .content-grid{grid-template-columns:1fr}
    .roles-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .contact-avatar{min-height:280px}
}
@media (max-width:860px){
    .nav-row{flex-wrap:wrap;justify-content:center;padding:12px 0}
    .brand{justify-content:center}
    .nav{order:3;width:100%}
    .server-grid,.stats-row,.roles-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .forum-row{grid-template-columns:1fr}
    .hero-banner{min-height:270px;background-position:center top}
}
@media (max-width:560px){
    .wrap{width:min(100% - 18px, 100%)}
    .server-grid,.stats-row,.roles-grid{grid-template-columns:1fr}
    .shoutbox-form{grid-template-columns:1fr}
    .message-row{grid-template-columns:1fr}
    .message-side{text-align:left}
    .panel-head h2{font-size:1.45rem}
}/* ===== Full precision pass 3 ===== */
.page-home .topbar{
    position:absolute;
    top:0; left:0; right:0;
    background:linear-gradient(180deg, rgba(7,8,10,.35), rgba(7,8,10,.06));
    border-bottom:none;
    box-shadow:none;
    backdrop-filter:none;
}
.page-home .page{padding-top:28px}
.page-home .nav-row{
    min-height:74px;
    justify-content:space-between;
}
.page-home .nav{
    justify-content:center;
    gap:8px;
}
.page-home .nav a{
    background:
      linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0) 24%),
      linear-gradient(180deg, rgba(36,39,44,.88), rgba(12,13,16,.92));
}
.page-home .nav-actions .btn,
.page-home .nav-actions .btn-muted{
    min-width:126px;
    padding-inline:22px;
    box-shadow:0 0 0 1px rgba(255,130,53,.22), 0 0 20px rgba(255,110,36,.08), inset 0 0 0 1px rgba(255,255,255,.04);
}

.page-home .hero-card{
    margin-top:6px;
    padding:10px;
    gap:12px;
    border-color:rgba(255,130,53,.32);
    box-shadow:0 0 0 1px rgba(255,130,53,.12), 0 0 50px rgba(255,92,23,.12), inset 0 0 32px rgba(255,92,23,.07);
}
.page-home .hero-banner{
    min-height:480px;
    background-position:center top;
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.03),
      inset 0 0 44px rgba(255,115,30,.15),
      0 0 30px rgba(255,90,20,.08);
}
.hero-title-strip{
    clip-path:var(--bevel-sm);
    border:1px solid rgba(255,130,53,.30);
    background:
      linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,0) 16%),
      linear-gradient(180deg, rgba(255,124,38,.14), rgba(255,124,38,0) 40%),
      linear-gradient(180deg, rgba(31,34,39,.98), rgba(9,10,12,.99));
    box-shadow:var(--glow), inset 0 0 24px rgba(255,110,36,.06);
    padding:18px 24px;
}
.hero-title-kicker{
    color:#ff8a47;
    font-size:.82rem;
    font-weight:900;
    letter-spacing:.1em;
    text-transform:uppercase;
    margin-bottom:6px;
}
.hero-title-main{
    font-size:2.55rem;
    line-height:1.08;
    font-weight:900;
    color:#fff1e5;
    text-shadow:0 0 16px rgba(255,122,38,.16);
}

.page-home .server-grid{gap:12px}
.page-home .server-card{
    min-height:104px;
    padding:14px 16px 16px;
}
.page-home .server-title{
    font-size:1.1rem;
    text-transform:none;
}
.page-home .server-meta{
    font-size:1rem;
    color:#ffe3cb;
    font-weight:800;
}
.page-home .status-chip{
    min-height:34px;
    padding:7px 12px;
    font-size:.78rem;
}

.page-home .content-grid{
    grid-template-columns:minmax(0,1.9fr) minmax(290px,.86fr);
    gap:16px;
}
.page-home .main-column,.page-home .sidebar{gap:16px}
.page-home .panel{
    padding:16px;
}
.page-home .panel-lg{
    padding:18px;
}
.page-home .panel-head{
    margin-bottom:12px;
    padding-bottom:10px;
}
.page-home .panel-head h2{
    font-size:1.85rem;
}
.page-home .panel-head a{
    font-size:1rem;
    font-weight:900;
}
.page-home .muted-box{
    min-height:56px;
    display:flex;
    align-items:center;
}
.page-home .message-row{
    padding:12px 14px;
}
.page-home .forum-row{
    padding:14px 16px;
    min-height:94px;
}
.page-home .forum-row h3{
    font-size:1.12rem;
}
.page-home .stats-row{
    gap:12px;
}
.page-home .stat-card{
    min-height:98px;
}
.page-home .stat-value{
    font-size:2rem;
}
.page-home .roles-grid{
    gap:10px;
}
.page-home .role-group-card summary{
    padding:12px 12px 10px;
}
.page-home .role-list{
    padding:10px;
    gap:7px;
}
.page-home .role-item{
    min-height:42px;
    padding:9px 10px;
    font-size:.95rem;
}
.page-home .sidebar-card .contact-avatar{
    min-height:330px;
    background-position:center top;
}
.page-home .quick-links{
    gap:8px;
}
.page-home .quick-link{
    min-height:48px;
    font-size:.98rem;
}

@media (max-width: 1100px){
    .page-home .topbar{position:sticky;background:linear-gradient(180deg, rgba(10,10,12,.88), rgba(10,10,12,.72))}
    .page-home .page{padding-top:16px}
    .page-home .hero-banner{min-height:320px}
    .hero-title-main{font-size:1.9rem}
}
@media (max-width: 700px){
    .hero-title-main{font-size:1.45rem}
}


/* ===== width correction pass ===== */
.wrap{width:min(1540px, calc(100% - 18px)) !important}
.page-home .page{padding-top:18px !important}
.page-home .hero-card{padding:8px !important;gap:10px !important}
.page-home .hero-banner{min-height:560px !important}
.page-home .hero-title-strip{padding:16px 20px !important}
.page-home .content-grid{grid-template-columns:minmax(0,1fr) 340px !important;gap:12px !important}
.page-home .main-column,.page-home .sidebar{gap:12px !important}
.page-home .panel,.page-home .panel-lg{padding:14px !important}
.page-home .server-grid{grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:10px !important}
.page-home .server-card{min-height:98px !important;padding:12px 14px 14px !important}
.page-home .stats-row{grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:10px !important}
.page-home .roles-grid{grid-template-columns:repeat(5,minmax(0,1fr)) !important;gap:10px !important}
.page-home .forum-row{grid-template-columns:minmax(0,1.35fr) .55fr .8fr !important;padding:12px 14px !important}
.page-home .sidebar-card .contact-avatar{min-height:300px !important}
@media (max-width: 1280px){
  .wrap{width:min(100% - 18px, 100%) !important}
  .page-home .content-grid{grid-template-columns:minmax(0,1fr) 320px !important}
}
@media (max-width: 1100px){
  .page-home .content-grid{grid-template-columns:1fr !important}
  .page-home .hero-banner{min-height:340px !important}
  .page-home .roles-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}
@media (max-width: 700px){
  .page-home .server-grid,.page-home .stats-row,.page-home .roles-grid{grid-template-columns:1fr !important}
  .page-home .forum-row{grid-template-columns:1fr !important}
  .page-home .hero-banner{min-height:240px !important}
}


/* ===== profile / settings / pw ===== */
.avatar.has-image{
    overflow:hidden;
    padding:0 !important;
}
.avatar.has-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.avatar-profile{
    width:150px;
    height:150px;
    font-size:2rem;
    margin:0 auto;
}
.profile-grid{
    display:grid;
    grid-template-columns:320px minmax(0, 1fr);
    gap:18px;
    align-items:start;
}
.profile-sidebar{
    text-align:center;
}
.profile-hero-avatar{
    margin-bottom:14px;
}
.profile-name{
    margin:0;
    font-size:2rem;
}
.profile-login{
    color:#cdb39d;
    margin-top:6px;
    margin-bottom:14px;
}
.profile-role-badge{
    margin:0 auto 16px;
    justify-content:center;
}
.profile-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:14px;
}
.info-grid,.contact-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}
.info-card{
    clip-path:var(--bevel-sm);
    border:1px solid rgba(255,130,53,.20);
    background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(31,34,39,.98), rgba(10,11,13,.99));
    padding:14px 16px;
}
.info-card span{
    display:block;
    color:#c7ab91;
    margin-bottom:8px;
    font-size:.9rem;
}
.info-card strong{
    display:block;
    color:#fff4ea;
    word-break:break-word;
}
.profile-bio{
    color:#f1e0cf;
    line-height:1.7;
    min-height:90px;
}
.settings-form .settings-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
    margin-bottom:18px;
}
.settings-form label,
.auth-form label{
    display:grid;
    gap:8px;
    margin-bottom:14px;
    color:#e8d6c5;
    font-weight:700;
}
.settings-form textarea,
.auth-form textarea{
    width:100%;
    padding:14px 16px;
    color:#fff;
    border:none;
    outline:none;
    clip-path:var(--bevel-sm);
    background:
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 28%),
      linear-gradient(180deg, rgba(28,31,36,.96), rgba(9,10,12,.98));
    border:1px solid rgba(255,130,53,.22);
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.02), inset 0 0 16px rgba(255,115,30,.06);
    resize:vertical;
}
.settings-avatar-preview{
    margin-bottom:14px;
}
.checkbox-line{
    display:flex !important;
    align-items:center;
    gap:10px;
    margin-bottom:14px;
}
.checkbox-line input{
    width:auto !important;
    min-height:auto !important;
}
.subnav{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-bottom:14px;
}
.subnav-link{
    clip-path:var(--bevel-sm);
    border:1px solid rgba(255,130,53,.22);
    background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 18%), linear-gradient(180deg, rgba(31,34,39,.98), rgba(10,11,13,.99));
    padding:10px 14px;
    font-weight:800;
    color:#f1dac7;
}
.subnav-link.is-active{
    box-shadow:var(--glow);
    color:#fff3e6;
}
.pm-list{
    display:grid;
    gap:12px;
}
.pm-row{
    display:grid;
    grid-template-columns:56px minmax(0,1fr) auto;
    gap:12px;
    align-items:start;
    padding:14px;
    clip-path:var(--bevel-sm);
    border:1px solid rgba(255,130,53,.20);
    background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0) 18%), linear-gradient(180deg, rgba(31,34,39,.98), rgba(10,11,13,.99));
}
.pm-row.is-unread{
    box-shadow:var(--glow);
}
.pm-main{
    min-width:0;
}
.pm-top{
    display:flex;
    gap:10px;
    justify-content:space-between;
    flex-wrap:wrap;
    margin-bottom:8px;
}
.pm-top strong a{
    color:#fff4ea;
}
.pm-preview{
    color:#ccb198;
}
.pm-side{
    text-align:right;
    color:#c7ac95;
    display:grid;
    gap:8px;
}
.pm-view-head{
    display:flex;
    gap:16px;
    align-items:center;
    margin-bottom:18px;
}
.pm-meta{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    color:#c7ab91;
    margin-top:6px;
}
.pm-view-body{
    min-height:180px;
    clip-path:var(--bevel-sm);
    border:1px solid rgba(255,130,53,.18);
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(28,31,36,.98), rgba(9,10,12,.99));
    padding:18px;
    line-height:1.8;
    margin-bottom:16px;
    color:#f3e2d0;
}
@media (max-width: 980px){
    .profile-grid,
    .settings-form .settings-grid{
        grid-template-columns:1fr;
    }
}
@media (max-width: 700px){
    .info-grid,.contact-grid{
        grid-template-columns:1fr;
    }
    .pm-row{
        grid-template-columns:1fr;
    }
    .pm-side{
        text-align:left;
    }
}


/* ===== polish pass: auth + admin ===== */
.section-lead{
    margin:8px 0 0;
    color:#cbb39c;
    font-size:1rem;
    line-height:1.65;
}
.panel-head-split{
    align-items:flex-start;
}
.panel-head-auth{
    margin-bottom:18px;
    padding-bottom:14px;
}
.auth-shell{
    max-width:880px;
    margin:0 auto;
}
.auth-card{
    padding:24px;
}
.auth-card-centered{
    max-width:860px;
    margin:0 auto;
}
.auth-form-stack{
    display:grid;
    gap:6px;
}
.auth-form-stack input{
    min-height:58px;
    font-size:1rem;
}
.auth-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:8px;
}
.field-block{
    display:grid;
    gap:8px;
    color:#e8d6c5;
    font-weight:700;
}
.field-block select,
.inline-form select,
.admin-form-box select{
    width:100%;
    min-height:48px;
    padding:0 16px;
    color:#fff;
    border:none;
    outline:none;
    clip-path:var(--bevel-sm);
    background:
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 28%),
      linear-gradient(180deg, rgba(28,31,36,.96), rgba(9,10,12,.98));
    border:1px solid rgba(255,130,53,.22);
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.02), inset 0 0 16px rgba(255,115,30,.06);
}
.page-auth .auth-card,
.page-settings .auth-card,
.page-account .panel,
.page-admin .panel{
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 14%),
      linear-gradient(180deg, rgba(255,115,30,.10), rgba(255,115,30,0) 36%),
      linear-gradient(180deg, rgba(34,37,43,.98), rgba(10,11,13,.99));
}
.admin-page-panel{
    overflow:visible;
}
.admin-users-layout{
    display:grid;
    grid-template-columns:320px minmax(0,1fr);
    gap:18px;
    align-items:start;
}
.admin-users-list{
    display:grid;
    gap:12px;
    max-height:880px;
    overflow:auto;
    padding-right:4px;
}
.admin-user-item{
    display:grid;
    gap:6px;
    padding:14px 16px;
    color:#f4e2d2;
}
.admin-user-item strong{
    font-size:1rem;
}
.admin-user-item small{
    color:#c8ad95;
    word-break:break-word;
}
.admin-user-item.active{
    box-shadow:var(--glow), inset 0 0 0 1px rgba(255,255,255,.04);
    border-color:rgba(255,130,53,.38);
}
.admin-users-form{
    min-width:0;
}
.admin-editor-form{
    display:grid;
    gap:16px;
}
.checkbox-grid,
.permissions-grid-admin{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}
.checkbox-card{
    display:flex;
    align-items:flex-start;
    gap:12px;
    min-height:82px;
    padding:14px 16px;
    cursor:pointer;
}
.checkbox-card input[type="checkbox"]{
    width:18px;
    height:18px;
    min-height:auto !important;
    margin:2px 0 0;
    accent-color:#ff7a26;
    flex:0 0 auto;
}
.checkbox-card span{
    display:grid;
    gap:4px;
    min-width:0;
}
.checkbox-card strong{
    color:#f7eadf;
    font-size:1rem;
    word-break:break-word;
}
.checkbox-card small{
    color:#c6ab94;
    font-size:.88rem;
    line-height:1.4;
    word-break:break-word;
}
.inline-form,
.admin-filter-form{
    display:flex;
    align-items:end;
    gap:12px;
    flex-wrap:wrap;
    margin-bottom:18px;
}
.inline-form label{
    display:grid;
    gap:8px;
    color:#e7d3c3;
    font-weight:700;
    min-width:320px;
    flex:1 1 360px;
}
.admin-form-actions{
    display:flex;
    gap:12px;
    align-items:center;
    flex-wrap:wrap;
    margin-top:4px;
}
.admin-forms-grid{
    display:grid;
    gap:18px;
}
.admin-forms-grid-2{
    grid-template-columns:repeat(2,minmax(0,1fr));
    margin-bottom:18px;
}
.admin-form-polish{
    display:grid;
    gap:10px;
    padding:18px;
}
.admin-form-polish h3{
    margin:0 0 6px;
    font-size:1.15rem;
}
.admin-form-polish label{
    display:grid;
    gap:8px;
    color:#ead6c7;
    font-weight:700;
}
.table-wrap{
    overflow:auto;
}
.admin-table{
    width:100%;
    border-collapse:separate;
    border-spacing:0 10px;
}
.admin-table thead th{
    text-align:left;
    color:#ffdfc2;
    font-weight:900;
    font-size:.92rem;
    padding:0 12px 8px;
}
.admin-table tbody td{
    padding:14px 12px;
    background:
      linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0) 16%),
      linear-gradient(180deg, rgba(28,31,36,.96), rgba(10,11,13,.98));
    border-top:1px solid rgba(255,130,53,.22);
    border-bottom:1px solid rgba(255,130,53,.22);
}
.admin-table tbody td:first-child{
    border-left:1px solid rgba(255,130,53,.22);
    clip-path:polygon(12px 0,100% 0,100% 100%,12px 100%,0 calc(100% - 12px),0 12px);
}
.admin-table tbody td:last-child{
    border-right:1px solid rgba(255,130,53,.22);
}
.wide-card{
    max-width:none;
}
@media (max-width: 1180px){
    .checkbox-grid,
    .permissions-grid-admin{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media (max-width: 980px){
    .admin-users-layout,
    .admin-forms-grid-2{
        grid-template-columns:1fr;
    }
    .admin-users-list{
        max-height:none;
    }
}
@media (max-width: 700px){
    .checkbox-grid,
    .permissions-grid-admin{
        grid-template-columns:1fr;
    }
    .inline-form label{
        min-width:0;
        flex:1 1 auto;
    }
    .auth-card{
        padding:18px;
    }
    .auth-actions{
        flex-direction:column;
    }
}


/* ===== forum posting polish ===== */
.page-topic .wrap{
    width:min(1480px, calc(100% - 24px));
}
.topic-shell{
    display:grid;
    gap:18px;
}
.post-list{
    display:grid;
    gap:16px;
}
.forum-post-card{
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    gap:18px;
    padding:18px;
}
.post-user{
    display:grid;
    align-content:start;
    gap:14px;
    padding:16px;
    clip-path:var(--bevel-sm);
    background:
      linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0) 18%),
      linear-gradient(180deg, rgba(255,115,30,.08), rgba(255,115,30,0) 38%),
      linear-gradient(180deg, rgba(29,32,37,.98), rgba(10,11,13,.99));
    border:1px solid rgba(255,130,53,.18);
}
.post-user-top{
    display:grid;
    justify-items:start;
    gap:12px;
}
.avatar-xl{
    width:88px !important;
    height:88px !important;
    font-size:2rem !important;
}
.post-user-meta{
    display:grid;
    gap:8px;
}
.post-user-meta strong{
    font-size:1.45rem;
    line-height:1.1;
    color:#fff3e9;
    word-break:break-word;
}
.post-user-extra{
    display:grid;
    gap:8px;
    color:#cfb49e;
    font-size:.92rem;
    line-height:1.45;
}
.post-user-extra span{
    display:block;
}
.post-content{
    min-width:0;
    display:grid;
    gap:14px;
}
.post-content-head{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    padding-bottom:10px;
    border-bottom:1px solid rgba(255,130,53,.14);
}
.post-time{
    color:#c8ad96;
    font-weight:700;
}
.forum-post-text{
    min-height:120px;
    padding:6px 2px 2px;
    color:#f1e3d4;
    font-size:1.02rem;
    line-height:1.8;
    word-break:break-word;
}
.reply-card{
    padding:18px;
    clip-path:var(--bevel-sm);
    background:
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 16%),
      linear-gradient(180deg, rgba(255,115,30,.10), rgba(255,115,30,0) 38%),
      linear-gradient(180deg, rgba(32,35,40,.98), rgba(10,11,13,.99));
    border:1px solid rgba(255,130,53,.24);
    box-shadow:var(--shadow), var(--glow);
}
.reply-form-polished{
    display:grid;
    gap:16px;
}
.reply-form-polished textarea,
.topic-create-form textarea{
    width:100%;
    min-height:240px;
    resize:vertical;
    padding:16px 18px;
    color:#fff;
    border:none;
    outline:none;
    clip-path:var(--bevel-sm);
    background:
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 22%),
      linear-gradient(180deg, rgba(28,31,36,.96), rgba(9,10,12,.98));
    border:1px solid rgba(255,130,53,.24);
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.02), inset 0 0 18px rgba(255,115,30,.06);
    font:16px/1.7 Inter,Segoe UI,Arial,sans-serif;
}
.topic-create-form input[type="text"]{
    min-height:56px;
    font-size:1rem;
}
.reply-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}
.page-topic .panel-head h1{
    font-size:2.3rem;
}
.page-topic .panel-head h2{
    font-size:1.6rem;
}
@media (max-width: 980px){
    .forum-post-card{
        grid-template-columns:1fr;
    }
    .post-user{
        grid-template-columns:auto 1fr;
        align-items:center;
    }
    .post-user-top{
        grid-template-columns:auto 1fr;
        align-items:center;
        justify-items:start;
    }
    .post-user-extra{
        grid-column:1 / -1;
    }
}
@media (max-width: 640px){
    .page-topic .wrap{
        width:min(100% - 16px, 100%);
    }
    .topic-shell,
    .post-list{
        gap:12px;
    }
    .forum-post-card,
    .reply-card{
        padding:14px;
    }
    .reply-form-polished textarea,
    .topic-create-form textarea{
        min-height:180px;
    }
    .page-topic .panel-head h1{
        font-size:1.7rem;
    }
}


/* ===== bigger navigation and admin controls ===== */
.topbar .wrap{
    width:min(1460px, calc(100% - 26px));
}
.nav-row{
    min-height:98px;
    gap:20px;
}
.brand{
    min-width:280px;
}
.brand-mark{
    width:62px;
    height:62px;
}
.brand-name{
    font-size:2.05rem;
}
.brand-tagline{
    font-size:.92rem;
}
.nav{
    gap:12px;
}
.nav a{
    min-height:56px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 24px;
    font-size:1.08rem;
    font-weight:900;
    letter-spacing:.01em;
    color:#f7e1cf;
    box-shadow:0 0 0 1px rgba(255,130,53,.22), 0 0 20px rgba(255,111,44,.08), inset 0 1px 0 rgba(255,255,255,.07);
}
.nav-actions{
    gap:14px;
}
.user-pill{
    min-width:118px;
    min-height:66px;
    justify-content:center;
    padding:10px 16px 11px;
    border-radius:12px;
    font-size:1.02rem;
    font-weight:900;
    box-shadow:0 0 0 1px rgba(255,130,53,.26), 0 0 22px rgba(255,111,44,.08), inset 0 0 0 1px rgba(255,255,255,.03);
}
.user-pill small{
    font-size:.88rem;
    line-height:1.15;
}
.btn,.btn-muted{
    min-height:56px;
    padding:0 24px;
    font-size:1.02rem;
}
.page-account .subnav{
    gap:12px;
    margin-bottom:16px;
}
.page-account .subnav-link,
.page-admin .subnav-link{
    min-height:56px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 22px;
    font-size:1rem;
    font-weight:900;
    color:#f4ddca;
    box-shadow:0 0 0 1px rgba(255,130,53,.18), inset 0 1px 0 rgba(255,255,255,.04);
}
.page-account .subnav-link.is-active,
.page-admin .subnav-link.is-active{
    box-shadow:var(--glow), 0 0 22px rgba(255,111,44,.10);
}
.page-admin .panel-head h1{
    font-size:3rem;
}
.page-admin .section-lead{
    font-size:1.12rem;
}
.admin-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    margin-top:12px;
}
.admin-tile{
    display:grid;
    gap:10px;
    padding:18px 20px;
    clip-path:var(--bevel-sm);
    border:1px solid rgba(255,130,53,.26);
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 18%),
      linear-gradient(180deg, rgba(255,115,30,.10), rgba(255,115,30,0) 40%),
      linear-gradient(180deg, rgba(31,34,39,.98), rgba(10,11,13,.99));
    box-shadow:var(--shadow), var(--glow);
    overflow:hidden;
}
.admin-tile::after{
    content:"";
    position:absolute;
    left:12px;
    right:12px;
    bottom:10px;
    height:1px;
    background:linear-gradient(90deg, transparent, rgba(255,130,53,.72), transparent);
}
.admin-tile-lg{
    min-height:120px;
}
.admin-tile-title{
    display:block;
    font-size:1.26rem;
    font-weight:900;
    color:#fff2e6;
}
.admin-tile-desc{
    display:block;
    color:#cdb39d;
    line-height:1.55;
    font-size:.95rem;
}
.page-account .settings-panel .panel-head h1{
    font-size:2.45rem;
}
.page-account .settings-panel .panel-head a{
    min-height:52px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 22px;
    clip-path:var(--bevel-sm);
    border:1px solid rgba(255,130,53,.24);
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 18%),
      linear-gradient(180deg, rgba(31,34,39,.98), rgba(10,11,13,.99));
    font-weight:900;
    box-shadow:var(--glow);
}
@media (max-width: 1200px){
    .admin-grid{
        grid-template-columns:1fr;
    }
}
@media (max-width: 980px){
    .nav-row{
        min-height:unset;
        padding:12px 0;
    }
    .nav{
        width:100%;
        justify-content:center;
    }
    .nav a{
        min-height:52px;
        padding:0 18px;
        font-size:1rem;
    }
    .user-pill{
        min-width:96px;
        min-height:58px;
    }
}
@media (max-width: 640px){
    .topbar .wrap{
        width:min(100% - 14px, 100%);
    }
    .nav{
        gap:8px;
    }
    .nav a,
    .btn,
    .btn-muted,
    .page-account .subnav-link,
    .page-admin .subnav-link{
        width:100%;
    }
    .nav-actions{
        width:100%;
        flex-direction:column;
    }
    .user-pill{
        width:100%;
        align-items:center;
    }
}


/* ===== compact header fix ===== */
.topbar .wrap{
    width:min(1460px, calc(100% - 24px));
}
.nav-row{
    min-height:88px !important;
    gap:14px !important;
    align-items:flex-start;
    padding:8px 0;
}
.brand{
    min-width:250px !important;
    padding-top:6px;
}
.brand-mark{
    width:60px !important;
    height:60px !important;
}
.brand-name{
    font-size:1.95rem !important;
}
.brand-tagline{
    font-size:.84rem !important;
}
.nav{
    gap:8px !important;
    align-items:flex-start;
    justify-content:center;
}
.nav a{
    width:auto !important;
    min-width:0 !important;
    min-height:54px !important;
    padding:0 22px !important;
    font-size:1rem !important;
    white-space:nowrap;
}
.nav-actions{
    gap:10px !important;
    align-items:flex-start;
    padding-top:4px;
}
.user-pill{
    min-width:122px !important;
    width:122px !important;
    min-height:58px !important;
    height:58px !important;
    padding:8px 10px !important;
    border-radius:0 !important;
    clip-path:var(--bevel-sm);
    display:grid !important;
    justify-items:center;
    align-content:center;
    text-align:center;
    line-height:1.05;
}
.user-pill small{
    margin-top:4px;
    font-size:.84rem !important;
}
.btn,.btn-muted{
    min-height:54px !important;
    padding:0 20px !important;
    font-size:1rem !important;
}
.page-account .subnav-link,
.page-admin .subnav-link{
    width:auto !important;
    min-height:52px !important;
    padding:0 20px !important;
    font-size:1rem !important;
    white-space:nowrap;
}
.page-account .subnav{
    gap:10px !important;
}
@media (max-width: 1100px){
    .nav-row{
        align-items:center;
        padding:10px 0;
    }
}
@media (max-width: 640px){
    .nav{
        gap:8px !important;
    }
    .nav a,
    .btn,
    .btn-muted{
        width:auto !important;
    }
    .user-pill{
        width:122px !important;
    }
}


/* ===== header size tune ===== */
.topbar .wrap{
    width:min(1440px, calc(100% - 28px)) !important;
}
.nav-row{
    min-height:76px !important;
    gap:12px !important;
    padding:6px 0 !important;
    align-items:center !important;
}
.brand{
    min-width:232px !important;
    gap:12px !important;
    padding-top:0 !important;
}
.brand-mark{
    width:52px !important;
    height:52px !important;
}
.brand-name{
    font-size:1.72rem !important;
    line-height:1 !important;
}
.brand-tagline{
    font-size:.78rem !important;
    margin-top:2px !important;
}

.nav{
    gap:8px !important;
    align-items:center !important;
}
.nav a{
    min-height:46px !important;
    padding:0 18px !important;
    font-size:.94rem !important;
    line-height:1 !important;
    box-shadow:0 0 0 1px rgba(255,130,53,.16), 0 0 14px rgba(255,111,44,.06), inset 0 1px 0 rgba(255,255,255,.05) !important;
}

.nav-actions{
    gap:10px !important;
    align-items:center !important;
    padding-top:0 !important;
}
.user-pill{
    width:108px !important;
    min-width:108px !important;
    height:48px !important;
    min-height:48px !important;
    padding:6px 8px !important;
    font-size:.92rem !important;
    border-radius:0 !important;
    line-height:1 !important;
}
.user-pill small{
    font-size:.75rem !important;
    margin-top:3px !important;
}

.btn,
.btn-muted{
    min-height:46px !important;
    padding:0 18px !important;
    font-size:.94rem !important;
}

.page-account .subnav-link,
.page-admin .subnav-link{
    min-height:46px !important;
    padding:0 18px !important;
    font-size:.94rem !important;
}

@media (max-width: 1200px){
    .nav-row{
        min-height:70px !important;
    }
    .brand-mark{
        width:48px !important;
        height:48px !important;
    }
    .brand-name{
        font-size:1.58rem !important;
    }
    .nav a,
    .btn,
    .btn-muted{
        min-height:44px !important;
        padding:0 16px !important;
        font-size:.9rem !important;
    }
    .user-pill{
        width:100px !important;
        min-width:100px !important;
        height:46px !important;
        min-height:46px !important;
    }
}

@media (max-width: 980px){
    .nav-row{
        align-items:center !important;
        padding:10px 0 !important;
    }
    .nav{
        width:100% !important;
        justify-content:center !important;
    }
}

@media (max-width: 640px){
    .topbar .wrap{
        width:min(100% - 12px, 100%) !important;
    }
    .nav{
        gap:6px !important;
    }
    .nav a,
    .btn,
    .btn-muted{
        min-height:42px !important;
        padding:0 14px !important;
        font-size:.88rem !important;
    }
    .user-pill{
        width:100px !important;
        min-width:100px !important;
        height:44px !important;
        min-height:44px !important;
    }
}


/* ===== home hero + header overlap fix ===== */
.page-home .topbar{
    position:sticky !important;
    top:0 !important;
    background:linear-gradient(180deg, rgba(10,10,12,.94), rgba(10,10,12,.84)) !important;
    border-bottom:1px solid rgba(255,130,53,.18) !important;
    box-shadow:0 10px 28px rgba(0,0,0,.34) !important;
    backdrop-filter:blur(8px) !important;
}
.page-home .page{
    padding-top:12px !important;
}
.page-home .hero-card{
    margin-top:0 !important;
}
.page-home .hero-banner{
    min-height:520px !important;
    background-position:center top !important;
}
.topbar .wrap{
    width:min(1440px, calc(100% - 28px)) !important;
}
.nav-row{
    min-height:72px !important;
    gap:12px !important;
    padding:6px 0 !important;
    align-items:center !important;
}
.brand{
    min-width:228px !important;
    gap:12px !important;
}
.brand-mark{
    width:50px !important;
    height:50px !important;
}
.brand-name{
    font-size:1.68rem !important;
}
.brand-tagline{
    font-size:.78rem !important;
    margin-top:2px !important;
}
.nav{
    gap:8px !important;
}
.nav a{
    min-height:44px !important;
    padding:0 17px !important;
    font-size:.93rem !important;
    white-space:nowrap !important;
}
.nav-actions{
    gap:10px !important;
}
.user-pill{
    width:104px !important;
    min-width:104px !important;
    height:46px !important;
    min-height:46px !important;
    padding:5px 8px !important;
    clip-path:var(--bevel-sm) !important;
    border-radius:0 !important;
    line-height:1 !important;
}
.user-pill small{
    font-size:.74rem !important;
    margin-top:3px !important;
}
.btn,
.btn-muted{
    min-height:44px !important;
    padding:0 17px !important;
    font-size:.93rem !important;
}
@media (max-width: 980px){
    .page-home .topbar{
        position:sticky !important;
    }
}


/* ===== fitted hero banner pass ===== */
.page-home .hero-card{
    padding:8px !important;
}
.page-home .hero-banner{
    min-height:560px !important;
    background-image:url('/assets/hero-fire.png') !important;
    background-size:cover !important;
    background-position:center top !important;
    background-repeat:no-repeat !important;
}
@media (max-width: 1100px){
    .page-home .hero-banner{
        min-height:360px !important;
    }
}
@media (max-width: 700px){
    .page-home .hero-banner{
        min-height:240px !important;
    }
}


/* ===== contact slider ===== */
.contacts-slider-card{
    padding:18px 16px 14px !important;
}
.contact-slider{
    position:relative;
    overflow:hidden;
}
.contact-slider-window{
    overflow:hidden;
}
.contact-slider-track{
    display:flex;
    transition:transform .55s ease;
    will-change:transform;
}
.contact-slide{
    min-width:100%;
    display:grid;
    justify-items:center;
    text-align:center;
    gap:12px;
    padding:6px 4px 0;
}
.contact-slider-title{
    margin:6px 0 8px;
    font-size:1.65rem;
    line-height:1.15;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.04em;
    color:#fff5ea;
}
.contact-avatar-ring{
    width:170px;
    height:170px;
    border-radius:999px;
    display:grid;
    place-items:center;
    border:3px solid #ff2958;
    box-shadow:0 0 0 1px rgba(255,41,88,.16), 0 0 24px rgba(255,50,90,.08), inset 0 0 22px rgba(255,88,42,.08);
    background:radial-gradient(circle at 30% 30%, rgba(255,115,30,.12), rgba(8,8,10,.0) 55%);
}
.contact-avatar-media{
    width:150px !important;
    height:150px !important;
    border-radius:999px;
    overflow:hidden;
    display:grid;
    place-items:center;
    font-size:2.4rem;
    font-weight:900;
    background:
      radial-gradient(circle at 50% 0, rgba(255,255,255,.08), rgba(255,255,255,0) 45%),
      linear-gradient(180deg, rgba(22,24,29,.98), rgba(7,8,10,.99));
}
.contact-avatar-media img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.contact-name{
    margin-top:4px;
    font-size:2rem;
    font-weight:900;
    line-height:1.05;
    color:#ff2d59;
    text-shadow:0 0 18px rgba(255,45,89,.16);
}
.contact-role{
    font-size:1.2rem;
    font-weight:900;
    color:#fff2e6;
    letter-spacing:.04em;
    text-transform:uppercase;
}
.contact-links{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
    margin-top:6px;
}
.contact-link-btn{
    min-width:42px;
    height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 12px;
    border:none;
    cursor:pointer;
    clip-path:var(--bevel-sm);
    color:#f6ebff;
    font-weight:900;
    background:
      linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,0) 18%),
      linear-gradient(180deg, #7f69ff, #4f3db4);
    box-shadow:0 0 0 1px rgba(164,132,255,.30), 0 0 20px rgba(104,84,233,.12);
}
.contact-link-btn:hover{
    filter:brightness(1.08);
}
.contact-slider-controls{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    margin-top:16px;
}
.contact-arrow{
    width:40px;
    height:40px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:none;
    cursor:pointer;
    clip-path:var(--bevel-sm);
    color:#f4e5d6;
    font-size:1.35rem;
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 18%),
      linear-gradient(180deg, rgba(36,40,46,.98), rgba(11,12,15,.99));
    box-shadow:var(--glow);
}
.contact-slider-dots{
    display:flex;
    gap:10px;
    align-items:center;
}
.contact-dot{
    width:38px;
    height:4px;
    border:none;
    cursor:pointer;
    border-radius:999px;
    background:rgba(255,255,255,.18);
}
.contact-dot.is-active{
    background:#ffffff;
    box-shadow:0 0 16px rgba(255,255,255,.14);
}
.contact-copy-hint{
    margin-top:10px;
    color:#bba897;
    font-size:.9rem;
    text-align:center;
    min-height:22px;
}
.admin-contacts-grid{
    display:grid;
    grid-template-columns:420px minmax(0,1fr);
    gap:18px;
    align-items:start;
}
.admin-contacts-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}
.admin-contact-card{
    display:grid;
    gap:14px;
}
.admin-contact-top{
    display:grid;
    grid-template-columns:84px minmax(0,1fr);
    gap:14px;
    align-items:center;
}
.admin-contact-top strong{
    display:block;
    color:#fff4ea;
    font-size:1.25rem;
    line-height:1.1;
}
.admin-contact-role{
    margin-top:6px;
    color:#ff7b49;
    font-weight:800;
}
.admin-contact-meta{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    color:#c7ad96;
    font-size:.92rem;
}
.admin-contact-chips{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}
.mini-chip{
    display:inline-flex;
    align-items:center;
    min-height:32px;
    padding:0 12px;
    clip-path:var(--bevel-sm);
    color:#f3dfcf;
    font-size:.86rem;
    font-weight:800;
    background:
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 18%),
      linear-gradient(180deg, rgba(31,34,39,.98), rgba(10,11,13,.99));
    border:1px solid rgba(255,130,53,.18);
}
.settings-avatar-preview .avatar-profile{
    width:120px !important;
    height:120px !important;
}
.settings-avatar-preview{
    margin-bottom:16px;
}
.settings-avatar-preview .avatar-profile img{
    object-fit:cover;
}
@media (max-width: 1180px){
    .admin-contacts-grid{
        grid-template-columns:1fr;
    }
    .admin-contacts-list{
        grid-template-columns:1fr 1fr;
    }
}
@media (max-width: 760px){
    .contact-slider-title{
        font-size:1.3rem;
    }
    .contact-avatar-ring{
        width:140px;
        height:140px;
    }
    .contact-avatar-media{
        width:124px !important;
        height:124px !important;
    }
    .contact-name{
        font-size:1.55rem;
    }
    .contact-role{
        font-size:1rem;
    }
    .admin-contacts-list{
        grid-template-columns:1fr;
    }
}


/* fixpack: stable hero + contacts */
.page-home .topbar{
    position:sticky !important;
    top:0 !important;
    background:linear-gradient(180deg, rgba(10,10,12,.92), rgba(10,10,12,.82)) !important;
    border-bottom:1px solid rgba(255,130,53,.18) !important;
    box-shadow:0 10px 28px rgba(0,0,0,.34) !important;
    backdrop-filter:blur(8px) !important;
}
.page-home .page{padding-top:12px !important}
.page-home .hero-banner{
    min-height:560px !important;
    background-position:center top !important;
    background-size:cover !important;
}
.admin-contacts-grid{
    display:grid;
    grid-template-columns:minmax(320px, 420px) minmax(0,1fr);
    gap:18px;
    align-items:start;
}
.admin-contacts-list{
    display:grid;
    gap:14px;
}
.admin-contact-card{padding:16px}
.admin-contact-top{
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    gap:14px;
    align-items:center;
    margin-bottom:10px;
}
.contact-avatar-media.contact-avatar-media,
.admin-contact-card .contact-avatar-media{
    width:72px !important;
    height:72px !important;
    font-size:1.6rem;
}
.admin-contact-role{
    color:#ff9d6f;
    font-weight:800;
}
.admin-contact-meta,
.admin-contact-chips{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top:10px;
}
.admin-contact-meta span,
.admin-contact-chips span{
    padding:6px 10px;
    clip-path:var(--bevel-sm);
    border:1px solid rgba(255,130,53,.18);
    background:linear-gradient(180deg, rgba(31,34,39,.98), rgba(10,11,13,.99));
    color:#f1dcca;
    font-size:.88rem;
}
@media (max-width: 1000px){
    .admin-contacts-grid{grid-template-columns:1fr}
}


/* ===== emergency hotfix: source leak + hero fit ===== */
.page-home .hero-banner{
    min-height:540px !important;
    background-image:url('/assets/hero-fire.png') !important;
    background-size:cover !important;
    background-position:center top !important;
    background-repeat:no-repeat !important;
}
@media (max-width: 1100px){
    .page-home .hero-banner{min-height:340px !important;}
}
@media (max-width: 700px){
    .page-home .hero-banner{min-height:230px !important;}
}


/* ===== banner full visible with text ===== */
.page-home .hero-banner{
    min-height:560px !important;
    background-image:url('/assets/hero-fire.png') !important;
    background-size:cover !important;
    background-position:center center !important;
    background-repeat:no-repeat !important;
}
@media (max-width: 1100px){
    .page-home .hero-banner{min-height:340px !important;}
}
@media (max-width: 700px){
    .page-home .hero-banner{min-height:220px !important;}
}


/* ===== fix: selects visibility, contacts edit, footer ===== */
select{
    color-scheme: dark;
}
select option,
select optgroup{
    background:#f3e7da !important;
    color:#111 !important;
}
.btn-xs{
    min-height:38px !important;
    padding:0 14px !important;
    font-size:.88rem !important;
}
.admin-contacts-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}
.admin-contact-preview{
    display:flex;
    justify-content:flex-start;
    margin:6px 0 4px;
}
.admin-contact-preview .contact-avatar-media{
    width:96px !important;
    height:96px !important;
}
.footer{
    border-top:1px solid rgba(255,130,53,.18);
    background:linear-gradient(180deg, rgba(8,8,10,.25), rgba(8,8,10,.88));
}
.footer-copy{
    min-height:86px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:6px;
    text-align:center;
    color:#d3b49b;
    line-height:1.55;
    font-size:.95rem;
}
@media (max-width: 1180px){
    .admin-contacts-list{
        grid-template-columns:1fr;
    }
}
@media (max-width: 760px){
    .footer-copy{
        font-size:.88rem;
        min-height:96px;
    }
}

/* fix: primary role / permissions selects readable */
.page-admin .field-block select,
.page-admin .inline-form select,
.page-admin .admin-form-box select{
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 18%),
      linear-gradient(180deg, rgba(31,34,39,.98), rgba(10,11,13,.99)) !important;
    color:#fff !important;
}


/* ===== topic layout upgrade ===== */
.page-topic .wrap{
    width:min(1360px, calc(100% - 24px));
}
.topic-shell-upgraded{
    display:grid;
    gap:18px;
}
.topic-cover-card{
    clip-path:var(--bevel-sm);
    padding:20px 22px;
    border:1px solid rgba(255,130,53,.22);
    background:
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 16%),
      linear-gradient(180deg, rgba(255,115,30,.10), rgba(255,115,30,0) 40%),
      linear-gradient(180deg, rgba(33,36,42,.98), rgba(11,12,15,.99));
    box-shadow:var(--shadow), var(--glow);
}
.topic-cover-kicker{
    color:#ff9d63;
    text-transform:uppercase;
    font-size:.82rem;
    font-weight:900;
    letter-spacing:.1em;
    margin-bottom:8px;
}
.topic-cover-card h1{
    margin:0;
    font-size:2.35rem;
    line-height:1.1;
    color:#fff3ea;
}
.topic-cover-links{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:16px;
}
.topic-chip{
    display:inline-flex;
    align-items:center;
    min-height:38px;
    padding:0 14px;
    clip-path:var(--bevel-sm);
    color:#f5decb;
    font-size:.88rem;
    font-weight:800;
    background:
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 18%),
      linear-gradient(180deg, rgba(31,34,39,.98), rgba(10,11,13,.99));
    border:1px solid rgba(255,130,53,.18);
}
.topic-chip-link:hover{
    filter:brightness(1.08);
}
.topic-chip-alert{
    color:#ffb28d;
    border-color:rgba(255,110,80,.32);
}
.topic-chip-author{
    color:#ffd59e;
}
.topic-posts{
    display:grid;
    gap:16px;
}
.forum-post-row{
    display:grid;
    grid-template-columns:270px minmax(0,1fr);
    gap:16px;
    align-items:stretch;
}
.forum-post-author,
.forum-post-message{
    clip-path:var(--bevel-sm);
    border:1px solid rgba(255,130,53,.22);
    background:
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 16%),
      linear-gradient(180deg, rgba(255,115,30,.08), rgba(255,115,30,0) 36%),
      linear-gradient(180deg, rgba(31,34,39,.98), rgba(10,11,13,.99));
    box-shadow:var(--shadow), var(--glow);
}
.forum-post-author{
    padding:18px;
}
.forum-post-author-inner{
    display:grid;
    gap:16px;
    justify-items:center;
    text-align:center;
}
.avatar-xxl{
    width:116px !important;
    height:116px !important;
    font-size:2.35rem !important;
}
.forum-post-author-meta{
    display:grid;
    gap:10px;
    justify-items:center;
}
.forum-post-author-meta strong{
    font-size:1.4rem;
    line-height:1.15;
    color:#fff4ea;
    word-break:break-word;
}
.forum-post-message{
    padding:20px 22px;
    min-width:0;
}
.forum-post-message-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding-bottom:12px;
    margin-bottom:16px;
    border-bottom:1px solid rgba(255,130,53,.16);
}
.forum-post-title-line{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.forum-post-number{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:54px;
    min-height:34px;
    padding:0 10px;
    clip-path:var(--bevel-sm);
    background:linear-gradient(180deg, #4a2b1a, #1e1512), linear-gradient(135deg, var(--orange), var(--orange2));
    border:1px solid rgba(255,130,53,.28);
    color:#ffe7d1;
    font-weight:900;
}
.forum-post-subtitle{
    color:#d8b89f;
    font-weight:800;
}
.forum-post-date{
    color:#c7a991;
    font-size:.93rem;
    white-space:nowrap;
}
.forum-post-body{
    min-height:180px;
    color:#f2e2d3;
    line-height:1.9;
    font-size:1.03rem;
    word-break:break-word;
}
.topic-bottom-bar{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
}
.topic-bottom-stat{
    clip-path:var(--bevel-sm);
    padding:16px 18px;
    text-align:center;
    border:1px solid rgba(255,130,53,.18);
    background:
      linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0) 16%),
      linear-gradient(180deg, rgba(31,34,39,.98), rgba(10,11,13,.99));
}
.topic-bottom-stat small{
    display:block;
    color:#bda089;
    margin-bottom:8px;
}
.topic-bottom-stat strong{
    display:block;
    color:#fff2e6;
    font-size:1.65rem;
    line-height:1.1;
}
.topic-locked-box{
    display:flex;
    align-items:center;
    gap:14px;
    clip-path:var(--bevel-sm);
    padding:18px 20px;
    border:1px solid rgba(255,130,53,.24);
    background:
      linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0) 16%),
      linear-gradient(180deg, rgba(64,28,16,.95), rgba(16,12,10,.98));
    color:#ffb47e;
    font-weight:800;
}
.topic-locked-icon{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    font-size:1.5rem;
    clip-path:var(--bevel-sm);
    background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 16%), linear-gradient(180deg, #4a2b1a, #1e1512);
    border:1px solid rgba(255,130,53,.24);
}
@media (max-width: 980px){
    .forum-post-row{
        grid-template-columns:1fr;
    }
    .forum-post-author-inner{
        grid-template-columns:auto 1fr;
        justify-items:start;
        text-align:left;
        align-items:center;
    }
    .forum-post-author-meta{
        justify-items:start;
    }
    .topic-bottom-bar{
        grid-template-columns:1fr;
    }
}
@media (max-width: 700px){
    .page-topic .wrap{
        width:min(100% - 16px, 100%);
    }
    .topic-cover-card{
        padding:16px;
    }
    .topic-cover-card h1{
        font-size:1.7rem;
    }
    .forum-post-message{
        padding:16px;
    }
    .forum-post-message-head{
        align-items:flex-start;
        flex-direction:column;
    }
}


/* ===== global font + vertical admin panel ===== */
@font-face{
    font-family:"Xirod";
    src:url('/assets/fonts/xirod.ttf') format('truetype');
    font-weight:normal;
    font-style:normal;
    font-display:swap;
}

html, body, button, input, select, textarea{
    font-family:"Xirod", Inter, "Segoe UI", Arial, sans-serif !important;
}

.page-admin .topbar{
    position:fixed !important;
    left:0;
    top:0;
    bottom:0;
    width:270px;
    height:100vh;
    z-index:50;
    border-right:1px solid rgba(255,130,53,.20);
    border-bottom:none !important;
    background:
        linear-gradient(180deg, rgba(12,12,14,.96), rgba(8,8,10,.94)),
        radial-gradient(circle at top center, rgba(255,110,36,.08), transparent 28%) !important;
    box-shadow:18px 0 40px rgba(0,0,0,.35);
}

.page-admin .topbar .wrap{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 16px !important;
}

.page-admin .nav-row{
    min-height:100vh !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    gap:12px !important;
    padding:22px 0 !important;
}

.page-admin .brand{
    min-width:0 !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:12px !important;
    padding:0 6px 10px !important;
    border-bottom:1px solid rgba(255,130,53,.14);
    margin-bottom:8px;
}

.page-admin .brand-mark{
    width:58px !important;
    height:58px !important;
}

.page-admin .brand-name{
    font-size:1.55rem !important;
    letter-spacing:.05em !important;
}

.page-admin .brand-tagline{
    font-size:.78rem !important;
    line-height:1.35 !important;
}

.page-admin .nav{
    width:100% !important;
    flex:0 0 auto !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    gap:8px !important;
}

.page-admin .nav a{
    width:100% !important;
    min-height:50px !important;
    padding:0 16px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    text-align:left !important;
    font-size:1rem !important;
    letter-spacing:.01em !important;
}

.page-admin .nav a[href*="/admin/"]{
    background:
      linear-gradient(180deg, rgba(255,170,99,.12), rgba(255,255,255,0) 26%),
      linear-gradient(180deg, #382118, #151211),
      linear-gradient(135deg, rgba(255,124,38,.18), rgba(255,69,18,.06));
    border-color:rgba(255,130,53,.34) !important;
    color:#ffe7d2 !important;
}

.page-admin .nav-actions{
    width:100% !important;
    margin-top:auto !important;
    padding-top:12px;
    border-top:1px solid rgba(255,130,53,.14);
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
}

.page-admin .user-pill{
    width:100% !important;
    min-width:0 !important;
    min-height:62px !important;
    padding:10px 12px !important;
    justify-content:center !important;
    align-items:flex-start !important;
    text-align:left !important;
    clip-path:var(--bevel-sm);
    border-radius:0 !important;
}

.page-admin .btn,
.page-admin .btn-muted{
    width:100% !important;
    min-height:50px !important;
    justify-content:flex-start !important;
    padding:0 16px !important;
}

.page-admin .page{
    width:auto !important;
    max-width:none !important;
    margin-left:286px !important;
    padding:20px 22px 34px !important;
}

.page-admin .wrap.page{
    width:auto !important;
}

.page-admin .panel-head h1{
    font-size:2.5rem !important;
    line-height:1.08;
}

.page-admin .panel-head .section-lead{
    max-width:900px;
}

.page-admin .admin-grid{
    grid-template-columns:1fr !important;
    gap:14px !important;
}

.page-admin .admin-tile{
    min-height:118px;
    align-content:center;
}

.page-admin .admin-forms-grid-2{
    grid-template-columns:repeat(2,minmax(0,1fr));
}

.page-admin .admin-users-layout{
    grid-template-columns:340px minmax(0,1fr);
}

@media (max-width: 1180px){
    .page-admin .page{
        margin-left:0 !important;
        padding:16px 12px 28px !important;
    }
    .page-admin .topbar{
        position:sticky !important;
        width:auto !important;
        height:auto !important;
        border-right:none !important;
        border-bottom:1px solid rgba(255,130,53,.18) !important;
        box-shadow:0 10px 28px rgba(0,0,0,.34);
    }
    .page-admin .topbar .wrap{
        padding:0 !important;
    }
    .page-admin .nav-row{
        min-height:auto !important;
        flex-direction:row !important;
        flex-wrap:wrap !important;
        padding:10px 14px !important;
    }
    .page-admin .nav{
        flex-direction:row !important;
        flex-wrap:wrap !important;
    }
    .page-admin .nav a,
    .page-admin .btn,
    .page-admin .btn-muted{
        width:auto !important;
        justify-content:center !important;
    }
    .page-admin .nav-actions{
        margin-top:0 !important;
        padding-top:0 !important;
        border-top:none !important;
        flex-direction:row !important;
        width:auto !important;
    }
    .page-admin .user-pill{
        width:auto !important;
        align-items:center !important;
        text-align:center !important;
    }
    .page-admin .admin-forms-grid-2,
    .page-admin .admin-users-layout{
        grid-template-columns:1fr !important;
    }
}


/* ===== XIROD scale fix ===== */
html{
    font-size:14px;
}

body{
    letter-spacing:0 !important;
}

.brand{
    min-width:220px !important;
    gap:10px !important;
}

.brand-mark{
    width:44px !important;
    height:44px !important;
}

.brand-name{
    font-size:1.2rem !important;
    letter-spacing:.03em !important;
    line-height:1.02 !important;
}

.brand-tagline{
    font-size:.62rem !important;
    line-height:1.2 !important;
    margin-top:2px !important;
}

.nav-row{
    min-height:64px !important;
    gap:10px !important;
}

.nav{
    gap:8px !important;
}

.nav a{
    min-height:38px !important;
    padding:0 12px !important;
    font-size:.78rem !important;
    letter-spacing:.02em !important;
}

.btn,
.btn-muted{
    min-height:38px !important;
    padding:0 14px !important;
    font-size:.78rem !important;
    letter-spacing:.02em !important;
}

.user-pill{
    padding:7px 10px !important;
    min-height:38px !important;
    font-size:.82rem !important;
    line-height:1.05 !important;
}

.user-pill small{
    font-size:.62rem !important;
    margin-top:2px !important;
}

.panel-head h1{
    letter-spacing:.01em !important;
}

.panel-head h2{
    letter-spacing:.01em !important;
}

.page-admin .topbar{
    width:238px !important;
}

.page-admin .page{
    margin-left:252px !important;
}

.page-admin .brand-name{
    font-size:1.05rem !important;
}

.page-admin .brand-tagline{
    font-size:.58rem !important;
}

.page-admin .nav a{
    min-height:42px !important;
    font-size:.78rem !important;
    padding:0 12px !important;
}

.page-admin .btn,
.page-admin .btn-muted{
    min-height:42px !important;
    font-size:.78rem !important;
    padding:0 12px !important;
}

.page-admin .user-pill{
    min-height:50px !important;
    font-size:.8rem !important;
}

@media (max-width: 1180px){
    html{
        font-size:13px;
    }
    .brand-name{
        font-size:1.05rem !important;
    }
    .brand-tagline{
        display:block !important;
        font-size:.58rem !important;
    }
    .nav a,
    .btn,
    .btn-muted{
        min-height:36px !important;
        padding:0 10px !important;
        font-size:.72rem !important;
    }
}

@media (max-width: 760px){
    html{
        font-size:12px;
    }
    .brand{
        min-width:0 !important;
    }
    .brand-tagline{
        display:none !important;
    }
    .nav{
        gap:6px !important;
    }
    .nav a,
    .btn,
    .btn-muted{
        font-size:.68rem !important;
        padding:0 8px !important;
    }
}


/* ===== roles/groups title visibility fix ===== */
.roles-grid{
    align-items:start;
}

.role-group-card{
    overflow:hidden;
}

.role-group-card summary{
    min-height:54px !important;
    padding:12px 14px 11px !important;
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    line-height:1.08 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
}

.role-group-card summary .group-icon,
.role-group-card summary .role-group-icon{
    flex:0 0 auto;
}

.role-group-card summary,
.role-group-card summary *{
    letter-spacing:.01em !important;
}

.role-group-card summary{
    font-size:1rem !important;
}

.role-list{
    padding-top:10px !important;
}

.role-item{
    min-height:44px !important;
    padding:9px 12px !important;
    line-height:1.15 !important;
}

.role-item,
.role-item *{
    letter-spacing:0 !important;
}

.page-home .roles-grid{
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
    gap:12px !important;
}

@media (max-width: 1200px){
    .role-group-card summary{
        font-size:.9rem !important;
        min-height:50px !important;
        padding:10px 12px !important;
    }
}

@media (max-width: 980px){
    .page-home .roles-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
    .role-group-card summary{
        white-space:normal !important;
        line-height:1.15 !important;
        min-height:unset !important;
    }
}

@media (max-width: 700px){
    .page-home .roles-grid{
        grid-template-columns:1fr !important;
    }
}


/* ===== fix: admin sidebar logo + shoutbox time font ===== */
.page-admin .brand{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    display:grid !important;
    grid-template-columns:52px minmax(0,1fr) !important;
    align-items:center !important;
    gap:10px !important;
    padding:0 4px 10px !important;
    overflow:hidden !important;
}

.page-admin .brand-mark{
    width:52px !important;
    height:52px !important;
    border-radius:8px !important;
}

.page-admin .brand > div{
    min-width:0 !important;
    overflow:hidden !important;
}

.page-admin .brand-name{
    display:block !important;
    max-width:100% !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    font-size:.92rem !important;
    letter-spacing:.025em !important;
    line-height:1 !important;
}

.page-admin .brand-tagline{
    display:block !important;
    max-width:100% !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    font-size:.52rem !important;
    line-height:1.15 !important;
    margin-top:3px !important;
}

.page-admin .topbar{
    width:228px !important;
}

.page-admin .topbar .wrap{
    padding:0 10px !important;
}

.page-admin .page{
    margin-left:240px !important;
}

.page-admin .nav a{
    font-size:.74rem !important;
    padding:0 10px !important;
    min-height:40px !important;
}

.page-admin .btn,
.page-admin .btn-muted{
    font-size:.74rem !important;
    padding:0 10px !important;
    min-height:40px !important;
}

.page-admin .user-pill{
    font-size:.74rem !important;
    min-height:46px !important;
    padding:8px 10px !important;
}

.page-admin .user-pill small{
    font-size:.56rem !important;
}

.message-side,
.message-side time,
.message-side .link-button{
    font-family:Inter, "Segoe UI", Arial, sans-serif !important;
    letter-spacing:0 !important;
}

.message-side{
    min-width:96px;
    font-size:.82rem !important;
    line-height:1.25 !important;
}

.message-side time{
    display:block;
    font-size:.8rem !important;
    font-weight:700 !important;
    color:#c5ab95 !important;
}

.message-side .link-button{
    margin-top:6px;
    font-size:.78rem !important;
    font-weight:700 !important;
}

@media (max-width:1180px){
    .page-admin .brand{
        grid-template-columns:46px minmax(0,1fr) !important;
    }
    .page-admin .brand-mark{
        width:46px !important;
        height:46px !important;
    }
    .page-admin .brand-name{
        font-size:.86rem !important;
    }
    .page-admin .brand-tagline{
        font-size:.5rem !important;
    }
}


/* ===== profile click fix ===== */
.user-link{
    color:inherit;
    text-decoration:none;
    font-weight:inherit;
}
.user-link:hover{
    color:#ff8a43;
}
.contact-name .user-link{
    color:inherit;
}


/* ===== rank color fix: contacts + shoutbox ===== */
.user-link.role-colored{
    color:var(--role-color, inherit) !important;
    text-shadow:0 0 12px color-mix(in srgb, var(--role-color, #fff) 22%, transparent);
}
.user-link.role-colored:hover{
    filter:brightness(1.08);
}
.contact-role{
    color:var(--role-color, #f6eadf) !important;
    text-shadow:0 0 14px color-mix(in srgb, var(--role-color, #fff) 18%, transparent);
}
.message-top strong{
    font-weight:900;
}
.message-top .role-badge{
    box-shadow:0 0 10px color-mix(in srgb, var(--role-color, #fff) 16%, transparent);
}


/* ===== contact avatar full ring fix ===== */
.contact-avatar-ring{
    width:190px !important;
    height:190px !important;
    margin:0 auto 10px !important;
    padding:0 !important;
    display:grid !important;
    place-items:center !important;
    border-radius:50% !important;
    overflow:hidden !important;
}

.contact-avatar-media{
    width:100% !important;
    height:100% !important;
    min-width:100% !important;
    min-height:100% !important;
    border-radius:50% !important;
    overflow:hidden !important;
    display:block !important;
    clip-path:none !important;
    border:none !important;
    box-shadow:none !important;
    background:transparent !important;
}

.contact-avatar-media img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center !important;
    border-radius:50% !important;
    display:block !important;
}

.contact-avatar-media.has-image{
    padding:0 !important;
}

.contact-avatar-media:not(.has-image){
    display:grid !important;
    place-items:center !important;
    font-size:2.2rem !important;
    font-weight:900 !important;
    color:#fff !important;
    background:
      radial-gradient(circle at 50% 35%, rgba(255,130,53,.22), transparent 38%),
      linear-gradient(180deg, #252931, #121419) !important;
}


/* ===== online users rank color chips ===== */
.user-chip{
    color:var(--role-color, #f0ddce);
    border-color:color-mix(in srgb, var(--role-color, rgba(255,130,53,.18)) 46%, rgba(255,130,53,.18));
    box-shadow:0 0 10px color-mix(in srgb, var(--role-color, #ff7c26) 14%, transparent);
    text-shadow:0 0 10px color-mix(in srgb, var(--role-color, #ffffff) 18%, transparent);
}


/* ===== real online rank color fix ===== */
.user-chip{
    color:var(--role-color, #f0ddce) !important;
    border-color:color-mix(in srgb, var(--role-color, #ff7c26) 42%, rgba(255,130,53,.18)) !important;
    box-shadow:
      0 0 0 1px color-mix(in srgb, var(--role-color, #ff7c26) 18%, transparent),
      0 0 12px color-mix(in srgb, var(--role-color, #ff7c26) 16%, transparent) !important;
    text-shadow:0 0 10px color-mix(in srgb, var(--role-color, #ffffff) 18%, transparent) !important;
}


/* ===== forum latest post avatar + rank color ===== */
.avatar-xs{
    width:34px !important;
    height:34px !important;
    font-size:.78rem !important;
}
.forum-row-latest-meta{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    margin-top:6px;
}
.forum-latest-user{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-width:0;
}
.forum-latest-avatar{
    flex:0 0 auto;
}
.forum-latest-user-name{
    font-weight:900;
    color:var(--role-color, #fff2e8);
    text-shadow:0 0 10px color-mix(in srgb, var(--role-color, #ffffff) 16%, transparent);
}
.forum-row-latest small{
    color:#bf9f86;
}


/* ===== profile horizontal menu ===== */
.profile-subnav{
    margin-bottom:16px;
    gap:12px;
}
.profile-subnav .subnav-link{
    min-height:46px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 18px;
    font-size:.95rem;
    font-weight:900;
    letter-spacing:.01em;
}
.profile-subnav .subnav-link.is-active{
    border-color:rgba(255,130,53,.36);
    box-shadow:var(--glow), 0 0 18px rgba(255,111,44,.10);
}
.profile-main{
    min-width:0;
}
@media (max-width: 700px){
    .profile-subnav{
        gap:8px;
    }
    .profile-subnav .subnav-link{
        width:100%;
    }
}


/* ===== unique CerberusElite redesign: ranks & groups ===== */
.page-home .roles-grid{
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
    gap:14px !important;
    align-items:start;
}

.page-home .panel:has(.roles-grid){
    overflow:visible;
}

.role-group-card{
    position:relative;
    isolation:isolate;
    min-height:360px;
    border:1px solid color-mix(in srgb, var(--group-start, #ff7c26) 44%, rgba(255,130,53,.22));
    background:
        radial-gradient(circle at 50% -10%, color-mix(in srgb, var(--group-start, #ff7c26) 20%, transparent), transparent 34%),
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0) 12%),
        linear-gradient(180deg, rgba(6,7,9,.0), rgba(6,7,9,.24) 28%, rgba(5,6,8,.62) 100%),
        linear-gradient(180deg, rgba(14,16,19,.98), rgba(6,7,9,.995));
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--group-start, #ff7c26) 14%, transparent),
        0 10px 30px rgba(0,0,0,.42),
        inset 0 1px 0 rgba(255,255,255,.05),
        inset 0 0 40px color-mix(in srgb, var(--group-start, #ff7c26) 10%, transparent);
    overflow:hidden;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.role-group-card::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(90deg, transparent, rgba(255,255,255,.03), transparent),
        repeating-linear-gradient(135deg, rgba(255,255,255,.018) 0 1px, transparent 1px 18px);
    opacity:.75;
    mix-blend-mode:screen;
}
.role-group-card::after{
    content:"";
    position:absolute;
    left:16px;
    right:16px;
    bottom:12px;
    height:1px;
    background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--group-start, #ff7c26) 88%, white 10%), transparent);
    box-shadow:0 0 14px color-mix(in srgb, var(--group-start, #ff7c26) 36%, transparent);
    pointer-events:none;
}
.role-group-card:hover{
    transform:translateY(-3px);
    border-color:color-mix(in srgb, var(--group-start, #ff7c26) 62%, rgba(255,130,53,.32));
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--group-start, #ff7c26) 20%, transparent),
        0 18px 38px rgba(0,0,0,.48),
        0 0 26px color-mix(in srgb, var(--group-start, #ff7c26) 18%, transparent),
        inset 0 1px 0 rgba(255,255,255,.06),
        inset 0 0 56px color-mix(in srgb, var(--group-start, #ff7c26) 13%, transparent);
}

.role-group-card summary{
    position:relative;
    z-index:1;
    min-height:58px !important;
    padding:13px 14px 12px !important;
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    border-bottom:1px solid color-mix(in srgb, var(--group-start, #ff7c26) 32%, transparent);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--group-start, #ff7c26) 28%, transparent), rgba(255,255,255,0) 72%),
        linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,0) 18%),
        linear-gradient(180deg, rgba(44,47,54,.95), rgba(17,18,22,.99));
    box-shadow:inset 0 -20px 35px rgba(0,0,0,.15);
}
.role-group-card summary::-webkit-details-marker{display:none}
.role-group-card summary::after{
    content:"";
    position:absolute;
    left:18px;
    right:18px;
    bottom:0;
    height:1px;
    background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--group-start, #ff7c26) 84%, white 12%), transparent);
    box-shadow:0 0 12px color-mix(in srgb, var(--group-start, #ff7c26) 28%, transparent);
}
.role-group-mark{
    flex:0 0 auto;
    width:26px;
    height:26px;
    display:grid;
    place-items:center;
    clip-path:var(--bevel-sm);
    background:
        linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,0) 22%),
        linear-gradient(180deg, color-mix(in srgb, var(--group-start, #ff7c26) 22%, #2a2d32), #101217);
    border:1px solid color-mix(in srgb, var(--group-start, #ff7c26) 48%, transparent);
    color:#fff5eb;
    font-size:.9rem;
    box-shadow:0 0 12px color-mix(in srgb, var(--group-start, #ff7c26) 20%, transparent);
}
.role-group-title{
    min-width:0;
    display:block;
    color:#fff2e4;
    font-size:1rem;
    font-weight:900;
    letter-spacing:.02em;
    line-height:1.05;
    text-transform:uppercase;
    text-shadow:0 0 10px rgba(255,255,255,.04);
}

.role-list{
    position:relative;
    z-index:1;
    display:grid;
    gap:10px;
    padding:12px 12px 18px !important;
}

.role-item{
    position:relative;
    min-height:48px;
    padding:10px 12px !important;
    display:flex;
    align-items:center;
    gap:10px;
    clip-path:var(--bevel-sm);
    background:
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0) 18%),
        linear-gradient(180deg, rgba(31,34,39,.98), rgba(9,10,12,.995));
    border:1px solid color-mix(in srgb, var(--role-color, #fff) 24%, rgba(255,130,53,.16));
    color:var(--role-color, #ffffff);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.03),
        inset 0 0 20px color-mix(in srgb, var(--role-color, #fff) 6%, transparent);
    transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, filter .16s ease;
}
.role-item::after{
    content:"";
    position:absolute;
    left:10px;
    right:10px;
    bottom:0;
    height:1px;
    background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--role-color, #fff) 68%, transparent), transparent);
    opacity:.66;
}
.role-item:hover{
    transform:translateX(4px);
    filter:brightness(1.06);
    border-color:color-mix(in srgb, var(--role-color, #fff) 42%, rgba(255,130,53,.20));
    box-shadow:
        0 0 16px color-mix(in srgb, var(--role-color, #fff) 12%, transparent),
        inset 0 1px 0 rgba(255,255,255,.04),
        inset 0 0 28px color-mix(in srgb, var(--role-color, #fff) 9%, transparent);
}
.role-item-mark{
    flex:0 0 auto;
    width:18px;
    text-align:center;
    font-size:.92rem;
    filter:drop-shadow(0 0 6px color-mix(in srgb, var(--role-color, #fff) 25%, transparent));
}
.role-item-title{
    min-width:0;
    display:block;
    font-weight:900;
    line-height:1.05;
    letter-spacing:.01em;
    text-shadow:0 0 8px color-mix(in srgb, var(--role-color, #fff) 14%, transparent);
}

/* stronger unique identities by column */
.page-home .roles-grid .role-group-card:nth-child(1){
    --group-start:#b5334b;
    --group-end:#482127;
}
.page-home .roles-grid .role-group-card:nth-child(2){
    --group-start:#1fa159;
    --group-end:#1a4e2e;
}
.page-home .roles-grid .role-group-card:nth-child(3){
    --group-start:#b9921a;
    --group-end:#4c4012;
}
.page-home .roles-grid .role-group-card:nth-child(4){
    --group-start:#2e74d1;
    --group-end:#253f74;
}
.page-home .roles-grid .role-group-card:nth-child(5){
    --group-start:#8b8c94;
    --group-end:#43444d;
}

/* compact fallback for smaller widths */
@media (max-width: 1180px){
    .page-home .roles-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
}
@media (max-width: 720px){
    .page-home .roles-grid{
        grid-template-columns:1fr !important;
    }
    .role-group-card{
        min-height:unset;
    }
    .role-group-title{
        font-size:.92rem;
    }
}


/* ===== ranks/groups spacing + less cramped ===== */
.page-home .roles-grid{
    grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)) !important;
    gap:18px !important;
}

.role-group-card{
    min-height:390px !important;
}

.role-group-card summary{
    min-height:62px !important;
    padding:15px 18px 14px !important;
    gap:12px !important;
}

.role-group-mark{
    width:30px !important;
    height:30px !important;
    font-size:1rem !important;
}

.role-group-title{
    font-size:.96rem !important;
    line-height:1.05 !important;
    letter-spacing:.015em !important;
}

.role-list{
    gap:12px !important;
    padding:14px 14px 22px !important;
}

.role-item{
    min-height:56px !important;
    padding:12px 16px !important;
    gap:12px !important;
}

.role-item-mark{
    width:20px !important;
    font-size:1rem !important;
}

.role-item-title{
    font-size:1rem !important;
    line-height:1.08 !important;
    letter-spacing:0 !important;
}

@media (max-width: 1360px){
    .page-home .roles-grid{
        grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1160px){
    .page-home .roles-grid{
        grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    }
    .role-group-title{
        font-size:.92rem !important;
    }
    .role-item-title{
        font-size:.94rem !important;
    }
}

@media (max-width: 900px){
    .page-home .roles-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
        gap:16px !important;
    }
    .role-group-card{
        min-height:unset !important;
    }
}

@media (max-width: 620px){
    .page-home .roles-grid{
        grid-template-columns:1fr !important;
    }
    .role-group-card summary{
        padding:14px 16px !important;
    }
    .role-item{
        min-height:52px !important;
        padding:11px 14px !important;
    }
}


/* ===== FIX ADMINISTRACJA COLUMN TOO TIGHT ===== */
.role-group-card{
    padding-bottom:10px;
}

.role-list{
    padding-top:16px !important;
}

.role-item{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    min-height:60px !important;
    padding:14px 18px !important;
    border-radius:8px;
}

.role-item-title{
    font-size:1.05rem !important;
    white-space:nowrap;
}

.role-group-title{
    font-size:1.05rem !important;
    letter-spacing:0.02em;
}

.role-group-card summary{
    padding:18px 20px !important;
}

/* more space between items */
.role-list{
    gap:16px !important;
}

/* make admin column slightly wider */
.page-home .roles-grid{
    grid-template-columns:repeat(auto-fit,minmax(230px,1fr)) !important;
}

/* prevent icon from squeezing text */
.role-item-mark{
    min-width:26px;
}

/* mobile improvement */
@media (max-width:900px){
    .role-item-title{
        white-space:normal;
    }
}


/* ===== banner + logo visibility fix ===== */
.hero-banner{
    min-height:520px !important;
    background-image:
      linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.18)),
      url('/assets/hero-fire.png') !important;
    background-position:center center !important;
    background-repeat:no-repeat !important;
    background-size:cover !important;
    border:1px solid rgba(255,130,53,.30) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.03),
      inset 0 0 40px rgba(255,115,30,.14),
      0 0 32px rgba(255,90,20,.10) !important;
}

.brand{
    min-width:300px !important;
    gap:14px !important;
}
.brand-mark{
    width:60px !important;
    height:60px !important;
    border-radius:10px !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,0) 26%),
      linear-gradient(180deg, rgba(255,130,53,.08), rgba(255,130,53,0)),
      url('/assets/emblem-fire.png') center/cover no-repeat !important;
    border:1px solid rgba(255,130,53,.32) !important;
    box-shadow:
      0 0 0 1px rgba(255,130,53,.16),
      0 0 18px rgba(255,110,40,.16),
      inset 0 0 18px rgba(255,110,40,.08) !important;
}
.brand-name{
    text-shadow:0 0 16px rgba(255,114,26,.18) !important;
}
.brand-tagline{
    color:#d9b79a !important;
}

@media (max-width: 1100px){
    .hero-banner{
        min-height:360px !important;
    }
}

@media (max-width: 760px){
    .hero-banner{
        min-height:250px !important;
        background-position:center center !important;
    }
    .brand{
        min-width:0 !important;
    }
    .brand-mark{
        width:52px !important;
        height:52px !important;
    }
}


/* ===== fix: rangi i grupy in one clean row ===== */
.page-home .panel:has(.roles-grid){
    overflow:hidden !important;
}

.page-home .roles-grid{
    display:grid !important;
    grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
    gap:14px !important;
    align-items:start !important;
}

.page-home .roles-grid .role-group-card{
    width:100% !important;
    min-width:0 !important;
    min-height:350px !important;
    margin:0 !important;
}

.page-home .roles-grid .role-group-card summary{
    min-width:0 !important;
}

.page-home .roles-grid .role-group-title{
    font-size:.92rem !important;
    line-height:1.04 !important;
    letter-spacing:.01em !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
}

.page-home .roles-grid .role-list{
    gap:10px !important;
    padding:12px 12px 18px !important;
}

.page-home .roles-grid .role-item{
    min-height:48px !important;
    padding:10px 12px !important;
    gap:10px !important;
}

.page-home .roles-grid .role-item-title{
    font-size:.92rem !important;
    line-height:1.02 !important;
    white-space:normal !important;
    word-break:break-word !important;
}

.page-home .roles-grid .role-item-mark{
    min-width:18px !important;
    width:18px !important;
    font-size:.88rem !important;
}

@media (max-width: 1280px){
    .page-home .roles-grid{
        grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1040px){
    .page-home .roles-grid{
        grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 820px){
    .page-home .roles-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    }
    .page-home .roles-grid .role-group-card{
        min-height:unset !important;
    }
}

@media (max-width: 560px){
    .page-home .roles-grid{
        grid-template-columns:1fr !important;
    }
}


/* ===== hero banner frame-fit fix ===== */
.hero-banner{
    min-height:420px !important;
    background-image:url('/assets/hero-fire.png') !important;
    background-repeat:no-repeat !important;
    background-position:center center !important;
    background-size:contain !important;
    background-color:#060606 !important;
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.03),
      inset 0 0 28px rgba(255,115,30,.08),
      0 0 24px rgba(255,90,20,.06) !important;
}

@media (max-width: 1100px){
    .hero-banner{
        min-height:320px !important;
        background-size:contain !important;
    }
}

@media (max-width: 760px){
    .hero-banner{
        min-height:220px !important;
        background-size:contain !important;
    }
}


/* ===== neon frame restyle inspired by reference mockup ===== */
:root{
    --neon-red:#ff6046;
    --neon-pink:#ff45d4;
    --neon-violet:#9867ff;
    --neon-blue:#4785ff;
    --neon-cyan:#32e7ff;
    --neon-green:#36ff9d;
    --neon-gold:#ffbe4d;
}

:is(.panel,.server-card,.stat-card,.quick-link,.mini-card,.role-group-card,.role-item,.muted-box,.notice,.admin-tile,.admin-user-item,.checkbox-card,.admin-form-box,.auth-card,.simple-box,.hero-card,.hero-title-strip,.contact-link-btn,.contact-arrow,.contact-avatar-ring,.status-chip,.nav a,.btn,.btn-muted){
    --frame-a:var(--neon-red);
    --frame-b:var(--neon-pink);
    --frame-c:var(--neon-blue);
    --frame-glow:rgba(255,96,70,.28);
    --corner-w:62px;
    --corner-h:18px;
    position:relative;
    isolation:isolate;
    border:1px solid rgba(255,255,255,.08) !important;
    background:
      radial-gradient(circle at 50% 0, rgba(255,255,255,.06), rgba(255,255,255,0) 34%),
      linear-gradient(180deg, rgba(16,18,28,.97), rgba(5,6,12,.985)) !important;
    box-shadow:
      0 0 0 1px rgba(255,255,255,.03),
      inset 0 0 0 1px rgba(255,255,255,.02),
      inset 0 0 36px rgba(255,255,255,.02),
      0 0 16px rgba(255,96,70,.10),
      0 0 34px rgba(70,133,255,.08) !important;
}

:is(.panel,.server-card,.stat-card,.quick-link,.mini-card,.role-group-card,.role-item,.muted-box,.notice,.admin-tile,.admin-user-item,.checkbox-card,.admin-form-box,.auth-card,.simple-box,.hero-card,.hero-title-strip,.contact-link-btn,.contact-arrow,.contact-avatar-ring,.status-chip,.nav a,.btn,.btn-muted)::before{
    content:"";
    position:absolute;
    inset:0;
    padding:2px;
    clip-path:inherit;
    border-radius:inherit;
    pointer-events:none;
    background:linear-gradient(135deg, var(--frame-a) 0%, var(--frame-b) 45%, var(--frame-c) 100%);
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor;
    mask-composite:exclude;
    opacity:.95;
    box-shadow:0 0 14px var(--frame-glow), 0 0 26px var(--frame-glow);
}

:is(.panel,.server-card,.stat-card,.quick-link,.mini-card,.role-group-card,.role-item,.muted-box,.notice,.admin-tile,.admin-user-item,.checkbox-card,.admin-form-box,.auth-card,.simple-box,.hero-card,.hero-title-strip,.contact-link-btn,.contact-arrow,.contact-avatar-ring,.status-chip,.nav a,.btn,.btn-muted)::after{
    content:"";
    position:absolute;
    inset:1px;
    clip-path:inherit;
    border-radius:inherit;
    pointer-events:none;
    opacity:.92;
    background:
      linear-gradient(90deg, var(--frame-a), var(--frame-b)) top left/var(--corner-w) 2px no-repeat,
      linear-gradient(180deg, var(--frame-a), var(--frame-b)) top left/2px var(--corner-h) no-repeat,
      linear-gradient(90deg, var(--frame-b), var(--frame-c)) top right/var(--corner-w) 2px no-repeat,
      linear-gradient(180deg, var(--frame-b), var(--frame-c)) top right/2px var(--corner-h) no-repeat,
      linear-gradient(90deg, var(--frame-c), var(--frame-b)) bottom right/var(--corner-w) 2px no-repeat,
      linear-gradient(180deg, var(--frame-c), var(--frame-b)) bottom right/2px var(--corner-h) no-repeat,
      linear-gradient(90deg, var(--frame-b), var(--frame-a)) bottom left/var(--corner-w) 2px no-repeat,
      linear-gradient(180deg, var(--frame-b), var(--frame-a)) bottom left/2px var(--corner-h) no-repeat;
    filter:drop-shadow(0 0 5px var(--frame-glow)) drop-shadow(0 0 12px var(--frame-glow));
}

.hero-card,
.hero-title-strip,
.hero-banner,
.panel,
.server-card,
.stat-card,
.quick-link,
.mini-card,
.role-group-card,
.role-item,
.muted-box,
.notice,
.status-chip,
.contact-link-btn,
.contact-arrow{
    overflow:hidden;
}

.hero-card,
.hero-title-strip,
.hero-banner,
.panel,
.server-card,
.stat-card,
.quick-link,
.mini-card,
.role-group-card,
.role-item,
.muted-box,
.notice,
.contact-link-btn,
.contact-arrow,
.status-chip,
.nav a,
.btn,
.btn-muted{
    clip-path:polygon(16px 0, calc(100% - 16px) 0, 100% 16px, 100% calc(100% - 16px), calc(100% - 16px) 100%, 16px 100%, 0 calc(100% - 16px), 0 16px) !important;
}

.hero-card{
    --frame-a:#ff6648;
    --frame-b:#ff4fd8;
    --frame-c:#7384ff;
    --frame-glow:rgba(255,104,74,.30);
    --corner-w:84px;
    --corner-h:22px;
    background:
      radial-gradient(circle at 50% 0, rgba(255,117,76,.12), rgba(255,255,255,0) 26%),
      linear-gradient(180deg, rgba(11,12,22,.96), rgba(3,4,9,.99)) !important;
    box-shadow:
      0 0 0 1px rgba(255,255,255,.03),
      inset 0 0 0 1px rgba(255,255,255,.02),
      inset 0 0 42px rgba(255,93,66,.05),
      0 0 18px rgba(255,104,74,.12),
      0 0 52px rgba(88,118,255,.10) !important;
}

.hero-banner{
    position:relative;
    clip-path:polygon(16px 0, calc(100% - 16px) 0, 100% 16px, 100% calc(100% - 16px), calc(100% - 16px) 100%, 16px 100%, 0 calc(100% - 16px), 0 16px) !important;
    border:1px solid rgba(255,255,255,.08) !important;
    background-color:#06070d !important;
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.03),
      inset 0 0 30px rgba(255,105,72,.08),
      0 0 16px rgba(255,105,72,.10),
      0 0 28px rgba(80,108,255,.08) !important;
}

.hero-banner::before{
    content:"";
    position:absolute;
    inset:0;
    clip-path:inherit;
    pointer-events:none;
    background:linear-gradient(135deg, #ff5e43, #ff47cd 46%, #477fff 100%);
    padding:2px;
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor;
    mask-composite:exclude;
    opacity:.96;
}

.hero-banner::after{
    content:"";
    position:absolute;
    inset:1px;
    clip-path:inherit;
    pointer-events:none;
    background:
      linear-gradient(90deg, #ff5e43, #ff47cd) top left/94px 2px no-repeat,
      linear-gradient(180deg, #ff5e43, #ff47cd) top left/2px 28px no-repeat,
      linear-gradient(90deg, #ff47cd, #477fff) top right/94px 2px no-repeat,
      linear-gradient(180deg, #ff47cd, #477fff) top right/2px 28px no-repeat,
      linear-gradient(90deg, #477fff, #ff47cd) bottom right/94px 2px no-repeat,
      linear-gradient(180deg, #477fff, #ff47cd) bottom right/2px 28px no-repeat,
      linear-gradient(90deg, #ff47cd, #ff5e43) bottom left/94px 2px no-repeat,
      linear-gradient(180deg, #ff47cd, #ff5e43) bottom left/2px 28px no-repeat;
    filter:drop-shadow(0 0 6px rgba(255,96,74,.30)) drop-shadow(0 0 14px rgba(73,126,255,.22));
}

.hero-title-strip{
    --frame-a:#ff6547;
    --frame-b:#ff48c9;
    --frame-c:#5876ff;
    --frame-glow:rgba(255,100,72,.28);
    background:
      linear-gradient(180deg, rgba(19,20,32,.97), rgba(6,7,14,.99)) !important;
}

.server-card:nth-child(1){--frame-a:#ff6d47;--frame-b:#ff49c7;--frame-c:#8f67ff;--frame-glow:rgba(255,109,71,.28);}
.server-card:nth-child(2){--frame-a:#ff59cb;--frame-b:#9167ff;--frame-c:#45b6ff;--frame-glow:rgba(192,108,255,.24);}
.server-card:nth-child(3){--frame-a:#ffbe48;--frame-b:#40ff93;--frame-c:#27e4ff;--frame-glow:rgba(255,190,72,.24);}
.server-card:nth-child(4){--frame-a:#965fff;--frame-b:#46a6ff;--frame-c:#2ef3ff;--frame-glow:rgba(103,126,255,.26);}

.panel-shoutbox,
.panel-shoutbox .message-row,
.panel-shoutbox .muted-box{
    --frame-a:#ff6647;
    --frame-b:#ff47ca;
    --frame-c:#4d80ff;
    --frame-glow:rgba(255,102,71,.28);
}

.panel-forum-home,
.panel-forum-home .forum-row{
    --frame-a:#ffb94b;
    --frame-b:#3eff98;
    --frame-c:#33ddff;
    --frame-glow:rgba(81,255,170,.18);
}

.stats-row .stat-card:nth-child(1){--frame-a:#ff6645;--frame-b:#ff9451;--frame-c:#ff47c8;--frame-glow:rgba(255,104,69,.28);}
.stats-row .stat-card:nth-child(2){--frame-a:#ff8d50;--frame-b:#ff4fc8;--frame-c:#a865ff;--frame-glow:rgba(255,126,78,.24);}
.stats-row .stat-card:nth-child(3){--frame-a:#ffb34a;--frame-b:#5b79ff;--frame-c:#34e4ff;--frame-glow:rgba(93,123,255,.24);}
.stats-row .stat-card:nth-child(4){--frame-a:#ff4dc8;--frame-b:#7a6cff;--frame-c:#35dcff;--frame-glow:rgba(132,109,255,.24);}

.sidebar-card.contacts-slider-card,
.contact-avatar-ring,
.contact-link-btn,
.contact-arrow{
    --frame-a:#ff5f46;
    --frame-b:#ff4dd2;
    --frame-c:#5a72ff;
    --frame-glow:rgba(255,96,70,.26);
}

.quick-link{
    --frame-a:#ffbf4d;
    --frame-b:#37ff9d;
    --frame-c:#34dfff;
    --frame-glow:rgba(68,255,170,.18);
    background:
      radial-gradient(circle at 50% 0, rgba(80,255,192,.08), rgba(255,255,255,0) 34%),
      linear-gradient(180deg, rgba(11,18,18,.97), rgba(4,8,10,.99)) !important;
}

.mini-card{
    --frame-a:#ff57c8;
    --frame-b:#8a68ff;
    --frame-c:#3edbff;
    --frame-glow:rgba(160,104,255,.22);
}

.user-chip,
.role-badge,
.link-button{
    box-shadow:0 0 10px rgba(255,93,66,.08), 0 0 18px rgba(86,109,255,.06) !important;
}

.role-group-card:nth-child(1),
.role-group-card:nth-child(1) .role-item{--frame-a:#ff605d;--frame-b:#ff4fa8;--frame-c:#ff7a55;--frame-glow:rgba(255,96,93,.24);}
.role-group-card:nth-child(2),
.role-group-card:nth-child(2) .role-item{--frame-a:#44f0a0;--frame-b:#1adf86;--frame-c:#4bd8ff;--frame-glow:rgba(68,240,160,.20);}
.role-group-card:nth-child(3),
.role-group-card:nth-child(3) .role-item{--frame-a:#ffc34c;--frame-b:#f39b19;--frame-c:#ffd76e;--frame-glow:rgba(255,195,76,.22);}
.role-group-card:nth-child(4),
.role-group-card:nth-child(4) .role-item{--frame-a:#5f9aff;--frame-b:#4d7dff;--frame-c:#43dfff;--frame-glow:rgba(95,154,255,.22);}
.role-group-card:nth-child(5),
.role-group-card:nth-child(5) .role-item{--frame-a:#a56bff;--frame-b:#6e6fff;--frame-c:#56d7ff;--frame-glow:rgba(165,107,255,.20);}

.panel-head{
    border-bottom:none !important;
    position:relative;
    padding-bottom:12px !important;
}
.panel-head::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:2px;
    background:linear-gradient(90deg, var(--frame-a, #ff6547), var(--frame-b, #ff49ca), var(--frame-c, #4e80ff));
    box-shadow:0 0 8px var(--frame-glow, rgba(255,100,72,.24));
    opacity:.92;
}

.shoutbox-form input,
.auth-form input,
.auth-form textarea,
.admin-form-box input,
.admin-form-box textarea,
.admin-form-box select{
    border:1px solid rgba(255,255,255,.08) !important;
    background:
      radial-gradient(circle at 50% 0, rgba(255,255,255,.06), rgba(255,255,255,0) 30%),
      linear-gradient(180deg, rgba(14,16,26,.97), rgba(5,6,10,.99)) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.02),
      inset 0 0 22px rgba(255,255,255,.02),
      0 0 0 1px rgba(255,93,66,.05),
      0 0 14px rgba(76,126,255,.05) !important;
}

.nav a,
.btn,
.btn-muted,
.status-chip,
.contact-link-btn,
.contact-arrow{
    --corner-w:40px;
    --corner-h:12px;
}

.nav a{
    --frame-a:#ff6746;
    --frame-b:#ff47ca;
    --frame-c:#5e73ff;
    --frame-glow:rgba(255,102,70,.22);
    color:#fff3ea !important;
    text-shadow:0 0 10px rgba(255,124,92,.18);
}

.btn,
.status-chip{
    --frame-a:#ff7b4f;
    --frame-b:#ff4bc9;
    --frame-c:#ff9b58;
    --frame-glow:rgba(255,123,79,.22);
    color:#fff7ef !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 20%),
      linear-gradient(180deg, rgba(58,22,20,.95), rgba(23,10,12,.98)) !important;
}

.btn-muted{
    --frame-a:#7f6cff;
    --frame-b:#4aa6ff;
    --frame-c:#3fe6ff;
    --frame-glow:rgba(103,124,255,.22);
    color:#edf4ff !important;
}

.contact-slider-title,
.panel-head h2,
.hero-title-main,
.brand-name{
    text-shadow:0 0 14px rgba(255,104,74,.14), 0 0 24px rgba(72,125,255,.08);
}

@media (max-width: 860px){
    :is(.panel,.server-card,.stat-card,.quick-link,.mini-card,.role-group-card,.role-item,.muted-box,.notice,.admin-tile,.admin-user-item,.checkbox-card,.admin-form-box,.auth-card,.simple-box,.hero-card,.hero-title-strip,.contact-link-btn,.contact-arrow,.contact-avatar-ring,.status-chip,.nav a,.btn,.btn-muted){
        --corner-w:42px;
        --corner-h:12px;
    }
    .hero-card,
    .hero-banner{--corner-w:56px;--corner-h:16px;}
}


/* ===== shock neon glow pass ===== */
@keyframes neonShockPulse{
    0%,100%{opacity:.88;filter:drop-shadow(0 0 8px var(--frame-glow, rgba(255,96,70,.28))) drop-shadow(0 0 16px rgba(83,128,255,.16));}
    50%{opacity:1;filter:drop-shadow(0 0 12px var(--frame-glow, rgba(255,96,70,.36))) drop-shadow(0 0 24px rgba(83,128,255,.24));}
}
@keyframes neonTracerSweep{
    0%{transform:translateX(-42%) scaleX(.82);opacity:0;}
    10%{opacity:.22;}
    45%{opacity:.98;}
    100%{transform:translateX(42%) scaleX(1.06);opacity:0;}
}

.page-home .hero-card,
.page-home .hero-banner,
.page-home .hero-title-strip,
.page-home .panel,
.page-home .server-card,
.page-home .stat-card,
.page-home .quick-link,
.page-home .mini-card,
.page-home .role-group-card,
.page-home .role-item,
.page-home .muted-box,
.page-home .contact-link-btn,
.page-home .contact-arrow,
.page-home .contact-avatar-ring,
.page-home .status-chip{
    box-shadow:
      0 0 0 1px rgba(255,255,255,.03),
      inset 0 0 0 1px rgba(255,255,255,.03),
      inset 0 0 44px rgba(255,255,255,.025),
      inset 0 0 56px color-mix(in srgb, var(--frame-b, #ff47cd) 5%, transparent),
      0 0 18px color-mix(in srgb, var(--frame-a, #ff6046) 16%, transparent),
      0 0 38px color-mix(in srgb, var(--frame-b, #ff47cd) 14%, transparent),
      0 0 72px color-mix(in srgb, var(--frame-c, #4785ff) 12%, transparent) !important;
}

.page-home .hero-card::before,
.page-home .hero-banner::before,
.page-home .hero-title-strip::before,
.page-home .panel::before,
.page-home .server-card::before,
.page-home .stat-card::before,
.page-home .quick-link::before,
.page-home .mini-card::before,
.page-home .role-group-card::before,
.page-home .role-item::before,
.page-home .muted-box::before,
.page-home .contact-link-btn::before,
.page-home .contact-arrow::before,
.page-home .contact-avatar-ring::before,
.page-home .status-chip::before{
    opacity:1 !important;
    box-shadow:
      0 0 14px color-mix(in srgb, var(--frame-a, #ff6046) 34%, transparent),
      0 0 28px color-mix(in srgb, var(--frame-b, #ff47cd) 26%, transparent),
      0 0 44px color-mix(in srgb, var(--frame-c, #4785ff) 18%, transparent) !important;
}

.page-home .hero-card::after,
.page-home .hero-banner::after,
.page-home .hero-title-strip::after,
.page-home .panel::after,
.page-home .server-card::after,
.page-home .stat-card::after,
.page-home .quick-link::after,
.page-home .mini-card::after,
.page-home .role-group-card::after,
.page-home .role-item::after,
.page-home .muted-box::after,
.page-home .contact-link-btn::after,
.page-home .contact-arrow::after,
.page-home .contact-avatar-ring::after,
.page-home .status-chip::after{
    inset:1px !important;
    opacity:1 !important;
    background:
      linear-gradient(90deg, var(--frame-a), var(--frame-b)) top left/72px 2px no-repeat,
      linear-gradient(180deg, var(--frame-a), var(--frame-b)) top left/2px 24px no-repeat,
      linear-gradient(90deg, var(--frame-b), var(--frame-c)) top right/72px 2px no-repeat,
      linear-gradient(180deg, var(--frame-b), var(--frame-c)) top right/2px 24px no-repeat,
      linear-gradient(90deg, var(--frame-c), var(--frame-b)) bottom right/72px 2px no-repeat,
      linear-gradient(180deg, var(--frame-c), var(--frame-b)) bottom right/2px 24px no-repeat,
      linear-gradient(90deg, var(--frame-b), var(--frame-a)) bottom left/72px 2px no-repeat,
      linear-gradient(180deg, var(--frame-b), var(--frame-a)) bottom left/2px 24px no-repeat,
      linear-gradient(90deg, transparent, color-mix(in srgb, var(--frame-a) 50%, white 16%), color-mix(in srgb, var(--frame-b) 92%, white 8%), color-mix(in srgb, var(--frame-c) 50%, white 12%), transparent) center top 10px / calc(100% - 120px) 1px no-repeat,
      linear-gradient(90deg, transparent, color-mix(in srgb, var(--frame-b) 75%, white 10%), transparent) center bottom 10px / calc(100% - 140px) 1px no-repeat,
      radial-gradient(circle at left top, color-mix(in srgb, var(--frame-a) 34%, transparent), transparent 34%),
      radial-gradient(circle at right top, color-mix(in srgb, var(--frame-c) 28%, transparent), transparent 34%),
      radial-gradient(circle at left bottom, color-mix(in srgb, var(--frame-b) 22%, transparent), transparent 34%),
      radial-gradient(circle at right bottom, color-mix(in srgb, var(--frame-c) 20%, transparent), transparent 34%);
    animation:neonShockPulse 5s ease-in-out infinite;
}

.page-home .hero-card,
.page-home .hero-banner{
    --corner-w:104px;
    --corner-h:30px;
}

.page-home .panel-head{
    overflow:hidden;
}
.page-home .panel-head::after{
    height:2px !important;
    background:linear-gradient(90deg, var(--frame-a, #ff6547), var(--frame-b, #ff49ca) 46%, var(--frame-c, #4e80ff)) !important;
    box-shadow:0 0 8px var(--frame-glow, rgba(255,100,72,.24)), 0 0 18px color-mix(in srgb, var(--frame-b, #ff49ca) 26%, transparent) !important;
}
.page-home .panel-head::before{
    content:"";
    position:absolute;
    left:16%;
    right:16%;
    bottom:-1px;
    height:10px;
    pointer-events:none;
    background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--frame-a, #ff6547) 70%, white 6%), color-mix(in srgb, var(--frame-b, #ff49ca) 92%, white 8%), color-mix(in srgb, var(--frame-c, #4e80ff) 72%, white 4%), transparent);
    filter:blur(4px);
    animation:neonTracerSweep 4.8s linear infinite;
}

.page-home .message-row,
.page-home .forum-row,
.page-home .role-item,
.page-home .user-chip,
.page-home .subnav-link{
    position:relative;
    background:
      linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0) 16%),
      linear-gradient(180deg, rgba(13,15,25,.97), rgba(5,6,11,.99)) !important;
    border:1px solid rgba(255,255,255,.06) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.02),
      0 0 0 1px color-mix(in srgb, var(--frame-a, #ff6046) 8%, transparent),
      0 0 16px color-mix(in srgb, var(--frame-b, #ff47cd) 10%, transparent),
      0 0 28px color-mix(in srgb, var(--frame-c, #4785ff) 8%, transparent) !important;
}

.page-home .message-row::after,
.page-home .forum-row::after,
.page-home .role-item::after,
.page-home .user-chip::after{
    content:"";
    position:absolute;
    left:12px;
    right:12px;
    top:0;
    height:1px;
    background:linear-gradient(90deg, transparent, var(--frame-a, #ff6046), var(--frame-b, #ff47cd), transparent);
    box-shadow:0 0 8px color-mix(in srgb, var(--frame-b, #ff47cd) 26%, transparent);
    opacity:.88;
}

.page-home .panel:hover,
.page-home .server-card:hover,
.page-home .stat-card:hover,
.page-home .quick-link:hover,
.page-home .mini-card:hover,
.page-home .role-group-card:hover,
.page-home .contact-link-btn:hover,
.page-home .contact-arrow:hover{
    box-shadow:
      0 0 0 1px rgba(255,255,255,.04),
      inset 0 0 0 1px rgba(255,255,255,.04),
      inset 0 0 54px color-mix(in srgb, var(--frame-b, #ff47cd) 7%, transparent),
      0 0 22px color-mix(in srgb, var(--frame-a, #ff6046) 24%, transparent),
      0 0 48px color-mix(in srgb, var(--frame-b, #ff47cd) 22%, transparent),
      0 0 94px color-mix(in srgb, var(--frame-c, #4785ff) 18%, transparent) !important;
}

.page-home .hero-title-main,
.page-home .panel-head h2,
.page-home .stat-value,
.page-home .contact-name,
.page-home .brand-name{
    text-shadow:
      0 0 8px rgba(255,255,255,.08),
      0 0 16px color-mix(in srgb, var(--frame-a, #ff6547) 24%, transparent),
      0 0 28px color-mix(in srgb, var(--frame-b, #ff49ca) 18%, transparent),
      0 0 44px color-mix(in srgb, var(--frame-c, #4e80ff) 12%, transparent) !important;
}

.page-home .server-card:nth-child(1){--frame-a:#ff694a;--frame-b:#ff2dbd;--frame-c:#7f67ff;--frame-glow:rgba(255,105,74,.34);}
.page-home .server-card:nth-child(2){--frame-a:#ff45d3;--frame-b:#7f68ff;--frame-c:#34dbff;--frame-glow:rgba(194,90,255,.30);}
.page-home .server-card:nth-child(3){--frame-a:#ffbc47;--frame-b:#52ff76;--frame-c:#28e7ff;--frame-glow:rgba(104,255,166,.26);}
.page-home .server-card:nth-child(4){--frame-a:#7a63ff;--frame-b:#40a7ff;--frame-c:#3effff;--frame-glow:rgba(95,123,255,.30);}

.page-home .panel-shoutbox,
.page-home .panel-shoutbox .message-row,
.page-home .panel-shoutbox .muted-box{--frame-a:#ff5f43;--frame-b:#ff36c8;--frame-c:#4d7bff;--frame-glow:rgba(255,95,67,.30);}
.page-home .panel-forum-home,
.page-home .panel-forum-home .forum-row{--frame-a:#ffb84a;--frame-b:#3cff95;--frame-c:#2adfff;--frame-glow:rgba(73,255,160,.24);}
.page-home .main-column > .panel:nth-child(4),
.page-home .main-column > .panel:nth-child(4) .user-chip{--frame-a:#ff844b;--frame-b:#ff4abb;--frame-c:#5f7dff;--frame-glow:rgba(255,132,75,.24);}
.page-home .main-column > .panel:nth-child(5),
.page-home .main-column > .panel:nth-child(5) .role-item{--frame-a:#4eff89;--frame-b:#2fe7ff;--frame-c:#6a7aff;--frame-glow:rgba(78,255,137,.22);}

.page-home .sidebar > .panel:nth-child(1),
.page-home .sidebar > .panel:nth-child(1) .contact-link-btn,
.page-home .sidebar > .panel:nth-child(1) .contact-arrow,
.page-home .sidebar > .panel:nth-child(1) .contact-avatar-ring{--frame-a:#ff6048;--frame-b:#ff36d7;--frame-c:#5872ff;--frame-glow:rgba(255,96,72,.32);}
.page-home .sidebar > .panel:nth-child(2),
.page-home .sidebar > .panel:nth-child(2) .quick-link{--frame-a:#ffc14b;--frame-b:#39ff9d;--frame-c:#2ee2ff;--frame-glow:rgba(76,255,170,.22);}
.page-home .sidebar > .panel:nth-child(3),
.page-home .sidebar > .panel:nth-child(3) .mini-card{--frame-a:#a968ff;--frame-b:#6670ff;--frame-c:#33dfff;--frame-glow:rgba(169,104,255,.24);}
.page-home .sidebar > .panel:nth-child(4),
.page-home .sidebar > .panel:nth-child(4) .mini-card{--frame-a:#ff5ab2;--frame-b:#ff6d65;--frame-c:#8a6cff;--frame-glow:rgba(255,90,178,.24);}

.page-home .stats-row .stat-card:nth-child(1){--frame-a:#ff6947;--frame-b:#ff944d;--frame-c:#ff30cb;--frame-glow:rgba(255,105,71,.30);}
.page-home .stats-row .stat-card:nth-child(2){--frame-a:#ff9050;--frame-b:#ff45ca;--frame-c:#8a68ff;--frame-glow:rgba(255,144,80,.28);}
.page-home .stats-row .stat-card:nth-child(3){--frame-a:#ffc04e;--frame-b:#5e71ff;--frame-c:#31e2ff;--frame-glow:rgba(94,113,255,.28);}
.page-home .stats-row .stat-card:nth-child(4){--frame-a:#ff4ac9;--frame-b:#7f69ff;--frame-c:#2bdfff;--frame-glow:rgba(127,105,255,.28);}

.page-home .contact-avatar-ring{
    background:
      radial-gradient(circle at 50% 50%, rgba(6,8,16,.78), rgba(6,8,16,.96)),
      linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,0)) !important;
}

.page-home .quick-link,
.page-home .mini-card,
.page-home .contact-link-btn,
.page-home .contact-arrow,
.page-home .btn,
.page-home .btn-muted,
.page-home .nav a,
.page-home .status-chip{
    transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.page-home .quick-link:hover,
.page-home .mini-card:hover,
.page-home .contact-link-btn:hover,
.page-home .contact-arrow:hover,
.page-home .btn:hover,
.page-home .btn-muted:hover,
.page-home .nav a:hover,
.page-home .status-chip:hover{
    transform:translateY(-1px);
    filter:brightness(1.08);
}

@media (max-width: 860px){
    .page-home .hero-card::after,
    .page-home .hero-banner::after,
    .page-home .hero-title-strip::after,
    .page-home .panel::after,
    .page-home .server-card::after,
    .page-home .stat-card::after,
    .page-home .quick-link::after,
    .page-home .mini-card::after,
    .page-home .role-group-card::after,
    .page-home .role-item::after,
    .page-home .muted-box::after,
    .page-home .contact-link-btn::after,
    .page-home .contact-arrow::after,
    .page-home .contact-avatar-ring::after,
    .page-home .status-chip::after{
        background:
          linear-gradient(90deg, var(--frame-a), var(--frame-b)) top left/42px 2px no-repeat,
          linear-gradient(180deg, var(--frame-a), var(--frame-b)) top left/2px 16px no-repeat,
          linear-gradient(90deg, var(--frame-b), var(--frame-c)) top right/42px 2px no-repeat,
          linear-gradient(180deg, var(--frame-b), var(--frame-c)) top right/2px 16px no-repeat,
          linear-gradient(90deg, var(--frame-c), var(--frame-b)) bottom right/42px 2px no-repeat,
          linear-gradient(180deg, var(--frame-c), var(--frame-b)) bottom right/2px 16px no-repeat,
          linear-gradient(90deg, var(--frame-b), var(--frame-a)) bottom left/42px 2px no-repeat,
          linear-gradient(180deg, var(--frame-b), var(--frame-a)) bottom left/2px 16px no-repeat,
          linear-gradient(90deg, transparent, color-mix(in srgb, var(--frame-a) 54%, white 10%), color-mix(in srgb, var(--frame-b) 92%, white 8%), color-mix(in srgb, var(--frame-c) 50%, white 10%), transparent) center top 8px / calc(100% - 82px) 1px no-repeat,
          linear-gradient(90deg, transparent, color-mix(in srgb, var(--frame-b) 72%, white 8%), transparent) center bottom 8px / calc(100% - 96px) 1px no-repeat,
          radial-gradient(circle at left top, color-mix(in srgb, var(--frame-a) 34%, transparent), transparent 34%),
          radial-gradient(circle at right top, color-mix(in srgb, var(--frame-c) 28%, transparent), transparent 34%),
          radial-gradient(circle at left bottom, color-mix(in srgb, var(--frame-b) 22%, transparent), transparent 34%),
          radial-gradient(circle at right bottom, color-mix(in srgb, var(--frame-c) 20%, transparent), transparent 34%) !important;
    }
}