/* Genshin.ch V8 | single character theme. Merge order: theme > component > hybrid V6 > V7. */

/* ===== components ===== */
.theme-comic{--comic-ink: #17243E; --comic-paper: #FFF9ED;
  --comic-blue: #4CCDE9; --comic-yellow: #FFD458; --comic-pink: #FC718E;
  --comic-mint: #86DDBD; --comic-shadow: 7px 8px 0 var(--comic-ink);
  color: var(--comic-ink);
  font-family: "Trebuchet MS", "Arial", sans-serif;}
.theme-comic .comic-panel{background: var(--comic-paper) url("../comic/patterns/paper-grain.svg") repeat;
  border: 5px solid var(--comic-ink);
  border-radius: 9px; box-shadow: var(--comic-shadow);
  padding: 1.4rem; position: relative;}
.theme-comic .comic-panel::before{content: ""; position: absolute; height: 10px; background: var(--comic-yellow);
  left: 0; top: 0; right: 0; border-radius: 5px 5px 0 0;}
.theme-comic .comic-panel--blue{background-color: #E9F9FE;}
.theme-comic .comic-panel--pink{background-color: #FFF0F3;}
.theme-comic .comic-panel--dark{background: #31466A; color: #FFF;}
.theme-comic .comic-button{position:relative; display:inline-flex; align-items:center; justify-content:center;
  background:var(--comic-yellow); color:var(--comic-ink); border:4px solid var(--comic-ink);
  border-radius:7px; padding:.58rem 1.1rem; font-weight:900; letter-spacing:.03em;
  box-shadow:4px 4px 0 var(--comic-ink); text-decoration:none;
  transform:skew(-3deg); transition:transform .12s, box-shadow .12s;}
.theme-comic .comic-button:hover, .theme-comic .comic-button:focus-visible{transform:translate(2px,2px) skew(-3deg); box-shadow:2px 2px 0 var(--comic-ink);}
.theme-comic .comic-button--blue{background:var(--comic-blue);}
.theme-comic .comic-button--pink{background:var(--comic-pink);}
.theme-comic .comic-tab{display:inline-flex; align-items:center; justify-content:center;
  padding:.6rem 1.15rem; color:var(--comic-ink); background:#fff;
  border:4px solid var(--comic-ink); border-radius:9px 9px 0 0;
  font-weight:900; text-decoration:none;}
.theme-comic .comic-tab[aria-selected="true"], .theme-comic .comic-tab.is-active{background:var(--comic-yellow);}
.theme-comic .comic-card{background:#fff; border:4px solid var(--comic-ink); border-radius:9px;
 box-shadow:5px 5px 0 var(--comic-ink); overflow:hidden;}
.theme-comic .comic-card__header{background:var(--comic-blue); border-bottom:4px solid var(--comic-ink); padding:.8rem; font-weight:900;}
.theme-comic .comic-bubble{position:relative; border:4px solid var(--comic-ink); border-radius:27px;
 background:white; color:var(--comic-ink); padding:1rem 1.2rem; font-weight:700;
 box-shadow:5px 5px 0 var(--comic-ink);}
.theme-comic .comic-bubble::after{content:""; position:absolute; bottom:-17px; left:45px; width:26px; height:26px;
 background:#fff; border-right:4px solid var(--comic-ink); border-bottom:4px solid var(--comic-ink);
 transform:rotate(45deg);}
.theme-comic .comic-caption{display:inline-block; background:#fff; border:4px solid var(--comic-ink);
 transform:rotate(-1.5deg); box-shadow:4px 4px 0 var(--comic-pink);
 padding:.4rem .85rem; font-weight:900;}
.theme-comic .comic-tag{display:inline-flex; align-items:center; gap:.35rem; border:3px solid var(--comic-ink);
 background:var(--comic-yellow); border-radius:999px; font-weight:900;
 padding:.2rem .6rem;}
.theme-comic .comic-region-scene{position:relative; overflow:hidden; isolation:isolate;
 background-size:cover; background-position:center;}
.theme-comic .comic-region-scene::before{content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
 background-image:url("../comic/patterns/halftone-dots.svg");
 background-size:160px 160px; opacity:.18;}
.theme-comic .comic-region-scene > *{position:relative; z-index:1;}
.theme-comic .comic-region-scene::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
 box-shadow:inset 0 0 0 9px var(--comic-ink);}
@media (prefers-reduced-motion:reduce){
.theme-comic .comic-button{transition:none;}
}

/* ===== details ===== */
.gcc-comic{--gcc-ink: #17233e;
  --gcc-paper: #fff8ea;
  --gcc-pink: #ff6f91;
  --gcc-yellow: #ffce49;
  --gcc-blue: #40c4e8;
  --gcc-mint: #72d7b5;
  --gcc-element: #64bedc;
  --gcc-dots: url("../comic/patterns/halftone-dots.svg");
  box-sizing: border-box;
  width: min(1530px, calc(100% - 36px));
  margin: 22px auto 90px;
  color: var(--gcc-ink);
  font-family: "Trebuchet MS", "Arial", sans-serif;
  position: relative;
  isolation: isolate;
  line-height: 1.45;}
.gcc-comic *, .gcc-comic *::before, .gcc-comic *::after{box-sizing: border-box;}
.gcc-comic :is(a, button, select):focus-visible{outline: 4px solid #2867e0; outline-offset: 5px;}
.gcc-comic button, .gcc-comic select{font: inherit;}
.gcc-comic p{margin: .5em 0;}
.gcc-comic h1,.gcc-comic h2,.gcc-comic h3{font-family: "Trebuchet MS", "Arial Black", sans-serif; line-height: 1.16; margin: 0;}
.gcc-comic a{color: inherit;}
.gcc-comic img{display: block; max-width: 100%;}
.gcc-sr-only{position:absolute!important; width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.gcc-comic[data-comic-element="pyro"]{--gcc-element: #f77445;}
.gcc-comic[data-comic-element="electro"]{--gcc-element: #ac8bee;}
.gcc-comic[data-comic-element="hydro"]{--gcc-element: #52beeb;}
.gcc-comic[data-comic-element="anemo"]{--gcc-element: #61d2b3;}
.gcc-comic[data-comic-element="dendro"]{--gcc-element: #98cc65;}
.gcc-comic[data-comic-element="cryo"]{--gcc-element: #a9ecf5;}
.gcc-comic[data-comic-element="geo"]{--gcc-element: #f2c366;}
.gcc-topline{display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:18px;}
.gcc-crumb{display:inline-flex; align-items:center; gap:8px; text-decoration:none; background:#fff;
  border:3px solid var(--gcc-ink); box-shadow:4px 4px 0 var(--gcc-ink); padding:7px 14px; font-weight:900;}
.gcc-crumb img{width:21px; height:21px;}
.gcc-crumb-slash{font-size:22px; font-weight:900; padding:0 4px;}
.gcc-current-crumb{font-size:14px; font-weight:900; text-transform:uppercase; letter-spacing:.03em; padding:4px 2px;}
.gcc-current-crumb span{opacity:.5; margin:0 5px;}
.gcc-character-art--fallback{width:65%;height:83%;}
.gcc-region-sticker{width:52px;height:44px;object-fit:contain;}
.gcc-picker-section{margin-top:25px;border:4px solid var(--gcc-ink);box-shadow:7px 7px 0 var(--gcc-ink);
  background:var(--gcc-paper) url("../comic/patterns/paper-grain.svg") repeat;padding:17px 24px 19px;}
.gcc-picker{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 22px;align-items:center;}
.gcc-picker-heading{display:flex;align-items:center;gap:11px;text-transform:uppercase;font-size:18px;}
.gcc-picker-heading img{width:35px;height:35px;}
.gcc-picker-controls{display:flex;align-items:center;gap:9px;min-width:0;}
.gcc-picker-controls select{flex:1;min-width:100px;border:3px solid var(--gcc-ink);background:#fff;
  color:var(--gcc-ink);padding:11px;font-weight:800;font-size:15px;cursor:pointer;}
.gcc-picker-step{background:var(--gcc-mint);border:3px solid var(--gcc-ink);box-shadow:3px 3px 0 var(--gcc-ink);
  width:43px;height:43px;font-size:30px;line-height:1;cursor:pointer;font-weight:900;}
.gcc-picker-go{white-space:nowrap;min-height:43px;gap:10px;cursor:pointer;}
.gcc-picker-go span{font-size:22px;line-height:1;}
.gcc-filter-row{grid-column:1/-1;display:flex;align-items:center;flex-wrap:wrap;gap:7px;
  border:0;border-top:2px dashed rgba(23,35,62,.25);padding:12px 0 0;margin:4px 0 0;min-width:0;}
.gcc-filter-row legend{float:left;width:auto;padding:0 10px 0 0;font-size:11px;text-transform:uppercase;font-weight:900;}
.gcc-filter{border:2px solid var(--gcc-ink);background:#fff;padding:4px 11px;font-size:12px;cursor:pointer;
  font-weight:900;box-shadow:2px 2px 0 var(--gcc-ink);}
.gcc-filter:hover{background:#edf9ff;}
.gcc-filter.is-active{background:var(--gcc-yellow);}
.gcc-count{margin-left:auto;font-size:12px;font-weight:900;}
.gcc-chapters{margin-top:32px;}
.gcc-tabs{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin-bottom:0;padding:0 5px;}
.gcc-comic .gcc-tabs .comic-tab{gap:9px;min-height:51px;cursor:pointer;font-weight:900;text-transform:uppercase;
  background:#fff url("../comic/ui/tab-default.svg") center/100% 100% no-repeat;transform:none;border-width:3px 3px 0;
  border-radius:5px 5px 0 0;box-shadow:none;padding:12px 20px;font-size:13px;}
.gcc-comic .gcc-tabs .comic-tab[aria-selected="true"]{background:var(--gcc-yellow) url("../comic/ui/tab-active.svg") center/100% 100% no-repeat;
  min-height:57px;position:relative;z-index:2;}
.gcc-comic .gcc-tabs .comic-tab:hover{background-color:#e7f8ff;}
.gcc-comic .gcc-tabs .comic-tab[aria-selected="true"]:hover{background-color:var(--gcc-yellow);}
.gcc-chapter-contents{border:5px solid var(--gcc-ink);background:#ecf7f7 url("../comic/patterns/halftone-dots.svg") repeat;
  background-size:auto,180px 180px;box-shadow:9px 10px 0 var(--gcc-ink);padding:25px;}
.gcc-tab-pane[hidden]{display:none!important;}
.gcc-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}
.gcc-content-card{border:4px solid var(--gcc-ink);background:#fffdf7 url("../comic/patterns/paper-grain.svg") repeat;
  box-shadow:5px 6px 0 var(--gcc-ink);padding:0 17px 15px;min-width:0;position:relative;}
.gcc-content-card h2{margin:0 -17px 13px;padding:10px 13px;border-bottom:4px solid var(--gcc-ink);
  display:flex;align-items:center;gap:10px;min-height:56px;font-size:clamp(16px,1.5vw,21px);text-transform:uppercase;background:var(--gcc-blue);}
.gcc-feature-story h2{background:var(--gcc-yellow);}
.gcc-feature-constellations h2{background:#efc9ff;}
.gcc-feature-materials h2{background:var(--gcc-mint);}
.gcc-chapter-mark{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border:3px solid var(--gcc-ink);
  background:#fff;font-size:16px;line-height:1;transform:rotate(-5deg);}
.gcc-story-content{display:flex;gap:16px;align-items:flex-start;min-width:0;}
.gcc-story-content > img{width:126px;max-height:175px;object-fit:contain;flex:0 0 auto;border:3px solid var(--gcc-ink);background:#f5eef0;}
.gcc-story-content > div{min-width:0;}
.gcc-story-content h3{font-size:17px;margin-bottom:8px;}
.gcc-story-content p{font-size:14px;line-height:1.55;max-height:176px;overflow:auto;}
.gcc-mini-row{display:flex;align-items:center;gap:11px;min-height:59px;padding:7px 2px;border-bottom:2px dashed rgba(23,35,62,.3);font-size:13px;}
.gcc-mini-row img{width:42px;height:42px;object-fit:contain;flex:0 0 auto;background:#e9f4f8;border:2px solid var(--gcc-ink);}
.gcc-readmore{display:inline-flex;margin:13px 0 0;background:var(--gcc-yellow);border:3px solid var(--gcc-ink);
  padding:6px 12px;font-weight:900;font-size:12px;text-transform:uppercase;box-shadow:3px 3px 0 var(--gcc-ink);cursor:pointer;}
.gcc-readmore:hover{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--gcc-ink);}
.gcc-material-tiles,.gcc-cost-items{display:flex;flex-wrap:wrap;align-items:flex-start;gap:9px;}
.gcc-material-chip{width:64px;min-height:66px;border:2px solid var(--gcc-ink);background:#f4f8fd;position:relative;}
.gcc-material-chip img{width:52px;height:49px;object-fit:contain;margin:auto;}
.gcc-material-chip b{display:block;position:absolute;right:-4px;bottom:-5px;background:var(--gcc-yellow);
  padding:0 4px;border:2px solid var(--gcc-ink);font-size:11px;}
.gcc-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}
.gcc-detail-card{padding-bottom:17px;}
.gcc-detail-card h2{font-size:17px;overflow-wrap:anywhere;}
.gcc-detail-card h2 img{width:47px;height:47px;object-fit:contain;border:2px solid var(--gcc-ink);background:white;}
.gcc-detail-card p{font-size:14px;line-height:1.65;white-space:normal;overflow-wrap:anywhere;}
.gcc-detail-card:nth-child(4n/**/+2) h2{background:var(--gcc-yellow);}
.gcc-detail-card:nth-child(4n/**/+3) h2{background:var(--gcc-mint);}
.gcc-detail-card:nth-child(4n/**/+4) h2{background:#fac5d5;}
.gcc-cost-card{margin-top:24px;padding-bottom:25px;}
.gcc-cost-card h2{background:var(--gcc-mint);}
.gcc-cost-items > span{display:flex;position:relative;align-items:center;flex-direction:column;text-align:center;gap:4px;
  width:102px;min-height:120px;border:2px solid var(--gcc-ink);background:#fff;padding:7px 5px;}
.gcc-cost-items img{width:56px;height:56px;object-fit:contain;}
.gcc-cost-items b{font-size:12px;background:var(--gcc-yellow);padding:1px 5px;}
.gcc-cost-items small{font-size:11px;line-height:1.1;overflow-wrap:anywhere;}
.gcc-cost-level{padding:15px 0;border-top:2px dashed #768096;margin-top:18px;}
.gcc-cost-level > strong{display:inline-block;background:var(--gcc-yellow);border:2px solid var(--gcc-ink);padding:2px 10px;margin-bottom:10px;}
.gcc-source-note{text-align:center;font-size:12px;color:#fff;background:rgba(23,35,62,.9);padding:12px 20px;
  width:fit-content;max-width:100%;margin:23px auto 0!important;border:2px solid var(--gcc-ink);}
@media (max-width:1120px){
.gcc-picker{grid-template-columns:1fr;}
.gcc-picker-heading{grid-column:1;}
.gcc-picker-controls{grid-column:1;}
}
@media (max-width:790px){
.gcc-comic{width:min(100% - 24px, 620px);margin-top:18px;}
.gcc-card-grid,.gcc-detail-grid{grid-template-columns:1fr;}
.gcc-chapter-contents{padding:18px 15px;}
.gcc-tabs{gap:3px;}
.gcc-comic .gcc-tabs .comic-tab{padding:10px 12px;min-height:45px;font-size:12px;}
.gcc-comic .gcc-tabs .comic-tab[aria-selected="true"]{min-height:49px;}
.gcc-picker-section{padding:14px;}
}
@media (max-width:470px){
.gcc-topline{gap:7px;}
.gcc-current-crumb{order:3;width:100%;}
.gcc-crumb-slash{display:none;}
.gcc-comic .gcc-tabs .comic-tab{padding:9px;gap:0; font-size:13px;}
.gcc-comic .gcc-tabs .comic-tab > span{display:none;}
.gcc-picker-controls{flex-wrap:wrap;}
.gcc-picker-controls select{flex:1 1 55%;}
.gcc-picker-go{width:100%;}
.gcc-story-content{display:block;}
.gcc-story-content > img{float:left;width:100px;margin:0 12px 8px 0;}
}
@media (prefers-reduced-motion:reduce){
.gcc-comic *, .gcc-comic *::before, .gcc-comic *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important;}
}

/* ===== hybrid ===== */
.gch-hybrid{--gch-h-ink: #14223b;
  --gch-h-paper: #fff8ec;
  --gch-h-dots: url("../comic/patterns/halftone-dots.svg");
  width: min(1490px, calc(100% - 40px));
  margin: 22px auto 80px;}
.gch-hybrid .gch-h-topline{margin-bottom: 16px;}
.gch-hybrid .gcc-current-crumb{color:#fff; text-shadow:1px 1px 1px #17233e;}
.gch-h-fold{display: grid;
  grid-template-columns: minmax(0, 1.52fr) minmax(340px, .83fr);
  gap: 17px;
  min-height: 684px;}
.gch-h-hero, .gch-h-identity, .gch-h-picker-section{border: 5px solid var(--gcc-ink);
  box-shadow: 8px 8px 0 var(--gcc-ink);
  min-width: 0;}
.gch-h-hero{position:relative;
  overflow:hidden;
  min-height:684px;
  background:#b9e2ee;
  isolation:isolate;}
.gch-hybrid .gch-h-hero::before{content:"";
  position:absolute;inset:0;
  background:var(--gcc-region-image) center / cover no-repeat;
  filter:saturate(.90);
  z-index:0;}
.gch-hybrid .gch-h-hero::after{content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(13,29,57,.06) 0%,transparent 45%,rgba(13,29,57,.23) 67%,rgba(13,29,57,.78) 100%);
  pointer-events:none;
  z-index:4;}
.gch-h-hero .gch-h-region{position:absolute!important;inset:0;z-index:1!important;
  background:linear-gradient(135deg,rgba(250,245,225,.14),rgba(255,255,255,.03) 50%,rgba(19,35,63,.08));}
.gch-h-hero .gch-h-ink-pattern{position:absolute!important;inset:0;z-index:2!important;
  background-image:var(--gch-h-dots);
  background-size:150px 150px;
  opacity:.16;
  pointer-events:none;}
.gch-h-hero .gch-h-element-halo{position:absolute!important;
  width:72%;aspect-ratio:1;top:13%;left:12%;z-index:2!important;
  background:radial-gradient(ellipse,var(--gcc-element) 0%,transparent 69%);
  opacity:.38;
  filter:blur(36px);
  pointer-events:none;}
.gch-h-hero .gch-h-hero-art{position:absolute!important;
  inset:0 0 6px;
  z-index:3!important;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  pointer-events:none;}
.gch-h-hero-art img{display:block;
  max-width:none!important;
  width:auto;
  height:114%;
  object-fit:contain;
  transform:translate(2%, 4%);
  filter:drop-shadow(6px 7px 0 rgba(12,19,37,.66));}
.gch-h-hero-art img.gch-h-art-fallback{height:74%;transform:none;}
.gch-h-hero .gch-h-region-label{position:absolute!important;
  top:24px;left:20px;z-index:6!important;
  display:flex;gap:10px;align-items:center;
  background:#fff8ed;
  border:4px solid var(--gcc-ink);
  box-shadow:5px 5px 0 var(--gcc-ink);
  padding:5px 14px 5px 6px;
  font-weight:1000;
  font-size:clamp(14px,1.5vw,20px);
  transform:rotate(-3deg);}
.gch-h-region-label img{width:51px;height:39px;object-fit:contain;}
.gch-h-hero .gch-h-motion-toggle{position:absolute!important;right:17px;bottom:20px;z-index:8!important;
  height:36px;min-width:36px;padding:5px 9px;
  background:#fff6df;color:var(--gcc-ink);
  border:3px solid var(--gcc-ink);box-shadow:3px 3px 0 var(--gcc-ink);
  cursor:pointer;font-size:14px;font-weight:900;}
.gch-h-motion-toggle:hover{background:var(--gcc-yellow);}
.gch-h-motion-toggle span{display:inline-block;vertical-align:middle;}
.gch-h-hero .gch-h-titleblock{position:absolute!important;bottom:25px;left:24px;right:64px;z-index:6!important;
  max-width:calc(100% - 95px);color:#fff;
  text-shadow:3px 3px 0 rgba(12,19,37,.85);}
.gch-h-titleblock h1{font-family:Impact,"Arial Black","Trebuchet MS",sans-serif!important;
  font-size:clamp(48px,5vw,92px);
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.006em;
  overflow-wrap:anywhere;
  line-height:.97!important;
  -webkit-text-stroke:1px rgba(0,0,0,.35);}
.gch-h-titleblock p{margin:12px 0 0!important;font-size:clamp(13px,1.4vw,18px);font-weight:900;max-width:92%;}
.gch-h-side{min-width:0;display:grid;grid-template-rows:minmax(0, 1fr) auto;gap:17px;}
.gch-h-identity{padding:0;
  position:relative;
  background:var(--gch-h-paper) url("../comic/patterns/paper-grain.svg") repeat;
  overflow:hidden;}
.gch-h-pane-title{background:var(--gcc-blue);display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:4px solid var(--gcc-ink);}
.gch-h-pane-title h2{font-size:20px;font-weight:1000;line-height:1.1;text-transform:uppercase;}
.gch-h-label-number{display:grid;place-items:center;background:#fff;border:3px solid var(--gcc-ink);width:37px;height:37px;font-weight:1000;transform:rotate(-4deg);flex:0 0 37px;}
.gch-h-identity-head{display:flex;align-items:center;gap:12px;padding:15px 15px 11px;min-width:0;}
.gch-h-avatar{width:68px;height:68px;flex:0 0 68px;object-fit:contain;border:3px solid var(--gcc-ink);background:#fff;box-shadow:3px 3px 0 var(--gcc-pink);}
.gch-h-identity-heading{display:flex;flex-direction:column;min-width:0;gap:4px;flex:1;}
.gch-h-identity-heading strong{font-size:clamp(16px,1.5vw,23px);text-transform:uppercase;overflow-wrap:anywhere;line-height:1.1;}
.gch-h-rating{font-size:22px;color:#efb41c;letter-spacing:-3px;-webkit-text-stroke:.75px #17233e;white-space:nowrap;}
.gch-h-element-sticker{position:relative;display:inline-flex;align-items:center;gap:6px;flex:0 1 auto;max-width:145px;overflow-wrap:anywhere;padding:5px 9px;background:var(--gcc-element);border:2px solid var(--gcc-ink);font-weight:1000;font-size:12px;text-transform:uppercase;transform:rotate(3deg);box-shadow:2px 2px 0 var(--gcc-ink);}
.gch-h-element-sticker .gch-h-element-icon{display:block;width:26px;height:26px;flex:0 0 26px;object-fit:contain;}
.gch-h-element-sticker > span{min-width:0;}
.gch-h-facts{padding:0 17px;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 13px;}
.gch-h-facts > div{padding:10px 1px;border-top:2px dashed rgba(23,35,62,.24);min-width:0;}
.gch-h-facts dt{text-transform:uppercase;font-weight:900;font-size:10px;letter-spacing:.06em;color:#617186;}
.gch-h-facts dd{font-size:13px;font-weight:900;margin:4px 0 0;overflow-wrap:anywhere;}
.gch-h-identity-description{margin:4px 16px 14px!important;
  padding:10px 12px;
  background:#fff;
  border-left:5px solid var(--gcc-element);
  border-top:2px solid var(--gcc-ink);
  font-size:12px;
  line-height:1.45;
  max-height:79px;
  overflow:auto;}
.gch-hybrid .gch-h-picker-section{padding:12px 14px;
  margin:0;
  background:#fff9ed url("../comic/patterns/paper-grain.svg") repeat;}
.gch-hybrid .gch-h-picker{display:block;}
.gch-hybrid .gch-h-picker .gcc-picker-heading{margin-bottom:11px;font-size:15px;}
.gch-hybrid .gch-h-picker .gcc-picker-heading img{width:26px;height:26px;}
.gch-hybrid .gch-h-picker .gcc-picker-controls{display:grid;grid-template-columns:35px minmax(0,1fr) 35px;gap:8px;}
.gch-hybrid .gch-h-picker .gcc-picker-controls select{font-size:13px;padding:6px;max-width:100%;min-width:0;min-height:37px;}
.gch-hybrid .gch-h-picker .gcc-picker-step{width:35px;height:37px;font-size:23px;}
.gch-hybrid .gch-h-picker .gcc-picker-go{grid-column:1/-1;min-height:33px;padding:4px;font-size:12px;}
.gch-hybrid .gch-h-picker .gcc-filter-row{padding-top:9px;margin-top:10px;gap:5px;}
.gch-hybrid .gch-h-picker .gcc-filter-row legend{font-size:10px;}
.gch-hybrid .gch-h-picker .gcc-filter{font-size:10px;padding:3px 7px;}
.gch-hybrid .gch-h-picker .gcc-count{font-size:10px;}
.gch-h-fast{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px;margin-top:28px;}
.gch-hybrid .gch-h-fast-card{display:block;min-width:0;min-height:166px;
  padding:0;
  text-align:left;
  background:#fff;
  border:5px solid var(--gcc-ink);
  box-shadow:7px 7px 0 var(--gcc-ink);
  cursor:pointer;
  color:var(--gcc-ink);
  transition:transform .14s ease,box-shadow .14s ease;}
.gch-hybrid .gch-h-fast-card:hover{transform:translate(3px,3px);box-shadow:4px 4px 0 var(--gcc-ink);}
.gch-hybrid .gch-h-fast-card:active{transform:translate(6px,6px);box-shadow:1px 1px 0 var(--gcc-ink);}
.gch-h-fast-top{display:flex;align-items:center;gap:12px;min-height:58px;padding:10px;border-bottom:4px solid var(--gcc-ink);background:#6ed1e5;}
.gch-h-fast-top > span:first-child{display:grid;place-items:center;width:39px;height:39px;flex:0 0 39px;border:3px solid var(--gcc-ink);background:white;font-weight:1000;font-size:15px;transform:rotate(-5deg);}
.gch-h-fast-top strong{font-size:clamp(15px,1.6vw,24px);text-transform:uppercase;overflow-wrap:anywhere;line-height:1.1;flex:1;}
.gch-h-fast-top > span:last-child{font-weight:900;font-size:23px;}
.gch-h-fast-stars .gch-h-fast-top{background:#ebc9f7;}
.gch-h-fast-ascension .gch-h-fast-top{background:#8bdfc1;}
.gch-h-fast-details{display:flex;gap:10px;align-items:center;justify-content:space-between;min-height:94px;padding:13px 15px;background-color:#fff9ed;background-image:var(--gch-h-dots);background-size:155px 155px;}
.gch-h-quick-icons{display:flex;gap:4px;align-items:center;}
.gch-h-quick-icons img{display:block;width:48px;height:48px;object-fit:contain;border:2px solid var(--gcc-ink);background:white;}
.gch-h-fast-details small{font-size:11px;font-weight:900;line-height:1.3;text-align:right;max-width:42%;}
.gch-h-chapters{margin-top:34px;scroll-margin-top:14px;}
.gch-h-section-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:10px;color:#fff;text-shadow:1px 1px #091526;}
.gch-h-section-bar strong{font-size:clamp(20px,2.2vw,31px);font-weight:1000;text-transform:uppercase;}
.gch-h-section-kicker{font-size:12px;font-weight:1000;letter-spacing:.08em;background:var(--gcc-ink);padding:6px 13px;}
.gch-h-section-kicker b{color:var(--gcc-yellow);}
.gch-hybrid .gcc-chapter-contents{background:#eaf3f4 url("../comic/patterns/halftone-dots.svg") repeat;padding:20px 22px;}
.gch-hybrid .gcc-tabs{gap:7px;}
.gch-hybrid .gcc-card-grid{grid-template-columns:1.1fr .9fr;}
.gch-hybrid .gcc-feature-story{grid-row:span 2;}
.gch-hybrid .gcc-feature-materials{grid-column:1/-1;}
.gch-hybrid .gcc-story-content > img{width:165px;max-height:260px;}
.gch-hybrid .gcc-story-content p{max-height:280px;}
.gch-hybrid .gcc-feature-materials .gcc-material-tiles{justify-content:flex-start;}
@media (max-width:1150px){
.gch-h-fold{grid-template-columns:minmax(0,1.25fr) minmax(310px,.83fr);}
.gch-h-identity-head{gap:7px;}
.gch-h-avatar{width:55px;height:55px;flex-basis:55px;}
.gch-h-identity-description{max-height:58px;}
.gch-h-quick-icons img{width:37px;height:40px;}
}
@media (max-width:900px){
.gch-h-fold{grid-template-columns:1fr;}
.gch-h-hero{min-height:540px;}
.gch-h-side{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto;align-items:start;}
.gch-h-identity,.gch-h-picker-section{height:100%;}
.gch-h-identity-description{max-height:85px;}
.gch-h-fast{gap:12px;}
.gch-h-fast-top{gap:6px;}
.gch-h-fast-top strong{font-size:16px;}
}
@media (max-width:710px){
.gch-hybrid{width:calc(100% - 24px);}
.gch-h-hero{min-height:440px;}
.gch-h-hero-art img{height:115%;}
.gch-h-titleblock h1{font-size:clamp(35px,8.2vw,62px);}
.gch-h-side{grid-template-columns:1fr;}
.gch-h-fast{grid-template-columns:1fr;}
.gch-hybrid .gch-h-fast-card{min-height:0;}
.gch-h-fast-details{min-height:80px;}
.gch-hybrid .gcc-card-grid{grid-template-columns:1fr;}
.gch-hybrid .gcc-chapter-contents{padding:15px;}
}
@media (max-width:470px){
.gch-hybrid .gcc-topline{gap:7px;}
.gch-hybrid .gcc-current-crumb{order:3;width:100%;}
.gch-h-hero{min-height:355px;}
.gch-h-hero .gch-h-region-label{top:12px;left:9px;padding:3px 8px;font-size:12px;}
.gch-h-region-label img{width:33px;height:30px;}
.gch-h-hero .gch-h-motion-toggle{right:9px;bottom:9px;}
.gch-h-hero .gch-h-titleblock{bottom:17px;left:13px;right:13px;}
.gch-h-titleblock h1{font-size:clamp(31px,8vw,49px);}
.gch-h-titleblock p{font-size:12px!important;margin-top:5px!important;}
.gch-h-rating{font-size:16px;}
.gch-h-section-bar{display:block;}
.gch-h-section-bar strong{display:block;margin-top:6px;}
.gch-hybrid .gcc-tabs .comic-tab{padding:8px 11px;}
.gch-hybrid .gcc-story-content > img{width:90px;}
}
@media (prefers-reduced-motion: reduce){
.gch-hybrid .gch-h-fast-card{transition:none;}
}
.gch-hybrid .gch-h-hero::before{background:transparent;}
.gch-hybrid .gch-h-hero{background:rgba(25,42,67,.16);}
.gch-hybrid .gch-h-hero .gch-h-region{background:linear-gradient(135deg,rgba(250,245,225,.06),rgba(255,255,255,.06) 40%,rgba(19,35,63,.08));}
.gch-hybrid .gch-h-element-halo{animation:gch-h-glow 9s ease-in-out infinite alternate;}
.gch-hybrid .gch-h-light-sweep{position:absolute!important;inset:-5% 0;z-index:2!important;pointer-events:none;
  opacity:.19;background:linear-gradient(113deg,transparent 22%,rgba(255,255,255,.72) 46%,transparent 62%);
  transform:translateX(-110%);animation:gch-h-sweep 15s ease-in-out infinite;}
.gch-hybrid .gch-h-hero-art img{animation:gch-h-idle 9s ease-in-out infinite;}
.gch-hybrid .gch-h-particles{position:absolute!important;inset:0;z-index:2!important;pointer-events:none;overflow:hidden;}
.gch-hybrid .gch-h-particles--front{z-index:5!important;}
.gch-hybrid .gch-h-particles i{position:absolute;left:calc(var(--p-index) * 6.05%);bottom:-16px;
  width:5px;height:5px;border-radius:50%;
  background:#fff;box-shadow:0 0 9px 2px var(--gcc-element);
  opacity:0;animation:gch-h-rise calc(8s + var(--p-index) * .44s) linear infinite;
  animation-delay:calc(var(--p-index) * -.75s);}
.gch-hybrid .gch-h-particles i:nth-child(3n/**/+1){width:3px;height:3px;}
.gch-hybrid .gch-h-particles i:nth-child(4n/**/+2){width:7px;height:7px;background:var(--gcc-element);}
.gch-hybrid .gch-h-particles--front i{left:calc(var(--p-index) * 9.35%);width:3px;height:3px;opacity:0;}
@keyframes gch-h-idle{
  0%,100% {transform:translate(2%,4%);}
  50% {transform:translate(2%,3.2%);}
}
@keyframes gch-h-glow{from{opacity:.25;transform:scale(.96)}to{opacity:.46;transform:scale(1.06)}}
@keyframes gch-h-sweep{0%,58%{transform:translateX(-110%)}75%,100%{transform:translateX(110%)}}
@keyframes gch-h-rise{
  0%{transform:translate3d(0,0,0) scale(.7);opacity:0}
  12%{opacity:.7}72%{opacity:.46}
  100%{transform:translate3d(20px,-570px,0) scale(1.15);opacity:0}
}
.gch-hybrid.is-motion-paused .gch-h-hero *,
.gch-hybrid.is-motion-paused .gch-h-hero *::before,
.gch-hybrid.is-motion-paused .gch-h-hero *::after{animation-play-state:paused!important;}
.gch-hybrid .gcc-feature-skills .gcc-mini-row > img,
.gch-hybrid .gcc-detail-card h2 > img,
.gch-hybrid .gch-h-fast-talents .gch-h-quick-icons > img,
.gch-hybrid .gch-h-constellation-icon{background:#101729!important;border:2px solid #344d72!important;
  border-radius:5px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);}
.gch-hybrid .gcc-mini-row img{width:60px;height:60px;}
.gch-hybrid .gcc-detail-card h2 > img{width:66px;height:66px;}
.gch-hybrid .gch-h-quick-icons img{width:58px;height:58px;}
.gch-hybrid .gch-h-constellation-icon{width:66px;height:66px;display:inline-grid;place-items:center;
  position:relative;flex:0 0 66px;padding:3px;}
.gch-hybrid .gch-h-constellation-icon img{border:0!important;background:transparent!important;width:100%;height:100%;object-fit:contain;}
.gch-hybrid .gch-h-constellation-icon b{position:absolute;right:-6px;bottom:-6px;display:grid;place-items:center;
  min-width:27px;height:27px;padding:0 4px;background:var(--gcc-yellow);
  border:2px solid var(--gcc-ink);font-weight:1000;font-size:14px;line-height:1;
  box-shadow:2px 2px 0 var(--gcc-ink);}
.gch-hybrid .gch-h-quick-icons .gch-h-constellation-icon{width:58px;height:58px;flex-basis:58px;}
.gch-hybrid .gch-h-constellation-icon img{display:block;}
.gch-hybrid .gcc-detail-card h2 .gch-h-constellation-icon{width:68px;height:68px;flex-basis:68px;}
.gch-hybrid .gcc-detail-card h2 > span:last-child{min-width:0;}
.gch-hybrid .gcc-material-tiles{gap:17px;}
.gch-hybrid .gcc-material-chip{width:115px;min-height:143px;padding:9px 7px 23px;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;}
.gch-hybrid .gcc-material-chip img{width:88px;height:86px;margin:0;object-fit:contain;}
.gch-hybrid .gcc-material-chip .gch-h-material-name{font-size:12px;font-weight:800;line-height:1.12;text-align:center;overflow-wrap:anywhere;}
.gch-hybrid .gcc-material-chip b{font-size:14px;padding:2px 6px;right:-5px;bottom:-7px;}
.gch-hybrid .gcc-cost-items{gap:14px;}
.gch-hybrid .gcc-cost-items > span{width:145px;min-height:163px;padding:13px 9px;gap:7px;}
.gch-hybrid .gcc-cost-items img{width:85px;height:85px;}
.gch-hybrid .gcc-cost-items b{font-size:16px;}
.gch-hybrid .gcc-cost-items small{font-size:13px;line-height:1.2;}
.gch-hybrid .gcc-cost-card > p{font-size:15px;}
@media (max-width:1150px){
.gch-hybrid .gch-h-quick-icons .gch-h-constellation-icon{width:46px;height:46px;flex-basis:46px;}
.gch-hybrid .gch-h-quick-icons img{width:46px;height:46px;}
.gch-hybrid .gch-h-quick-icons .gch-h-constellation-icon b{font-size:11px;min-width:22px;height:22px;}
}
@media (max-width:600px){
.gch-hybrid .gcc-material-chip{width:calc(33.333% - 12px);min-width:91px;min-height:132px;}
.gch-hybrid .gcc-material-chip img{width:76px;height:76px;}
.gch-hybrid .gcc-cost-items > span{width:calc(50% - 7px);max-width:190px;min-height:156px;}
.gch-hybrid .gcc-cost-items img{width:78px;height:78px;}
.gch-hybrid .gch-h-hero-art img{height:114%;}
}
@media (prefers-reduced-motion:reduce){
.gch-hybrid .gch-h-hero *,
  .gch-hybrid .gch-h-hero *::before,
  .gch-hybrid .gch-h-hero *::after{animation:none!important;transition:none!important;}
.gch-hybrid .gch-h-light-sweep,.gch-hybrid .gch-h-particles{display:none!important;}
}
.gch-hybrid{width:min(2900px, calc(100vw - clamp(24px, 3vw, 100px)));
  max-width:none;
  margin:22px 0 80px;
  left:50%;
  transform:translateX(-50%);}
.gch-h-fold{grid-template-columns:minmax(0, 1.8fr) minmax(360px, .82fr);min-height:675px;}
.gch-h-hero{min-height:675px;}
.gch-hybrid .gch-h-hero::before{background:transparent!important;}
.gch-hybrid .gch-h-hero{background:rgba(20,36,63,.10);}
.gch-h-hero .gch-h-titleblock{position:absolute!important;
  bottom:clamp(174px, 13vw, 226px);
  left:clamp(18px, 2vw, 42px);
  right:34px;
  max-width:min(520px, calc(100% - 82px));
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:9px;}
.gch-h-title-card{width:clamp(88px, 8.4vw, 142px);
  height:clamp(98px, 9.4vw, 148px);
  object-fit:contain;
  background:transparent;
  border:0;
  box-shadow:none;}
.gch-h-titleblock h1{font-size:clamp(48px, 5vw, 108px);}
.gch-hybrid .gcc-card-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
.gch-hybrid .gcc-feature-materials{grid-column:auto;}
.gch-h-section-bar{justify-content:flex-start;}
.gch-hybrid .gch-h-hero-art img{pointer-events:none;}
.gch-h-hero .gch-h-element-energy,
.gch-h-hero .gch-h-element-flares{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2;}
.gch-h-hero .gch-h-element-flares{z-index:5;}
.gch-h-element-energy i,.gch-h-element-flares i{position:absolute;display:block;pointer-events:none;}
.gch-h-element-energy i{width:clamp(95px,12vw,230px);height:clamp(95px,12vw,230px);
  left:var(--gch-left,20%);top:var(--gch-top,25%);
  border:2px solid var(--gcc-element);border-radius:50%;opacity:0;
  box-shadow:0 0 16px var(--gcc-element),inset 0 0 11px var(--gcc-element);
  animation:gch-h-energy-pulse 9s ease-out infinite;
  animation-delay:var(--gch-delay,0s);}
.gch-h-element-energy i:nth-child(1){--gch-left:15%;--gch-top:12%;--gch-delay:-1s;}
.gch-h-element-energy i:nth-child(2){--gch-left:62%;--gch-top:36%;--gch-delay:-4s;transform:scale(.8);}
.gch-h-element-energy i:nth-child(3){--gch-left:35%;--gch-top:54%;--gch-delay:-7s;transform:scale(.6);}
.gch-h-element-flares i{width:clamp(45px,8vw,140px);height:2px;
  left:var(--gch-flare-x,12%);top:var(--gch-flare-y,28%);
  background:linear-gradient(90deg,transparent,var(--gcc-element),#fff,transparent);
  opacity:0;filter:drop-shadow(0 0 5px var(--gcc-element));
  animation:gch-h-flare-drift 8s ease-in-out infinite;
  animation-delay:var(--gch-delay,0s);}
.gch-h-element-flares i:nth-child(1){--gch-flare-x:12%;--gch-flare-y:26%;--gch-delay:-2s;}
.gch-h-element-flares i:nth-child(2){--gch-flare-x:67%;--gch-flare-y:57%;--gch-delay:-5s;}
.gch-h-element-flares i:nth-child(3){--gch-flare-x:29%;--gch-flare-y:72%;--gch-delay:-7s;}
@keyframes gch-h-energy-pulse{
  0%,100%{opacity:0;scale:.64;} 20%{opacity:.28;} 63%{opacity:.10;} 80%{opacity:0;scale:1.32;}
}
@keyframes gch-h-flare-drift{
  0%,10%,100%{opacity:0;transform:translate3d(-15px,10px,0) rotate(-25deg)}
  28%{opacity:.52}58%{opacity:0;transform:translate3d(60px,-18px,0) rotate(-25deg)}
}
.gch-hybrid[data-comic-element="hydro"] .gch-h-particles i{background:radial-gradient(circle at 30% 25%,#fff 0 20%,#80eeff 24% 38%,transparent 65%);
  border:1px solid #8deaff;box-shadow:0 0 10px #1eb2ff;
  width:8px;height:8px;}
.gch-hybrid[data-comic-element="hydro"] .gch-h-element-energy i{border:3px double #b1efff;box-shadow:0 0 15px #4dc8ff;}
.gch-hybrid[data-comic-element="pyro"] .gch-h-particles i{border-radius:60% 0 60% 35%;background:linear-gradient(25deg,#ff7c26,#fff0b1);
  transform:rotate(25deg);box-shadow:0 0 12px #ff6e17;}
.gch-hybrid[data-comic-element="pyro"] .gch-h-element-energy i{border-style:dashed;border-color:#ffc84d;}
.gch-hybrid[data-comic-element="electro"] .gch-h-particles i{border-radius:0;clip-path:polygon(52% 0,100% 0,59% 43%,85% 43%,20% 100%,41% 49%,13% 49%);
  width:15px;height:18px;background:#e7caff;box-shadow:none;filter:drop-shadow(0 0 5px #b378ff);}
.gch-hybrid[data-comic-element="electro"] .gch-h-element-energy i{border:3px dashed #ad86ff;border-radius:20%;}
.gch-hybrid[data-comic-element="electro"] .gch-h-element-flares i{height:4px;transform:rotate(-40deg);}
.gch-hybrid[data-comic-element="cryo"] .gch-h-particles i{border-radius:0;clip-path:polygon(47% 0,53% 0,54% 37%,82% 17%,86% 23%,60% 45%,100% 47%,100% 53%,60% 55%,86% 77%,82% 83%,54% 63%,53% 100%,47% 100%,46% 63%,18% 83%,14% 77%,40% 55%,0 53%,0 47%,40% 45%,14% 23%,18% 17%,46% 37%);
  background:#ecffff;width:16px;height:16px;box-shadow:none;
  animation-name:gch-h-snowfall;}
@keyframes gch-h-snowfall{0%{opacity:0;translate:0 -500px;rotate:0deg}20%{opacity:.75}85%{opacity:.52}100%{opacity:0;translate:70px 80px;rotate:180deg}}
.gch-hybrid[data-comic-element="anemo"] .gch-h-particles i{background:#b0ffe6;border-radius:90% 0 90% 0;width:16px;height:8px;
  animation-name:gch-h-anemo-float;}
@keyframes gch-h-anemo-float{0%{translate:-200px 0;rotate:0deg;opacity:0}25%{opacity:.8}85%{opacity:.35}100%{translate:450px -210px;rotate:360deg;opacity:0}}
.gch-hybrid[data-comic-element="anemo"] .gch-h-element-energy i{border-color:rgba(122,246,212,.68);border-width:2px 0 2px 0;}
.gch-hybrid[data-comic-element="dendro"] .gch-h-particles i{border-radius:100% 0 100% 0;background:#a9eb75;width:13px;height:19px;
  animation-name:gch-h-dendro-fall;}
@keyframes gch-h-dendro-fall{0%{opacity:0;translate:0 -550px;rotate:-80deg}20%{opacity:.7}80%{opacity:.38}100%{opacity:0;translate:75px 30px;rotate:260deg}}
.gch-hybrid[data-comic-element="geo"] .gch-h-particles i{border-radius:0;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
  background:#ffe9a3;width:11px;height:14px;}
.gch-hybrid[data-comic-element="geo"] .gch-h-element-energy i{border:4px solid #eac875;border-radius:17%;rotate:45deg;}
@media (min-width:1900px){
.gch-h-fold{grid-template-columns:minmax(0, 1.76fr) minmax(450px, .82fr);}
.gch-h-hero{min-height:720px;}
.gch-h-identity-head{padding:20px 24px;}
.gch-h-facts{padding:0 24px;gap:0 28px;}
.gch-h-facts dd{font-size:16px;}
.gch-h-facts dt{font-size:12px;}
}
@media (max-width:1150px){
.gch-h-fold{grid-template-columns:minmax(0,1.35fr) minmax(300px,.83fr);}
.gch-h-hero{min-height:600px;}
.gch-hybrid .gcc-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.gch-hybrid .gcc-feature-materials{grid-column:1/-1;}
}
@media (max-width:900px){
.gch-h-fold{grid-template-columns:1fr;}
.gch-h-hero{min-height:565px;}
.gch-h-hero .gch-h-titleblock{bottom:185px;}
}
@media (max-width:710px){
.gch-hybrid{width:calc(100vw - 24px);}
.gch-h-hero{min-height:515px;}
.gch-h-hero .gch-h-titleblock{bottom:164px;left:14px;right:15px;max-width:calc(100% - 28px);}
.gch-h-titleblock h1{font-size:clamp(36px,8vw,62px);}
.gch-h-title-card{width:78px;height:93px;}
.gch-hybrid .gcc-card-grid{grid-template-columns:1fr;}
.gch-hybrid .gcc-feature-materials{grid-column:auto;}
}
@media (max-width:470px){
.gch-h-hero{min-height:440px;}
.gch-h-hero .gch-h-titleblock{bottom:151px;}
.gch-h-title-card{width:62px;height:82px;}
.gch-h-hero .gch-h-motion-toggle{right:10px;bottom:158px;}
}
.gch-hybrid.is-motion-paused .gch-h-element-energy *,
.gch-hybrid.is-motion-paused .gch-h-element-flares *{animation-play-state:paused!important;}
@media (prefers-reduced-motion:reduce){
.gch-hybrid .gch-h-element-energy,.gch-hybrid .gch-h-element-flares{display:none!important;}
}
@media (max-width:710px){
.gch-h-hero .gch-h-titleblock{bottom:154px;max-width:calc(100% - 28px);gap:7px;}
}
@media (max-width:470px){
.gch-h-hero .gch-h-titleblock{bottom:145px;left:13px;right:13px;max-width:calc(100% - 26px);gap:6px;}
.gch-h-title-card{width:56px;height:74px;}
}
body.theme-comic-page .gch-h-viewport-wallpaper{position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  z-index: 0 !important;
  display: block !important;
  pointer-events: none !important;
  background-image:
    linear-gradient(110deg, rgba(11,21,42,.52), rgba(10,24,47,.25) 46%, rgba(11,21,42,.52)),
    var(--gch-h-wallpaper-image) !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  transform: none !important;
  filter: none !important;
  animation: none !important;}
body.theme-comic-page .gch-hybrid{position: relative !important;
  z-index: 1 !important;}
.gch-hybrid .gcc-filter-row{align-items:center;}
.gch-hybrid .gcc-filter{display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 31px;
  padding: 5px 8px;
  white-space: nowrap;
  background: #fff9ec;
  line-height: 1.15;
  color: var(--gcc-ink);}
.gch-hybrid .gcc-filter img{display:block;flex:0 0 22px;width:22px;height:22px;object-fit:contain;}
.gch-hybrid .gcc-filter:hover{background:#e6f4fa;}
.gch-hybrid .gcc-filter.is-active{background: var(--gcc-yellow);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.15), 2px 2px 0 var(--gcc-ink);}
@media (max-width:470px){
.gch-hybrid .gcc-filter{min-height:29px; padding:4px 6px; gap:4px;}
.gch-hybrid .gcc-filter img{width:19px; height:19px; flex-basis:19px;}
}

/* ===== recommendations ===== */
body.theme-comic-hybrid{--v7-ink:#14233d;}
body.theme-comic-hybrid .gch-hybrid{--gch-v7-lens:#fbd16b;}
.gch-hybrid .gch-h-hero{overflow:hidden;}
.gch-h-hero .gch-v7-tier{position:absolute!important;right:clamp(16px,2.6vw,48px);top:clamp(20px,2.1vw,45px);z-index:8!important;
  min-width:clamp(85px,8vw,138px);max-width:34%;padding:10px 13px 12px;text-align:center;
  transform:rotate(8deg);background:#fbd75f;border:4px solid #14223b;
  box-shadow:6px 7px 0 #14223b;color:#15243d;}
.gch-v7-tier-kicker{display:block;font-weight:900;font-size:clamp(10px,.68vw,13px);text-transform:uppercase;line-height:1.1;}
.gch-v7-tier strong{display:block;font-family:Impact,"Arial Black",sans-serif;font-size:clamp(49px,5.3vw,100px);line-height:1;}
.gch-v7-tier small{display:block;font-size:clamp(10px,.7vw,13px);font-weight:900;}
.gch-v7-tier.is-pending{background:#fff4cf;}
.gch-h-identity{display:flex;flex-direction:column;}
.gch-v7-identity-build{margin:auto 15px 14px;border:2px dashed #738498;border-left:6px solid var(--gcc-element);
  background:#fffaf0;padding:11px 13px;}
.gch-v7-identity-build-title{display:flex;gap:10px;align-items:center;text-transform:uppercase;font-size:14px;}
.gch-v7-identity-build-title img{width:27px;height:27px;object-fit:contain;}
.gch-v7-identity-build p{margin:5px 0!important;font-size:12px;line-height:1.45;}
.gch-v7-identity-chips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:12px;}
.gch-v7-identity-chips a{display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center;text-decoration:none;
  border:2px solid #14243d;box-shadow:2px 2px 0 #14243d;background:#fffdf8;padding:7px 4px;min-width:0;
  font-size:clamp(10px,.85vw,13px);font-weight:900;text-align:center;overflow-wrap:anywhere;}
.gch-v7-identity-chips a:hover{background:#d1f2ee;}
.gch-v7-identity-chips a img{width:29px;height:29px;object-fit:contain;}
.gch-hybrid .gch-v7-nav{position:sticky;top:6px;z-index:45;display:flex;align-items:center;gap:5px;
  overflow-x:auto;scrollbar-width:thin;padding:8px;
  background:rgba(22,35,61,.96);border:3px solid #0d192e;box-shadow:5px 5px 0 rgba(0,0,0,.45);
  margin:25px 0 22px;}
.gch-v7-nav :is(a,button){flex:0 0 auto;display:inline-flex;justify-content:center;align-items:center;
  color:#112037;background:#fff9e9;border:2px solid #06172c;border-radius:0;
  text-decoration:none;font-family:inherit;font-size:clamp(11px,.85vw,15px);
  font-weight:900;padding:9px 13px;min-height:38px;cursor:pointer;white-space:nowrap;}
.gch-v7-nav :is(a,button):hover,.gch-v7-nav :is(a,button):focus-visible{background:var(--gcc-element);}
.gch-v7-nav .is-selected{background:#fbd75f;}
.gch-v7-builds{scroll-margin-top:82px;margin-bottom:30px;}
.gch-hybrid .gch-h-fast{margin-top:25px;}
.gch-hybrid .gch-h-chapters{scroll-margin-top:84px;}
@media (max-width:470px){
.gch-h-hero .gch-v7-tier{top:62px;right:12px;padding:6px 8px;min-width:72px;border-width:3px;}
.gch-v7-tier strong{font-size:48px;}
.gch-v7-tier-kicker{font-size:9px;}
.gch-v7-nav :is(a,button){font-size:11px;padding:7px 9px;}
.gch-v7-builds{scroll-margin-top:76px;}
}
@media (prefers-reduced-motion:reduce){
.gch-v7-nav :is(a,button){scroll-behavior:auto;}
}

/* V8: no theme switch or legacy cover. Keep the V6 fixed background layer. */
.gch-hybrid .gch-h-topline{justify-content:flex-start;}
.gch-hybrid .gcc-current-crumb{margin-left:auto;}
@media(max-width:650px){.gch-hybrid .gcc-current-crumb{margin-left:0;}}

/* Comic Hybrid recommendations: real catalog data, editorial publication only. */
.gch-hybrid .gch-rec {scroll-margin-top:84px;}
.gch-rec-heading{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px;margin:25px 0 20px;}
.gch-rec-heading h2{color:#fff;font-size:clamp(27px,2.45vw,45px);line-height:1.03!important;text-transform:uppercase;text-shadow:3px 3px 0 #132340;}
.gch-rec-heading .gch-v7-label{display:inline-block;background:#f9d15d;border:2px solid #132440;color:#182640;font-size:11px;font-weight:900;padding:4px 9px;text-transform:uppercase;}
.gch-rec-count {display:inline-flex;align-items:center;border:3px solid #182640;background:#e5faf2;box-shadow:3px 3px 0 #182640;padding:8px 13px;color:#182640;font-size:12px;font-weight:1000;}
.gch-rec-switch{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));gap:14px;margin:0 0 22px;}
.gch-rec-switch-button{appearance:none;display:flex;gap:13px;align-items:center;text-align:left;background:#fff6e2;border:4px solid #182640;box-shadow:5px 5px 0 #182640;color:#182640;cursor:pointer;padding:12px 15px;min-width:0;font-family:inherit;transition:transform .15s,background .15s;}
.gch-rec-switch-button:is(:hover,:focus-visible){background:#e9f9f7;transform:translateY(-2px);}
.gch-rec-switch-button:focus-visible {outline:3px solid #2783fa;outline-offset:7px;}
.gch-rec-switch-button.is-active{background:#ffd66e;}
.gch-rec-switch-index{align-self:stretch;display:grid;place-items:center;width:43px;flex:0 0 43px;background:#192842;color:#fff;font-weight:1000;font-size:21px;transform:rotate(-3deg);}
.gch-rec-switch-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px;}
.gch-rec-switch-text strong{font-size:clamp(14px,1.1vw,18px);line-height:1.18;overflow-wrap:anywhere;}
.gch-rec-switch-text small{font-size:11px;font-weight:900;opacity:.75;}
.gch-rec-switch-arrow{font-weight:1000;font-size:25px;}
.gch-hybrid .gch-rec-panel[hidden]{display:none!important;}
.gch-rec-panel{margin-bottom:25px;}
.gch-rec-panel+.gch-rec-panel {margin-top:24px;}
.gch-rec-panel-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;padding:3px 0 14px;color:#fff;text-shadow:2px 2px 0 #142443;}
.gch-rec-eyebrow{font-size:11px;letter-spacing:.11em;font-weight:1000;text-transform:uppercase;color:#ffde77;}
.gch-rec-panel-heading h3{margin:4px 0 0;font-size:clamp(22px,2vw,32px);line-height:1.12;font-weight:1000;}
.gch-rec-version{background:#192842;border:2px solid #f4f6ff;box-shadow:2px 2px 0 #192842;padding:5px 9px;font-weight:900;font-size:11px;color:#fff;white-space:nowrap;text-shadow:none;}
.gch-rec-equipment{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:19px;margin-bottom:19px;}
.gch-rec-card{min-width:0;background:#fff9ed;color:#192842;border:5px solid #192842;box-shadow:7px 7px 0 #192842;display:flex;flex-direction:column;scroll-margin-top:100px;}
.gch-rec-card-heading{display:flex;align-items:center;gap:13px;padding:13px 15px;border-bottom:4px solid #192842;background:#a9e5d1;}
.gch-rec-card--weapons .gch-rec-card-heading{background:#9fdaf3;}
.gch-rec-card--teams .gch-rec-card-heading{background:#e8c6ef;}
.gch-rec-card-heading>img{width:45px;height:45px;flex:0 0 45px;object-fit:contain;}
.gch-rec-card-heading>div{min-width:0;flex:1;}
.gch-rec-card-heading>div>span{display:block;font-size:10px;letter-spacing:.09em;text-transform:uppercase;font-weight:1000;}
.gch-rec-card-heading h4{font-size:clamp(20px,1.65vw,29px);font-weight:1000;line-height:1.1;text-transform:uppercase;margin:0;}
.gch-rec-total{font-size:17px;font-weight:1000;color:#fff;background:#192842;padding:4px 9px;min-width:36px;text-align:center;}
.gch-rec-card-content{flex:1;padding:14px;background-image:var(--gch-h-dots);background-size:190px 190px;}
.gch-rec-artifact-list,.gch-rec-weapon-list{list-style:none;margin:0;padding:0;}
.gch-rec-artifact-choice{display:flex;gap:13px;align-items:center;padding:9px 2px;min-width:0;}
.gch-rec-artifact-choice+.gch-rec-artifact-choice{border-top:2px dashed #b4b9bf;}
.gch-rec-order{align-self:flex-start;flex:0 0 auto;background:#ffe8a4;border:2px solid #192842;display:inline-grid;place-items:center;width:36px;height:34px;font-size:13px;font-weight:1000;}
.gch-rec-artifact-sets{display:flex;gap:13px;flex-wrap:wrap;flex:1;min-width:0;}
.gch-rec-artifact-set{display:flex;align-items:center;gap:10px;min-width:0;flex:1 1 190px;}
.gch-rec-artifact-set strong{font-size:14px;line-height:1.25;overflow-wrap:anywhere;}
.gch-rec-artifact-image,.gch-rec-weapon-image{flex:0 0 65px;width:65px;height:65px;border:2px solid #192842;background:#fff;display:grid;place-items:center;position:relative;}
.gch-rec-artifact-image img,.gch-rec-weapon-image img{width:100%;height:100%;object-fit:contain;}
.gch-rec-piece-count{position:absolute;bottom:-5px;right:-4px;padding:0 5px;background:#ffd66e;border:2px solid #192842;font-size:12px;font-weight:1000;}
.gch-rec-weapon{display:flex;align-items:center;gap:12px;min-width:0;padding:7px 2px;}
.gch-rec-weapon+.gch-rec-weapon{border-top:2px dashed #b4b9bf;}
.gch-rec-weapon>.gch-rec-order{align-self:center;}
.gch-rec-weapon strong{flex:1;min-width:0;font-size:14px;line-height:1.25;overflow-wrap:anywhere;}
.gch-rec-chip{display:inline-flex;max-width:100%;align-items:center;border:2px solid #192842;background:#d3f4e0;color:#192842;padding:3px 8px;font-size:10px;font-weight:1000;line-height:1.3;text-transform:uppercase;white-space:normal;}
.gch-rec-chip--high{background:#ffdfa6;}
.gch-rec-card--teams .gch-rec-card-content{padding:16px;}
.gch-rec-team-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;}
.gch-rec-team{min-width:0;background:#fffefa;border:3px solid #192842;box-shadow:4px 4px 0 #192842;padding:13px;}
.gch-rec-team-heading{min-height:25px;display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px;flex-wrap:wrap;}
.gch-rec-team-heading>span:first-child{font-size:12px;letter-spacing:.04em;text-transform:uppercase;font-weight:1000;}
.gch-rec-team-members{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
.gch-rec-member{display:flex;flex-direction:column;gap:6px;min-width:0;text-align:center;text-decoration:none!important;color:#192842!important;}
.gch-rec-member-portrait{display:grid;place-items:center;aspect-ratio:1;overflow:hidden;border:2px solid #192842;background:#fff;transition:background .15s,transform .15s;}
.gch-rec-member.is-current .gch-rec-member-portrait{background:#bbf0e9;border-color:#17668c;box-shadow:0 0 0 2px #d3f4f6;}
.gch-rec-member:hover .gch-rec-member-portrait,.gch-rec-member:focus-visible .gch-rec-member-portrait{background:#ffe9a4;transform:translateY(-2px);}
.gch-rec-member:focus-visible{outline:3px solid #2783fa;outline-offset:3px;}
.gch-rec-member-portrait img{width:100%;height:100%;object-fit:contain;}
.gch-rec-member-name{font-size:clamp(10px,.88vw,13px);line-height:1.25;font-weight:900;overflow-wrap:anywhere;}
.gch-rec-bosses{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:13px;padding-top:10px;border-top:2px dashed #cad1d8;}
.gch-rec-bosses>strong{font-size:11px;}
.gch-rec-boss{display:inline-flex;align-items:center;gap:6px;max-width:100%;background:#fff;border:2px solid #192842;padding:3px 6px;font-size:11px;font-weight:900;}
.gch-rec-boss img{width:32px;height:32px;object-fit:contain;}
.gch-rec-guides{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;padding-top:11px;border-top:2px dashed #cad1d8;}
.gch-rec-guides a{display:inline-flex;align-items:center;gap:6px;background:#e6f0ff;border:2px solid #192842;color:#154779!important;padding:5px 9px;font-size:11px;font-weight:900;text-decoration:none!important;overflow-wrap:anywhere;}
.gch-rec-guides a:hover{background:#ffe6a1;}
.gch-rec-tier-source{margin:16px 0 0;font-size:12px;font-weight:900;color:#fff;text-shadow:1px 1px 0 #192842;}
.gch-rec-tier-source a{color:#fff1a9!important;text-decoration:underline;font-weight:1000;}
.gch-rec-not-published{display:flex;align-items:center;justify-content:center;gap:18px;background:#fff9ed;border:4px solid #192842;box-shadow:6px 6px 0 #192842;padding:25px;}
.gch-rec-not-published img{width:62px;height:62px;object-fit:contain;opacity:.75;}
.gch-rec-not-published p,.gch-rec-empty-entry{font-size:14px;line-height:1.4;font-weight:900;color:#526276;}
.gch-rec-empty-entry{padding:14px 0;margin:0;}
@media (max-width:1050px){
  .gch-rec-artifact-sets{gap:10px;}
  .gch-rec-artifact-set{flex-basis:165px;}
  .gch-rec-card-heading{gap:8px;padding:10px;}
  .gch-rec-card-heading>img{width:36px;height:36px;flex-basis:36px;}
  .gch-rec-team-grid{gap:11px;}
  .gch-rec-team{padding:10px;}
}
@media (max-width:850px){
  .gch-rec-equipment,.gch-rec-team-grid{grid-template-columns:1fr;}
  .gch-rec-member-name{font-size:12px;}
}
@media (max-width:470px){
  .gch-rec-switch{grid-template-columns:1fr;gap:11px;}
  .gch-rec-card{border-width:3px;box-shadow:4px 4px 0 #192842;}
  .gch-rec-card-content,.gch-rec-card--teams .gch-rec-card-content{padding:9px;}
  .gch-rec-card-heading h4{font-size:22px;}
  .gch-rec-artifact-image,.gch-rec-weapon-image{flex-basis:51px;width:51px;height:51px;}
  .gch-rec-artifact-set strong,.gch-rec-weapon strong{font-size:12px;}
  .gch-rec-order{width:27px;height:28px;font-size:11px;}
  .gch-rec-artifact-choice,.gch-rec-weapon{gap:8px;}
  .gch-rec-team-members{gap:5px;}
  .gch-rec-member-name{font-size:10px;}
  .gch-rec-team{padding:8px;box-shadow:2px 2px 0 #192842;}
}
@media (prefers-reduced-motion:reduce){
  .gch-rec-switch-button,.gch-rec-member-portrait{transition:none;}
  .gch-rec-switch-button:is(:hover,:focus-visible),.gch-rec-member:hover .gch-rec-member-portrait{transform:none;}
}

/* V13: independent team directory with cumulative per-member roles. */
.gch-rec > .gch-rec-card--teams{margin-top:22px;}
.gch-rec-member-roles{display:flex;gap:4px;flex-wrap:wrap;justify-content:center;align-items:flex-start;}
.gch-rec-role{display:inline-flex;align-items:center;justify-content:center;padding:3px 5px;
  border:1px solid #1b344c;background:#e2f8ef;border-radius:5px;font-size:10px;
  font-weight:900;line-height:1.18;color:#17344c;overflow-wrap:anywhere;text-align:center;}
@media(max-width:470px){.gch-rec-role{font-size:9px;padding:2px 3px;}}

/* V14: team-only character recommendations, no empty equipment/build navigation. */
.gch-rec--teams-only > .gch-rec-card--teams{margin-top:0;}
.gch-rec--teams-only .gch-rec-team-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
.gch-rec--teams-only .gch-rec-team{padding:16px 18px;}
.gch-rec--teams-only .gch-rec-member-roles{max-width:100%;}
@media(max-width:470px){.gch-rec--teams-only .gch-rec-team{padding:9px;}}

/* V15: progression panels are permanent page sections, never hidden in JS tabs. */
.gch-hybrid a.gch-h-fast-card{color:var(--gcc-ink);text-decoration:none;}
.gch-hybrid a.gch-h-fast-card:focus-visible{outline:4px solid var(--gcc-yellow);outline-offset:5px;}
.gch-hybrid .gch-h-data-chapter{scroll-margin-top:92px;}
.gch-hybrid .gch-h-data-chapter + .gch-h-data-chapter{margin-top:32px;padding-top:27px;border-top:3px dashed rgba(20,35,61,.4);}
.gch-hybrid .gch-h-data-heading{display:flex;align-items:center;min-height:66px;gap:15px;margin:0 0 19px;
  border:4px solid var(--gcc-ink);background:var(--gcc-blue);box-shadow:5px 5px 0 var(--gcc-ink);
  padding:13px 18px;font-size:clamp(22px,2vw,32px);font-weight:1000;text-transform:uppercase;color:var(--gcc-ink);}
.gch-hybrid .gch-h-data-heading::before{content:"✦";display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;
  font-size:21px;background:#fff;border:3px solid var(--gcc-ink);transform:rotate(-5deg);}
.gch-hybrid .gch-h-data-heading--constellations{background:#ebc9f7;}
.gch-hybrid .gch-h-data-heading--ascension{background:#8bdfc1;}
.gch-hybrid .gch-h-data-chapter .gcc-cost-card{margin-top:24px;}
@media(max-width:710px){
  .gch-hybrid .gch-h-data-heading{padding:10px 12px;font-size:22px;}
  .gch-hybrid .gch-h-data-heading::before{width:31px;height:31px;flex-basis:31px;font-size:18px;}
  .gch-hybrid .gch-h-data-chapter + .gch-h-data-chapter{margin-top:22px;padding-top:22px;}
}

/* V17: two team cards and two talent-material level cards per desktop row. */
.gch-hybrid .gcc-cost-level-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:22px;}
.gch-hybrid .gcc-cost-level-grid>.gcc-cost-level{margin:0;min-width:0;padding:15px 12px 18px;border:2px solid var(--gcc-ink);background:#fffdf5;}
.gch-hybrid .gcc-cost-level-grid .gcc-cost-items{gap:8px;}
.gch-hybrid .gcc-cost-level-grid .gcc-cost-items>span{width:calc(25% - 6px);max-width:none;min-width:75px;padding:9px 4px;}
.gch-hybrid .gcc-cost-level-grid .gcc-cost-items img{width:min(100%,65px);height:65px;}
.gch-hybrid .gcc-cost-level-grid .gcc-cost-items small{font-size:12px;}
@media(max-width:850px){
  .gch-rec--teams-only .gch-rec-team-grid{grid-template-columns:1fr;}
  .gch-hybrid .gcc-cost-level-grid{grid-template-columns:1fr;}
}
@media(max-width:470px){
  .gch-hybrid .gcc-cost-level-grid{gap:12px;}
  .gch-hybrid .gcc-cost-level-grid>.gcc-cost-level{padding:11px 8px;}
  .gch-hybrid .gcc-cost-level-grid .gcc-cost-items>span{width:calc(50% - 5px);max-width:none;min-width:0;}
}

/* V18: immediate top-of-page chapter navigation. It remains sticky while scrolling. */
.gch-hybrid .gch-v7-nav{margin:2px 0 20px;top:8px;}

/* V18: keep the character name intact, even when it extends beyond the illustration. */
.gch-hybrid .gch-h-hero{overflow:visible;z-index:3;}
.gch-hybrid .gch-h-side{position:relative;z-index:1;}
.gch-h-hero .gch-h-titleblock{bottom:clamp(22px,2.5vw,42px);}
.gch-h-titleblock h1{
  width:max-content;max-width:none;white-space:nowrap;
  overflow-wrap:normal;word-break:normal;hyphens:none;
  font-size:clamp(43px,4.65vw,96px);
  pointer-events:none;
}
/* No opaque tile, border or frame behind the character card. */
.gch-hybrid .gch-h-title-card{background:transparent;border:0;box-shadow:none;}
/* Comic subtitle stamp rather than unframed text. */
.gch-hybrid .gch-h-titleblock .gch-h-subtitle{
  display:inline-block;width:auto;max-width:min(520px,90vw);
  margin:4px 0 0!important;padding:6px 12px;
  background:#fff9e9;border:3px solid var(--gcc-ink);
  box-shadow:4px 4px 0 var(--gcc-element);
  color:#14233d;text-shadow:none;font-weight:900;
  font-size:clamp(13px,1.12vw,18px);line-height:1.3;
  transform:rotate(-1deg);overflow-wrap:anywhere;
}
/* Portrait description now lives directly below the image in the information panel. */
.gch-hybrid .gch-h-identity-description{
  margin:3px 16px 15px!important;padding:11px 13px;
  max-height:none;overflow:visible;
  font-size:clamp(12px,.92vw,15px);line-height:1.5;
  background:#fffdfa;border:2px solid var(--gcc-ink);
  border-left:6px solid var(--gcc-element);
  box-shadow:3px 3px 0 rgba(23,35,62,.18);
}
@media(max-width:900px){
  .gch-h-titleblock h1{font-size:clamp(31px,5.9vw,55px);letter-spacing:-.01em;}
}
@media(max-width:470px){
  .gch-h-hero .gch-h-titleblock{bottom:20px;left:13px;right:auto;max-width:none;}
  .gch-h-titleblock h1{font-size:clamp(24px,5.75vw,31px);letter-spacing:-.025em;}
  .gch-hybrid .gch-h-titleblock .gch-h-subtitle{font-size:12px;padding:4px 8px;max-width:calc(100vw - 58px);}
  .gch-hybrid .gch-v7-nav{margin-bottom:15px;}
}