/* ComixWire 1.3 — shared, responsive visual design; works with the 1.2 templates.
   No external fonts, icon fonts, CSS frameworks, trackers or inline JS. */
:root {
 --cw-surface: #091e32;
 --cw-surface-strong: #0b283f;
 --cw-border: #285573;
 --cw-border-active: #45a7de;
 --cw-radius: 9px;
 --cw-headline: #f7fbff;
}
/* Consistent hierarchy and panel styling on the directory, series and episode pages. */
.cw-directory-header,.cw-show-block,.cw-episode-section,.cw-info-panel,
.cw-show-empty,.cw-episode-back {
 border-radius:var(--cw-radius);
 border-color:var(--cw-border);
 background-color:var(--cw-surface);
}
.cw-directory-header,.cw-show-cover,.cw-episode-masthead {
 background-color:#081c2e;
 border-bottom:1px solid #215071;
}
.cw-directory-header {
 background-image:linear-gradient(100deg,#07192b 4%,#0c334e 75%,#0d2740);
}
.cw-universe-dc .cw-directory-header {
 background-image:linear-gradient(100deg,#07192b 4%,#0b426a 75%,#0b2540);
}
.cw-universe-marvel .cw-directory-header {
 background-image:linear-gradient(100deg,#07192b 4%,#472039 75%,#0b2540);
}
.cw-directory-header h1,.cw-show-summary h1,.cw-episode-v2-intro h1,
.cw-episode-showname {
 font-family:Arial,Helvetica,sans-serif;
 font-weight:900;
 font-style:italic;
 letter-spacing:-.035em;
 color:var(--cw-headline);
}
.cw-bar-title {font-family:Arial,Helvetica,sans-serif;font-size:clamp(17px,1.55vw,22px);font-weight:900}
.cw-show-block,.cw-episode-section,.cw-info-panel {
 background:linear-gradient(145deg,#0c253b,#091d30);
 box-shadow:inset 0 1px #ffffff08;
}
.cw-info-panel .cw-bar-title {font-size:17px}
.cw-directory-card,.cw-home-card,.cw-home-episode-card {border-radius:var(--cw-radius)}
.cw-show-cover:before {background:linear-gradient(90deg,#061628fa 0%,#071c30e8 48%,#06172a65 100%)}
.cw-episode-masthead:after {background:linear-gradient(90deg,#061628f7,#061b30cb 46%,#07182999),linear-gradient(0deg,#061628aa,transparent)}
.cw-episode-masthead {height:156px}
.cw-show-layout,.cw-episode-v2-layout {padding-bottom:32px}
/* A NEW image-generation render, not reused or resized from previous ComixWire versions.
   Display the hero artwork at near-native pixel size and keep all text as real HTML. */
.cw-home-masthead {
 min-height:285px;
 height:285px;
 background:linear-gradient(90deg,#041426 0%,#09284b 55%,#4b1934 100%);
 border-bottom:1px solid #23476a;
}
.cw-home-masthead:before {
 background:linear-gradient(90deg,#041426 0%,#041426f6 12%,#041426ed 25%,#04142666 34%,transparent 47%),
 linear-gradient(0deg,#061526aa 0%,transparent 22%);
 z-index:1;
}
.cw-home-art {overflow:hidden}
.cw-home-art img {
 position:absolute;
 top:22px;
 right:0;
 -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 16%);
 mask-image:linear-gradient(90deg,transparent 0%,#000 16%);
 width:1112px;
 height:244px;
 max-width:none;
 object-fit:fill;
}
.cw-home-masthead:after {content:"";position:absolute;inset:auto 0 0;height:34px;background:linear-gradient(transparent,#061526b8);pointer-events:none;z-index:1}
.cw-home-intro {padding-top:29px;padding-bottom:16px}
.cw-home-intro h1 {font-size:clamp(45px,4.1vw,66px);line-height:.97;margin:14px 0 12px;letter-spacing:-.04em}
.cw-home-intro p {max-width:410px;font-size:14px;line-height:1.65}
.cw-home-content {padding-bottom:52px}
/* The approved composition: featured story on the left, four upright shortcut tiles on the right. */
.cw-home-showcase {
 display:grid;
 grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);
 align-items:stretch;
 gap:16px;
 position:relative;
 z-index:3;
 margin-top:-15px;
}
.cw-home-showcase-no-featured {grid-template-columns:1fr}
.cw-home-showcase-no-featured .cw-quick-links{grid-template-columns:repeat(4,minmax(0,1fr))}
.cw-home-showcase .cw-featured {
 margin:0;
 max-width:none;
 min-height:209px;
 height:100%;
 grid-template-columns:43% minmax(0,1fr);
 border:1px solid #3396c2;
 border-left:3px solid #f23757;
 background:linear-gradient(125deg,#092a46,#081d32 67%,#082239);
 border-radius:var(--cw-radius);
 box-shadow:0 12px 28px #0005;
}
.cw-home-showcase .cw-featured-art {min-height:209px}
.cw-home-showcase .cw-featured-art:after {background:linear-gradient(90deg,transparent 82%,#0a2032a0)}
.cw-home-showcase .cw-featured-art img {object-position:center 40%}
.cw-home-showcase .cw-featured-copy {padding:18px 19px 16px;gap:6px}
.cw-home-showcase .cw-featured-copy h2 {font-style:italic;font-size:clamp(21px,2vw,31px);line-height:1.08;letter-spacing:-.035em;margin:0}
.cw-home-showcase .cw-featured-copy>p {font-size:12px;line-height:1.55;margin:0 0 auto;color:#d5e6f4;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cw-home-showcase .cw-featured-bottom {display:flex;align-items:flex-end;gap:8px;flex-wrap:wrap;margin-top:6px}
.cw-home-showcase .cw-featured-metadata {display:flex;gap:5px;align-items:center;flex-wrap:wrap}
.cw-home-showcase .cw-featured .btn {font-size:11px;padding:9px 11px;white-space:nowrap}
.cw-home-explore {display:block;margin:0;min-width:0}
.cw-quick-links {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;height:100%}
.cw-quick-link,.cw-quick-link.cw-quick-dc,.cw-quick-link.cw-quick-marvel {
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:space-between;
 gap:8px;
 min-height:209px;
 border-radius:var(--cw-radius);
 border:1px solid #38769e;
 padding:16px 9px 12px;
 text-align:center;
 color:#f4faff;
 background:linear-gradient(155deg,#0d2b44,#071a2c 77%);
 box-shadow:inset 0 1px #ffffff1a,0 9px 19px #0004;
 text-decoration:none;
}
.cw-quick-link.cw-quick-dc {border-color:#078fdb;background:linear-gradient(155deg,#104d7a,#071b30 80%)}
.cw-quick-link.cw-quick-marvel {border-color:#e02b50;background:linear-gradient(155deg,#5f1831,#11172b 80%)}
.cw-quick-link>svg:first-child {flex:0 0 auto;color:#eff7ff;width:34px;height:34px;stroke-width:1.7}
.cw-quick-link.cw-quick-dc>svg:first-child {color:#51bdff}
.cw-quick-link.cw-quick-marvel>svg:first-child {color:#ff617b}
.cw-quick-link>strong {font-style:normal;font-size:11px;line-height:1.25;font-weight:900;flex:0 0 auto;min-height:28px;display:flex;align-items:center;justify-content:center}
.cw-quick-link>span {font-size:10px;line-height:1.4;color:#bdd3e5;flex:1;max-width:130px}
.cw-quick-link>svg:last-child {flex:0 0 auto;color:#f2f7ff;width:19px;height:19px}
.cw-quick-link:hover,.cw-quick-link:focus-visible {border-color:#8cdbff;transform:translateY(-2px);background-color:#173955}
.cw-home-latest,.cw-home-episodes {margin-top:23px}
.cw-home-section-heading {margin-bottom:13px}
/* Prevent narrow or zoomed windows from compressing four destination tiles into tiny text. */
@media(max-width:1260px){
 .cw-home-showcase {grid-template-columns:minmax(0,1fr);gap:12px}
 .cw-home-showcase-no-featured {grid-template-columns:1fr}
.cw-home-showcase-no-featured .cw-quick-links{grid-template-columns:repeat(4,minmax(0,1fr))}
.cw-home-showcase .cw-featured {min-height:193px}
 .cw-home-showcase .cw-featured-art {min-height:193px}
 .cw-home-showcase .cw-quick-links {grid-template-columns:repeat(4,minmax(0,1fr))}
 .cw-home-showcase .cw-quick-link {min-height:117px;padding:13px 9px}
 .cw-quick-link>strong {min-height:0}
 .cw-quick-link>span {max-width:none}
}
@media(max-width:800px){
 .cw-home-masthead {height:250px;min-height:250px}
 .cw-home-art img {right:-220px}
 .cw-home-masthead:before {background:linear-gradient(90deg,#041426 0%,#041426ed 18%,#041426bd 37%,transparent 76%),linear-gradient(0deg,#061526b0,transparent 24%)}
 .cw-home-intro {padding-top:30px}
 .cw-home-intro h1 {font-size:clamp(38px,7vw,57px)}
 .cw-home-intro p {max-width:350px;font-size:12px}
}
@media(max-width:560px){
 .cw-home-masthead {height:245px;min-height:245px}
 .cw-home-art img {right:-440px;top:0}
 .cw-home-masthead:before {background:linear-gradient(90deg,#041426f9 0%,#041426ee 42%,#04142655 90%)}
 .cw-home-intro h1 {font-size:clamp(36px,10vw,44px);letter-spacing:-1.8px}
 .cw-home-intro p {max-width:286px;font-size:12px}
 .cw-home-showcase {margin-top:-9px}
 .cw-home-showcase-no-featured {grid-template-columns:1fr}
.cw-home-showcase-no-featured .cw-quick-links{grid-template-columns:repeat(4,minmax(0,1fr))}
.cw-home-showcase .cw-featured {grid-template-columns:40% minmax(0,1fr);min-height:174px}
 .cw-home-showcase .cw-featured-art {min-height:174px}
 .cw-home-showcase .cw-featured-copy {padding:12px 10px 10px;gap:5px}
 .cw-home-showcase .cw-featured-copy h2 {font-size:19px}
 .cw-home-showcase .cw-featured-copy>p {-webkit-line-clamp:2;font-size:10px}
 .cw-home-showcase .cw-featured .btn {padding:7px 8px;font-size:9px}
 .cw-home-showcase .cw-featured-metadata {gap:4px}
 .cw-home-showcase .cw-quick-links {grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 .cw-home-showcase .cw-quick-link {min-height:123px}
 .cw-quick-link>svg:first-child {width:30px;height:30px}
 .cw-quick-link>strong {font-size:11px}
 .cw-quick-link>span {font-size:10px}
 .cw-home-episodes,.cw-home-latest {margin-top:23px}
}
@media(prefers-reduced-motion:reduce){.cw-quick-link:hover{transform:none}}
