/* Shared visual system - ZARVEXIS fantasy emerald / antique gold */
:root{--zx-gold:#e8c87d;--zx-gold-edge:rgba(232,200,125,.55);--zx-emerald:#87f2cb;--zx-ink:rgba(2,19,18,.90);--zx-border:rgba(232,200,125,.39);--zx-glow:rgba(40,178,136,.24)}
body{background-color:#061510;background-image:linear-gradient(180deg,rgba(1,13,13,.32),rgba(1,17,16,.24) 35%,rgba(1,12,12,.67)),url('/assets/Zarvexis_background_website.jpg');background-position:center top;background-size:cover;background-attachment:fixed}
.topbar{background:linear-gradient(180deg,rgba(0,14,13,.88),rgba(0,18,16,.44) 83%,transparent);border-bottom:1px solid rgba(232,200,125,.2);padding-inline:clamp(14px,2vw,36px)}
.topbar nav a{border-color:rgba(232,200,125,.35);background:linear-gradient(135deg,rgba(3,34,29,.86),rgba(1,18,18,.78));color:#f1e6c9;box-shadow:0 4px 20px #0007,inset 0 1px rgba(255,255,255,.06)}
.topbar nav a:hover,.topbar nav a:focus-visible{border-color:var(--zx-gold);color:#fff7db;background:rgba(8,77,59,.86)}
.topbar nav a.nav-donate{border-color:rgba(247,145,163,.6)}
.feature-page,.bosses-page{position:relative}
.feature-heading,.bosses-heading{padding-top:13px}
.feature-heading:after,.bosses-heading:after,.home-section-heading:after{content:"";display:block;width:min(450px,80%);height:45px;margin:2px auto -20px;background:url('/assets/zarvexis-divider.svg') center/contain no-repeat;opacity:.95;pointer-events:none}
.feature-heading h1,.bosses-heading h1{color:#fff3d6;letter-spacing:.02em}
.feature-panel,.class-card,.boss-card,.class-controls,.signs-grid>*,.ranking-grid>*{border-color:var(--zx-border);background:linear-gradient(135deg,rgba(2,24,22,.95),rgba(2,38,32,.84));box-shadow:0 13px 32px rgba(0,0,0,.48),inset 0 1px rgba(255,236,185,.06);backdrop-filter:blur(10px)}
.feature-panel,.class-card,.boss-card{position:relative;overflow:hidden}
.feature-panel:before,.class-card:before,.boss-card:before{content:"";position:absolute;left:0;top:0;width:56px;height:56px;background:url('/assets/zarvexis-corner.svg') top left/contain no-repeat;opacity:.72;pointer-events:none}
.feature-panel h2,.class-card h2,.boss-info h2,.home-pillar h2{color:var(--zx-gold)}
.boss-card:hover,.class-card:hover,.feature-panel:hover{border-color:rgba(244,216,147,.78);box-shadow:0 16px 36px #000a,0 0 22px rgba(34,150,119,.14)}
.class-controls input,.class-controls select{border-color:rgba(232,200,125,.4);background:rgba(0,20,18,.85)}
.class-controls input:focus-visible,.class-controls select:focus-visible{outline:2px solid var(--zx-gold);outline-offset:2px}
.ranking-table th{background:rgba(33,63,48,.95);color:#f4d899}
.ranking-table tbody tr:hover{background:rgba(225,197,115,.09)}
.bosses-refresh,.feature-bottom-nav a,.bosses-nav-link{border-color:var(--zx-gold-edge);background:rgba(2,34,28,.88);color:#f1d899}
.bosses-refresh:hover,.feature-bottom-nav a:hover,.bosses-nav-link:hover{border-color:#f8db97;background:rgba(14,78,60,.85)}
.footer{border-top:1px solid rgba(232,200,125,.24);background:linear-gradient(0deg,rgba(0,13,12,.82),rgba(0,13,12,.18));align-items:center}
.social-links a{color:#b2f9da}
.social-links a:hover{color:var(--zx-gold)}
.music-toggle{border-color:rgba(232,200,125,.55);color:#e8c87d;box-shadow:0 6px 22px #0009}
.cinematic-hero .hero-content{position:relative}
.cinematic-hero .hero-content:before{content:"";position:absolute;inset:-12px -40px;z-index:-1;background:radial-gradient(ellipse,rgba(1,19,17,.56),transparent 70%);pointer-events:none}
.home-pillar,.home-overview,.home-start,.cinematic-status .server-status-panel{border-color:var(--zx-gold-edge)}
.home-pillar{position:relative;overflow:hidden}
.home-pillar:before,.home-overview:after,.home-start:after{content:"";position:absolute;right:0;bottom:0;width:65px;height:65px;background:url('/assets/zarvexis-corner.svg') center/contain no-repeat;transform:rotate(180deg);opacity:.6;pointer-events:none}
@media(max-width:850px){.topbar nav a{padding:8px 10px}.feature-page,.bosses-page{width:auto}.footer{padding-bottom:90px}}
@media(prefers-reduced-motion:reduce){.boss-card,.class-card,.home-pillar{transition:none}}

/* Original forest art preserved; atmospheric artwork is an independent SVG overlay. */
body{background-image:url('/assets/zarvexis-atmosphere.svg'),linear-gradient(180deg,rgba(1,13,13,.22),rgba(1,17,16,.2) 35%,rgba(1,12,12,.52)),url('/assets/Zarvexis_background_website.jpg');background-position:center center,center top,center top;background-size:cover,cover,cover}

/* Cinematic artwork: separately generated forest + original transparent character */
body{background-image:url('/assets/zarvexis-atmosphere.svg'),linear-gradient(180deg,rgba(1,13,13,.15),rgba(1,17,16,.16) 35%,rgba(1,12,12,.50)),url('/assets/zarvexis-cinematic-forest.jpg')}
@media(min-width:1050px){.cinematic-hero{isolation:isolate}.cinematic-hero:before{content:"";position:absolute;z-index:-1;left:clamp(0px,4vw,100px);bottom:-18px;width:clamp(180px,22vw,360px);height:clamp(380px,39vw,570px);background:url('/assets/Zarvexis.png') center bottom/contain no-repeat;filter:drop-shadow(0 0 20px rgba(75,231,194,.38)) drop-shadow(0 14px 24px #000)}.cinematic-hero:after{content:"";position:absolute;z-index:-2;inset:0;background:radial-gradient(ellipse at 50% 47%,rgba(0,24,22,.62),transparent 54%);pointer-events:none}}
@media(max-width:1049px){.cinematic-hero:before{display:none}}

/* Visual refinement 2026-10-12: improve hierarchy and contrast across the portal. */
:root{--zx-surface:rgba(2,22,20,.94);--zx-surface-alt:rgba(3,39,33,.89)}
body{background-color:#031310;background-image:linear-gradient(90deg,rgba(0,9,9,.36),rgba(0,12,12,.08) 45%,rgba(0,10,9,.33)),linear-gradient(180deg,rgba(0,12,12,.22),rgba(0,14,13,.22) 45%,rgba(0,10,10,.65)),url('/assets/zarvexis-cinematic-forest.jpg');background-size:cover;background-position:center top;background-attachment:fixed}
.cinematic-hero{isolation:isolate;min-height:420px;display:flex;justify-content:center;align-items:center;padding-top:34px}
.cinematic-hero:before{content:none!important;display:none!important;background:none!important}
.cinematic-hero:after{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(ellipse at 50% 42%,rgba(0,19,18,.66),rgba(0,18,16,.23) 50%,transparent 78%);pointer-events:none}
.cinematic-hero .hero-content{position:relative;z-index:1;max-width:900px}
.cinematic-hero .hero-logo{display:block;width:clamp(190px,23vw,340px);max-height:230px;object-fit:contain;filter:drop-shadow(0 7px 20px #001c1a) drop-shadow(0 0 16px rgba(68,244,202,.18));margin:0 auto 12px}
.cinematic-hero .tagline{font-size:clamp(28px,2.8vw,43px);line-height:1.16;max-width:850px;margin:4px auto 10px;color:#fff4dc;text-shadow:0 4px 17px #000,0 0 30px rgba(0,0,0,.6)}
.cinematic-hero .hero-description{max-width:660px;margin:0 auto 22px;color:#e4f5ec;text-shadow:0 2px 9px #000}
.cinematic-status{position:relative;z-index:2;margin-top:-4px}
.cinematic-status .server-status-panel,.home-overview,.home-start,.home-pillar,.feature-panel,.class-card,.boss-card{background:linear-gradient(135deg,var(--zx-surface),var(--zx-surface-alt));border:1px solid rgba(214,180,109,.46);box-shadow:0 12px 34px rgba(0,0,0,.53),inset 0 1px rgba(255,240,201,.07)}
.cinematic-status .server-status-panel{border-color:rgba(235,198,123,.7)}
.home-world{margin-top:30px}
.home-world .home-section-heading{margin-bottom:28px}
.home-pillar{min-height:170px}
.home-pillar h2,.feature-panel h2,.boss-info h2,.class-card h2{color:#f3d48a}
.home-overview,.home-start{padding-top:30px;padding-bottom:30px}
.feature-heading,.bosses-heading{position:relative;padding-top:22px}
.feature-heading h1,.bosses-heading h1{color:#fff0ce;text-shadow:0 3px 16px rgba(0,0,0,.85)}
.feature-heading p,.bosses-heading p{color:#e1f0e8;text-shadow:0 2px 8px #000}
.feature-panel:before,.class-card:before,.boss-card:before{opacity:.48;width:42px;height:42px}
.home-pillar:before,.home-overview:after,.home-start:after{opacity:.35;width:50px;height:50px}
.class-card,.boss-card{transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.class-card:hover,.boss-card:hover{transform:translateY(-2px);border-color:rgba(242,208,137,.7)}
.ranking-table{font-variant-numeric:tabular-nums}
.ranking-table th{background:rgba(39,67,53,.95);color:#ffe3a3}
.ranking-table td,.ranking-table th{padding-top:12px;padding-bottom:12px}
.feature-bottom-nav{margin-top:22px}
@media(max-width:850px){.cinematic-hero{min-height:350px;padding-top:20px}.cinematic-hero .hero-logo{width:clamp(170px,42vw,290px)}.cinematic-status{margin-top:0}.home-world{margin-top:22px}body{background-attachment:scroll}}
@media(max-width:520px){.cinematic-hero{min-height:325px}.cinematic-hero .tagline{font-size:clamp(25px,7vw,32px)}.home-overview,.home-start{padding:22px 16px}}
@media(prefers-reduced-motion:reduce){.class-card,.boss-card{transition:none;transform:none!important}}

/* Official ZARVEXIS forest artwork provided by the project owner. */
body{
 background-image:linear-gradient(180deg,rgba(0,12,12,.10) 0%,rgba(0,12,12,.12) 35%,rgba(0,12,12,.66) 100%),url('/assets/Zarvexis_background_website_2.png');
 background-position:center top;
 background-size:cover;
 background-attachment:fixed;
 background-repeat:no-repeat;
}
.topbar{background:linear-gradient(180deg,rgba(0,15,14,.94),rgba(0,17,16,.81));backdrop-filter:blur(10px)}
.cinematic-hero{min-height:580px;align-items:flex-end;padding:100px 20px 35px;background:linear-gradient(180deg,transparent 0%,transparent 52%,rgba(0,16,15,.68) 100%)}
.cinematic-hero .hero-logo{display:none}
.cinematic-hero:after{background:none}
.cinematic-hero .hero-content{width:100%;max-width:980px}
.cinematic-hero .tagline{margin-bottom:12px}
.cinematic-status{margin-top:0}
@media(min-width:1600px){.cinematic-hero{min-height:620px}}
@media(max-width:900px){body{background-size:auto 100vh;background-position:42% top;background-attachment:scroll}.cinematic-hero{min-height:510px;padding-top:90px}}
@media(max-width:520px){.cinematic-hero{min-height:460px;padding:80px 12px 22px}.cinematic-hero .tagline{font-size:25px}}

/* Background already contains the official ZARVEXIS branding. */
.topbar{justify-content:flex-end}
.cinematic-hero .hero-logo,.cinematic-hero .tagline{display:none!important}
.cinematic-hero{min-height:clamp(380px,42vw,620px)}
@media(max-width:900px){.topbar{justify-content:center}.cinematic-hero{min-height:440px}}

/* Background alignment and transparent navigation across all pages. */
html,body{min-height:100%}
body{
 background-color:#061510;
 background-image:url('/assets/Zarvexis_background_website_2.png')!important;
 background-position:center top!important;
 background-repeat:no-repeat!important;
 background-size:100% auto!important;
 background-attachment:fixed!important;
}
body::before{display:none!important;content:none!important}
.topbar{
 background:transparent!important;
 background-image:none!important;
 backdrop-filter:none!important;
 -webkit-backdrop-filter:none!important;
 box-shadow:none!important;
 border:0!important;
}
.cinematic-hero{
 background:transparent!important;
 background-image:none!important;
}
.cinematic-hero::after{display:none!important;content:none!important}
@media(max-width:900px){
 body{background-size:cover!important;background-position:center top!important;background-attachment:scroll!important}
}
/* Owner-requested glass transparency and improved embedded logo visibility. */
:root{--zx-surface:rgba(2,24,22,.56);--zx-surface-alt:rgba(3,39,33,.49)}
.cinematic-status .server-status-panel,
.home-overview,.home-start,.home-pillar,
.feature-panel,.class-card,.boss-card{
 background:linear-gradient(135deg,rgba(1,27,24,.62),rgba(2,38,32,.50))!important;
 border-color:rgba(143,225,186,.55);
 box-shadow:0 10px 28px rgba(0,0,0,.28),inset 0 1px rgba(255,240,201,.08);
}
.class-controls,.ranking-panel,.seven-signs-panel,.feature-page .feature-panel{
 background-color:rgba(1,28,25,.58)!important;
}
.ranking-table th{background:rgba(33,63,48,.65)!important}
.ranking-table tbody tr:nth-child(even){background:rgba(15,65,53,.30)}
.topbar{background:transparent!important}
.topbar nav a{background:rgba(0,26,23,.45);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
/* Logos are part of the background image, so enhance local contrast without duplicate images. */
body{background-color:#061510!important}
.cinematic-hero .hero-content:before{display:none!important}
@media(max-width:700px){
 .cinematic-status .server-status-panel,.home-overview,.home-start,.home-pillar,.feature-panel,.class-card,.boss-card{
 background:linear-gradient(135deg,rgba(1,27,24,.74),rgba(2,38,32,.66))!important;
 }
}
/* Global authentic Interlude C6 cursor and subtle forest ambience. */
@media (pointer:fine){
 html,body,body *{cursor:url('/assets/interlude-arrow.cur'),auto}
 a,button,select,summary,[role="button"],input[type="button"],input[type="submit"],input[type="checkbox"],input[type="radio"],label[for]{cursor:url('/assets/interlude-hand.cur'),pointer!important}
 input:not([type="button"]):not([type="submit"]),textarea,[contenteditable="true"]{cursor:text!important}
}
.forest-ambience{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.forest-glow{position:absolute;width:clamp(7px,1.1vw,18px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fff7d8 0%,rgba(255,228,137,.82) 15%,rgba(255,196,73,.32) 40%,transparent 73%);filter:drop-shadow(0 0 10px rgba(255,201,95,.75));opacity:.22;animation:forest-twinkle var(--duration,5s) ease-in-out infinite alternate;animation-delay:var(--delay,0s)}
@keyframes forest-twinkle{0%,18%{opacity:.10;transform:scale(.75)}58%{opacity:.46;transform:scale(1.1)}100%{opacity:.17;transform:scale(.83)}}
.forest-mouse-glint{position:fixed;z-index:5;pointer-events:none;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle,#fff9df,rgba(255,217,121,.85) 30%,transparent 75%);box-shadow:0 0 9px 2px rgba(249,193,87,.35);animation:forest-dust-fade .65s ease-out forwards}
@keyframes forest-dust-fade{from{opacity:.65;transform:translate(-50%,-50%) scale(.85)}to{opacity:0;transform:translate(-50%,-80%) scale(.1)}}
@media(max-width:900px),(pointer:coarse),(prefers-reduced-motion:reduce){.forest-ambience,.forest-mouse-glint{display:none!important}}
/* Consistent translucent glass across every page; controls retain readable contrast. */
:root{--zx-glass-a:rgba(1,27,24,.62);--zx-glass-b:rgba(2,38,32,.50)}
.cinematic-status .server-status-panel,
.server-status-panel,
.home-overview,.home-start,.home-pillar,
.feature-panel,.class-card,.boss-card,.class-controls,
.signs-grid > *, .ranking-grid > *,
.ranking-panel,.seven-signs-panel,
.portal-feature,.feature-notice,.bosses-notice{
 background:linear-gradient(135deg,var(--zx-glass-a),var(--zx-glass-b))!important;
 background-color:transparent!important;
 border-color:rgba(143,225,186,.55);
 box-shadow:0 10px 28px rgba(0,0,0,.28),inset 0 1px rgba(255,240,201,.08);
 -webkit-backdrop-filter:blur(7px);
 backdrop-filter:blur(7px);
}
.ranking-table th{background:rgba(33,63,48,.54)!important}
.ranking-table tbody tr:nth-child(even){background:rgba(15,65,53,.20)}
/* Match the LivingPortal's 3 golden sparkles per 32ms, with 540-990ms drift. */
.forest-ambience{z-index:40!important}
.forest-glow{width:clamp(12px,1.5vw,25px)!important;filter:drop-shadow(0 0 15px rgba(255,197,73,.95))!important}
@keyframes forest-twinkle{0%,18%{opacity:.18;transform:scale(.7)}58%{opacity:.9;transform:scale(1.25)}100%{opacity:.24;transform:scale(.85)}}
.forest-mouse-glint{
 z-index:100!important;width:auto;height:auto;background:none;box-shadow:none;
 color:#ffce62;font-family:"Segoe UI Symbol",sans-serif;font-size:var(--dust-size,13px);
 line-height:1;filter:drop-shadow(0 0 8px rgba(255,189,65,.9));
 animation:livingportal-dust var(--dust-duration,.75s) ease-out forwards!important;
}
.forest-mouse-glint:nth-of-type(2n){color:#fff6c2}
@keyframes livingportal-dust{
 from{opacity:.95;transform:translate(-50%,-50%) scale(1)}
 to{opacity:0;transform:translate(calc(-50% + var(--dust-dx,0px)),calc(-50% + var(--dust-dy,-30px))) scale(.65)}
}
@media(max-width:700px){
 .server-status-panel,.home-overview,.home-start,.home-pillar,.feature-panel,.class-card,.boss-card,.class-controls,.signs-grid > *,.ranking-grid > *{
 background:linear-gradient(135deg,rgba(1,27,24,.73),rgba(2,38,32,.65))!important
 }
}

/* Readability refinement: preserve existing glass surfaces and forest artwork. */
.feature-heading > p:not(.eyebrow),.bosses-heading > p:not(.eyebrow),.home-section-heading p,.cinematic-hero .hero-description{color:#f4fff8;text-shadow:0 2px 5px rgba(0,0,0,.95),0 0 13px rgba(0,0,0,.65)}
.class-stages span,.signs-metrics span{color:#c9e8da;font-size:12px;line-height:1.45}
.class-stages strong,.signs-metrics strong{color:#fffdf3;font-size:14px;text-shadow:0 1px 3px rgba(0,0,0,.65)}
.boss-respawn,.boss-location{color:#e0f5e9;font-size:13px;text-shadow:0 1px 3px rgba(0,0,0,.65)}
.feature-disclaimer,.feature-empty,.bosses-updated{color:#f4ead0;font-size:13px;line-height:1.65;text-shadow:0 1px 4px #000}
.ranking-table{font-size:14px}
.ranking-table td{color:#f7fff9;text-shadow:0 1px 2px rgba(0,0,0,.6)}
.ranking-table th{color:#ffe7ac}
.home-pillar p,.home-overview p,.home-start p{color:#f0fbf4;line-height:1.6;text-shadow:0 1px 3px rgba(0,0,0,.55)}
