
/* ===== Ashen Veil site: shared styles (content pages + navigation for the landing page) ===== */
:root{--bg:#050a05;--g:#10b981;--g2:#6ee7b7;--b:#38bdf8;--y:#fde047;--r:#ef4444;--t:#cbd5e1;--m:#64748b;--line:#1e293b;--panel:rgba(15,23,42,.72)}
*{box-sizing:border-box}
/* ----- navigation (used on every page) ----- */
.sn{position:sticky;top:0;z-index:900;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 22px;background:rgba(2,6,2,.94);border-bottom:1px solid #134e3a;backdrop-filter:blur(6px);font-family:'Courier New',Courier,monospace}
.sn-brand{color:#fff;font-weight:bold;letter-spacing:4px;text-decoration:none;font-size:1.15rem;text-shadow:0 0 10px #10b981}
.sn-brand span{color:var(--b);margin-left:6px}
.sn-links{display:flex;align-items:center;flex-wrap:wrap;gap:2px}
.sn-links a{color:#94a3b8;text-decoration:none;font-size:.82rem;letter-spacing:2px;padding:9px 11px;border-radius:3px;font-weight:bold}
.sn-links a:hover,.sn-links a.on{color:#fff;background:rgba(16,185,129,.14)}
.sn-links a.on{box-shadow:inset 0 -2px 0 var(--g)}
.sn-links .sn-play{margin-left:8px;color:#000;background:var(--g);box-shadow:0 0 14px rgba(16,185,129,.45)}
.sn-links .sn-play:hover{background:#34d399;color:#000}
.sn-burger{display:none;background:none;border:1px solid #134e3a;color:var(--g);font-size:1.5rem;padding:2px 12px;cursor:pointer;border-radius:3px}
@media(max-width:1060px){.sn-burger{display:block}.sn-links{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;background:rgba(2,6,2,.98);padding:10px 16px 16px;border-bottom:1px solid #134e3a}.sn-links.open{display:flex}.sn-links a{padding:13px 10px;border-bottom:1px dashed #0f2a1f}.sn-links .sn-play{margin:10px 0 0;text-align:center}}
/* ----- page body ----- */
body.av-page{margin:0;background:var(--bg);color:var(--t);font-family:'Courier New',Courier,monospace;line-height:1.75;font-size:16.5px;background-image:linear-gradient(rgba(5,10,5,.9),rgba(5,10,5,.97)),url('/images/bg-main.jpg?v=3');background-attachment:fixed;background-size:cover;background-position:center;overflow-x:hidden}
.av-page .wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.av-page .hero{padding:54px 0 36px;border-bottom:1px dashed var(--line);background:radial-gradient(circle at 20% 0%,rgba(16,185,129,.16),rgba(5,10,5,.2) 60%);background-size:cover;background-position:center}
.av-page .kick{color:var(--m);letter-spacing:4px;font-size:.8rem;margin-bottom:8px}
.av-page h1{color:#fff;font-size:2.5rem;line-height:1.2;margin:0 0 14px;letter-spacing:3px;text-shadow:0 0 18px rgba(16,185,129,.55);text-transform:uppercase;overflow-wrap:anywhere}
.av-page .lead{font-size:1.1rem;color:#dbe5ee;max-width:880px;margin:0}
.av-page .upd{margin-top:14px;color:var(--m);font-size:.8rem;letter-spacing:1px}
.av-page .bc{font-size:.8rem;color:var(--m);margin-bottom:14px;letter-spacing:1px}
.av-page .bc a{color:var(--b);text-decoration:none}
.av-page .bc span{color:#94a3b8}
.av-page .main{padding-top:34px;padding-bottom:70px}
.av-page h2{color:var(--b);font-size:1.55rem;letter-spacing:2px;margin:44px 0 14px;border-left:5px solid var(--b);padding-left:14px;text-transform:uppercase;line-height:1.3}
.av-page h2:first-child{margin-top:0}
.av-page h3{color:var(--y);font-size:1.2rem;letter-spacing:1px;margin:30px 0 10px;line-height:1.35}
.av-page h4{color:var(--g2);margin:20px 0 6px}
.av-page p{margin:0 0 16px;max-width:920px}
.av-page li{margin-bottom:7px;max-width:900px}
.av-page a{color:var(--b)}
.av-page a:hover{color:var(--g2)}
.av-page strong,.av-page b{color:#f1f5f9}
.av-page em{color:var(--g2);font-style:normal}
.av-page .note{background:rgba(251,191,36,.07);border:1px solid #92400e;border-left:4px solid #f59e0b;padding:14px 18px;margin:22px 0;max-width:920px;color:#fde68a}
.av-page .tip{background:rgba(16,185,129,.07);border:1px solid #065f46;border-left:4px solid var(--g);padding:14px 18px;margin:22px 0;max-width:920px;color:#a7f3d0}
.av-page .warn{background:rgba(239,68,68,.07);border:1px solid #7f1d1d;border-left:4px solid var(--r);padding:14px 18px;margin:22px 0;max-width:920px;color:#fecaca}
.av-page .note b,.av-page .tip b,.av-page .warn b{color:inherit}
.av-page .toc{background:var(--panel);border:1px solid #334155;padding:16px 22px;margin:0 0 30px;max-width:920px}
.av-page .toc strong{display:block;margin-bottom:6px;color:var(--y);letter-spacing:2px}
.av-page .toc ol,.av-page .toc ul{margin:0;padding-left:22px;columns:2;column-gap:30px}
@media(max-width:700px){.av-page .toc ol,.av-page .toc ul{columns:1}}
.av-page .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:20px;margin:22px 0}
.av-page .card2{display:flex;flex-direction:column;background:var(--panel);border:1px solid #1e3a8a;padding:20px;text-decoration:none;color:var(--t);transition:.25s;border-radius:3px}
.av-page .card2:hover{border-color:var(--b);transform:translateY(-4px);box-shadow:0 12px 26px rgba(0,0,0,.7)}
.av-page .card2 h3{margin:0 0 8px;color:var(--g2);font-size:1.1rem}
.av-page .card2 p{margin:0 0 12px;font-size:.95rem;color:#b6c4d3;flex:1}
.av-page .card2 .go{color:var(--b);font-size:.8rem;letter-spacing:2px}
.av-page .panel{background:var(--panel);border:1px solid #334155;padding:20px 24px;margin:20px 0;border-radius:3px}
.av-page .panel h3{margin-top:0}
.av-page .tbl-wrap{overflow-x:auto;margin:18px 0 28px;border:1px solid #1e293b;-webkit-overflow-scrolling:touch}
.av-page .tbl{border-collapse:collapse;width:100%;font-size:.88rem;min-width:560px}
.av-page .tbl th{background:#0b1a14;color:var(--g2);text-align:left;padding:10px 12px;letter-spacing:1px;font-size:.78rem;text-transform:uppercase;border-bottom:2px solid #134e3a;white-space:nowrap}
.av-page .tbl td{padding:9px 12px;border-bottom:1px solid #16212b;vertical-align:top}
.av-page .tbl tr:nth-child(even) td{background:rgba(255,255,255,.02)}
.av-page .tbl tr:hover td{background:rgba(16,185,129,.07)}
.av-page .tbl td:first-child{color:#fff;font-weight:bold}
.av-page .pill{display:inline-block;padding:1px 9px;border:1px solid currentColor;border-radius:20px;font-size:.74rem;letter-spacing:1px;font-weight:bold;white-space:nowrap}
.r-Common{color:#9ca3af}.r-Uncommon{color:#34d399}.r-Rare{color:#38bdf8}.r-Epic{color:#c084fc}.r-Legendary{color:#fbbf24}.r-Godlike{color:#ef4444}
.av-page .tag{display:inline-block;padding:2px 10px;font-size:.72rem;letter-spacing:2px;font-weight:bold;margin-right:10px;vertical-align:middle;border-radius:2px;color:#000}
.tag-new{background:#34d399}.tag-improved{background:#38bdf8}.tag-fixed{background:#fbbf24}.tag-hardcore{background:#ef4444;color:#fff!important}
/* news */
.av-page .alert{border:1px solid #7f1d1d;background:rgba(127,29,29,.18);padding:16px 20px;margin:0 0 26px;color:#fecaca;max-width:920px}
.av-page .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:24px 0 34px}
.av-page .stat{background:var(--panel);border:1px solid #134e3a;text-align:center;padding:16px 8px}
.av-page .stat b{display:block;font-size:2rem;color:var(--g);text-shadow:0 0 12px rgba(16,185,129,.5)}
.av-page .stat span{font-size:.72rem;letter-spacing:2px;color:var(--m)}
.av-page .np{background:var(--panel);border:1px solid #334155;border-left:5px solid #475569;padding:20px 24px;margin:0 0 20px;max-width:980px}
.av-page .np.feat{border-left-color:var(--g);background:rgba(6,40,28,.55)}
.av-page .np h3{margin:0 0 12px;font-size:1.25rem;color:#fff}
.av-page .np .body p,.av-page .np .body ul{margin:0 0 12px}
.av-page .np .body ul{padding-left:22px}
.av-page .np .body b{color:var(--y)}
/* talents */
.av-page .tier{margin:26px 0 8px;padding:6px 12px;background:#0b1a14;border-left:4px solid var(--g);color:var(--g2);letter-spacing:2px;font-size:.85rem;font-weight:bold}
.av-page .tal{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.av-page .tl{background:var(--panel);border:1px solid #1f2d3d;padding:14px 16px;border-top:3px solid var(--tc,#38bdf8)}
.av-page .tl h4{margin:0 0 4px;color:#fff;font-size:1.02rem}
.av-page .tl .rk{color:var(--m);font-size:.78rem;letter-spacing:1px}
.av-page .tl ul{margin:8px 0 0;padding-left:18px;font-size:.9rem}
.av-page .tl .rq{margin-top:8px;font-size:.8rem;color:#f59e0b}
/* bestiary */
.av-page .boss{display:flex;gap:0;background:var(--panel);border:1px solid #334155;margin:24px 0;overflow:hidden;border-radius:3px}
.av-page .boss .pic{flex:0 0 250px;background:#000;border-right:1px solid #334155;min-height:230px;position:relative}
.av-page .boss .pic img{width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block;position:absolute;inset:0}
.av-page .boss .info{padding:18px 22px;flex:1;min-width:0}
.av-page .boss h3{margin:0 0 4px;color:#fff;font-size:1.25rem}
.av-page .boss .meta{color:var(--m);font-size:.8rem;letter-spacing:1px;margin-bottom:10px}
@media(max-width:760px){.av-page .boss{flex-direction:column}.av-page .boss .pic{flex:none;height:260px;border-right:0;border-bottom:1px solid #334155;min-height:0}}
/* footer */
.sf{background:#000;border-top:1px dashed var(--line);padding:46px 20px 30px;font-family:'Courier New',Courier,monospace;color:var(--m)}
.sf-grid{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px}
.sf h4{color:var(--g2);letter-spacing:3px;margin:0 0 12px;font-size:.9rem}
.sf a{display:block;color:#7aa2c0;text-decoration:none;padding:3px 0;font-size:.88rem}
.sf a:hover{color:var(--g)}
.sf p{font-size:.85rem;line-height:1.6;margin:0 0 12px}
.sf .sf-play{display:inline-block;color:#000;background:var(--g);padding:9px 16px;font-weight:bold;letter-spacing:2px;margin-top:4px}
.sf-bottom{max-width:1120px;margin:30px auto 0;padding-top:18px;border-top:1px solid #111;text-align:center;font-size:.78rem;letter-spacing:1px}
.sf-bottom a{display:inline;color:#7aa2c0}
@media(max-width:800px){.sf-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.sf-grid{grid-template-columns:1fr}.av-page h1{font-size:1.8rem;letter-spacing:1px}.av-page .hero{padding:36px 0 26px}}
/* ----- landing page extras (home) ----- */
.hm-sec{padding:70px 8%;border-bottom:1px dashed #1e293b;background:rgba(0,0,0,.4);width:100%}
.hm-sec h2{color:#38bdf8;font-size:2rem;letter-spacing:4px;border-left:6px solid #38bdf8;padding-left:18px;margin:0 0 22px;text-transform:uppercase}
.hm-news{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px;margin-top:26px}
.hm-news a,.hm-tile{display:block;text-decoration:none;background:rgba(15,23,42,.7);border:1px solid #1e3a8a;padding:22px;color:#cbd5e1;transition:.25s}
.hm-news a:hover,.hm-tile:hover{border-color:#38bdf8;transform:translateY(-5px);box-shadow:0 12px 26px rgba(0,0,0,.8)}
.hm-news b,.hm-tile b{display:block;color:#6ee7b7;font-size:1.1rem;letter-spacing:1px;margin-bottom:8px}
.hm-news p,.hm-tile p{margin:0;font-size:.95rem;line-height:1.65;color:#b6c4d3}
.hm-news .t{font-size:.7rem;font-weight:bold;letter-spacing:2px;padding:2px 9px;margin-bottom:10px;display:inline-block;color:#000}
.hm-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-top:26px}
.hm-more{margin-top:26px}
.hm-more a{color:#38bdf8;letter-spacing:2px;font-weight:bold;text-decoration:none}
@media(max-width:900px){.hm-sec{padding:44px 5%}.hm-sec h2{font-size:1.45rem;letter-spacing:2px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
