/* Combat editorial system: transparent owner-supplied legend art and original arena geometry. */
body:is(.brawlhalla-editorial,.data-bank-editorial,.tier-editorial,.flow-editorial,.fgc-editorial,.arena-editorial){--combat-gold:#dfc47d;--combat-teal:#79d9ca;--combat-line:#b7a66d80;--combat-ink:#f4f0e5}
body:is(.brawlhalla-editorial,.data-bank-editorial,.tier-editorial,.flow-editorial,.fgc-editorial,.arena-editorial) main{isolation:isolate}
body:is(.brawlhalla-editorial,.data-bank-editorial,.tier-editorial,.flow-editorial,.fgc-editorial,.arena-editorial) :is(.page-hero,.tool-hero,.hero,.lab-hero){position:relative;isolation:isolate}

/* The Handbook reads as a cover spread, while the guided mode remains compact. */
.brawlhalla-editorial main>.hero{padding:clamp(30px,4vw,58px);margin-top:18px;border:1px solid var(--combat-line);border-radius:20px;background:radial-gradient(circle at 79% 45%,#c8b5791c,transparent 35%),repeating-linear-gradient(115deg,transparent 0 92px,#c7bc8a0a 93px 94px),linear-gradient(125deg,#16231b,#0d1511 74%);box-shadow:0 26px 75px #0007;overflow:hidden}
.brawlhalla-editorial main>.hero::before{content:"";position:absolute;inset:auto -8% -210px 42%;height:410px;border:1px solid #dbc98330;border-radius:50%;box-shadow:0 0 0 72px #d3bb7110,0 0 0 144px #d3bb7108;pointer-events:none}
.brawlhalla-editorial main>.hero>div{position:relative;z-index:2}
.brawlhalla-editorial main>.hero .eyebrow{color:var(--combat-teal);letter-spacing:.17em}
.brawlhalla-editorial main>.hero h1{max-width:11ch;line-height:1.02}
.brawlhalla-editorial main>.hero h1 span{color:var(--combat-gold)}
.brawlhalla-editorial main>.hero .intro{font-size:clamp(19px,2vw,25px);max-width:30ch;color:#eee9d9}
.brawlhalla-editorial .book{position:relative;isolation:isolate;min-height:500px;overflow:hidden;border:1px solid #d9c77b8c;border-radius:16px;background:radial-gradient(circle at 76% 74%,#b4a24b4a,transparent 45%),linear-gradient(165deg,#253a2d,#0b1613 75%);box-shadow:0 28px 80px #0009,9px 10px 0 #d3ba7140;transform:rotate(1deg)}
.brawlhalla-editorial .book::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(#09130ef0 0%,#09130ecb 42%,#09130e57 78%,transparent)}
.brawlhalla-editorial .book>:not(.handbook-art-pair){position:relative;z-index:2}
.brawlhalla-editorial .book .eyebrow,.brawlhalla-editorial .book .byline{color:#e7d196}
.brawlhalla-editorial .book h2{color:#fff9ec;text-shadow:0 3px 18px #000}
.brawlhalla-editorial .book p{color:#f0e9ce;text-shadow:0 2px 10px #000;background:#081510b8;border-radius:5px;padding:8px 10px;margin-left:-10px}
.brawlhalla-editorial .book .byline{display:inline-block;background:#081510e3;border-left:2px solid var(--combat-gold);padding:7px 10px;margin-left:-10px;text-shadow:0 2px 9px #000}
.handbook-art-pair{position:absolute;inset:0;z-index:0;pointer-events:none}
.handbook-art-pair img{position:absolute;object-fit:contain;filter:drop-shadow(0 18px 18px #0009)}
.handbook-wu{width:98%;height:auto;max-height:47%;right:-12%;bottom:-4%}
.handbook-petra{width:32%;height:auto;max-height:44%;left:-3%;bottom:-6%;opacity:.6}
.brawlhalla-editorial .experience-gateway{position:relative;overflow:hidden;border:1px solid #73c9b771;border-radius:18px;background:radial-gradient(circle at 80% 55%,#53d6b424,transparent 36%),linear-gradient(110deg,#172b22,#0c1817)}
.brawlhalla-editorial .experience-gateway img{filter:drop-shadow(0 16px 30px #0008);transition:transform .35s ease}
.brawlhalla-editorial .experience-gateway:hover img{transform:translateY(-6px) scale(1.025)}
.brawlhalla-editorial .handbook-mode-links>a{position:relative;overflow:hidden;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.brawlhalla-editorial .handbook-mode-links>a:hover{transform:translateY(-4px);border-color:#d9c57b;box-shadow:0 18px 38px #0006}

/* The six original guides keep their archive copy but receive a graphic first impression. */
.guides-editorial .page-hero{min-height:420px;padding:clamp(34px,5vw,64px);padding-right:min(40%,420px);margin-top:18px;overflow:hidden;border:1px solid #a9b68a66;border-radius:20px;background:radial-gradient(circle at 80% 48%,#64c7bd22,transparent 34%),linear-gradient(125deg,#19291f,#0b1613);box-shadow:0 24px 70px #0007}
.guides-editorial .page-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(112deg,transparent 0 89px,#d9c48310 90px 91px)}
.guides-editorial .page-hero>*:not(.guides-hero-art){position:relative;z-index:2}
.guides-editorial .page-hero h1{max-width:11ch;font-size:clamp(48px,6vw,82px);line-height:1.02}
.guides-editorial .page-hero h1 span{color:var(--combat-gold)}
.guides-hero-art{position:absolute;right:0;bottom:-28px;width:35%;height:106%;display:grid;place-items:end center;pointer-events:none;z-index:1}
.guides-hero-art::before{content:"";position:absolute;width:95%;aspect-ratio:1;border:1px solid #d4c77e66;border-radius:50%;box-shadow:0 0 0 40px #d4c77e0b,0 0 0 80px #d4c77e07;right:-9%;top:10%}
.guides-hero-art img{position:relative;width:100%;height:100%;object-fit:contain;object-position:bottom;filter:drop-shadow(0 18px 25px #0009);animation:combat-float 7s ease-in-out infinite alternate}
.guides-editorial .guide-card{position:relative;isolation:isolate;background:linear-gradient(145deg,#1d3026,#121b15);border-color:#7b9d7a66;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.guides-editorial .guide-card::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--combat-gold),var(--combat-teal),transparent)}
.guides-editorial .guide-card:hover{transform:translateY(-5px);border-color:#d9c57b;box-shadow:0 20px 38px #0006}

/* Data and tier surfaces use the same art language without reducing tool space. */
.data-bank-editorial .page-hero{min-height:350px;margin-top:18px;padding:clamp(30px,4vw,55px);overflow:hidden;border:1px solid #a7b88966;border-radius:18px;background:radial-gradient(circle at 77% 47%,#dbca7a26,transparent 37%),linear-gradient(120deg,#19271d,#0b1511 75%);box-shadow:0 20px 65px #0006}
.data-bank-editorial .page-hero>*:not(.index-hero-art){position:relative;z-index:2;max-width:62%}
.data-bank-editorial .page-hero h1{font-size:clamp(38px,4.7vw,65px);line-height:1.06}
.index-hero-art{position:absolute;right:-5%;bottom:-7%;width:49%;height:92%;display:grid;place-items:center;pointer-events:none;z-index:1}
.index-hero-art::before{content:"";position:absolute;width:68%;aspect-ratio:1;border:1px solid #e5d28166;border-radius:50%;box-shadow:0 0 0 48px #e5d2810b,0 0 0 98px #e5d28108}
.index-hero-art img{position:relative;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 20px 22px #000a);transform:rotate(-5deg)}
.tier-editorial .tool-hero{min-height:410px;margin-top:18px;padding:clamp(30px,4vw,54px);overflow:hidden;border:1px solid #a7b88966;border-radius:18px;background:radial-gradient(circle at 77% 40%,#6fc2b321,transparent 38%),linear-gradient(126deg,#18271f,#0d1613 75%);box-shadow:0 22px 70px #0007}
.tier-editorial .tool-hero h1{font-size:clamp(43px,5vw,72px);line-height:1.02;max-width:13ch}
.tier-hero-gallery{position:relative;min-height:330px;align-self:stretch;isolation:isolate}
.tier-energy-ring{position:absolute;inset:8% 12%;border:1px solid #d8c67b88;border-radius:50%;box-shadow:0 0 0 36px #b4ca7b0d,0 0 0 73px #b4ca7b08}
.tier-hero-gallery img{position:absolute;object-fit:contain;filter:drop-shadow(0 18px 20px #000a)}
.tier-gallery-yumiko{width:85%;height:60%;right:-10%;top:4%;transform:rotate(-10deg)}
.tier-gallery-jaeyun{width:96%;height:60%;left:-18%;bottom:0;transform:rotate(5deg)}
.tier-hero-gallery .tool-game-logo{width:77%;height:auto;max-height:80px;left:11%;bottom:40%;z-index:2;filter:drop-shadow(0 8px 14px #000a)}

/* A duel poster gives the reserved cross-game branch an identity of its own. */
.fgc-editorial .tool-hero{min-height:490px;margin-top:18px;padding:clamp(32px,4vw,60px);border:1px solid #8d967e80;border-radius:20px;overflow:hidden;background:radial-gradient(circle at 81% 40%,#9c59664a,transparent 34%),linear-gradient(120deg,#18231e,#0d1412 67%,#211a23);box-shadow:0 25px 75px #0008}
.fgc-editorial .tool-hero::before{content:"";position:absolute;inset:-20% 25% -20% auto;width:2px;background:linear-gradient(transparent,#decc8d70,transparent);transform:rotate(24deg);pointer-events:none}
.fgc-editorial .tool-hero>div:first-child{position:relative;z-index:2}
.fgc-editorial .tool-hero h1{font-size:clamp(43px,5vw,72px);line-height:1.02;max-width:13ch}
.fgc-editorial .tool-hero .intro{max-width:44ch}
.fgc-hero-visual{position:relative;min-height:380px;align-self:stretch;isolation:isolate}
.fgc-visual-ring{position:absolute;inset:8% 8% 10%;border:1px solid #dec98780;border-radius:50%;box-shadow:0 0 0 48px #d6bc720b,0 0 0 96px #d6bc7208;background:radial-gradient(circle,#c9b98219,transparent 65%)}
.fgc-hero-visual img{position:absolute;width:76%;height:75%;object-fit:contain;filter:drop-shadow(0 20px 15px #000b)}
.fgc-hero-jin{left:-7%;top:2%;transform:rotate(-5deg) scale(1.18)}
.fgc-hero-hoon{right:-3%;bottom:-3%;width:65%;transform:scaleX(-1) rotate(-4deg) scale(1.05)}
.fgc-visual-label{position:absolute;bottom:4%;left:8%;color:#e6d8ab;font:800 10px/1.4 system-ui,sans-serif;letter-spacing:.22em}
.fgc-editorial .fgc-game-grid{position:relative;padding:clamp(24px,4vw,44px);border:1px solid #94847466;border-radius:18px;background:radial-gradient(circle at 83% 60%,#a2617133,transparent 33%),linear-gradient(125deg,#19231f,#0f1715);overflow:hidden}
.fgc-editorial .fgc-roster span{border:1px solid #b7a17977;background:#2c2926;padding:8px 12px;border-radius:5px}

/* Original Platform Lab art stays distinct from the Brawlhalla illustrations. */
.arena-editorial .lab-hero{grid-template-columns:minmax(0,1fr) minmax(310px,.88fr);min-height:360px;overflow:hidden;background:radial-gradient(circle at 80% 50%,#6cbaa32d,transparent 40%),repeating-linear-gradient(112deg,transparent 0 90px,#ddce8d0c 91px 92px),linear-gradient(125deg,#192a20,#0c1512 77%)}
.arena-editorial .lab-hero>div:first-child{grid-column:1;grid-row:1;z-index:2}
.arena-editorial .lab-hero>.lab-note{grid-column:1;grid-row:2;align-self:start;z-index:2}
.lab-hero-visual{grid-column:2;grid-row:1/span 2;position:relative;align-self:stretch;min-height:330px;display:grid;place-items:center;isolation:isolate}
.lab-hero-visual::before{content:"";position:absolute;inset:6%;border:1px solid #d8c77d66;border-radius:50%;box-shadow:0 0 0 35px #d8c77d0c,0 0 0 70px #d8c77d08}
.lab-hero-visual img{position:relative;width:110%;max-width:none;height:100%;object-fit:contain;filter:drop-shadow(0 18px 30px #0008);animation:combat-float 6s ease-in-out infinite alternate}
.lab-hero-visual span{position:absolute;right:0;bottom:0;color:#d9c78b;font:800 10px/1.4 system-ui,sans-serif;letter-spacing:.16em}
.arena-editorial .lab-game{border-color:#d9c47f;box-shadow:0 0 0 5px #d9c47f11,0 28px 80px #000a}

/* Flowchart art gets a directional treatment without changing workspace controls. */
.flow-editorial .fc-hero{position:relative;overflow:hidden;margin-top:18px;padding:clamp(28px,4vw,52px);border:1px solid #a7b88966;border-radius:18px;background:radial-gradient(circle at 80% 34%,#77c6b525,transparent 36%),repeating-linear-gradient(120deg,transparent 0 94px,#d9c87d0b 95px 96px),linear-gradient(120deg,#18291f,#0d1713);box-shadow:0 22px 70px #0006}
.flow-editorial .fc-hero h1{font-size:clamp(44px,5vw,72px);line-height:1.04;max-width:12ch}
.flow-editorial .fc-hero .game-feature{position:relative;transform:rotate(1.5deg);border:1px solid #cfbf7e8c;box-shadow:0 20px 48px #0009;transition:transform .3s ease,box-shadow .3s ease}
.flow-editorial .fc-hero .game-feature:hover{transform:rotate(0) translateY(-5px);box-shadow:0 27px 58px #000b}
.flow-editorial .fc-hero .game-feature-image{aspect-ratio:16/9;background:#ebe7d9;overflow:hidden}
.flow-editorial .fc-hero .game-feature-image img{object-fit:cover;object-position:center 28%;transform:scale(1.15)}

@keyframes combat-float{from{transform:translateY(0)}to{transform:translateY(-9px)}}
@media(max-width:950px){
  .arena-editorial .lab-hero{grid-template-columns:1fr}
  .arena-editorial .lab-hero>div:first-child{grid-column:1;grid-row:1}
  .arena-editorial .lab-hero>.lab-note{grid-column:1;grid-row:2}
  .lab-hero-visual{grid-column:1;grid-row:3;min-height:250px;max-height:320px}
  .tier-hero-gallery,.fgc-hero-visual{min-height:300px}
}
@media(max-width:700px){
  .brawlhalla-editorial main>.hero{padding:24px}
  .brawlhalla-editorial .book{min-height:420px;transform:none}
  .handbook-wu{width:102%;right:-14%}
  .guides-editorial .page-hero{padding:26px;min-height:0}
  .guides-editorial .page-hero h1{font-size:clamp(42px,10vw,60px)}
  .guides-hero-art{position:relative;width:100%;height:230px;right:auto;bottom:auto;margin:12px 0 -26px;place-items:end center}
  .guides-hero-art img{height:100%;width:75%}
  .data-bank-editorial .page-hero{padding:26px;min-height:0}
  .data-bank-editorial .page-hero>*:not(.index-hero-art){max-width:none}
  .index-hero-art{position:relative;right:auto;bottom:auto;width:100%;height:175px;opacity:.75}
  .index-hero-art img{max-width:340px}
  .tier-editorial .tool-hero,.fgc-editorial .tool-hero{padding:26px;min-height:0}
  .tier-hero-gallery{min-height:245px}
  .fgc-hero-visual{min-height:260px}
  .fgc-hero-visual img{height:82%}
  .fgc-visual-label{bottom:0}
  .flow-editorial .fc-hero{padding:26px}
  .flow-editorial .fc-hero .game-feature{transform:none}
  .lab-hero-visual{min-height:200px;max-height:245px}
}
@media(prefers-reduced-motion:reduce){
  .guides-hero-art img,.lab-hero-visual img{animation:none}
  .guides-editorial .guide-card,.brawlhalla-editorial .handbook-mode-links>a,.flow-editorial .fc-hero .game-feature,.brawlhalla-editorial .experience-gateway img{transition:none}
}