@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700;900&family=Cinzel:wght@400;600;700;900&family=IM+Fell+English:ital@0;1&display=swap');

:root {
    --gold:    #c8a96e;
    --gold-l:  #e8d090;
    --gold-d:  #7a5520;
    --blood:   #8b0000;
    --blood-l: #cc2222;
    --dark:    #07070f;
    --dark2:   #0c0c18;
    --dark3:   #141428;
    --tx:      #8a7560;
    --tx-l:    #c8a96e;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--dark); color:var(--tx); font-family:'IM Fell English',serif; font-size:17px; overflow-x:hidden; min-height:100vh; }
#bgc { position:fixed; top:0; left:0; width:100%; height:100%; pointer-events:none; z-index:0; }
::-webkit-scrollbar { width:3px; }
::-webkit-scrollbar-track { background:var(--dark); }
::-webkit-scrollbar-thumb { background:var(--gold-d); }

/* HEADER */
header { position:relative; z-index:100; display:flex; justify-content:space-between; align-items:center; padding:20px 50px; border-bottom:1px solid rgba(200,169,110,.12); background:linear-gradient(180deg,rgba(7,7,15,.97),rgba(7,7,15,.7)); backdrop-filter:blur(8px); }
.logo { font-family:'Cinzel Decorative',serif; font-size:24px; font-weight:900; color:var(--gold); letter-spacing:5px; text-decoration:none; text-shadow:0 0 20px rgba(200,169,110,.6),0 0 50px rgba(139,0,0,.4); }
.hright { display:flex; gap:14px; align-items:center; }
.btn-n { font-family:'Cinzel',serif; font-size:10px; letter-spacing:3px; padding:8px 20px; border:1px solid var(--gold-d); color:var(--gold); background:transparent; cursor:pointer; text-transform:uppercase; transition:all .3s; text-decoration:none; display:inline-block; }
.btn-n:hover { background:rgba(200,169,110,.08); border-color:var(--gold); }
.btn-c { font-family:'Cinzel',serif; font-size:10px; letter-spacing:3px; padding:8px 20px; background:linear-gradient(135deg,var(--blood),#5a0000); border:1px solid var(--blood-l); color:var(--gold-l); cursor:pointer; text-transform:uppercase; transition:all .3s; text-decoration:none; display:inline-block; }
.btn-c:hover { box-shadow:0 0 20px rgba(139,0,0,.5); }
.utag { font-family:'Cinzel',serif; font-size:11px; letter-spacing:2px; color:var(--gold); }

/* ORNAMENT */
.orn { display:flex; align-items:center; gap:14px; margin-bottom:12px; }
.ol  { flex:1; height:1px; background:linear-gradient(90deg,transparent,rgba(200,169,110,.25)); }
.ol.r{ background:linear-gradient(90deg,rgba(200,169,110,.25),transparent); }
.og  { width:7px; height:7px; background:var(--gold-d); transform:rotate(45deg); flex-shrink:0; }

/* DIVIDER */
.div { width:100%; height:1px; background:linear-gradient(90deg,transparent,rgba(200,169,110,.15),transparent); }

/* LABELS */
.sec-lbl { font-family:'Cinzel',serif; font-size:10px; letter-spacing:8px; color:var(--blood-l); text-transform:uppercase; margin-bottom:8px; }
.sec-hd  { font-family:'Cinzel Decorative',serif; font-size:30px; font-weight:700; color:var(--gold); letter-spacing:3px; margin-bottom:44px; }

/* FORM */
.fg  { margin-bottom:16px; }
.fl  { display:block; font-family:'Cinzel',serif; font-size:10px; letter-spacing:3px; color:var(--tx); text-transform:uppercase; margin-bottom:6px; }
.fi  { width:100%; background:rgba(7,7,15,.8); border:1px solid rgba(200,169,110,.12); color:var(--gold-l); padding:12px 15px; font-family:'IM Fell English',serif; font-size:16px; transition:border-color .3s; outline:none; }
.fi:focus { border-color:rgba(200,169,110,.35); }
.fi::placeholder { color:rgba(138,117,96,.3); }
.fb  { width:100%; padding:14px; background:linear-gradient(135deg,var(--blood),#5a0000); border:1px solid var(--blood-l); color:var(--gold-l); font-family:'Cinzel',serif; font-size:11px; letter-spacing:4px; text-transform:uppercase; cursor:pointer; transition:all .3s; margin-top:6px; }
.fb:hover { box-shadow:0 0 25px rgba(139,0,0,.45); transform:translateY(-1px); }
.fm { margin-top:12px; padding:10px 15px; font-family:'Cinzel',serif; font-size:11px; letter-spacing:1px; display:none; }
.fm.ok  { background:rgba(0,80,40,.25); border:1px solid rgba(0,200,100,.2); color:#00cc66; display:block; }
.fm.err { background:rgba(80,0,0,.25);  border:1px solid rgba(200,0,0,.2);   color:#ff4444; display:block; }
.fsw { text-align:center; margin-top:16px; font-size:15px; color:var(--tx); }
.fsw a { color:var(--gold); cursor:pointer; }

/* NEWS CARD — corpo senza italico */
.nc { background:linear-gradient(145deg,rgba(20,20,40,.9),rgba(12,12,24,.9)); border:1px solid rgba(200,169,110,.08); padding:28px 26px; position:relative; overflow:hidden; transition:all .3s; }
.nc::before { content:''; position:absolute; top:0; left:0; width:3px; height:100%; background:linear-gradient(180deg,var(--blood),var(--gold-d)); }
.nc:hover { border-color:rgba(200,169,110,.22); transform:translateY(-4px); box-shadow:0 16px 40px rgba(0,0,0,.5); }
.nd { font-family:'Cinzel',serif; font-size:10px; letter-spacing:4px; color:var(--blood-l); text-transform:uppercase; margin-bottom:10px; }
.nt { font-family:'Cinzel',serif; font-size:17px; color:var(--gold); margin-bottom:11px; line-height:1.35; }
.nb { font-size:16px; color:var(--tx); line-height:1.7; /* no font-style:italic */ }

/* FOOTER */
footer { position:relative; z-index:10; border-top:1px solid rgba(200,169,110,.08); padding:28px 50px; display:flex; justify-content:space-between; align-items:center; background:rgba(7,7,15,.95); }
footer p { font-family:'Cinzel',serif; font-size:9px; letter-spacing:3px; color:rgba(138,117,96,.3); text-transform:uppercase; }

/* STATUS BAR */
.sbar { position:relative; z-index:10; background:rgba(12,12,24,.92); border-top:1px solid rgba(200,169,110,.08); border-bottom:1px solid rgba(200,169,110,.08); padding:22px 50px; display:flex; justify-content:center; gap:0; backdrop-filter:blur(12px); }
.si { text-align:center; padding:0 44px; border-right:1px solid rgba(200,169,110,.1); }
.si:last-child { border-right:none; }
.sv { font-family:'Cinzel',serif; font-size:26px; font-weight:700; color:var(--gold); display:block; letter-spacing:2px; }
.sl { font-family:'Cinzel',serif; font-size:9px; letter-spacing:4px; color:var(--tx); text-transform:uppercase; margin-top:4px; display:block; }
.sdot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:7px; vertical-align:middle; }
.sdot.on  { background:#00e87a; box-shadow:0 0 8px #00e87a; animation:pulse 2s infinite; }
.sdot.off { background:#cc3333; box-shadow:0 0 6px #cc3333; }
@keyframes pulse { 0%,100%{opacity:1}50%{opacity:.4} }
.chdots { display:flex; gap:4px; justify-content:center; flex-wrap:wrap; margin-top:5px; }
.chd { font-family:'Cinzel',serif; font-size:8px; letter-spacing:1px; padding:2px 7px; border:1px solid rgba(200,169,110,.15); color:var(--tx); }
.chd.up   { border-color:rgba(0,232,122,.3); color:#00e87a; }
.chd.down { border-color:rgba(204,51,51,.3);  color:#cc3333; }

/* TAB NAV */
.tabnav { position:relative; z-index:10; display:flex; justify-content:center; background:rgba(12,12,24,.85); border-bottom:1px solid rgba(200,169,110,.1); backdrop-filter:blur(8px); }
.tabnav a { font-family:'Cinzel',serif; font-size:11px; letter-spacing:5px; text-transform:uppercase; color:var(--tx); text-decoration:none; padding:18px 50px; border-bottom:2px solid transparent; margin-bottom:-1px; transition:all .3s; position:relative; }
.tabnav a:hover { color:var(--gold); }
.tabnav a.active { color:var(--gold); border-bottom-color:var(--gold); }
.tabnav a.active::after { content:''; position:absolute; bottom:-4px; left:50%; transform:translateX(-50%); width:5px; height:5px; background:var(--gold); border-radius:50%; }

/* PAGE LAYOUT */
.page-wrapper { position:relative; z-index:5; display:flex; min-height:calc(100vh - 130px); }
.main-content { flex:1; padding:50px; overflow:hidden; }

/* MODAL */
.mo { position:fixed; inset:0; background:rgba(0,0,0,.88); z-index:1000; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .3s; backdrop-filter:blur(6px); }
.mo.active { opacity:1; pointer-events:all; }
.md { background:linear-gradient(145deg,var(--dark3),var(--dark2)); border:1px solid rgba(200,169,110,.18); width:100%; max-width:440px; padding:48px; position:relative; transform:translateY(30px) scale(.98); transition:transform .35s cubic-bezier(.16,1,.3,1); box-shadow:0 40px 80px rgba(0,0,0,.8); }
.mo.active .md { transform:translateY(0) scale(1); }
.md::before { content:''; position:absolute; top:0;left:0;right:0; height:2px; background:linear-gradient(90deg,transparent,var(--blood),var(--gold),var(--blood),transparent); }
.mx { position:absolute; top:16px; right:18px; background:none; border:none; color:var(--tx); font-size:20px; cursor:pointer; transition:color .2s; line-height:1; }
.mx:hover { color:var(--gold); }
.mt { font-family:'Cinzel Decorative',serif; font-size:20px; color:var(--gold); letter-spacing:4px; margin-bottom:5px; }
.ms { font-size:15px; color:var(--tx); margin-bottom:30px; }

/* SIDEBAR */
.sidebar { width:298px; flex-shrink:0; display:flex; flex-direction:column; gap:0; border-right:1px solid rgba(200,169,110,.1); background:rgba(7,7,15,.6); backdrop-filter:blur(4px); position:sticky; top:0; max-height:calc(100vh - 60px); overflow-y:auto; scrollbar-width:thin; scrollbar-color:var(--gold-d) transparent; }
.sidebar::-webkit-scrollbar { width:2px; }
.sidebar::-webkit-scrollbar-thumb { background:var(--gold-d); }
.sb-block { padding:16px 16px; border-bottom:1px solid rgba(200,169,110,.07); }
.sb-orn { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.sb-ol  { flex:1; height:1px; background:linear-gradient(90deg,transparent,rgba(200,169,110,.2)); }
.sb-ol.r{ background:linear-gradient(90deg,rgba(200,169,110,.2),transparent); }
.sb-og  { width:5px; height:5px; background:var(--gold-d); transform:rotate(45deg); flex-shrink:0; }
.sb-label { font-family:'Cinzel',serif; font-size:9px; letter-spacing:4px; color:var(--blood-l); text-transform:uppercase; }
.sb-list { display:flex; flex-direction:column; gap:2px; margin-top:8px; }
.sb-row { display:flex; align-items:center; gap:6px; padding:4px 3px; border-bottom:1px solid rgba(200,169,110,.04); transition:background .2s; }
.sb-row:hover { background:rgba(200,169,110,.04); }
.sb-row.compact { padding:3px; }
.medal { font-family:'Cinzel',serif; font-size:8px; font-weight:700; width:17px; height:17px; display:flex; align-items:center; justify-content:center; flex-shrink:0; border:1px solid transparent; }
.medal.gold   { color:#ffd700; border-color:rgba(255,215,0,.3); }
.medal.silver { color:#c0c0c0; border-color:rgba(192,192,192,.3); }
.medal.bronze { color:#cd7f32; border-color:rgba(205,127,50,.3); }
.medal.plain  { color:var(--tx); }
.sb-name { font-family:'Cinzel',serif; font-size:10px; color:var(--tx-l); flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sb-val  { font-family:'Cinzel',serif; font-size:9px; letter-spacing:1px; color:var(--tx); flex-shrink:0; }
.empire-badge { font-family:'Cinzel',serif; font-size:7px; letter-spacing:1px; padding:1px 4px; border:1px solid; flex-shrink:0; text-transform:uppercase; }
.sb-empire-section { margin-top:10px; margin-bottom:4px; }
.sb-empire-title { font-family:'Cinzel',serif; font-size:8px; letter-spacing:4px; text-transform:uppercase; margin-bottom:5px; padding-bottom:3px; border-bottom:1px solid rgba(200,169,110,.08); }
.sb-empty { font-family:'Cinzel',serif; font-size:8px; letter-spacing:2px; color:rgba(138,117,96,.4); text-align:center; padding:6px; }
