:root{--bg:#0d0c0a;--ink:#ede8dc;--brass:#c9a05f;--caption:#8a8478;--hair:#272219;--panel:#151310}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font:16px/1.75 "Archivo",-apple-system,sans-serif;font-weight:300;-webkit-font-smoothing:antialiased}
a{color:var(--brass);text-decoration:none} a:hover{color:var(--ink)}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.mono{font-family:"IBM Plex Mono",monospace;font-weight:300;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--caption)}
.mono b{color:var(--brass);font-weight:400}
.wrap{max-width:1000px;margin:0 auto;padding:0 24px}
.chrome{display:flex;justify-content:space-between;align-items:center;padding:22px 22px 0;gap:14px;flex-wrap:wrap}
.chrome img{display:block;height:34px;width:auto;background:#000;border:1px solid rgba(237,232,220,.16);padding:5px 10px;border-radius:2px}
.chrome nav{display:flex;gap:20px;flex-wrap:wrap}
.chrome nav a{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--caption)}
.chrome nav a:hover,.chrome nav a.on{color:var(--brass)}
.hero{position:relative;margin-top:22px;height:52vh;min-height:340px;overflow:hidden;display:flex;align-items:flex-end}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.85) brightness(.82)}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,12,10,.45),rgba(13,12,10,.1) 45%,rgba(13,12,10,.92))}
.hero .wrap{position:relative;z-index:2;padding-bottom:40px;width:100%}
h1{font-family:"Marcellus",serif;font-weight:400;font-size:clamp(2.2rem,6vw,3.6rem)}
h1 em,h2 em,h3 em{font-style:normal;color:var(--brass)}
section{padding:72px 0;border-top:1px solid var(--hair)}
section:first-of-type{border-top:0}
h2{font-family:"Marcellus",serif;font-size:clamp(1.5rem,3.5vw,2.2rem);margin-bottom:26px}
p.body{color:#d0cabc;max-width:62ch;margin-bottom:16px}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.gallery figure{border:1px solid var(--hair);background:var(--panel)}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;filter:saturate(.88)}
.gallery figure.tall img{aspect-ratio:3/4}
.gallery figcaption{padding:11px 13px;font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--caption)}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px}
.tile{position:relative;display:block;border:1px solid var(--hair);overflow:hidden;min-height:320px}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.85) brightness(.7);transition:transform .6s ease}
.tile:hover img{transform:scale(1.04)}
.tile .t{position:absolute;left:20px;bottom:18px;z-index:2}
.tile .t h3{font-family:"Marcellus",serif;font-size:1.4rem;color:var(--ink)}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(13,12,10,.85))}
.tile .t{z-index:3}
.entry{padding:30px 0;border-bottom:1px solid var(--hair);display:grid;grid-template-columns:150px 1fr;gap:26px}
.entry:last-of-type{border-bottom:0}
.entry .when{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.16em;color:var(--brass);padding-top:6px}
.entry h3{font-family:"Marcellus",serif;font-size:1.3rem;margin-bottom:8px}
.entry p{color:#d0cabc;max-width:62ch;margin-bottom:10px}
.entry a.more{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.rel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:24px}
.rel{background:var(--panel);border:1px solid var(--hair)}
.rel .art{aspect-ratio:1;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#191612}
.rel .art img{width:100%;height:100%;object-fit:cover}
.rel .art .score{font-family:"Marcellus",serif;font-size:1.3rem;color:var(--brass);padding:18px;text-align:center}
.rel figcaption{padding:14px 15px 18px;border-top:1px solid var(--hair)}
.rel .t{font-family:"Marcellus",serif;font-size:1.05rem;margin-bottom:5px}
.rel a.l{display:inline-block;margin-top:9px;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.player-frame{border:1px solid var(--hair);background:var(--panel);padding:14px;margin-bottom:40px}
.player-frame iframe{display:block;width:100%;border:0}
.btn{display:inline-block;font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:#0d0c0a;background:var(--brass);padding:15px 32px;border-radius:2px;margin:6px 6px 6px 0}
.btn:hover{background:var(--ink)}
.btn.ghost{background:transparent;color:var(--brass);border:1px solid var(--brass)}
.cta{text-align:center;padding:80px 24px}
footer{border-top:1px solid var(--hair);padding:44px 24px 64px;text-align:center}
footer .links{display:flex;gap:22px;justify-content:center;flex-wrap:wrap;margin-bottom:20px}
footer .links a{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--caption)}
footer .links a:hover{color:var(--brass)}
footer .draft{color:#5f594e;font-size:.8rem}
@media (max-width:640px){.entry{grid-template-columns:1fr;gap:6px}.chrome nav{gap:12px}}
