/* GW / Independent music editorial */
:root { --paper:#eeeee5; --ink:#171914; --muted:#63675b; --line:#c6c9bc; --acid:#ccff00; --bg-color:var(--paper); --card-bg:var(--paper); --text-primary:var(--ink); --text-secondary:var(--muted); --accent-color:#344700; --accent-hover:#ccff00; --border-color:var(--line); --radius:0; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:90px; }
body { margin:0; font-family:'Vazirmatn',sans-serif; background:var(--paper); color:var(--ink); line-height:1.8; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
button,a,input { -webkit-tap-highlight-color:transparent; }
button,a { touch-action:manipulation; }
::selection { background:var(--acid); color:var(--ink); }
:focus-visible { outline:3px solid #587600; outline-offset:5px; }
[hidden] { display:none!important; }
.skip-link { position:fixed; top:-100px; right:20px; z-index:9999; background:var(--acid); padding:12px 22px; }
.skip-link:focus { top:12px; }
.home-site header,.reading-site>nav { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:14px max(24px,calc((100vw - 1440px)/2)); background:var(--paper); color:var(--ink); border-bottom:1px solid var(--ink); position:sticky; top:0; z-index:100; backdrop-filter:none; box-shadow:none; }
.logo { display:flex; align-items:baseline; gap:6px; font-family:Arial,Helvetica,sans-serif; font-size:36px; font-weight:900; letter-spacing:-3px; line-height:1; background:none!important; -webkit-text-fill-color:currentColor!important; color:var(--ink); }
.logo span { font-size:12px; letter-spacing:0; font-weight:800; }
.logo i { font-size:12px; letter-spacing:0; font-style:normal; align-self:flex-start; }
.home-site nav ul { display:flex; align-items:center; list-style:none; gap:28px; margin:0; padding:0; }
.home-site nav a { display:flex; align-items:center; min-height:44px; font-size:14px; font-weight:700; border-bottom:2px solid transparent; }
.home-site nav a:hover { border-color:var(--ink); }
.home-site .container { max-width:1488px; padding:0 24px; margin:0 auto; }
.hero-text { padding:24px 0 0; margin:0 0 40px; }
.masthead-top,.masthead-bottom { display:flex; justify-content:space-between; align-items:center; gap:24px; font-size:12px; }
.masthead-top { padding-bottom:14px; border-bottom:1px solid var(--line); }
.masthead-top [dir=ltr],.eyebrow { font-family:monospace; font-size:12px; letter-spacing:1px; }
.masthead-main { display:grid; grid-template-columns:1fr 1fr; align-items:center; min-height:270px; overflow:hidden; }
.masthead-main h1 { font-size:clamp(46px,6vw,86px); font-weight:900; line-height:1.4; margin:12px 0 20px; letter-spacing:-3px; }
.masthead-word { font-family:Arial,Helvetica,sans-serif; font-size:clamp(130px,20vw,285px); line-height:.9; font-weight:900; letter-spacing:-.105em; text-align:left; white-space:nowrap; padding:12px 20px 20px 0; }
.masthead-word span { display:inline-block; font-weight:400; font-size:.67em; letter-spacing:-.13em; background:var(--acid); padding:0 .06em; transform:rotate(-8deg); vertical-align:middle; margin-left:.1em; }
.masthead-bottom { padding:16px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--ink); }
.masthead-bottom p { margin:0; font-size:14px; color:var(--muted); }
.masthead-bottom a { white-space:nowrap; font-weight:700; min-height:44px; display:flex; align-items:center; gap:20px; }
.masthead-bottom a span { font-size:27px; }
.bento-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 40px; }
.card { min-width:0; position:relative; border:0; border-radius:0; padding:0; background:transparent; box-shadow:none; overflow:hidden; }
.card:hover { transform:none; box-shadow:none; }
.card-tag { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-bottom:20px; padding-bottom:10px; border-bottom:1px solid var(--line); font-size:13px; font-weight:700; color:var(--muted); }
.card-tag span { color:var(--ink); font-family:Arial,sans-serif; }
.item-featured-article { grid-column:1/-1; grid-row:1; display:grid; grid-template-columns:1.25fr 1fr; background:var(--ink); color:var(--paper); margin-bottom:48px; --text-secondary:#c4c7ba; --accent-color:var(--acid); }
.featured-cover { position:relative; display:block; min-height:470px; background:#292d22; overflow:hidden; }
.featured-cover img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; transition:transform .4s ease; }
.featured-cover:hover img { transform:scale(1.025); }
.cover-placeholder { position:absolute; inset:0; display:grid; place-items:center; font:900 clamp(40px,7vw,100px)/1 Arial,sans-serif; color:var(--ink); background:var(--acid); letter-spacing:-.06em; }
.cover-placeholder:before { content:''; position:absolute; width:70%; aspect-ratio:1; border:1px solid #17191455; border-radius:50%; box-shadow:0 0 0 35px #1719140d,0 0 0 70px #1719140d,0 0 0 105px #1719140d; }
.cover-label { position:absolute; left:18px; bottom:18px; background:var(--acid); color:var(--ink); padding:5px 12px; font-size:12px; font-weight:700; }
.featured-copy { padding:32px 36px; display:flex; flex-direction:column; justify-content:center; }
.featured-copy .card-tag { color:#c4c7ba; border-color:#515647; }
.featured-copy .card-tag span { color:var(--acid); }
#featured-title { font-size:clamp(26px,3vw,43px); line-height:1.6; margin:0 0 12px; text-wrap:balance; }
.featured-meta { font-size:12px; color:#c4c7ba; margin:0; }
#featured-summary { font-size:15px; line-height:2; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; }
#featured-link { align-self:flex-start; display:inline-flex; align-items:center; min-height:44px; border-bottom:1px solid var(--acid); }
.archive-toolbar { grid-column:1/-1; grid-row:2; display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:35px; padding-bottom:24px; border-bottom:3px solid var(--ink); }
.eyebrow { display:block; color:var(--muted); margin-bottom:8px; }
.archive-toolbar h2 { font-size:clamp(24px,3vw,38px); margin:0; }
.archive-search { width:310px; max-width:100%; }
.archive-search label { display:block; font-size:12px; margin-bottom:6px; }
.archive-search input { width:100%; min-height:46px; padding:10px 14px; border:1px solid var(--ink); border-radius:0; color:var(--ink); background:transparent; }
.item-notes { grid-column:1; grid-row:3; }
.item-gw-plus { grid-column:2; grid-row:3; }
.archive-heading,.gw-plus-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; border-bottom:1px solid var(--ink); padding:12px 0; margin:0; }
.archive-heading h3,.gw-plus-heading h3 { font-size:25px; margin:0; }
.archive-heading>span,.gw-plus-mark { font-family:Arial,sans-serif; font-size:17px; font-weight:900; direction:ltr; unicode-bidi:isolate; }
.gw-plus-mark { padding:1px 8px; color:var(--ink); background:var(--acid); transform:rotate(-5deg); }
.archive-description,.gw-plus-description { color:var(--muted); font-size:13px; margin:10px 0 20px; }
.article-list { list-style:none; margin:0; padding:0; max-height:760px; overflow:auto; scrollbar-width:thin; scrollbar-color:var(--muted) var(--paper); }
.article-list li { border-bottom:1px solid var(--line); margin:0; padding:0; }
.article-list a { display:grid; grid-template-columns:90px minmax(0,1fr) 20px; gap:18px; align-items:center; min-height:128px; padding:20px 0; }
.archive-thumb { width:90px; height:88px; object-fit:cover; background:#dde0d4; }
.archive-thumb-placeholder { display:grid; place-items:center; font:900 27px Arial,sans-serif; }
.archive-entry h4 { font-size:17px; line-height:1.8; margin:0 0 8px; font-weight:700; }
.archive-entry span { font-size:12px; color:var(--muted); }
.archive-arrow { font-size:23px; transition:transform .2s; }
.article-list a:hover .archive-arrow { transform:translate(-3px,3px); }
.article-list a:hover h4 { text-decoration:underline; text-underline-offset:5px; }
.article-list-empty { padding:35px 12px!important; color:var(--muted); }
.item-main-media { grid-column:1/-1; grid-row:4; display:grid; grid-template-columns:1.25fr 1fr; gap:0 36px; align-items:start; background:#dfe2d4; padding:32px; margin-top:50px; }
.item-main-media .card-tag { grid-column:1/-1; color:var(--ink); border-color:#a8ae9a; }
#video-title { grid-column:2; grid-row:2; margin:0 0 18px; font-size:clamp(22px,2.5vw,34px); line-height:1.7; }
.video-wrapper { grid-column:1; grid-row:2/4; position:relative; aspect-ratio:16/9; overflow:hidden; background:var(--ink); }
.video-wrapper iframe,.podcast-poster { position:absolute; inset:0; width:100%; height:100%; border:0; }
.podcast-poster { cursor:pointer; padding:0; background:var(--ink); color:var(--paper); font:inherit; }
.podcast-poster img { width:100%; height:100%; object-fit:cover; }
.podcast-poster-fallback { display:grid; place-items:center; height:100%; }
.podcast-play-badge { position:absolute; bottom:16px; right:16px; background:var(--acid); color:var(--ink); min-height:44px; display:flex; align-items:center; gap:14px; padding:10px 18px; font-size:13px; font-weight:700; }
.podcast-play-icon { width:0; height:0; border-top:6px solid transparent; border-bottom:6px solid transparent; border-left:10px solid currentColor; }
#video-description { grid-column:2; grid-row:3; font-size:14px; line-height:2.1; margin:0!important; }
.item-links { grid-column:1/-1; grid-row:5; display:flex; justify-content:space-between; align-items:center; gap:32px; border-bottom:1px solid var(--ink); padding:42px 0; }
.social-heading h3 { margin:0 0 6px; font-size:25px; }
.social-heading p { margin:0; color:var(--muted); font-size:13px; }
.social-bento-grid { display:flex; gap:12px; }
.social-bento-grid>svg { position:absolute; }
.social-card { display:flex; align-items:center; gap:14px; min-height:62px; border:1px solid var(--ink); padding:16px 20px; font:700 13px Arial,sans-serif; transition:background .2s; }
.social-card:hover { background:var(--acid); }
.social-icon { width:23px; height:23px; fill:currentColor; }
.telegram-signup { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; margin:0; padding:40px 0; }
.telegram-signup-eyebrow { color:var(--muted); font-size:12px; }
.telegram-signup h2 { font-size:24px; margin:8px 0; }
.telegram-signup p { font-size:13px; color:var(--muted); margin:6px 0; }
.telegram-form-row { display:flex; gap:10px; }
.telegram-input-wrap { display:flex; direction:ltr; align-items:center; border:1px solid var(--ink); padding:0 14px; min-width:0; flex:1; }
.telegram-input-prefix { padding-right:6px; }
#telegramUsername { width:100%; min-width:0; min-height:48px; border:0; background:transparent; color:var(--ink); font:16px monospace; }
.btn { border:1px solid var(--ink); border-radius:0; background:var(--ink); color:var(--paper); min-height:48px; padding:10px 20px; cursor:pointer; font-weight:700; white-space:nowrap; }
.btn:hover { background:var(--acid); color:var(--ink); }
.btn:disabled { opacity:.6; cursor:wait; }
.telegram-form-status { min-height:24px; }
.telegram-form-status.is-error { color:#9c2819; }
.telegram-form-status.is-success { color:#365600; }
.telegram-honeypot { position:absolute!important; width:1px!important; height:1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; }
.home-site footer { background:var(--ink); color:var(--paper); margin:0; padding:34px max(24px,calc((100vw - 1440px)/2)); }
.footer-word { display:block; direction:ltr; font:900 clamp(48px,11vw,150px)/1.2 Arial,sans-serif; letter-spacing:-.06em; color:var(--acid); }
.footer-bottom { display:flex; justify-content:space-between; gap:24px; border-top:1px solid #505447; margin-top:24px; padding-top:20px; font-size:12px; }
.footer-bottom p { margin:0; }
/* Reading room: the same identity, with quieter long-form typography. */
.reading-site { --bg-deep:var(--paper); --bg-card:var(--paper); --bg-glass:var(--paper); --text-main:var(--ink); --text-muted:var(--muted); --accent:#435900; --accent-glow:transparent; }
.reading-site .ambient-glow,.reading-site .grid-overlay { display:none; }
.reading-site .glass-panel { background:var(--paper); backdrop-filter:none; box-shadow:none; border-color:var(--line); }
.reading-site .nav-cta,.reading-site .glow-button { color:var(--ink); background:transparent; border:1px solid var(--ink); border-radius:0; min-height:44px; box-shadow:none; }
.reading-site .nav-cta:hover,.reading-site .glow-button:hover { background:var(--acid); transform:none; box-shadow:none; }
.reading-site header.hero { min-height:0; max-width:1120px; margin:auto; padding:70px 24px 35px; text-align:right; align-items:flex-start; }
.reading-site h1.title { font-size:clamp(30px,4.8vw,64px); line-height:1.65; color:var(--ink); background:none; -webkit-text-fill-color:currentColor; animation:none; text-shadow:none; margin-bottom:24px; }
.reading-site .badge { background:var(--acid); color:var(--ink); border:0; border-radius:0; box-shadow:none; animation:none; letter-spacing:0; }
.reading-site .meta-info { justify-content:flex-start; margin-bottom:20px; }
.reading-site .article-meta-author { display:flex; align-items:center; gap:10px; min-width:0; }
.reading-site .article-meta-date,.reading-site .article-meta-reading { white-space:nowrap; }
.reading-site .author-avatar { width:12px; height:12px; background:var(--ink); border:0; border-radius:0; }
.reading-site .tag { color:var(--muted); border-color:var(--line); background:transparent; border-radius:0; }
.reading-site main { max-width:870px; margin:0 auto 70px; padding:0 24px; }
.reading-site .content-card { padding:36px 0; border-radius:0; border:0; border-top:2px solid var(--ink); overflow:visible; }
.reading-site .content-card:before,.reading-site article h2:after { display:none; }
.reading-site article p,.reading-site article li,.reading-site article ul,.reading-site article ol { color:#32382d; font-size:18px; line-height:2.25; text-align:right; }
.reading-site article h1,.reading-site article h2,.reading-site article h3,.reading-site article strong { color:var(--ink); }
.reading-site article em,.reading-site article a { color:#435900; }
.reading-site article h2 { display:block; line-height:1.7; }
.reading-site article blockquote { background:#dfe2d4; color:var(--ink); border-right:4px solid var(--ink); box-shadow:none; border-radius:0; }
.reading-site article .md-image img,.reading-site .article-featured-image,.reading-site .article-featured-image img { border-radius:0!important; box-shadow:none!important; }
.reading-site article .md-inline-code { background:#dfe2d4; color:var(--ink); }
.reading-site article { overflow-wrap:anywhere; }
.reading-site footer { background:var(--ink); color:var(--paper); padding:30px 24px; text-align:center; }
.reading-site footer .footer-word { font-size:clamp(40px,7vw,85px); }
@media(min-width:1600px) { .featured-cover { min-height:520px; } }
@media(max-width:900px) {
 .masthead-main { min-height:220px; }.masthead-main h1 { letter-spacing:-1px; }
 .bento-grid { column-gap:24px; }.featured-copy { padding:25px; }.featured-cover { min-height:390px; }
 .item-main-media { padding:24px; gap:0 24px; }.item-links { align-items:flex-start; flex-direction:column; }
 .archive-entry h4 { font-size:15px; }.article-list a { grid-template-columns:64px minmax(0,1fr); gap:12px; }.archive-thumb { width:64px; height:70px; }.archive-arrow { display:none; }
 .telegram-signup { grid-template-columns:1fr; gap:15px; }
}
@media(max-width:600px) {
 html { scroll-padding-top:115px; }.home-site header { flex-wrap:wrap; gap:0; padding:14px 18px 0; }.home-site .logo { font-size:32px; }.home-site nav { width:100%; }.home-site nav ul { justify-content:space-between; gap:12px; }.home-site nav a { font-size:12px; }
 .home-site .container { padding:0 18px; }.hero-text { padding-top:18px; margin-bottom:24px; }.masthead-top { font-size:10px; gap:12px; }.masthead-top [dir=ltr] { font-size:9px; letter-spacing:0; }
 .masthead-main { min-height:175px; grid-template-columns:1fr 1fr; }.masthead-main h1 { font-size:37px; line-height:1.6; }.masthead-word { font-size:clamp(86px,24vw,144px); padding-left:0; letter-spacing:-.12em; }.masthead-word span { font-size:.55em; }
 .masthead-bottom { align-items:flex-start; gap:14px; }.masthead-bottom p { font-size:11px; max-width:215px; }.masthead-bottom a { font-size:11px; gap:6px; min-height:40px; }
 .bento-grid { display:flex; flex-direction:column; gap:0; }.item-featured-article { order:0; grid-template-columns:1fr; margin-bottom:30px; }.featured-cover { min-height:0; aspect-ratio:4/3; }.featured-copy { padding:24px 20px; }#featured-title { font-size:27px; }.featured-copy .card-tag { margin-bottom:15px; }#featured-summary { font-size:14px; }
 .archive-toolbar { order:1; flex-direction:column; align-items:stretch; gap:20px; margin-bottom:10px; }.archive-toolbar h2 { font-size:28px; }.archive-search { width:100%; }
 .item-notes { order:2; }.item-gw-plus { order:3; margin-top:30px; }.archive-heading h3,.gw-plus-heading h3 { font-size:23px; }.article-list { max-height:600px; }.article-list a { grid-template-columns:74px minmax(0,1fr) 18px; min-height:112px; }.archive-thumb { width:74px; height:76px; }.archive-entry h4 { font-size:16px; }.archive-arrow { display:block; }
 .item-main-media { order:4; display:flex; flex-direction:column; padding:20px; margin-top:35px; }.item-main-media .card-tag { width:100%; }.video-wrapper { width:100%; order:1; }#video-title { order:2; font-size:23px; margin:20px 0 12px; }#video-description { order:3; font-size:14px; }
 .item-links { order:5; padding:30px 0; gap:20px; }.social-bento-grid { width:100%; gap:8px; }.social-card { flex:1; flex-direction:column; justify-content:center; padding:12px 8px; font-size:11px; gap:8px; }
 .telegram-signup { padding:30px 0; }.telegram-form-row { flex-wrap:wrap; }.telegram-input-wrap { min-width:140px; }.btn { font-size:12px; padding:10px 14px; }
 .home-site footer { padding:25px 18px; }.footer-bottom { flex-direction:column; gap:12px; }
 .reading-site>nav { padding:14px 18px; }.reading-site header.hero { padding:34px 18px 16px; }.reading-site main { padding:0 18px; margin-bottom:48px; }.reading-site .meta-info { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:8px 12px; width:100%; margin-bottom:12px; font-size:12.5px; line-height:1.6; }.reading-site .article-meta-separator { display:none; }.reading-site .article-meta-author { min-width:0; gap:7px; overflow:hidden; }.reading-site .article-meta-author #article-author { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.reading-site .article-meta-date,.reading-site .article-meta-reading { white-space:nowrap; font-variant-numeric:tabular-nums; }.reading-site .author-avatar { flex:0 0 10px; width:10px; height:10px; }.reading-site h1.title { max-inline-size:100%; font-size:clamp(27px,7.8vw,34px); line-height:1.48; margin-bottom:16px; text-wrap:balance; overflow-wrap:break-word; word-break:normal; hyphens:none; }.reading-site .hero.is-long-title h1.title { font-size:clamp(24px,6.8vw,29px); line-height:1.52; }.reading-site .hero.is-very-long-title h1.title { font-size:clamp(22px,6.1vw,26px); line-height:1.55; }.reading-site .content-card { padding:26px 0; }.reading-site article { overflow-wrap:break-word; word-break:normal; }.reading-site article p,.reading-site article li { font-size:16px; line-height:1.9; text-align:start; word-spacing:normal; letter-spacing:normal; }.reading-site article p { margin-bottom:1.35rem; }.reading-site article ul,.reading-site article ol { margin:0 0 1.4rem; padding-inline-start:1.4rem; }.reading-site article h2 { font-size:24px; line-height:1.55; margin:2.2rem 0 1rem; }.reading-site article h3 { font-size:20px; line-height:1.65; margin:1.8rem 0 .8rem; }.reading-site article blockquote { margin:1.5rem 0; padding:1rem; }.reading-site article .md-align-justify>p { text-align:start!important; }.reading-site article .md-dir-ltr.md-align-justify>p { text-align:left!important; }.reading-site .article-featured-image { margin-bottom:1.75rem!important; }
}
@media(prefers-reduced-motion:reduce) { html,* { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }
