#page-hero{
  min-height:260px;position:relative;overflow:hidden;
  background:#06080e;display:flex;align-items:flex-end;
}
.ph-covbg{
  position:absolute;inset:0;
  background-size:cover;background-position:center;
  filter:saturate(.6) brightness(.45);
  transition:opacity .5s;
}
.ph-overlay{
  position:absolute;inset:0;
  background:linear-gradient(0deg,rgba(4,6,12,.97) 0%,rgba(4,6,12,.65) 50%,rgba(4,6,12,.2) 100%);
}
.ph-bg{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 45% 110% at 12% 60%,rgba(200,155,60,.06),transparent),
    repeating-linear-gradient(90deg,transparent,transparent 79px,rgba(200,155,60,.018) 80px),
    repeating-linear-gradient(0deg,transparent,transparent 49px,rgba(200,155,60,.014) 50px);
}
.ph-btmline{
  position:absolute;bottom:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(200,155,60,.25),transparent);
}
.ph-icon{position:absolute;right:44px;top:50%;transform:translateY(-50%);font-size:100px;opacity:.05;pointer-events:none;user-select:none}
.ph-inner{position:relative;padding:24px 44px 30px;z-index:2;width:100%}
.ph-crumb{display:flex;align-items:center;gap:5px;margin-bottom:14px;font-family:'Cinzel',serif;font-size:9px;letter-spacing:.12em;color:var(--text3)}
.ph-bc{cursor:pointer;transition:.15s}
.ph-bc:hover{color:var(--gold)}
.ph-sep{opacity:.3;padding:0 2px}
.ph-cur{color:rgba(200,155,60,.55);cursor:default}
.ph-eyebrow{font-family:'Cinzel',serif;font-size:9px;letter-spacing:.35em;color:var(--gold);opacity:.7;text-transform:uppercase;margin-bottom:8px}
.ph-title{font-family:'Cinzel',serif;font-size:34px;font-weight:700;color:var(--white);letter-spacing:.04em;text-shadow:0 2px 20px rgba(0,0,0,.95),0 0 60px rgba(200,155,60,.12);line-height:1.15}
.ph-sub{font-family:'Crimson Pro',serif;font-size:15px;color:rgba(196,168,98,.7);font-style:italic;margin-top:8px;letter-spacing:.02em}
.ph-divider{margin-top:18px;display:flex;align-items:center;gap:10px}
.ph-divider-line{flex:1;max-width:120px;height:1px;background:linear-gradient(90deg,var(--gold),transparent);opacity:.5}
.ph-divider-gem{color:var(--gold);font-size:8px;opacity:.6}
/* page body */
#pbody{padding:36px 44px 60px;max-width:860px;margin:0 auto;width:100%}
/* ── Notion block rendering ── */
.nc>*+*{margin-top:.7em}
.n-p{font-size:16px;line-height:1.85;color:var(--text)}
/* Headings with fantasy treatment */
.n-h1{
  font-family:'Cinzel',serif;font-size:22px;font-weight:700;
  color:var(--gold3);letter-spacing:.06em;
  display:flex;align-items:center;gap:10px;
  padding-bottom:10px;margin-top:40px!important;margin-bottom:4px;
  border-bottom:1px solid rgba(200,155,60,.15);
}
.n-h1::before{content:'◈';color:var(--gold);font-size:14px;opacity:.8;flex-shrink:0}
.n-h2::before{content:'✦';color:var(--gold);font-size:10px;opacity:.7;flex-shrink:0}
/* Fancy divider */
.n-divider{
  border:none;margin:32px 0;position:relative;height:18px;
  display:flex;align-items:center;justify-content:center;gap:14px;
}
.n-divider-gem{color:var(--gold);font-size:9px;opacity:.7;flex-shrink:0}
/* Callout */
.n-callout{
  display:flex;gap:14px;align-items:flex-start;
  border-left:3px solid var(--callout-c,rgba(200,155,60,.5));
  /* effetto pergamena: gradiente caldo + noise overlay */
  background:linear-gradient(135deg,rgba(20,14,5,.92) 0%,rgba(16,11,4,.88) 100%);
  box-shadow:inset 0 0 40px rgba(200,155,60,.04),0 2px 12px rgba(0,0,0,.35),inset 1px 0 0 var(--callout-c,rgba(200,155,60,.3));
  padding:14px 18px;margin:16px 0;position:relative;overflow:hidden;
}
.n-callout::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 80% 60% at 10% 50%,rgba(200,155,60,.045) 0%,transparent 70%);
}
/* Quote — stile pergamena con virgolette decorative */
.n-quote{
  border-left:3px solid rgba(200,155,60,.45);
  padding:14px 22px 14px 52px;margin:20px 0;
  font-family:'Crimson Pro',serif;font-size:18px;
  color:rgba(196,168,98,.8);font-style:italic;line-height:1.7;
  background:linear-gradient(135deg,rgba(18,13,5,.88),rgba(14,10,3,.84));
  box-shadow:inset 0 0 30px rgba(200,155,60,.03),0 2px 8px rgba(0,0,0,.3);
  position:relative;overflow:hidden;
}
.n-quote::before{
  content:'“';position:absolute;left:10px;top:-4px;
  font-family:'Crimson Pro',serif;font-size:64px;color:rgba(200,155,60,.18);
  line-height:1;pointer-events:none;font-style:normal;
}
/* Page footer */
.n-page-footer{
  margin-top:56px;padding-top:28px;text-align:center;
  border-top:1px solid rgba(200,155,60,.12);
}
.n-page-footer-gems{
  font-family:'Cinzel',serif;font-size:11px;color:rgba(200,155,60,.35);
  letter-spacing:.4em;margin-bottom:8px;
}
.n-page-footer-text{
  font-family:'Crimson Pro',serif;font-size:12px;
  color:rgba(200,155,60,.2);font-style:italic;letter-spacing:.06em;
}
.n-p:empty{min-height:.7em}
.n-h1::after{content:'';position:absolute;bottom:-1px;left:0;width:55px;height:1px;background:linear-gradient(90deg,var(--gold),transparent)}
.n-h2{font-family:'Cinzel',serif;font-size:15.5px;font-weight:700;color:var(--gold2);margin-top:1.5em!important;margin-bottom:.3em;letter-spacing:.06em}
.n-h3{font-family:'Cinzel',serif;font-size:11.5px;font-weight:700;color:var(--parch);margin-top:1.2em!important;margin-bottom:.2em;text-transform:uppercase;letter-spacing:.14em;opacity:.75}
.n-ul{list-style:none;padding-left:0}
.n-ul>li{position:relative;padding:3px 0 3px 20px;font-size:16px;line-height:1.8}
.n-ul>li::before{content:'◆';position:absolute;left:3px;color:var(--gold);font-size:6.5px;top:9px}
.n-ol{padding-left:20px;font-size:16px}
.n-ol>li{margin-bottom:.3em;padding-left:4px;line-height:1.8}
.n-ol>li::marker{color:var(--gold);font-family:'Cinzel',serif;font-weight:700}
.n-quote{
  border-left:3px solid var(--gold);padding:12px 18px;margin:12px 0;
  background:rgba(200,155,60,.04);color:var(--parch);font-style:italic;font-size:16px;line-height:1.8;
}
.n-divider{border:none;margin:24px 0;position:relative;height:14px}
.n-divider::before{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--bdr2),var(--gold),var(--bdr2),transparent)}
.n-callout-icon{flex-shrink:0;font-size:19px;margin-top:2px}
.n-callout-body{flex:1;font-size:16px;line-height:1.75}
details{margin:5px 0}
details>.n-ts{list-style:none;display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none;font-size:16px;font-weight:600;color:var(--parch);padding:9px 15px;background:rgba(200,155,60,.04);border:1px solid var(--bdr);transition:.15s}
details>.n-ts::before{content:'▶';font-size:8px;color:var(--gold);transition:.2s;flex-shrink:0}
details[open]>.n-ts{background:rgba(200,155,60,.08);border-color:var(--bdr2);color:var(--gold2)}
details[open]>.n-ts::before{transform:rotate(90deg)}
.n-tc{padding:10px 14px 6px 22px;border-left:2px solid rgba(200,155,60,.16);margin-left:11px;margin-top:4px}
.n-code{background:rgba(0,0,0,.5);border:1px solid var(--bdr2);padding:13px 16px;overflow-x:auto;font-family:'Courier New',monospace;font-size:13px;color:var(--gold3);line-height:1.6}
.n-image{margin:16px 0;text-align:center}
.n-image figcaption{margin-top:7px;font-size:12px;color:var(--text3);font-style:italic}
/* ── child_page card grid ── */
.n-cp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin:20px 0}
.n-cp{
  position:relative;overflow:hidden;cursor:pointer;
  background:linear-gradient(160deg,rgba(16,20,30,.97),rgba(8,10,18,.99));
  border:1px solid rgba(200,155,60,.14);
  padding:0;transition:transform .25s,border-color .25s,box-shadow .25s;
  display:flex;flex-direction:column;
}
.n-cp::after{
  content:'';position:absolute;top:0;left:-80%;width:55%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(200,155,60,.09),transparent);
  transform:skewX(-18deg);transition:left .45s;pointer-events:none;z-index:3;
}
.n-cp:hover::after{left:130%}
.n-cp-thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(8,10,18,.8))}
.n-cp-info{padding:10px 14px 12px;flex:1}
.n-cp-title{font-family:'Cinzel',serif;font-size:11.5px;font-weight:700;color:var(--parch);letter-spacing:.06em;margin-bottom:3px;line-height:1.3;transition:.18s}
.n-cp:hover .n-cp-title{color:var(--gold3)}
.n-cp-cta{font-family:'Cinzel',serif;font-size:8px;letter-spacing:.12em;color:var(--text3);opacity:.6;transition:.18s}
.n-cp:hover .n-cp-cta{color:var(--gold);opacity:1}
.n-twrap{overflow-x:auto;margin:14px 0}
table.n-tbl{width:100%;border-collapse:collapse;font-size:15px}
table.n-tbl th{background:rgba(0,0,0,.4);color:var(--gold2);font-family:'Cinzel',serif;font-size:9.5px;font-weight:700;letter-spacing:.12em;padding:9px 13px;border:1px solid var(--bdr2);text-align:left;text-transform:uppercase}
table.n-tbl td{padding:8px 13px;border:1px solid var(--bdr);color:var(--text)}
table.n-tbl tr:nth-child(odd) td{background:rgba(200,155,60,.02)}
table.n-tbl tr:hover td{background:rgba(200,155,60,.05)}
.n-cols{display:grid;gap:18px;margin:12px 0}
.n-bkm{display:flex;gap:12px;border:1px solid var(--bdr);padding:13px 16px;background:var(--bg3);margin:8px 0;text-decoration:none;color:var(--text);transition:border-color .2s}
/* rich text */
.rb{font-weight:700;color:var(--parch)}
.ri{font-style:italic}
.rs{text-decoration:line-through;opacity:.6}
.ru{text-decoration:underline}
.rc{font-family:'Courier New',monospace;font-size:.85em;background:rgba(0,0,0,.3);border:1px solid var(--bdr2);padding:1px 5px;color:var(--gold3)}
.rl{color:var(--gold2);text-decoration:none;border-bottom:1px dotted rgba(200,155,60,.35);cursor:pointer;transition:.15s}
.rl:hover{color:var(--gold3)}
.rg{color:var(--text3)}
.rr{color:#b84030}
.ro{color:#a86020}
.ry{color:var(--gold3)}
.rge{color:#608030}
.rbl{color:#5080a8}
.rp{color:#8055a0}
/* loading */
.ldwrap{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px;gap:14px;color:var(--text3)}
.spin{width:32px;height:32px;border:2px solid var(--bdr2);border-top-color:var(--gold);border-radius:50%;animation:sp .8s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
.errbox{background:rgba(90,15,8,.2);border:1px solid #5a1a10;padding:14px 18px;color:#c06050;font-size:14px;margin:20px 0}
/* ════════════════════════════════════
   OVERLAY (Discord live)
════════════════════════════════════ */
/* ════════════════════════════════════
   HAMBURGER MOBILE
════════════════════════════════════ */
#hamburger{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:40px;height:var(--topbar-h);padding:0 10px;cursor:pointer;
  flex-shrink:0;background:none;border:none;
}
.hbr-bar{
  width:22px;height:2px;background:var(--gold);
  transition:transform .22s,opacity .22s,background .2s;transform-origin:center;
}
#hamburger.open .hbr-bar:nth-child(1){transform:translateY(7px) rotate(45deg)}
#hamburger.open .hbr-bar:nth-child(2){opacity:0;transform:scaleX(0)}
#hamburger.open .hbr-bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
/* Mobile nav drawer */
#mobile-nav{
  position:fixed;top:var(--topbar-h);left:0;right:0;
  background:rgba(4,5,12,.98);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border-bottom:2px solid var(--gold);
  z-index:190;display:none;
  max-height:calc(100vh - var(--topbar-h));overflow-y:auto;
}
#mobile-nav.open{display:block;animation:mnopen .22s ease forwards}
@keyframes mnopen{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.mn-section{padding:6px 0}
.mn-section+.mn-section{border-top:1px solid rgba(200,155,60,.08)}
.mn-label{
  font-family:'Cinzel',serif;font-size:7.5px;font-weight:700;letter-spacing:.3em;
  color:var(--gold);text-transform:uppercase;padding:10px 24px 5px;opacity:.55;
}
.mn-item{
  display:flex;align-items:center;gap:12px;padding:12px 24px;
  font-family:'Cinzel',serif;font-size:11px;font-weight:700;letter-spacing:.07em;
  color:var(--text2);cursor:pointer;transition:background .1s,color .1s;
}
.mn-item:hover{background:rgba(200,155,60,.06);color:var(--gold2)}
.mn-ii{font-size:16px;width:22px;text-align:center;flex-shrink:0}
.mn-discord{
  margin:12px 16px 16px;display:flex;align-items:center;justify-content:center;gap:8px;
  background:linear-gradient(135deg,rgba(50,55,168,.7),rgba(88,101,242,.6));
  border:1px solid rgba(255,255,255,.15);color:#e0e8ff;padding:13px 20px;
  font-family:'Cinzel',serif;font-size:10px;font-weight:700;letter-spacing:.12em;
  text-decoration:none;
}
/* ════════════════════════════════════
   DISCORD — PORTALE MAGICO v2
════════════════════════════════════ */
#overlay{
  position:fixed;inset:0;z-index:9999;display:none;
  background:rgba(2,3,8,.75);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
}
@keyframes ovin{from{opacity:0}to{opacity:1}}
@keyframes ovout{from{opacity:1}to{opacity:0}}
#overlay.ovopen{display:block;animation:ovin .2s ease forwards}
#overlay.ovclose{display:block;animation:ovout .16s ease forwards}
#ovp{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:min(540px,94vw);max-height:92vh;
  background:rgba(4,5,14,.96);
  border:1px solid rgba(200,155,60,.28);
  display:flex;flex-direction:column;overflow:hidden;
  box-shadow:
    0 0 0 1px rgba(200,155,60,.07),
    0 0 60px rgba(200,155,60,.08),
    0 40px 100px rgba(0,0,0,.95);
}
@keyframes pnlin{from{opacity:0;transform:translate(-50%,-46%) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
#overlay.ovopen #ovp{animation:pnlin .3s cubic-bezier(.16,1,.3,1) forwards}
/* Glow border animation */
#ovp::before{
  content:'';position:absolute;inset:-1px;z-index:-1;pointer-events:none;
  background:conic-gradient(from var(--a,0deg),rgba(200,155,60,.4),transparent 40%,transparent 60%,rgba(200,155,60,.3));
  animation:border-spin 6s linear infinite;
}
@property --a{syntax:'<angle>';inherits:false;initial-value:0deg;}
@keyframes border-spin{to{--a:360deg}}
/* Rune corners */
#ovp .rune-tl,#ovp .rune-tr,#ovp .rune-bl,#ovp .rune-br{
  position:absolute;font-size:9px;color:rgba(200,155,60,.28);
  pointer-events:none;animation:runeflicker 3s ease-in-out infinite;line-height:1;
}
#ovp .rune-tl{top:8px;left:10px}
#ovp .rune-tr{top:8px;right:10px;animation-delay:.7s}
#ovp .rune-bl{bottom:8px;left:10px;animation-delay:1.4s}
#ovp .rune-br{bottom:8px;right:10px;animation-delay:2.1s}
/* Portal header */
.portal-header{
  padding:18px 24px 16px;
  background:linear-gradient(90deg,rgba(0,0,0,.5),rgba(200,155,60,.04),rgba(0,0,0,.5));
  border-bottom:1px solid rgba(200,155,60,.15);
  display:flex;align-items:center;justify-content:space-between;flex-shrink:0;
  position:relative;overflow:hidden;
}
.portal-header::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(200,155,60,.6) 50%,transparent);
}
.portal-title{
  display:flex;align-items:center;gap:10px;
  font-family:'Cinzel',serif;font-size:12px;font-weight:900;
  letter-spacing:.24em;color:var(--gold3);text-shadow:0 0 20px rgba(200,155,60,.4);
}
.portal-title-rune{font-size:15px;opacity:.6;animation:runeflicker 2.8s ease-in-out infinite}
.portal-close{
  width:30px;height:30px;display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(200,155,60,.18);background:rgba(255,255,255,.02);
  cursor:pointer;color:var(--text3);font-size:12px;transition:.15s;flex-shrink:0;
}
.portal-close:hover{background:rgba(180,20,10,.18);border-color:#c03030;color:#ff6060}
/* Single column body */
.portal-body{
  flex:1;min-height:0;overflow-y:auto;
  display:flex;flex-direction:column;align-items:stretch;padding:28px 32px;gap:22px;
}
/* Particles canvas area */
.portal-particles{
  position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0;
}
.portal-p{
  position:absolute;border-radius:50%;
  background:var(--gold);opacity:0;
  animation:pp-drift var(--pd) ease-in-out infinite;
}
@keyframes pp-drift{
  0%{opacity:0;transform:translateY(0) scale(0)}
  20%{opacity:var(--po)}
  80%{opacity:var(--po)}
  100%{opacity:0;transform:translateY(-60px) scale(1.5)}
}
/* Roster section */
.portal-sh{
  font-family:'Cinzel',serif;font-size:8.5px;font-weight:700;letter-spacing:.22em;
  color:var(--gold);text-transform:uppercase;margin-bottom:10px;opacity:.65;
  display:flex;align-items:center;gap:8px;
}
.portal-sh::before{content:'◆';font-size:5px}
#roster-wrap,#ovdw{
  background:rgba(0,0,0,.35);border:1px solid rgba(200,155,60,.1);
  height:200px;overflow-y:auto;
}
.roster-member{
  display:flex;align-items:center;gap:12px;padding:9px 13px;
  border-bottom:1px solid rgba(200,155,60,.05);transition:.12s;
}
.roster-member:hover{background:rgba(200,155,60,.04)}
.roster-avatar{width:32px;height:32px;border-radius:50%;border:1.5px solid rgba(200,155,60,.2);object-fit:cover;flex-shrink:0}
.roster-name{font-family:'Cinzel',serif;font-size:11px;color:var(--parch);letter-spacing:.03em}
.roster-game{font-size:11px;color:var(--text3);font-style:italic;margin-top:1px}
/* Center JOIN button */
.portal-join-wrap{
  display:flex;flex-direction:column;align-items:center;gap:14px;position:relative;z-index:1;
}
.portal-join-btn{
  position:relative;display:flex;align-items:center;justify-content:center;gap:10px;
  width:100%;padding:18px 28px;overflow:hidden;
  background:linear-gradient(135deg,rgba(50,55,180,.7),rgba(88,101,242,.6));
  border:1px solid rgba(130,145,255,.55);
  color:#e8ecff;font-family:'Cinzel',serif;font-size:11px;font-weight:700;letter-spacing:.22em;
  text-decoration:none;transition:.25s;
  box-shadow:0 0 30px rgba(88,101,242,.22),inset 0 1px 0 rgba(255,255,255,.1);
  text-transform:uppercase;
}
.portal-join-btn::before{
  content:'';position:absolute;top:0;left:-100%;width:70%;height:100%;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.14) 50%,transparent 70%);
  transition:left .45s ease;pointer-events:none;
}
.portal-join-btn:hover::before{left:130%}
.portal-join-btn:hover{
  background:linear-gradient(135deg,rgba(60,65,210,.85),rgba(100,120,255,.7));
  border-color:rgba(180,190,255,.75);
  box-shadow:0 0 44px rgba(88,101,242,.4),0 6px 22px rgba(0,0,0,.45);
  transform:translateY(-3px);color:#fff;
}
/* Ripple */
.portal-join-btn .ripple{
  position:absolute;border-radius:50%;background:rgba(255,255,255,.18);
  transform:scale(0);animation:btn-ripple .6s linear;pointer-events:none;
}
@keyframes btn-ripple{to{transform:scale(4);opacity:0}}
.portal-quote{
  font-size:14px;font-style:italic;color:var(--text2);line-height:1.8;
  text-align:center;padding:12px 12px 0;
  border-top:1px solid rgba(200,155,60,.08);width:100%;
}
.online-dot{width:7px;height:7px;border-radius:50%;background:#57f287;box-shadow:0 0 8px #57f287;animation:lp 2s infinite;flex-shrink:0}
/* ════════════════════════════════════
   MAPPA INTERATTIVA — pin assoluti
════════════════════════════════════ */
.map-container{position:relative;overflow:hidden;margin-top:24px;line-height:0}
.map-tip{
  position:absolute;z-index:100;pointer-events:none;
  background:rgba(4,5,14,.96);border:1px solid rgba(200,155,60,.35);
  padding:10px 14px;min-width:155px;max-width:210px;
  opacity:0;transition:opacity .15s;
  box-shadow:0 8px 28px rgba(0,0,0,.75),0 0 18px rgba(200,155,60,.08);
  top:0;left:0;
}
.map-tip.vis{opacity:1}
.map-tip-name{font-family:'Cinzel',serif;font-size:10.5px;font-weight:700;color:var(--gold3);letter-spacing:.1em;margin-bottom:3px}
.map-tip-desc{font-size:11.5px;color:var(--parch);font-style:italic;line-height:1.5;margin-bottom:4px}
.map-tip-hint{font-family:'Cinzel',serif;font-size:8px;color:var(--gold);letter-spacing:.1em;opacity:.65}
.map-tip-hint.sub{color:rgba(80,200,110,.75)}
/* pin */
.mpin{
  position:absolute;transform:translate(-50%,-50%);
  width:28px;height:28px;cursor:pointer;z-index:10;
  display:flex;align-items:center;justify-content:center;
}
.mpin-dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--pc,rgba(200,155,60,.9));
  box-shadow:0 0 8px var(--pg,rgba(200,155,60,.7));
  transition:transform .2s,box-shadow .2s;z-index:2;
}
.mpin-ring{
  position:absolute;inset:0;border-radius:50%;
  border:1.5px solid var(--pc,rgba(200,155,60,.5));
  animation:pinpulse 2.5s ease-out infinite;
}
@keyframes pinpulse{
  0%{transform:scale(.6);opacity:.9}
  100%{transform:scale(2.2);opacity:0}
}
.mpin:hover .mpin-dot{transform:scale(1.5);box-shadow:0 0 16px var(--pg,rgba(200,155,60,.9))}
/* colori per tipo */
.mpin.t-city{--pc:rgba(220,175,60,.95);--pg:rgba(220,175,60,.8)}
.mpin.t-village{--pc:rgba(200,155,60,.85);--pg:rgba(200,155,60,.65)}
.mpin.t-fort{--pc:rgba(190,130,50,.85);--pg:rgba(190,130,50,.65)}
.mpin.t-forest{--pc:rgba(60,200,80,.85);--pg:rgba(60,200,80,.65)}
.mpin.t-water{--pc:rgba(80,160,240,.85);--pg:rgba(80,160,240,.65)}
.mpin.t-ruin{--pc:rgba(150,80,240,.85);--pg:rgba(150,80,240,.7);animation-duration:3.5s}
.mpin.t-fog{--pc:rgba(140,100,240,.85);--pg:rgba(140,100,240,.7)}
/* sub-map panels */
.sub-map-panel{
  display:none;position:absolute;inset:0;z-index:40;
  background:rgba(4,5,14,.97);backdrop-filter:blur(6px);flex-direction:column;
}
.sub-map-panel.open{display:flex}
.smp-header{
  padding:14px 20px;border-bottom:1px solid rgba(200,155,60,.18);
  display:flex;align-items:center;justify-content:space-between;flex-shrink:0;
}
.smp-title{font-family:'Cinzel',serif;font-size:11px;font-weight:700;color:var(--gold3);letter-spacing:.2em;display:flex;align-items:center;gap:10px}
.smp-close{
  width:28px;height:28px;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--bdr);cursor:pointer;color:var(--text3);font-size:12px;transition:.15s;
}
.smp-close:hover{color:#ff6060;border-color:#c03030}
.smp-body{flex:1;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:16px}
.map-or{text-align:center;margin-top:18px;font-family:'Cinzel',serif;font-size:9px;letter-spacing:.3em;color:var(--text3);opacity:.5;text-transform:uppercase}
/* mloc per sub-SVG panels */
.mloc{cursor:pointer}
.mloc .mc{transition:filter .2s}
.mloc:hover .mc{filter:drop-shadow(0 0 7px rgba(200,155,60,.8))}
.mloc .ml{font-family:'Cinzel',serif;fill:rgba(200,155,60,.6);font-weight:700;letter-spacing:.05em;pointer-events:none;transition:fill .2s}
.mloc:hover .ml{fill:rgba(220,175,60,.9)}
@media(max-width:768px){
  nav#tnav{display:none}
  #sw,#ovbtn{display:none}
  /* nasconde anche discord e font controls nel topbar per evitare overflow */
  #dcbtn{display:none}
  #font-controls{display:none}
  #hamburger{display:flex}
  #tr{padding:0 6px;gap:6px}
  /* topbar logo ridotto */
  #tlogo{padding:0 12px;gap:8px}
  #tlt{font-size:11px;letter-spacing:.10em}
  /* theme toggle rimane ma più piccolo */
  #theme-toggle{padding:0 6px;font-size:15px}
  /* mobile nav drawer: touch targets generosi */
  #mobile-nav{z-index:9000}
  .mn-item{padding:14px 20px;font-size:12px;min-height:48px;gap:14px}
  .mn-ii{font-size:18px;width:24px}
  .mn-label{padding:12px 20px 4px;font-size:8px}
  /* hero */
  .stit{font-size:38px}
  .scnt{padding:0 20px 60px}
  .sdesc{font-size:14px}
  .hero-cta,.scnt>div:last-child{flex-direction:column;gap:10px}
  /* sezioni */
  .hsec{padding:36px 16px 0}
  .arcadia-sec{padding:36px 16px}
  .wiki-toggle-btn{padding:16px 18px}
  .wiki-content{padding:0 16px 36px}
  .steps{grid-template-columns:1fr}
  /* cards carosello */
  .loc-card{flex:0 0 200px;height:270px}
  /* frecce carousel nascoste su mobile (swipe manuale) */
  .la{display:none!important}
  /* pagina interna */
  .nc{padding:24px 16px 40px}
  .ph-title{font-size:clamp(22px,6vw,40px)}
  /* immagini */
  .n-image img{width:100%!important;height:auto!important;max-width:100%!important}
  figure.n-image{margin:16px 0}
  /* tabelle scroll orizzontale */
  .n-twrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .n-tbl{min-width:400px}
  /* codice */
  .n-code{overflow-x:auto;-webkit-overflow-scrolling:touch;font-size:12px}
  /* paragrafi: word-break per lingue senza spazi */
  .n-p,.n-ul,.n-ol,.n-tc,.n-callout-body{
    word-break:break-word;overflow-wrap:break-word;
    font-size:calc(15px * var(--font-scale,1))!important
  }
  /* DB carousel interno alle pagine */
  .n-db-lc-wrap .loc-card{flex:0 0 180px;height:250px}
  /* glossario tooltip: sopra il termine invece di sotto su schermi piccoli */
  .gterm::after{max-width:180px;font-size:11px}
}
/* ─── iPhone SE e schermi ≤390px ─── */
@media(max-width:390px){
  #tlt{font-size:10px;letter-spacing:.06em}
  .mn-item{padding:12px 16px;font-size:11.5px}
  .stit{font-size:30px}
  .loc-card{flex:0 0 170px;height:240px}
  .n-db-lc-wrap .loc-card{flex:0 0 160px;height:230px}
  .cgrid{grid-template-columns:1fr 1fr}
  .lcard{min-width:0}
}
/* ════════════════════════════════════
   HOME NEW SECTIONS
════════════════════════════════════ */
@keyframes bounce{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,9px)}}
.scroll-ind{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);z-index:10;color:rgba(200,155,60,.5);font-size:20px;animation:bounce 2.2s ease-in-out infinite;cursor:pointer;user-select:none;letter-spacing:.1em;font-family:'Cinzel',serif;font-size:11px;display:flex;flex-direction:column;align-items:center;gap:4px}
.hsec{padding:64px 64px 0}
.hsec+.hsec{padding-top:56px}
#hv>div:last-child{padding-bottom:72px}
.sec-eyebrow{font-family:'Cinzel',serif;font-size:9px;letter-spacing:.35em;color:var(--violet3);text-transform:uppercase;margin-bottom:9px;display:flex;align-items:center;gap:10px}
.sec-eyebrow::before{content:'';width:28px;height:1px;background:var(--violet3);opacity:.55}
.sec-h{font-family:'Cinzel',serif;font-size:26px;font-weight:900;color:var(--white);letter-spacing:.07em;margin-bottom:10px;text-shadow:0 2px 16px rgba(0,0,0,.6)}
.sec-p{font-size:16px;color:var(--parch);line-height:1.75;max-width:640px;margin-bottom:28px;opacity:.82}
/* ── Location carousel ── */
.loc-wrap{position:relative;margin:0 -10px}
.loc-track-outer{overflow:hidden;padding:10px 10px 14px}
.loc-track{
  display:flex;gap:16px;
  transition:transform .55s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}
/* padding virtuale dopo l'ultima card — evita che tocchi il bordo */
.loc-track::after{content:'';flex:0 0 10px;display:block}
.loc-card{
  flex:0 0 260px;height:340px;position:relative;overflow:hidden;cursor:pointer;
  border:1px solid rgba(255,255,255,.06);background-size:cover;background-position:center;
  transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s,border-color .28s;
}
.loc-card:hover{
  transform:translateY(-8px) scale(1.018);
  box-shadow:0 22px 55px rgba(0,0,0,.85),0 0 35px rgba(200,155,60,.18),0 0 0 1px rgba(200,155,60,.2);
  border-color:rgba(200,155,60,.38);
}
.loc-ov{position:absolute;inset:0;background:linear-gradient(0deg,rgba(4,5,14,.97) 0%,rgba(4,5,14,.6) 45%,rgba(4,5,14,.08) 100%);display:flex;flex-direction:column;justify-content:flex-end;padding:20px 18px;transition:background .3s}
.loc-card:hover .loc-ov{background:linear-gradient(0deg,rgba(4,5,14,1) 0%,rgba(4,5,14,.82) 55%,rgba(20,10,40,.25) 100%)}
.loc-badge{font-family:'Cinzel',serif;font-size:8px;letter-spacing:.2em;text-transform:uppercase;color:var(--violet3);background:rgba(100,68,170,.2);border:1px solid rgba(100,68,170,.3);padding:3px 9px;display:inline-block;margin-bottom:8px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.loc-badge.explored{color:var(--gold2);background:rgba(200,155,60,.1);border-color:rgba(200,155,60,.25)}
.loc-badge.mystery{color:var(--text3);background:rgba(0,0,0,.3);border-color:rgba(100,100,120,.15)}
.loc-name{font-family:'Cinzel',serif;font-size:16px;font-weight:700;color:var(--white);margin-bottom:6px;line-height:1.25}
.loc-mystery-card .loc-name{color:var(--text3);letter-spacing:.2em;filter:blur(.5px)}
.loc-sub{font-size:13px;color:var(--parch);line-height:1.5;opacity:0;max-height:0;overflow:hidden;transition:max-height .32s ease,opacity .32s ease;margin-bottom:0}
.loc-card:hover .loc-sub{opacity:.88;max-height:60px;margin-bottom:8px}
.loc-cta{font-family:'Cinzel',serif;font-size:9px;letter-spacing:.18em;color:var(--gold2);opacity:0;transform:translateY(6px);transition:.3s;display:inline-flex;align-items:center;gap:5px}
.loc-card:hover .loc-cta{opacity:1;transform:translateY(0)}
.loc-mystery-card .loc-cta{display:none}
.la{position:absolute;top:50%;transform:translateY(-50%);z-index:10;width:40px;height:56px;display:flex;align-items:center;justify-content:center;background:rgba(4,5,14,.75);border:1px solid rgba(200,155,60,.15);color:var(--gold);font-size:16px;cursor:pointer;transition:.2s;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.la:hover{background:rgba(100,68,170,.3);border-color:var(--violet3);color:var(--violet3);box-shadow:var(--vglow)}
.la-prev{left:0}
.la-next{right:0}
/* freccia disabilitata a fine/inizio tracciato */
.la[style*="pointer-events: none"],.la[style*="pointer-events:none"]{
  opacity:.18!important;cursor:default;
}
.la{transition:opacity .25s ease,background .2s,border-color .2s,color .2s,box-shadow .2s}
/* ── Arcadia section ── */
.arcadia-sec{
  position:relative;overflow:hidden;
  background:linear-gradient(160deg,rgba(10,6,22,.97),rgba(6,8,20,.99));
  border-top:1px solid rgba(100,68,170,.12);border-bottom:1px solid rgba(100,68,170,.12);
  margin-top:56px;padding:64px;
}
.arcadia-sec::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 80% at 85% 50%,rgba(80,50,140,.1) 0%,transparent 65%);pointer-events:none}
.arcadia-inner{display:block;position:relative}
.arcadia-crest{font-size:90px;opacity:.55;filter:drop-shadow(0 0 40px rgba(120,80,200,.45));user-select:none}
.faction-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}
.fpill{
  display:flex;align-items:center;gap:12px;padding:13px 16px;
  background:rgba(8,6,18,.6);border:1px solid rgba(100,68,170,.18);
  cursor:pointer;transition:.25s cubic-bezier(.22,1,.36,1);
  position:relative;overflow:hidden;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.fpill::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(200,155,60,.07),transparent);
  opacity:0;transition:.25s;pointer-events:none;
}
.fpill:hover{
  border-color:rgba(200,155,60,.4);
  background:rgba(16,12,4,.75);
  transform:translateY(-4px);
  box-shadow:0 8px 28px rgba(0,0,0,.5),0 0 20px rgba(200,155,60,.12);
}
.fpill:hover::after{opacity:1}
.fp-i{font-size:18px;flex-shrink:0}
.fp-n{font-family:'Cinzel',serif;font-size:10px;color:var(--parch);font-weight:700;display:block}
.fp-d{font-size:11px;color:var(--text3);margin-top:2px}
/* ── Mystery section ── */
.mys-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.mys-card{
  position:relative;padding:28px 22px 22px;overflow:hidden;cursor:default;
  background:linear-gradient(160deg,rgba(8,5,20,.92),rgba(4,3,12,.96));
  border:1px solid rgba(80,60,130,.22);
  transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s,border-color .28s;
}
/* Fog layer */
.mys-card::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse 90% 60% at 50% 0%,rgba(60,40,100,.15),transparent 60%),
    radial-gradient(ellipse 70% 40% at 30% 100%,rgba(40,25,80,.1),transparent 50%);
}
/* Scanning mist line */
.mys-card::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,rgba(140,100,220,.25),transparent);
  opacity:0;transition:opacity .3s;
}
.mys-card:hover{
  transform:translateY(-6px) scale(1.01);
  border-color:rgba(140,100,220,.42);
  box-shadow:0 16px 44px rgba(0,0,0,.7),0 0 28px rgba(80,50,140,.2);
}
.mys-card:hover::after{opacity:1}
.mys-icon{
  font-size:28px;margin-bottom:12px;display:block;transition:filter .3s,transform .3s;
}
.mys-card:hover .mys-icon{
  filter:drop-shadow(0 0 12px rgba(140,100,220,.7));
  transform:scale(1.1);
}
.mys-name{
  font-family:'Cinzel',serif;font-size:13px;color:var(--text);
  margin-bottom:8px;transition:color .25s;letter-spacing:.04em;
}
.mys-card:hover .mys-name{color:var(--violet3)}
.mys-txt{
  font-size:13px;color:rgba(160,140,200,.55);font-style:italic;
  line-height:1.65;max-height:0;overflow:hidden;opacity:0;
  transition:max-height .4s,opacity .4s;
}
.mys-card:hover .mys-txt{max-height:90px;opacity:1}
/* ── GUILD CARDS — 2×2 large ── */
.guild-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:32px}
.guild-card{
  position:relative;overflow:hidden;
  border:1px solid rgba(200,155,60,.14);
  background:linear-gradient(160deg,rgba(14,18,28,.97),rgba(8,10,18,.99));
  display:grid;grid-template-columns:auto 1fr;gap:0;
  transition:transform .3s,border-color .3s,box-shadow .3s;
}
/* shine sweep */
.guild-card::after{
  content:'';position:absolute;top:0;left:-80%;width:50%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(200,155,60,.08),transparent);
  transform:skewX(-18deg);transition:left .5s ease;pointer-events:none;z-index:3;
}
.guild-card:hover{transform:translateY(-5px);border-color:rgba(200,155,60,.4);box-shadow:0 14px 44px rgba(0,0,0,.55),0 0 28px rgba(200,155,60,.09)}
.guild-card:hover::after{left:130%}
/* accent bar laterale colorato per gilda */
.guild-bar{width:4px;background:var(--gbar,rgba(200,155,60,.5));flex-shrink:0;align-self:stretch;transition:background .3s}
.guild-body{padding:28px 26px}
.guild-head{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.guild-icon{font-size:30px;filter:drop-shadow(0 0 10px var(--gbar,rgba(200,155,60,.5)));flex-shrink:0}
.guild-name{font-family:'Cinzel',serif;font-size:14px;font-weight:700;letter-spacing:.14em;color:var(--gold3);line-height:1.2}
.guild-desc{font-size:12.5px;color:var(--text3);font-style:italic;line-height:1.6;margin-bottom:20px;padding-left:2px}
.guild-divider{height:1px;background:linear-gradient(90deg,rgba(200,155,60,.18),transparent);margin-bottom:16px}
.guild-subs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.guild-sub{
  display:flex;flex-direction:column;gap:6px;padding:12px 12px 14px;
  background:rgba(200,155,60,.03);border:1px solid rgba(200,155,60,.08);
  transition:.2s;position:relative;overflow:hidden;
}
.guild-sub:hover{background:rgba(200,155,60,.07);border-color:rgba(200,155,60,.22)}
.guild-sub-i{font-size:20px;margin-bottom:2px;filter:drop-shadow(0 0 6px var(--gbar,rgba(200,155,60,.4)))}
.guild-sub-n{font-family:'Cinzel',serif;font-size:9px;letter-spacing:.1em;color:var(--gold2);display:block;margin-bottom:4px;line-height:1.3}
.guild-sub-d{font-size:11px;color:rgba(180,165,130,.6);line-height:1.45}
.guild-sub.locked{opacity:.38;cursor:default}
.guild-sub.locked .guild-sub-n::after{content:' ·  presto';color:rgba(200,155,60,.4);font-size:8px;letter-spacing:.05em}
@media(max-width:600px){.guild-subs{grid-template-columns:1fr}}
/* ── MYS CARDS CINEMATIC (v2) ── */
.mys-cin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:8px}
.mys-cin{
  position:relative;overflow:hidden;border:1px solid rgba(200,155,60,.12);
  min-height:280px;cursor:default;
  display:flex;flex-direction:column;justify-content:flex-end;
  transition:transform .3s,border-color .3s,box-shadow .3s;
}
.mys-cin-bg{position:absolute;inset:0;z-index:0;transition:transform .6s ease}
.mys-cin:hover .mys-cin-bg{transform:scale(1.04)}
.mys-cin-overlay{position:absolute;inset:0;z-index:1}
.mys-cin-body{position:relative;z-index:2;padding:22px 20px 20px}
.mys-cin-icon{font-size:28px;margin-bottom:10px;display:block;filter:drop-shadow(0 0 10px var(--ci,rgba(200,155,60,.6)))}
.mys-cin-name{font-family:'Cinzel',serif;font-size:13px;font-weight:700;letter-spacing:.12em;color:var(--gold3);margin-bottom:8px}
.mys-cin-txt{font-size:12.5px;color:var(--text3);line-height:1.6;font-style:italic}
/* hover particles per mys-cin */
.mys-cin:hover{transform:translateY(-5px);border-color:rgba(200,155,60,.3);box-shadow:0 16px 48px rgba(0,0,0,.6),0 0 24px var(--mg,rgba(200,155,60,.08))}
@media(max-width:900px){.mys-cin-grid{grid-template-columns:1fr}}
.mys-blur{filter:blur(2.5px);user-select:none}
/* ── Come iniziare ── */
.start-sec{border-top:1px solid rgba(200,155,60,.07)}
/* ── WIP badge animato ── */
@keyframes wip-pulse{0%,100%{box-shadow:0 0 0 0 rgba(100,160,32,.35)}60%{box-shadow:0 0 0 5px rgba(100,160,32,0)}}
@keyframes wip-shine{0%{background-position:-200% center}100%{background-position:200% center}}
.ctag-g{
  background:linear-gradient(90deg,rgba(100,160,32,.12),rgba(140,200,50,.22),rgba(100,160,32,.12));
  background-size:200% auto;
  color:#8ab840;border-color:rgba(100,160,32,.35);
  animation:wip-pulse 2.2s ease-in-out infinite,wip-shine 3s linear infinite;
  font-weight:900;letter-spacing:.08em;
}
/* ── Separatore dorato animato ── */
.gold-sep{
  height:20px;position:relative;margin:0;overflow:visible;
  display:flex;align-items:center;justify-content:center;
}
.gold-sep::before{
  content:'';position:absolute;top:50%;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(200,155,60,.12) 15%,rgba(200,155,60,.35) 45%,rgba(200,155,60,.35) 55%,rgba(200,155,60,.12) 85%,transparent);
  transform:translateY(-50%);
}
/* gemma centrale rotante */
.gold-sep::after{
  content:'◆';font-size:8px;color:var(--gold);position:relative;z-index:2;
  animation:gem-spin 8s linear infinite;
  filter:drop-shadow(0 0 6px rgba(200,155,60,.7));
  text-shadow:0 0 8px rgba(200,155,60,.5);
}
@keyframes gem-spin{0%{transform:rotate(0deg) scale(1)}50%{transform:rotate(180deg) scale(1.35)}100%{transform:rotate(360deg) scale(1)}}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:28px}
.step{position:relative;padding:24px 18px 20px;background:rgba(255,255,255,.022);border:1px solid rgba(200,155,60,.09);transition:.22s;overflow:hidden}
.step::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(200,155,60,.04),transparent);opacity:0;transition:.22s;pointer-events:none}
.step:hover{border-color:rgba(200,155,60,.28);background:rgba(200,155,60,.04);transform:translateY(-4px);box-shadow:0 8px 28px rgba(0,0,0,.5)}
.step:hover::before{opacity:1}
.step-n{font-family:'Cinzel',serif;font-size:38px;font-weight:900;color:rgba(200,155,60,.1);position:absolute;top:10px;right:14px;line-height:1}
.step-icon{font-size:26px;margin-bottom:12px}
.step-title{font-family:'Cinzel',serif;font-size:12px;color:var(--gold2);margin-bottom:6px;font-weight:700;letter-spacing:.05em}
.step-desc{font-size:14px;color:var(--text);line-height:1.65}
.cta-row{margin-top:28px;display:flex;gap:14px;flex-wrap:wrap;align-items:center}
/* ── Wiki collapsible ── */
.wiki-sec{border-top:1px solid rgba(200,155,60,.06);padding-top:0!important}
.wiki-toggle-btn{display:flex;align-items:center;gap:12px;cursor:pointer;padding:22px 64px;user-select:none;transition:background .2s}
.wiki-toggle-btn:hover{background:rgba(200,155,60,.03)}
.wiki-arrow{font-size:10px;color:var(--text3);transition:transform .22s;margin-left:auto}
.wiki-open .wiki-arrow{transform:rotate(90deg)}
.wiki-content{padding:0 64px 64px;display:none}
.wiki-open .wiki-content{display:block}
@media(max-width:960px){.arcadia-inner{grid-template-columns:1fr}.arcadia-crest{display:none}.steps{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.hsec,.arcadia-sec{padding:40px 20px!important}.steps{grid-template-columns:1fr}.wiki-toggle-btn{padding:16px 20px}.wiki-content{padding:0 20px 40px}.faction-grid{grid-template-columns:1fr}.loc-card{flex:0 0 210px;height:280px}}
/* ════════════════════════════════════
   NUOVI STILI AUTO-RENDERER
════════════════════════════════════ */

/* ── Intro block (primo callout) ── */
.n-intro{
  display:flex;gap:18px;align-items:flex-start;
  border-left:4px solid rgba(200,155,60,.6);
  background:rgba(200,155,60,.05);
  padding:20px 22px;margin:0 0 28px;
  position:relative;overflow:hidden;
}
.n-intro::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(200,155,60,.03),transparent 60%);
  pointer-events:none;
}
.n-intro-icon{font-size:26px;flex-shrink:0;margin-top:2px;position:relative;z-index:1}
.n-intro-body{flex:1;font-family:'Crimson Pro',serif;font-size:17px;line-height:1.8;color:var(--parch);font-style:italic;position:relative;z-index:1}
/* ── Immagini cinematiche ── */
.n-image{margin:24px 0;position:relative;overflow:hidden}
.n-image img{
  width:100%;display:block;
  border:1px solid rgba(200,155,60,.15);
  box-shadow:0 12px 40px rgba(0,0,0,.75);
  transition:transform .4s ease;
}
.n-image:hover img{transform:scale(1.01)}
.n-figcap{
  position:absolute;bottom:0;left:0;right:0;
  padding:8px 14px;
  background:linear-gradient(0deg,rgba(4,5,14,.9),transparent);
  font-family:'Cinzel',serif;font-size:9px;letter-spacing:.12em;
  color:rgba(200,155,60,.7);text-transform:uppercase;
}
/* ── Pagina vuota styled ── */
.n-empty{
  text-align:center;padding:60px 20px;
}
.n-empty-icon{font-size:52px;margin-bottom:18px;opacity:.35}
.n-empty-title{font-family:'Cinzel',serif;font-size:18px;color:rgba(200,155,60,.4);letter-spacing:.1em;margin-bottom:10px}
.n-empty-msg{font-size:14px;color:var(--text3);font-style:italic;opacity:.6}
/* ── Hero accent color ── */
#page-hero{border-bottom:1px solid var(--ph-acc,rgba(200,155,60,.2))}
.ph-topline{background:linear-gradient(90deg,transparent,var(--ph-acc,var(--gold3)),transparent)!important;opacity:.6!important}
.n-h1{color:var(--ph-acc,var(--white))!important}
/* ── DB gallery upgrade ── */
.n-db-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.n-db-card{
  cursor:pointer;overflow:hidden;
  background:rgba(8,10,18,.99);
  border:1px solid rgba(200,155,60,.12);
  transition:transform .25s,border-color .25s,box-shadow .25s;
}
.n-db-card:hover{transform:translateY(-4px);border-color:rgba(200,155,60,.35);box-shadow:0 10px 30px rgba(0,0,0,.6)}
.n-db-cover-wrap{position:relative;height:110px;overflow:hidden;background:rgba(14,18,28,.8)}
.n-db-cover{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.n-db-card:hover .n-db-cover{transform:scale(1.05)}
.n-db-cover-fade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,10,18,.7),transparent)}
.n-db-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:36px;opacity:.6}
.n-db-name{
  padding:9px 12px 11px;
  font-family:'Cinzel',serif;font-size:11px;color:var(--parch);line-height:1.3;
  border-top:2px solid rgba(200,155,60,.2);
  transition:color .18s;
}
.n-db-card:hover .n-db-name{color:var(--gold3)}
/* ── child_page card: accent border on hover ── */
.n-cp{border-color:rgba(200,155,60,.12)}
.n-cp:hover{border-color:var(--cpacc,rgba(200,155,60,.4))!important}
.n-cp-thumb{border-bottom:1px solid rgba(200,155,60,.07)}
/* ── Code block con lang label ── */
.n-code{position:relative;padding-top:32px!important}
.n-code-lang{
  position:absolute;top:8px;right:12px;
  font-family:'Cinzel',serif;font-size:8px;letter-spacing:.15em;
  color:rgba(200,155,60,.4);text-transform:uppercase;
}
/* ── To-do ── */
.n-todo{display:flex;gap:10px;align-items:flex-start;margin:4px 0;font-size:16px;line-height:1.8}
.n-todo-box{flex-shrink:0;width:18px;text-align:center}
/* ── Bookmark upgrade ── */
.n-bkm{
  display:flex;align-items:center;gap:12px;
  background:rgba(200,155,60,.04);border:1px solid rgba(200,155,60,.14);
  padding:12px 16px;margin:10px 0;transition:.2s;text-decoration:none;
}
.n-bkm:hover{border-color:rgba(200,155,60,.35);background:rgba(200,155,60,.07)}
.n-bkm-body{flex:1}
.n-bkm-label{font-family:'Cinzel',serif;font-size:12px;color:var(--parch);margin-bottom:3px}
.n-bkm-url{font-size:11px;color:var(--text3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.n-bkm-arr{color:var(--gold);font-size:14px;flex-shrink:0;transition:.2s}
.n-bkm:hover .n-bkm-arr{transform:translateX(4px)}
/* ── Divider e callout override ── */
.n-divider{
  border:none!important;margin:32px 0!important;height:18px!important;
  position:static!important;
  display:flex;align-items:center;justify-content:center;gap:14px;
}
.n-divider::before,.n-divider::after{
  content:''!important;flex:1;max-width:200px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(200,155,60,.3))!important;
  position:static!important;transform:none!important;top:auto!important;left:auto!important;
}
.n-divider::after{background:linear-gradient(270deg,transparent,rgba(200,155,60,.3))!important}
.n-callout{
  display:flex!important;background:var(--callout-bg,rgba(200,155,60,.04))!important;
  border:none!important;border-left:3px solid var(--callout-c,rgba(200,155,60,.5))!important;
  padding:14px 18px!important;margin:14px 0!important;
}


/* ════════════════════════════════════
   TOGGLE ANIMATION
════════════════════════════════════ */
@keyframes toggleOpen{
  from{opacity:0;transform:translateY(-8px)}
  to{opacity:1;transform:translateY(0)}
}
details.n-toggle{margin:6px 0}
details.n-toggle>.n-ts{
  list-style:none;display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none;
  font-size:16px;font-weight:600;color:var(--parch);padding:9px 15px;
  background:rgba(200,155,60,.04);border:1px solid var(--bdr);transition:background .15s,border-color .15s;
}
details.n-toggle>.n-ts::before{content:'▶';font-size:8px;color:var(--gold);transition:transform .22s;flex-shrink:0}
details.n-toggle[open]>.n-ts{background:rgba(200,155,60,.09);border-color:var(--bdr2);color:var(--gold2)}
details.n-toggle[open]>.n-ts::before{transform:rotate(90deg)}
details.n-toggle>.n-tc{padding:10px 14px 8px 22px;border-left:2px solid rgba(200,155,60,.16);margin-left:11px;margin-top:4px}
details.n-toggle[open]>.n-tc{animation:toggleOpen .2s ease forwards}
/* toggle su heading (n-th) — stile titolo dorato */
details.n-th{margin:20px 0 12px}
details.n-th>.n-tsum{
  list-style:none;display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none;
  background:none;border:none;padding:0;font-family:'Cinzel',serif;
  color:var(--gold2);text-transform:uppercase;letter-spacing:.08em;
}
details.n-th>.n-tsum.n-h1{font-size:1.45em}
details.n-th>.n-tsum.n-h2{font-size:1.2em}
details.n-th>.n-tsum.n-h3{font-size:1em}
details.n-th>.n-tsum::before{content:'◆';font-size:.5em;color:var(--gold);transition:transform .22s;flex-shrink:0}
details.n-th[open]>.n-tsum{color:var(--gold3)}
details.n-th[open]>.n-tsum::before{content:'◆';transform:rotate(45deg)}
details.n-th>.n-tc{padding:12px 0 8px 0;margin-top:8px}

/* ════════════════════════════════════
   RESPONSIVE COLUMNS
════════════════════════════════════ */
@media(max-width:700px){
  .n-cols{grid-template-columns:1fr!important;gap:0!important}
  .n-cols>div+div{margin-top:8px}
  .n-cp-grid{grid-template-columns:1fr!important}
  .n-db-grid{grid-template-columns:repeat(2,1fr)!important}
}

/* ════════════════════════════════════
   BREADCRUMB BACK LINK
════════════════════════════════════ */
.ph-bc-mid{
  color:var(--parch);opacity:.55;cursor:pointer;
  font-family:'Cinzel',serif;font-size:10px;letter-spacing:.07em;
  transition:opacity .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:110px;
}
.ph-bc-mid:hover{opacity:.9;color:var(--gold3)}

/* ════════════════════════════════════
   BLOCCHI MANCANTI
════════════════════════════════════ */
/* embed */
.n-embed{
  margin:16px 0;border:1px solid rgba(200,155,60,.12);
  background:rgba(8,10,18,.8);padding:14px 16px;
  display:flex;align-items:center;gap:12px;
}
.n-embed-icon{font-size:20px;flex-shrink:0;opacity:.5}
.n-embed-body{flex:1;min-width:0}
.n-embed-url{font-size:11px;color:var(--text3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:3px}
.n-embed-open{font-family:'Cinzel',serif;font-size:9px;color:var(--gold3);opacity:.6;flex-shrink:0;letter-spacing:.1em;transition:.15s}
.n-embed:hover .n-embed-open{opacity:1}

/* video */
.n-video{margin:20px 0;position:relative}
.n-video video,.n-video iframe{width:100%;display:block;border:1px solid rgba(200,155,60,.12);background:#000}
.n-video iframe{aspect-ratio:16/9;border:0}

/* pdf link */
.n-pdf{
  display:flex;align-items:center;gap:12px;
  margin:12px 0;padding:12px 16px;
  background:rgba(200,155,60,.04);border:1px solid rgba(200,155,60,.12);
  text-decoration:none;transition:.2s;
}
.n-pdf:hover{border-color:rgba(200,155,60,.3);background:rgba(200,155,60,.07)}
.n-pdf-icon{font-size:22px;flex-shrink:0}
.n-pdf-label{font-family:'Cinzel',serif;font-size:11px;color:var(--parch);letter-spacing:.05em}
.n-pdf-hint{font-size:10px;color:var(--text3);margin-top:2px}

/* ════════════════════════════════════
   DB CAROUSEL (loc-card style)
════════════════════════════════════ */
.n-db-lc-wrap{
  margin:20px 0 32px;
  position:relative;
}
.n-db-lc-wrap .n-db-title{
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:.2em;
  color:var(--gold3);text-transform:uppercase;
  margin-bottom:14px;opacity:.7;
}
.n-db-lc-wrap .loc-wrap{
  /* usa la stessa struttura del carousel homepage */
}
.n-db-lc-wrap .loc-card{
  flex:0 0 220px;
  height:300px;
}
@media(max-width:700px){
  .n-db-lc-wrap .loc-card{flex:0 0 180px;height:260px}
}

/* ════════════════════════════════════
   LOADER INIZIALE
════════════════════════════════════ */
#site-loader{
  position:fixed;inset:0;z-index:9999;background:#04050e;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;
  transition:opacity .5s ease,visibility .5s ease;
}
#site-loader.hidden{opacity:0;visibility:hidden;pointer-events:none}
.loader-rune{font-size:52px;animation:runeGlow 1.8s ease-in-out infinite alternate}
.loader-sub{font-family:'Cinzel',serif;font-size:8.5px;letter-spacing:.45em;color:rgba(200,155,60,.3);text-transform:uppercase}
.loader-dots{display:flex;gap:9px}
.loader-dot{width:5px;height:5px;border-radius:50%;background:rgba(200,155,60,.35);animation:ldot 1.3s ease-in-out infinite}
.loader-dot:nth-child(2){animation-delay:.18s}
.loader-dot:nth-child(3){animation-delay:.36s}
@keyframes runeGlow{from{text-shadow:0 0 18px rgba(200,155,60,.2)}to{text-shadow:0 0 40px rgba(200,155,60,.75),0 0 80px rgba(200,155,60,.2)}}
@keyframes ldot{0%,100%{transform:scale(1);opacity:.35}50%{transform:scale(1.5);opacity:1}}

/* ════════════════════════════════════
   PROGRESS BAR
════════════════════════════════════ */
#progress-bar{
  position:fixed;top:var(--topbar-h,50px);left:0;height:2px;width:0%;z-index:200;
  background:linear-gradient(90deg,var(--gold),rgba(200,155,60,.4));
  transition:width .12s linear;pointer-events:none;
}

/* ════════════════════════════════════
   SCROLL-TOP BUTTON
════════════════════════════════════ */
#scroll-top-btn{
  position:fixed;bottom:76px;right:18px;z-index:180;
  width:38px;height:38px;border-radius:50%;
  background:rgba(4,5,14,.92);border:1px solid rgba(200,155,60,.28);
  color:var(--gold);font-size:15px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transform:translateY(10px);pointer-events:none;
  transition:opacity .25s,transform .25s,border-color .2s;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
#scroll-top-btn.vis{opacity:1;transform:translateY(0);pointer-events:all}
#scroll-top-btn:hover{border-color:var(--gold);box-shadow:var(--glow)}
/* Tasto audio runa */
#audio-runa{
  position:fixed;bottom:122px;right:18px;z-index:180;
  width:38px;height:38px;border-radius:50%;
  background:rgba(4,5,14,.92);border:1px solid rgba(200,155,60,.18);
  color:var(--text3);font-size:14px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:border-color .2s,color .2s,box-shadow .2s;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
#audio-runa:hover{border-color:rgba(200,155,60,.4);color:var(--gold)}
#audio-runa.ara-on{border-color:var(--gold);color:var(--gold2);box-shadow:var(--glow);animation:arapulse 2.2s ease-in-out infinite}
@keyframes arapulse{0%,100%{box-shadow:var(--glow)}50%{box-shadow:0 0 18px rgba(200,155,60,.5)}}
@media(max-width:768px){#audio-runa{bottom:168px}}

/* ════════════════════════════════════
   FONT SIZE CONTROLS
════════════════════════════════════ */
.font-btn{
  width:26px;height:26px;border:1px solid rgba(200,155,60,.18);
  background:rgba(200,155,60,.04);color:var(--gold3);
  font-size:12px;font-weight:700;cursor:pointer;user-select:none;
  display:flex;align-items:center;justify-content:center;transition:.15s;
}
.font-btn:hover{background:rgba(200,155,60,.12);border-color:rgba(200,155,60,.4)}
#font-controls{display:flex;align-items:center;gap:3px;margin-left:6px}

/* ════════════════════════════════════
   THEME TOGGLE
════════════════════════════════════ */
#theme-toggle{
  width:30px;height:30px;border:1px solid rgba(200,155,60,.18);
  background:rgba(200,155,60,.04);color:var(--gold3);font-size:14px;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:.15s;margin-left:4px;flex-shrink:0;border-radius:2px;
}
#theme-toggle:hover{background:rgba(200,155,60,.12);border-color:rgba(200,155,60,.4)}

/* ════════════════════════════════════
   BOTTOM NAV (mobile)
════════════════════════════════════ */
#bottom-nav{
  display:none;position:fixed;bottom:0;left:0;right:0;z-index:180;
  height:54px;background:rgba(4,5,14,.97);
  border-top:1px solid rgba(200,155,60,.1);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  grid-template-columns:repeat(5,1fr);
}
.bnav-item{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:2px;height:100%;cursor:pointer;color:rgba(200,155,60,.32);
  font-size:19px;transition:color .15s;position:relative;
}
.bnav-item.active,.bnav-item:active{color:var(--gold2)}
.bnav-label{font-family:'Cinzel',serif;font-size:6.5px;letter-spacing:.07em;text-transform:uppercase;opacity:.7}
.bnav-badge{
  position:absolute;top:7px;right:calc(50% - 13px);
  width:7px;height:7px;border-radius:50%;
  background:var(--gold);border:1.5px solid #04050e;display:none;
}
.bnav-badge.vis{display:block}
@media(max-width:768px){
  #bottom-nav{display:grid}
  #main{padding-bottom:54px}
  #scroll-top-btn{bottom:70px}
}

/* ════════════════════════════════════
   RECENTI nell'overlay
════════════════════════════════════ */
#ov-recenti{margin-bottom:12px;display:none}
.ov-rec-label{font-family:'Cinzel',serif;font-size:8px;letter-spacing:.25em;color:var(--gold3);text-transform:uppercase;margin-bottom:7px;opacity:.55}
.ov-rec-item{
  display:flex;align-items:center;gap:10px;padding:7px 10px;cursor:pointer;
  transition:.15s;border-left:2px solid transparent;font-size:13.5px;color:var(--text);
}
.ov-rec-item:hover{background:rgba(200,155,60,.05);border-left-color:var(--gold3);color:var(--parch)}
.ov-rec-icon{flex-shrink:0;font-size:15px}

/* ════════════════════════════════════
   GLOSSARIO — tooltip termini
════════════════════════════════════ */
.gterm{
  border-bottom:1px dashed rgba(200,155,60,.4);cursor:help;position:relative;
}
.gterm::after{
  content:attr(data-def);position:absolute;bottom:calc(100% + 8px);left:50%;
  transform:translateX(-50%);background:rgba(6,8,18,.98);
  border:1px solid rgba(200,155,60,.25);color:var(--parch);
  font-size:12px;font-style:normal;padding:7px 12px;
  white-space:normal;max-width:220px;text-align:center;line-height:1.55;
  pointer-events:none;opacity:0;transition:opacity .18s;z-index:120;
  font-family:'Crimson Pro',serif;
}
.gterm:hover::after{opacity:1}

/* ════════════════════════════════════
   LIGHT THEME
════════════════════════════════════ */
body.light{
  --bg:#f2eddf;--bg2:#ebe5d5;--bg3:#e2dbc8;--bg4:#d8d0bb;
  --text:#2a2114;--text2:#3d3120;--text3:#6b5a3c;
  --white:#1a1408;--parch:#2a2114;
  --bdr:rgba(120,88,36,.18);--bdr2:rgba(120,88,36,.3);
  --gold:#7a5015;--gold2:#9a6820;--gold3:#b07a28;
  --glow:0 0 18px rgba(122,80,21,.2);
}
body.light #topbar{background:rgba(242,237,223,.97)!important;border-bottom:1px solid rgba(120,88,36,.18)!important}
body.light #main,body.light body{background:var(--bg)!important}
body.light #page-hero,body.light .ph-bg{background:#e5dfc8!important}
body.light #overlay{background:rgba(242,237,223,.65)}
body.light #ovp{background:rgba(238,232,218,.99)!important;border-color:rgba(120,88,36,.28)!important}
body.light #site-loader{background:#f2eddf}
body.light .n-code{background:rgba(200,180,140,.12);color:var(--text)}
body.light .n-image img{border-color:rgba(120,88,36,.2)}
body.light .lcard{background:linear-gradient(160deg,rgba(235,229,215,.97),rgba(225,218,200,.99))!important;border-color:rgba(120,88,36,.15)}
body.light .lcard:hover{box-shadow:0 14px 40px rgba(100,70,20,.15)!important}

/* ════════════════════════════════════
   FONT SCALE
════════════════════════════════════ */
.n-p,.n-ul,.n-ol,.n-quote,.n-callout-body,.n-intro-body,.n-tc{
  font-size:calc(16px * var(--font-scale,1))!important;
}
.n-h1{font-size:calc(20px * var(--font-scale,1))!important}
.n-h2{font-size:calc(15.5px * var(--font-scale,1))!important}
.n-h3{font-size:calc(11.5px * var(--font-scale,1))!important}

/* ════════════════════════════════════
   PULL TO REFRESH
════════════════════════════════════ */
#ptr-indicator{
  position:fixed;top:var(--topbar-h,50px);left:50%;transform:translateX(-50%);
  z-index:190;padding:7px 18px;
  background:rgba(8,10,20,.96);border:1px solid rgba(200,155,60,.22);
  font-family:'Cinzel',serif;font-size:8.5px;letter-spacing:.2em;
  color:var(--gold3);text-transform:uppercase;
  opacity:0;transition:opacity .2s;pointer-events:none;
}
#ptr-indicator.vis{opacity:1}

/* ════════════════════════════════════
   NOVITÀ PILL sulle lcard
════════════════════════════════════ */
.ctag-new{
  background:rgba(200,155,60,.12);color:var(--gold2);
  border:1px solid rgba(200,155,60,.28);
  font-family:'Cinzel',serif;font-size:7px;letter-spacing:.1em;padding:2px 6px;
  display:inline-block;
}

/* ════════════════════════════════════
   DUST VFX — particelle atmosferiche
════════════════════════════════════ */
#dust-vfx{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.dp{
  position:absolute;border-radius:50%;
  background:rgba(200,155,60,.12);
  animation:dustRise linear infinite;
  will-change:transform,opacity;
}
@keyframes dustRise{
  0%{transform:translate(0,100px) scale(1);opacity:0}
  15%{opacity:1}
  85%{opacity:.6}
  100%{transform:translate(var(--dx,30px),-110vh) scale(.6);opacity:0}
}