@import url("https://fonts.googleapis.com/css2?family=Anton&family=Barlow+Condensed:wght@500;600;700&family=Barlow:wght@400;500;600&family=JetBrains+Mono:wght@400;700&display=swap");
:root{--void:#050505;--ink-900:#0A0A0A;--ink-800:#121212;--ink-700:#1A1A1A;--ink-600:#242424;--ink-400:#4D4D4D;--ink-300:#7A7A7A;--ink-100:#D4D2CF;--bone:#F2F0EC;--red-600:#E2231A;--red-500:#FF3B2E;--ember:#FF6A1A;--signal:#FFD400;--line:rgba(255,255,255,.10);--line-2:rgba(255,255,255,.24);--font-display:"Anton","Arial Narrow",sans-serif;--font-cond:"Barlow Condensed","Arial Narrow",sans-serif;--font-sans:"Barlow","Helvetica Neue",sans-serif;--font-mono:"JetBrains Mono",ui-monospace,monospace;--ease:cubic-bezier(.16,1,.3,1);--page:1280px;--cw:min(1280px,100vw);--edge:calc((100vw - min(1280px,100vw)) / 2 + 40px);--shear:-7deg}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink-900);color:var(--ink-100);font-family:var(--font-sans);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:var(--red-500);text-decoration:none}
a:hover{color:var(--red-400,#FF6B60)}
.wrap{max-width:var(--page);margin:0 auto;padding:0 40px}
.eyebrow{font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--red-500)}
.rule{height:3px;width:64px;background:linear-gradient(90deg,var(--red-600) 0 33%,var(--ember) 33% 66%,var(--signal) 66% 100%);margin:14px 0 22px}
h2.dsp{font-family:var(--font-display);font-size:clamp(38px,5.4vw,64px);line-height:.88;text-transform:uppercase;color:#fff;margin:0}
h2.dsp.stack{line-height:1.04}
.lead{font-size:18px;color:var(--ink-300);max-width:60ch;margin:20px 0 0;text-wrap:pretty}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .3s var(--ease),border-color .3s var(--ease),backdrop-filter .3s}
.nav.stuck{background:rgba(10,10,10,.84);backdrop-filter:saturate(140%) blur(14px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:32px;padding-top:16px;padding-bottom:16px}
.nav img{height:54px;width:auto}
.nav nav{display:flex;gap:28px;margin-left:auto}
.nav nav a{font-family:var(--font-cond);font-weight:700;font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-300);border-bottom:2px solid transparent;padding-bottom:2px;transition:color .14s var(--ease)}
.nav nav a:hover{color:#fff;border-color:var(--red-600)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:44px;padding:0 24px;border:2px solid transparent;background:var(--red-600);color:#fff;font-family:var(--font-cond);font-weight:700;font-size:15px;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;box-shadow:4px 4px 0 var(--void);transition:background .14s var(--ease),transform .08s var(--ease),box-shadow .08s var(--ease)}
.btn:hover{background:var(--red-500);color:#fff}
.btn:active{transform:translate(2px,2px);box-shadow:none}
.btn.sm{height:36px;padding:0 16px;font-size:13px}
.btn.ghost{background:transparent;border-color:var(--line-2);color:#fff;box-shadow:none}
.btn.ghost:hover{background:#fff;color:var(--ink-900);border-color:#fff}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;border-bottom:1px solid var(--line)}
.hero .bg{position:absolute;top:0;bottom:0;right:var(--edge);left:calc(var(--edge) + (var(--cw) - 80px) * 0.42)}
.hero .bg img{width:100%;height:100%;object-fit:cover;object-position:center 22%;filter:grayscale(.28) contrast(1.14) saturate(1.05)}
.hero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--ink-900) 4%,rgba(10,10,10,.8) 32%,rgba(10,10,10,.3) 72%,rgba(10,10,10,.6) 100%),linear-gradient(to right,var(--ink-900) 0%,rgba(10,10,10,.9) 22%,rgba(10,10,10,0) 62%)}
.hero .shred{position:absolute;inset:0;background-image:repeating-linear-gradient(0deg,#fff 0 1px,transparent 1px 4px);opacity:.05;pointer-events:none}
.hero .wrap{position:relative;width:100%;padding-bottom:80px;padding-top:140px}
.hero .hcontent{max-width:530px;margin-left:15%;margin-right:auto}
.band .hcontent{max-width:530px;margin-left:15%;margin-right:auto}
.hero h1{font-family:var(--font-display);font-size:clamp(52px,9.4vw,122px);line-height:.9;text-transform:uppercase;color:#fff;margin:22px 0 0;transform:skewX(var(--shear));transform-origin:left bottom}
.hero h1 span{display:block}
.hero h1 span:nth-child(2){color:var(--red-500)}
.hero .sub{font-size:19px;color:var(--ink-100);max-width:46ch;margin:34px 0 0}
.hero .cta{display:flex;gap:12px;margin-top:34px;flex-wrap:wrap}
.scrollcue{position:absolute;right:40px;bottom:36px;font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-400);writing-mode:vertical-rl}

/* marquee */
.marquee{overflow:hidden;background:var(--red-600);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.marquee .track{display:flex;width:max-content;animation:mq 26s linear infinite}
.marquee .run{display:flex;align-items:center;gap:26px;padding:12px 26px;font-family:var(--font-display);font-size:22px;letter-spacing:.02em;text-transform:uppercase;color:#fff;white-space:nowrap}
.marquee .run i{font-style:normal;color:rgba(0,0,0,.45)}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* sections */
section{scroll-margin-top:76px}
.pad{padding:104px 0}
.pad.sunk{background:var(--void);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}

/* music grid */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.cut{background:var(--ink-800);border:1px solid var(--line);display:flex;flex-direction:column;transition:border-color .14s var(--ease),transform .14s var(--ease)}
.cut:hover{border-color:var(--red-600)}
.cut .thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--ink-700);cursor:pointer}
.cut .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .42s var(--ease)}
.cut:hover .thumb img{transform:scale(1.04)}
.cut .thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(5,5,5,.75),rgba(5,5,5,0) 55%)}
.cut .play{position:absolute;left:16px;bottom:16px;z-index:2;width:52px;height:52px;background:var(--red-600);display:flex;align-items:center;justify-content:center;transition:background .14s var(--ease),transform .08s var(--ease)}
.cut .thumb:hover .play{background:var(--red-500)}
.cut .thumb:active .play{transform:scale(.96)}
.cut .play svg{width:20px;height:20px;fill:#fff;margin-left:2px}
.cut .num{position:absolute;right:14px;top:12px;z-index:2;font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.14em;color:rgba(255,255,255,.6)}
.cut iframe{width:100%;aspect-ratio:16/9;border:0;display:block}
.cut .body{padding:18px;display:flex;flex-direction:column;gap:6px}
.cut .meta{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-100)}
.cut h3{font-family:var(--font-cond);font-weight:700;font-size:21px;line-height:1.15;text-transform:uppercase;color:#fff;margin:0}
.note,.cut .note{font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;color:var(--signal);line-height:1.6;text-transform:uppercase}
.cut .yt{white-space:nowrap;margin-top:8px;font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-100)}
.cut .yt:hover{color:var(--red-500)}

/* manifesto band */
.band{position:relative;min-height:520px;display:flex;align-items:center;overflow:hidden;background:var(--ink-900)}
.band .bg{position:absolute;top:0;bottom:0;right:var(--edge);left:calc(var(--edge) + (var(--cw) - 80px) * 0.42)}
.band .bg img{width:100%;height:100%;object-fit:cover;object-position:center 30%;filter:grayscale(.2) contrast(1.1)}
.band .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to right,var(--ink-900) 0%,rgba(10,10,10,.85) 20%,rgba(10,10,10,0) 60%)}
.band .wrap{position:relative;z-index:2;width:100%;padding-top:96px;padding-bottom:96px}
.band blockquote{font-family:var(--font-display);font-size:clamp(32px,4.6vw,58px);line-height:.94;text-transform:uppercase;color:#fff;margin:0;max-width:16ch}
.band blockquote em{font-style:normal;color:var(--red-500)}

/* what we do */
.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:44px;border-top:1px solid var(--line)}
.col{padding:32px 32px;border-right:1px solid var(--line)}
.col:first-child{padding-left:0}
.col:last-child{border-right:0;padding-right:0}
.col .n{font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.14em;color:var(--red-500)}
.col h3{font-family:var(--font-cond);font-weight:700;font-size:24px;text-transform:uppercase;color:#fff;margin:12px 0 10px}
.col p{margin:0;color:var(--ink-300);font-size:15px}


/* contact */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start}
.clist{margin-top:32px;font-family:var(--font-mono);font-size:13px;letter-spacing:.04em;line-height:2.4;color:var(--ink-300)}
.clist a{color:var(--ink-100);border-bottom:1px solid var(--line-2)}
.clist a:hover{color:var(--red-500);border-color:var(--red-500)}
form{display:grid;gap:16px}
label{display:grid;gap:8px}
label span{font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-300)}
input,textarea,select{height:44px;width:100%;background:var(--void);border:1px solid var(--line);color:#fff;font-family:var(--font-sans);font-size:15px;padding:0 14px;border-radius:0}
textarea{height:auto;padding:12px 14px;line-height:1.55;resize:vertical}
input:hover,textarea:hover,select:hover{border-color:var(--line-2)}
input:focus,textarea:focus,select:focus{outline:2px solid #00E5FF;border-color:transparent}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
/* cookie consent banner */
.cookie{position:fixed;left:20px;right:20px;bottom:20px;z-index:200;max-width:660px;margin:0 auto;background:var(--ink-800);border:1px solid var(--line-2);padding:18px 20px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;box-shadow:6px 6px 0 rgba(0,0,0,.5);opacity:0;transform:translateY(14px);transition:opacity .3s var(--ease),transform .3s var(--ease)}
.cookie.show{opacity:1;transform:none}
.cookie p{margin:0;flex:1;min-width:220px;font-size:14px;line-height:1.5;color:var(--ink-100)}
.cookie a{color:var(--red-500);border-bottom:1px solid var(--line-2)}
.cookie a:hover{border-color:var(--red-500)}
.cookie-btns{display:flex;gap:10px;flex:none}
@media (max-width:600px){.cookie{left:12px;right:12px;bottom:12px;flex-direction:column;align-items:stretch}.cookie-btns{justify-content:flex-end}}
.selectwrap{position:relative}
.selectwrap select{appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-right:44px;cursor:pointer;font-family:var(--font-cond);font-weight:600;letter-spacing:.02em;text-transform:uppercase}
/* fallback arrow only while JS hasn't upgraded the select */
.selectwrap:not(.cselect)::after{content:"";position:absolute;right:18px;top:50%;width:9px;height:9px;border-right:2px solid var(--ink-300);border-bottom:2px solid var(--ink-300);transform:translateY(-70%) rotate(45deg);pointer-events:none;transition:border-color .14s var(--ease)}
.selectwrap:not(.cselect):hover::after{border-color:#fff}
.selectwrap select option{background:var(--void);color:#fff;text-transform:none;font-family:var(--font-sans)}
/* fully-custom dropdown (styles the open list too — the part native selects can't) */
.cselect .cbtn{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;height:44px;background:var(--void);border:1px solid var(--line);color:#fff;font-family:var(--font-cond);font-weight:600;letter-spacing:.02em;text-transform:uppercase;font-size:15px;padding:0 14px;text-align:left;cursor:pointer;transition:border-color .14s var(--ease)}
.cselect .cbtn:hover{border-color:var(--line-2)}
.cselect.open .cbtn,.cselect .cbtn:focus-visible{outline:2px solid #00E5FF;outline-offset:0;border-color:transparent}
.cselect .carrow{flex:none;width:9px;height:9px;border-right:2px solid var(--ink-300);border-bottom:2px solid var(--ink-300);transform:translateY(-2px) rotate(45deg);transition:transform .16s var(--ease),border-color .14s var(--ease)}
.cselect .cbtn:hover .carrow{border-color:#fff}
.cselect.open .carrow{transform:translateY(2px) rotate(-135deg)}
.cselect .clist{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:30;background:var(--void);border:1px solid var(--line-2);max-height:300px;overflow:auto;display:none;box-shadow:6px 6px 0 rgba(0,0,0,.5)}
.cselect.open .clist{display:block}
.cselect .copt{padding:11px 14px;font-family:var(--font-sans);font-size:15px;color:var(--ink-100);cursor:pointer;border-bottom:1px solid var(--line)}
.cselect .copt:last-child{border-bottom:0}
.cselect .copt:hover,.cselect .copt.active{background:var(--ink-700);color:#fff}
.cselect .copt[aria-selected="true"]{color:var(--red-500)}

/* footer */
footer{border-top:1px solid var(--line)}
footer .wrap{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;padding-top:56px;padding-bottom:40px;flex-wrap:wrap}
footer img{height:52px;width:auto}
footer .legal{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-400)}
footer .social{display:flex;flex-direction:column;align-items:flex-end;gap:16px}
footer .social .flinks{display:flex;gap:18px}
footer .social .flinks a{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-300)}
footer .social .flinks a:hover{color:var(--red-500)}

@media (max-width:1000px){.grid{grid-template-columns:repeat(2,1fr)}.cols{grid-template-columns:1fr}.col{border-right:0;border-bottom:1px solid var(--line);padding-right:0}.col:last-child{border-bottom:0}.contact{grid-template-columns:1fr;gap:44px}}
@media (max-width:680px){.hero .bg{left:0;right:0}.band .bg{left:0;right:0}.band .bg::after{background:linear-gradient(to right,rgba(10,10,10,.92),rgba(10,10,10,.5))}.wrap{padding:0 20px}.nav nav{display:none}.grid{grid-template-columns:1fr}.pad{padding:64px 0}.hero .wrap{padding-bottom:56px}.row2{grid-template-columns:1fr}.scrollcue{display:none}}
@media (prefers-reduced-motion:reduce){*{animation-duration:0s!important;transition-duration:0s!important}html{scroll-behavior:auto}}

/* ---- shared additions: tags, buy rows, artist cards, page headers ---- */
.tagrow{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:2px}
.tag{display:inline-flex;align-items:center;flex:none;white-space:nowrap;height:22px;padding:0 9px;font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#0A0A0A;background:var(--ink-100)}
a.tag:hover{color:#0A0A0A;filter:brightness(1.12)}
.tag.out{background:transparent;color:var(--ink-300);box-shadow:inset 0 0 0 1px var(--line-2)}
a.tag.out:hover{color:#fff;box-shadow:inset 0 0 0 1px var(--red-600)}
.buyrow{display:flex;align-items:center;gap:14px;margin-top:12px;flex-wrap:wrap}
/* audio preview player */
.prev{display:flex;align-items:center;gap:12px;margin-top:12px}
.prev .pbtn{flex:none;width:36px;height:36px;border:0;background:var(--red-600);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:3px 3px 0 var(--void);transition:background .14s var(--ease),transform .08s var(--ease),box-shadow .08s var(--ease)}
.prev .pbtn:hover{background:var(--red-500)}
.prev .pbtn:active{transform:translate(2px,2px);box-shadow:none}
.prev .pbtn svg{width:16px;height:16px;fill:#fff}
.prev .ptrack{flex:1;height:4px;background:var(--ink-600);position:relative;overflow:hidden}
.prev .pbar{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--red-500)}
.prev.playing .pbar{background:var(--signal)}
.prev .ptime{flex:none;font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-300);min-width:56px;text-align:right}
.prev.playing .ptime{color:var(--signal)}
/* download button keeps its red even when the store link isn't set yet */
.btn.dl[disabled]{opacity:.6;pointer-events:none;box-shadow:none;background:var(--red-600);color:#fff}
/* fullscreen hint on video thumbs */
.cut .expand{position:absolute;left:16px;top:12px;z-index:2;width:30px;height:30px;display:flex;align-items:center;justify-content:center;background:rgba(5,5,5,.55);color:#fff;pointer-events:none;transition:background .14s var(--ease)}
.cut .thumb:hover .expand{background:var(--red-600)}
.cut .expand svg{width:15px;height:15px;fill:#fff}
/* youtube lightbox overlay */
.lb[hidden]{display:none}
.lb{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:24px}
.lb-back{position:absolute;inset:0;background:rgba(5,5,5,.88);backdrop-filter:blur(6px)}
.lb-inner{position:relative;z-index:1;width:min(1120px,100%)}
.lb-frame{position:relative;width:100%;aspect-ratio:16/9;background:#000;border:1px solid var(--line-2);box-shadow:10px 10px 0 rgba(0,0,0,.55)}
.lb-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.lb-x{position:absolute;top:-48px;right:0;width:40px;height:40px;background:var(--red-600);color:#fff;border:0;font-size:26px;line-height:1;cursor:pointer;font-family:var(--font-sans);box-shadow:3px 3px 0 var(--void);transition:background .14s var(--ease)}
.lb-x:hover{background:var(--red-500)}
@media (max-width:680px){.lb{padding:14px}.lb-x{top:-44px;width:36px;height:36px;font-size:22px}}
.btn[disabled]{opacity:.4;pointer-events:none;box-shadow:none}

/* page header */
.phead{padding:150px 0 56px;border-bottom:1px solid var(--line)}
/* image page headers: all mirror the homepage hero — image right, text left, matching spacing */
.phead.hasimg{position:relative;min-height:70vh;display:flex;align-items:flex-end;overflow:hidden;background:var(--ink-900);padding:180px 0 72px;border-bottom:1px solid var(--line)}
.phead.hasimg .bg{position:absolute;top:0;bottom:0;right:var(--edge);left:calc(var(--edge) + (var(--cw) - 80px) * 0.42)}
.phead.hasimg .bg img{width:100%;height:100%;object-fit:cover;object-position:center 22%;filter:grayscale(.28) contrast(1.12)}
.phead.hasimg .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--ink-900) 4%,rgba(10,10,10,.72) 30%,rgba(10,10,10,.25) 72%,rgba(10,10,10,.5) 100%),linear-gradient(to right,var(--ink-900) 0%,rgba(10,10,10,.9) 24%,rgba(10,10,10,0) 62%)}
.phead.hasimg .wrap{position:relative;z-index:2;width:100%}
.phead.hasimg .hcontent{max-width:560px;margin-left:15%;margin-right:auto}
@media (max-width:680px){
  .phead.hasimg{min-height:0;padding:120px 0 40px}
  .phead.hasimg .bg{left:0;right:0}
  .phead.hasimg .bg::after{background:linear-gradient(to top,var(--ink-900) 6%,rgba(10,10,10,.55) 58%,rgba(10,10,10,.4) 100%)}
  .phead.hasimg .hcontent{margin-left:0;max-width:none}
}
.phead h1{font-family:var(--font-display);font-size:clamp(46px,8vw,104px);line-height:.9;text-transform:uppercase;color:#fff;margin:0}
.phead h1.shear{transform:skewX(var(--shear));transform-origin:left bottom}
.crumb{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-400);margin-bottom:18px}
.crumb a{color:var(--ink-300)}
.crumb a:hover{color:var(--red-500)}
/* filter bar */
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-top:36px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.chip{white-space:nowrap;flex:none;font-family:var(--font-cond);font-weight:700;font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-300);background:transparent;border:1px solid var(--line);height:34px;padding:0 14px;cursor:pointer;transition:all .14s var(--ease)}
.chip:hover{color:#fff;border-color:var(--line-2)}
.chip.on{background:#fff;color:var(--ink-900);border-color:#fff}
/* artist cards */
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.pcard{display:flex;flex-direction:column;background:var(--ink-800);border:1px solid var(--line);color:inherit;transition:border-color .14s var(--ease)}
.pcard:hover{border-color:var(--red-600);color:inherit}
.pimg{aspect-ratio:1/1;overflow:hidden;background:var(--ink-700)}
.pimg img{width:100%;height:100%;object-fit:cover;filter:grayscale(.3) contrast(1.1);transition:filter .42s var(--ease),transform .42s var(--ease)}
.pcard:hover .pimg img{filter:none;transform:scale(1.03)}
.pbody{padding:18px;display:flex;flex-direction:column;gap:8px}
.pbody h3{font-family:var(--font-cond);font-weight:700;font-size:22px;text-transform:uppercase;color:#fff;margin:0}
.pbody .meta{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-300)}
/* artist detail */
.adetail{display:grid;grid-template-columns:460px 1fr;gap:56px;align-items:start}
.adetail .portrait{aspect-ratio:1/1;overflow:hidden;background:var(--ink-800);border:1px solid var(--line)}
.adetail .portrait img{width:100%;height:100%;object-fit:cover}
.adetail p{color:var(--ink-100);font-size:17px;max-width:60ch}
.adetail .bio p{margin:0 0 18px}
.adetail .bio p:last-child{margin-bottom:0}
/* genre index */
.ggrid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:40px}
.gcard{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:210px;padding:22px;color:#0A0A0A;overflow:hidden;transition:transform .14s var(--ease)}
.gcard:hover{color:#0A0A0A;transform:translate(-2px,-2px)}
.gcard .shredmask{position:absolute;inset:0;background-image:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 4px);pointer-events:none}
.gcard h3{position:relative;font-family:var(--font-display);font-size:38px;line-height:.9;text-transform:uppercase;margin:0}
.gcard .n{position:relative;font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:.7;margin-top:8px}
/* license list */
.lic{margin:28px 0 0;padding:0;list-style:none;display:grid;gap:12px;max-width:52ch}
.lic li{display:flex;gap:12px;font-size:15px;color:var(--ink-300);border-bottom:1px solid var(--line);padding-bottom:12px}
.lic li b{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;color:var(--red-500);flex:none;padding-top:3px}
.empty{font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;color:var(--ink-400);padding:40px 0}
/* legal / prose docs */
.doc{max-width:74ch;margin-top:8px}
.doc .updated{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-400);margin-bottom:40px}
.doc h2{font-family:var(--font-cond);font-weight:700;font-size:22px;letter-spacing:.02em;text-transform:uppercase;color:#fff;margin:44px 0 4px}
.doc h2 + .rule{margin-top:10px}
.doc p,.doc li{color:var(--ink-100);font-size:16px;line-height:1.65}
.doc ul{margin:12px 0 0;padding-left:20px;display:grid;gap:8px}
.doc a{color:var(--red-500);border-bottom:1px solid var(--line-2)}
.doc a:hover{border-color:var(--red-500)}
.doc .callout{border-left:3px solid var(--red-600);background:var(--ink-800);padding:16px 20px;margin-top:16px;color:#fff}
@media (max-width:1000px){.pgrid{grid-template-columns:repeat(2,1fr)}.ggrid{grid-template-columns:repeat(2,1fr)}.adetail{grid-template-columns:1fr;gap:32px}.adetail .portrait{max-width:460px}}
@media (max-width:680px){.pgrid{grid-template-columns:1fr}.ggrid{grid-template-columns:1fr}.phead{padding:120px 0 40px}}