@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600&family=Inter:wght@400;600;700&family=Nosifer&family=Source+Code+Pro:wght@500&display=swap");

:root {
  --bg: #0a0a0a;
  --panel: #111111;
  --panel-2: #171717;
  --text: #c4c4c4;
  --muted: #777;
  --line: rgba(139, 0, 0, .22);
  --red: #8b0000;
  --red-hot: #b22222;
  --violet: #2d1b69;
  --green: #00ff41;
}

* { box-sizing: border-box; }
html { color-scheme: dark; scroll-behavior: smooth; }
body {
  min-height: 100vh;
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 19px;
  line-height: 1.85;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 100% 4px;
  opacity: .35;
  z-index: 1;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; object-fit: cover; }
[hidden] { display: none !important; }
button, input, select, textarea { font: inherit; }
#particles { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; }
.page, .site-header, .gate, .post-detail { position: relative; z-index: 2; }
.progress { position: fixed; top: 0; left: 0; height: 2px; width: 0; background: var(--red-hot); z-index: 5; box-shadow: 0 0 16px var(--red-hot); }

.site-header {
  position: sticky;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px clamp(16px, 4vw, 56px);
  background: rgba(10, 10, 10, .82);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(18px);
  z-index: 4;
}

.brand, nav, .kicker, .meta, .button, .toolbar, .archive-meta, .form-status {
  font-family: Inter, system-ui, sans-serif;
}

.brand { font-size: 15px; font-weight: 700; letter-spacing: 0; }
.brand span { color: var(--red-hot); font-family: Nosifer, fantasy; margin-right: 8px; }
nav { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; font-size: 13px; color: #aaa; }
nav a { position: relative; padding: 7px 8px; transition: color .18s ease; }
nav a::after { position: absolute; right: 8px; bottom: 2px; left: 8px; height: 1px; background: var(--red-hot); content: ""; opacity: 0; transform: scaleX(.4); transition: opacity .18s ease, transform .18s ease; }
nav a.active, nav a:hover, nav a:focus-visible { color: #fff; outline: none; }
nav a.active::after, nav a:hover::after, nav a:focus-visible::after { opacity: 1; transform: scaleX(1); }
nav .nav-instagram { margin-left: 4px; border-left: 1px solid var(--line); color: #c67979; }
nav .nav-instagram::before { display: inline-block; width: 5px; height: 5px; margin: 0 6px 1px 0; border-radius: 50%; background: var(--red-hot); content: ""; vertical-align: middle; }
nav .nav-instagram::after { left: 13px; }
.site-menu-toggle { display: inline-grid; width: 42px; height: 42px; margin-left: auto; place-items: center; border: 1px solid var(--line); background: rgba(17, 17, 17, .84); color: #eee; cursor: pointer; }
.site-menu-toggle > span { display: grid; width: 17px; gap: 4px; }
.site-menu-toggle i { display: block; width: 17px; height: 1px; background: currentColor; transition: transform .2s ease, opacity .2s ease; }
.site-menu-toggle:hover, .site-menu-toggle:focus-visible { border-color: var(--red-hot); color: #fff; outline: 0; }
.site-header.is-menu-open .site-menu-toggle i:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.site-header.is-menu-open .site-menu-toggle i:nth-child(2) { opacity: 0; }
.site-header.is-menu-open .site-menu-toggle i:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }
.site-nav { position: absolute; top: calc(100% + 8px); right: clamp(16px, 4vw, 56px); z-index: 8; display: grid; width: min(310px, calc(100vw - 32px)); padding: 8px; border: 1px solid var(--line); background: rgba(12, 12, 12, .98); box-shadow: 0 24px 54px rgba(0, 0, 0, .42); opacity: 0; pointer-events: none; transform: translateY(-8px); transition: opacity .18s ease, transform .18s ease; visibility: hidden; }
.site-header.is-menu-open .site-nav { opacity: 1; pointer-events: auto; transform: translateY(0); visibility: visible; }
.site-nav a { width: 100%; padding: 11px 12px; }
.site-nav a::after { right: 12px; left: 12px; bottom: 6px; }
.site-nav .nav-instagram { margin: 4px 0 0; border-top: 1px solid var(--line); border-left: 0; padding-top: 13px; }
.site-nav .nav-instagram::after { left: 17px; }
.site-nav .nav-instagram::before { margin-left: 1px; }
body.is-menu-open { overflow: hidden; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.home-page .gate { min-height: calc(100vh - 70px); }

.gate {
  min-height: 100vh;
  display: grid;
  place-items: center;
  align-content: center;
  padding: 32px;
  text-align: center;
  overflow: hidden;
}

.sigil {
  font-family: Nosifer, fantasy;
  font-size: clamp(72px, 16vw, 190px);
  line-height: 1;
  color: rgba(178, 34, 34, .88);
  text-shadow: 0 0 36px rgba(139, 0, 0, .75);
  animation: sigil 4s ease-in-out infinite;
}

h1, h2 {
  font-family: "Cormorant Garamond", Georgia, serif;
  color: #f0eeee;
  line-height: 1.12;
  margin: 0;
  letter-spacing: 0;
}

.gate h1 { font-size: clamp(42px, 8vw, 96px); margin-top: 12px; }
.bio { font-size: clamp(22px, 3vw, 34px); color: #ddd; margin: 12px 0 28px; }
.kicker { color: var(--red-hot); text-transform: uppercase; font-size: 12px; letter-spacing: .18em; margin: 0 0 12px; }
.button, .icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border: 1px solid var(--line);
  background: rgba(17, 17, 17, .84);
  color: #eee;
  padding: 10px 18px;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.button:hover, .icon-button:hover { transform: translateY(-2px); border-color: var(--red-hot); box-shadow: 0 0 24px rgba(139, 0, 0, .26); }
.button.primary { background: linear-gradient(135deg, var(--red), #320707); }
.button.ghost { background: rgba(17, 17, 17, .62); }
.gate-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; }
.now-listening { display: grid; grid-template-columns: 88px minmax(0, 1fr); width: min(540px, 100%); gap: 16px; margin-top: 32px; padding: 14px; border: 1px solid var(--line); background: rgba(17, 17, 17, .84); text-align: left; font-family: Inter, system-ui, sans-serif; box-shadow: 0 18px 42px rgba(0, 0, 0, .2); }
.now-listening--page { width: min(680px, 100%); margin: 0 0 34px; grid-template-columns: 96px minmax(0, 1fr); }
.now-listening-cover { position: relative; display: grid; width: 88px; height: 88px; place-items: center; overflow: hidden; background: #17100f; border: 1px solid rgba(178, 34, 34, .55); }
.now-listening--page .now-listening-cover { width: 96px; height: 96px; }
.now-listening-cover::after { display: none; }
.now-listening-cover img { width: 100%; height: 100%; object-fit: cover; }
.now-listening-cover span { color: var(--red-hot); font: 500 44px/1 "Cormorant Garamond", Georgia, serif; }
.now-listening-copy { display: grid; min-width: 0; align-content: center; gap: 4px; }
.now-listening-topline { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.now-listening p { margin: 0; color: #a6adaa; font-size: 10px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.now-listening-topline span { color: #dc6464; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.now-listening-topline span:not(:empty)::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 6px 1px 0; border-radius: 50%; background: currentColor; box-shadow: 0 0 9px currentColor; }
.now-listening strong, .now-listening-artist { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.now-listening strong { color: #f0eeee; font-size: clamp(17px, 2.2vw, 21px); line-height: 1.25; }
.now-listening-artist { color: #959c99; font-size: 12px; }
.now-listening-meta { min-height: 14px; color: #bf6e6e; font: 10px/1.35 "Source Code Pro", monospace; letter-spacing: .04em; text-transform: uppercase; }
.now-listening-meta:empty { display: none; }
.now-listening-progress { position: relative; height: 3px; margin-top: 8px; overflow: hidden; background: rgba(255, 255, 255, .1); }
.now-listening-progress i { display: block; width: 0; height: 100%; background: var(--red-hot); box-shadow: 0 0 10px rgba(178, 34, 34, .85); transition: width .8s linear; }
.now-listening-time { display: flex; justify-content: space-between; gap: 12px; color: #6f7774; font: 10px/1.3 "Source Code Pro", monospace; }

.page { width: min(1200px, calc(100% - 32px)); margin: 0 auto; padding: 56px 0 84px; }
.archive-hero { max-width: 780px; margin-bottom: 32px; }
.archive-hero h1 { font-size: clamp(36px, 7vw, 82px); }
.archive-hero p:last-child { max-width: 650px; color: #aaa; }

.toolbar {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 150px 150px 48px;
  gap: 12px;
  align-items: end;
  margin: 28px 0 14px;
}
.toolbar label { display: grid; gap: 6px; font-size: 12px; color: #888; text-transform: uppercase; }
input, select {
  width: 100%;
  min-height: 46px;
  border: 1px solid var(--line);
  background: rgba(17, 17, 17, .9);
  color: #eee;
  padding: 0 12px;
  outline: none;
}
input:focus, select:focus { border-color: var(--red-hot); box-shadow: 0 0 0 3px rgba(139, 0, 0, .18); }
.icon-button { min-width: 48px; padding: 0; font-family: Inter, sans-serif; font-size: 24px; }
.archive-meta { color: var(--muted); margin: 10px 0 24px; font-size: 14px; }

.post-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.post-card {
  background: linear-gradient(180deg, rgba(26, 26, 26, .94), rgba(12, 12, 12, .94));
  border: 1px solid var(--line);
  overflow: hidden;
  min-width: 0;
  transform: translateY(18px);
  opacity: 0;
  transition: opacity .45s ease, transform .45s ease, border-color .25s ease, box-shadow .25s ease;
}
.post-card[data-post-url] { cursor: pointer; }
.post-card:focus-visible { outline: 2px solid var(--red-hot); outline-offset: 3px; }
.post-card.shown { opacity: 1; transform: translateY(0); }
.post-card:hover { border-color: rgba(178, 34, 34, .55); box-shadow: 0 18px 60px rgba(0, 0, 0, .36), 0 0 28px rgba(139, 0, 0, .18); }
.thumb img, .thumb video { width: 100%; min-height: 260px; max-height: 380px; background: #111; object-fit: cover; }
.card-body { padding: 18px; }
.meta { display: flex; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 12px; line-height: 1.4; }
.card-body p { margin: 12px 0 18px; color: #cfcfcf; font-size: 18px; line-height: 1.7; }
.card-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-family: Inter, sans-serif; font-size: 13px; }
.card-actions a { color: #fff; border-bottom: 1px solid var(--red-hot); }
.load-row { display: flex; justify-content: center; margin-top: 28px; }

.post-detail { width: min(1180px, calc(100% - 32px)); margin: 0 auto; padding: 42px 0 90px; }
.reader { display: grid; grid-template-columns: minmax(280px, 46%) minmax(0, 1fr); gap: clamp(24px, 5vw, 60px); align-items: start; }
.reader-media { position: sticky; top: 96px; margin: 0; border: 1px solid var(--line); background: #111; }
.hero-image { width: 100%; max-height: calc(100vh - 130px); object-fit: contain; background: #0d0d0d; }
.hero-image.media-video { object-fit: contain; }
.reader-text { max-width: 720px; }
.copy p { margin: 0 0 24px; }
.share-cards { margin-top: 34px; padding-top: 18px; border-top: 1px solid var(--line); font-family: Inter, sans-serif; }
.share-cards-head { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; margin-bottom: 12px; }
.share-cards-head p { margin: 0; color: #e5e5e5; font-size: 13px; font-weight: 700; }
.share-cards-head span { color: var(--green); font-size: 12px; }
.share-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.share-card { display: grid; min-height: 82px; align-content: center; gap: 5px; border: 1px solid var(--line); border-radius: 0; background: #111; color: #e7e7e7; padding: 13px 14px; text-align: left; cursor: pointer; transition: border-color .2s ease, background .2s ease; }
.share-card:hover, .share-card:focus-visible { border-color: var(--red-hot); background: rgba(139, 0, 0, .11); outline: none; }
.share-card strong { font-size: 13px; }
.share-card span { color: var(--muted); font-size: 11px; }
.instagram-stats { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: 26px; padding: 12px 0; border-top: 1px solid var(--line); color: var(--muted); font: 12px Inter, sans-serif; }
.instagram-stats b { color: #dedede; font-weight: 600; }
.instagram-stats.compact { gap: 4px 9px; margin-top: 10px; padding: 0; border-top: 0; font-size: 10px; }
.instagram-stats.compact span { white-space: nowrap; }
.echo-chamber { margin-top: 34px; padding-top: 18px; border-top: 1px solid var(--line); font-family: Inter, system-ui, sans-serif; }
.echo-chamber > header { display: grid; gap: 4px; margin-bottom: 14px; }
.echo-chamber > header p { margin: 0; color: var(--red-hot); font-size: 10px; font-weight: 700; letter-spacing: .14em; }
.echo-chamber > header h2 { margin: 0; color: #eeeeee; font: 600 26px/1.15 "Cormorant Garamond", Georgia, serif; }
.echo-chamber > header span { color: var(--muted); font-size: 12px; line-height: 1.45; }
.echo-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.echo-card { display: grid; min-width: 0; border: 1px solid var(--line); background: #111; transition: border-color .2s ease, background .2s ease; }
.echo-card:hover { border-color: var(--red-hot); background: rgba(139, 0, 0, .1); }
.echo-thumb { display: block; height: 122px; background: #0d0d0d; overflow: hidden; }
.echo-thumb img, .echo-thumb video { width: 100%; height: 100%; object-fit: cover; }
.echo-copy { display: grid; gap: 6px; padding: 11px; }
.echo-copy time, .echo-copy small { color: #b86262; font: 10px/1.35 "Source Code Pro", monospace; }
.echo-copy strong { display: -webkit-box; overflow: hidden; color: #e8e8e8; font-size: 12px; line-height: 1.45; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.echo-copy small { color: #8b928f; text-transform: uppercase; }
.listening-diary-page { max-width: 1120px; }
.diary-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 0 0 18px; border: 1px solid var(--line); background: var(--line); }
.diary-summary span { padding: 16px 18px; background: rgba(17, 17, 17, .9); color: var(--muted); font: 12px Inter, sans-serif; }
.diary-summary b { display: block; margin-bottom: 4px; color: #f0eeee; font: 600 25px/1 "Cormorant Garamond", Georgia, serif; }
.diary-filterbar { display: grid; gap: 15px; margin: 0 0 28px; padding: 16px; border: 1px solid var(--line); background: rgba(14, 14, 14, .72); font-family: Inter, sans-serif; }
.diary-presets { display: flex; flex-wrap: wrap; gap: 7px; }
.diary-presets button, .diary-clear { border: 1px solid var(--line); border-radius: 0; background: #101010; color: #bcbcbc; padding: 7px 10px; font: 11px Inter, sans-serif; cursor: pointer; transition: border-color .18s ease, color .18s ease, background .18s ease; }
.diary-presets button:hover, .diary-presets button.is-active, .diary-clear:hover { border-color: rgba(211, 83, 83, .72); background: rgba(139, 0, 0, .14); color: #f0eeee; }
.diary-filter-grid { display: grid; grid-template-columns: minmax(220px, 1.45fr) repeat(3, minmax(135px, 1fr)); gap: 10px; }
.diary-filter-grid label { display: grid; min-width: 0; gap: 6px; color: #8d9390; font: 10px Inter, sans-serif; letter-spacing: .06em; text-transform: uppercase; }
.diary-filter-grid input, .diary-filter-grid select { width: 100%; min-width: 0; height: 37px; border: 1px solid #303030; border-radius: 0; outline: 0; background: #0b0b0b; color: #e8e8e8; padding: 0 10px; font: 13px Inter, sans-serif; }
.diary-filter-grid input:focus, .diary-filter-grid select:focus { border-color: #a63b3b; }
.diary-filter-status { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 24px; color: var(--muted); font-size: 11px; }
.diary-clear { color: #d8a3a3; }
.diary-layout { display: grid; grid-template-columns: minmax(0, 1fr) 250px; align-items: start; gap: 34px; }
.diary-list { display: grid; gap: 30px; min-width: 0; }
.diary-insights { position: sticky; top: 92px; display: grid; gap: 11px; border-top: 2px solid #8d2020; padding-top: 13px; font-family: Inter, sans-serif; }
.diary-insights .eyebrow { margin: 0; color: #be5d5d; font-size: 10px; font-weight: 700; letter-spacing: .12em; }
.diary-insights h2 { margin: 0; color: #e9e6e6; font: 600 27px/1.05 "Cormorant Garamond", Georgia, serif; }
.diary-top-list { display: grid; gap: 0; margin: 2px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.diary-top-list li { display: grid; grid-template-columns: 25px minmax(0, 1fr) auto; gap: 8px; align-items: center; min-height: 39px; border-bottom: 1px solid var(--line); }
.diary-top-list span, .diary-top-list b { color: #b65d5d; font: 10px "Source Code Pro", monospace; }
.diary-top-list strong { overflow: hidden; color: #d8d8d8; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.diary-range { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; margin-top: 6px; border-top: 1px solid var(--line); padding-top: 12px; }
.diary-range span { color: var(--muted); font-size: 10px; text-transform: uppercase; }
.diary-range strong { color: #d5d5d5; font-size: 11px; font-weight: 500; text-align: right; }
.diary-muted { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.diary-insight-section { display: grid; gap: 9px; border-top: 1px solid var(--line); padding-top: 13px; }
.diary-insight-section > p { margin: 0; color: #bd6565; font: 10px Inter, sans-serif; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.diary-repeat-list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.07); }
.diary-repeat-list li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; min-height: 43px; border-bottom: 1px solid rgba(255,255,255,.07); }
.diary-repeat-list div { display: grid; min-width: 0; gap: 2px; }
.diary-repeat-list strong, .diary-repeat-list span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.diary-repeat-list strong { color: #dedede; font-size: 11px; }
.diary-repeat-list span { color: var(--muted); font-size: 10px; }
.diary-repeat-list b { color: #c76b6b; font: 11px "Source Code Pro", monospace; }
.diary-rhythm-title { color: #dedede; font-size: 12px; font-weight: 500; }
.diary-rhythm-bars { display: grid; gap: 7px; }
.diary-rhythm-bars > div { display: grid; grid-template-columns: 39px minmax(0, 1fr) 18px; gap: 7px; align-items: center; color: var(--muted); font-size: 10px; }
.diary-rhythm-bars i { display: block; height: 4px; background: #272020; }
.diary-rhythm-bars i::before { display: block; width: var(--diary-level); height: 100%; background: #9a3535; content: ""; }
.diary-rhythm-bars b { color: #c9c9c9; font: 10px "Source Code Pro", monospace; text-align: right; }
.diary-busiest-day strong { color: #e3dfdf; font: 600 21px/1 "Cormorant Garamond", Georgia, serif; }
.diary-busiest-day span { color: var(--muted); font-size: 11px; }
.diary-day { border-top: 1px solid var(--line); padding-top: 14px; }
.diary-day > header { display: grid; grid-template-columns: 1fr auto; gap: 4px 16px; margin-bottom: 10px; }
.diary-day > header p, .diary-day > header h2 { margin: 0; }
.diary-day > header p { color: #c96b6b; font: 10px Inter, sans-serif; text-transform: uppercase; }
.diary-day > header h2 { color: #eee; font-size: clamp(26px, 4vw, 38px); }
.diary-day > header span { display: grid; grid-column: 2; grid-row: 1 / span 2; align-self: center; gap: 3px; color: var(--muted); font: 11px Inter, sans-serif; text-align: right; }
.diary-day > header span small { color: #a45a5a; font: 9px "Source Code Pro", monospace; }
.diary-entry { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid rgba(255,255,255,.07); }
.diary-cover { position: relative; width: 52px; height: 52px; display: grid; place-items: center; overflow: hidden; background: #151010; border: 1px solid rgba(178,34,34,.45); }
.diary-cover img { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; object-fit: cover; }
.diary-cover span { color: var(--red-hot); font-size: 24px; }
.diary-entry > div:nth-child(2) { display: grid; min-width: 0; gap: 2px; }
.diary-entry time, .diary-entry small, .diary-duration { color: var(--muted); font: 10px "Source Code Pro", monospace; }
.diary-entry strong, .diary-entry p { overflow: hidden; margin: 0; text-overflow: ellipsis; white-space: nowrap; }
.diary-entry strong { color: #ededed; font: 600 14px Inter, sans-serif; }
.diary-entry p { color: #a8aeac; font: 12px Inter, sans-serif; }
.diary-entry small { color: #bd6565; text-transform: uppercase; }
.diary-empty { border: 1px solid var(--line); padding: 28px; background: rgba(17, 17, 17, .72); }
.diary-empty h2 { margin: 0 0 8px; color: #e5e2e2; font-size: 25px; }
.diary-empty p { margin: 0; color: var(--muted); font: 13px/1.55 Inter, sans-serif; }
.secret { margin: 36px 0; padding: 18px; border: 1px solid rgba(0, 255, 65, .22); background: rgba(0, 255, 65, .035); }
.secret pre { white-space: pre-wrap; overflow-wrap: anywhere; color: var(--green); font-family: "Source Code Pro", monospace; font-size: 12px; line-height: 1.7; }
.decoded { color: var(--green); font-family: "Source Code Pro", monospace; }
.post-nav { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; margin-top: 34px; border-top: 1px solid var(--line); padding-top: 18px; font-family: Inter, sans-serif; font-size: 14px; }
.post-nav a:last-child { text-align: right; }

.about-page { display: grid; gap: 48px; }
.about-hero {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: clamp(24px, 5vw, 64px);
  align-items: center;
  padding: 8px 0 48px;
  border-bottom: 1px solid var(--line);
}
.profile-portrait { width: 220px; height: 220px; margin: 0; border: 1px solid var(--line); background: #111; display: grid; place-items: center; }
.profile-portrait-mark { color: #d4d4d4; font-family: "Nosifer", cursive; font-size: 58px; line-height: 1; }
.profile-copy h1 { font-size: clamp(48px, 7vw, 84px); }
.profile-copy .bio { margin-bottom: 16px; }
.profile-facts { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); width:min(100%, 500px); margin:24px 0 18px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); font-family:Inter, system-ui, sans-serif; }
.profile-facts > div { display:grid; gap:4px; min-width:0; padding:12px 16px 13px 0; }
.profile-facts > div + div { padding-left:16px; border-left:1px solid var(--line); }
.profile-facts dt { color:#9e9694; font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.profile-facts dd { margin:0; color:#efebea; font:600 clamp(19px, 2.4vw, 27px)/1.1 "Cormorant Garamond", Georgia, serif; }
.text-link { font-family: Inter, system-ui, sans-serif; font-size: 14px; color: #d8d8d8; border-bottom: 1px solid var(--red-hot); }
.archive-doors {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.archive-door {
  min-height: 190px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
  padding: clamp(22px, 4vw, 44px);
  transition: background .2s ease, color .2s ease;
}
.archive-door + .archive-door { border-left: 1px solid var(--line); }
.archive-door:hover { background: rgba(139, 0, 0, .11); }
.archive-door strong { color: #f0eeee; font-size: clamp(27px, 3vw, 42px); font-weight: 600; line-height: 1.1; }
.archive-door > span:last-child { color: #aaa; }
.contact-section {
  display: grid;
  grid-template-columns: minmax(240px, .72fr) minmax(0, 1.28fr);
  gap: clamp(32px, 6vw, 80px);
  align-items: start;
  padding-top: 8px;
}
.contact-intro h2, .trace-aside h2, .trace-feed-head h2 { font-size: clamp(32px, 5vw, 58px); margin-bottom: 14px; }
.contact-intro p:last-child { max-width: 440px; color: #aaa; }
.contact-form {
  display: grid;
  gap: 18px;
  padding: clamp(20px, 3vw, 34px);
  border: 1px solid var(--line);
  background: rgba(17, 17, 17, .78);
}
.contact-form-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.contact-form label { display: grid; gap: 6px; font-family: Inter, sans-serif; font-size: 12px; color: #888; text-transform: uppercase; }
textarea {
  width: 100%;
  border: 1px solid var(--line);
  background: rgba(10, 10, 10, .88);
  color: #eee;
  padding: 12px;
  resize: vertical;
  outline: none;
}
textarea:focus { border-color: var(--red-hot); box-shadow: 0 0 0 3px rgba(139, 0, 0, .18); }
.form-status { min-height: 22px; margin: 0; color: #aaa; font-size: 13px; }
.form-status.success { color: #d7ffd7; }
.form-status.error { color: #ffd6d6; }
.contact-form-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; }

.traces-page { display: grid; gap: 32px; }
.traces-hero { display: flex; justify-content: space-between; gap: 24px; align-items: end; padding-bottom: 28px; border-bottom: 1px solid var(--line); }
.traces-hero h1 { font-size: clamp(40px, 7vw, 80px); }
.traces-hero > p { max-width: 330px; margin: 0; color: #aaa; }
.trace-workspace { display: grid; grid-template-columns: minmax(0, 1fr) minmax(230px, .42fr); gap: clamp(24px, 5vw, 64px); align-items: stretch; }
.trace-editor { display: grid; align-content: start; background: rgba(17, 17, 17, .8); border: 1px solid var(--line); }
.editor-identity { display: flex; align-items: center; gap: 12px; padding: 18px 20px; }
.editor-mark { display: grid; place-items: center; flex: 0 0 38px; height: 38px; border: 1px solid var(--red-hot); color: var(--red-hot); font-family: Inter, sans-serif; font-size: 22px; line-height: 1; }
.editor-identity label { display: grid; gap: 1px; flex: 1; font-family: Inter, sans-serif; font-size: 11px; color: #888; text-transform: uppercase; }
.editor-identity input { min-height: 25px; padding: 0; border: 0; background: transparent; color: #eee; font-family: "Cormorant Garamond", Georgia, serif; font-size: 20px; }
.editor-identity input:focus { box-shadow: none; }
.editor-writing textarea { min-height: 210px; border-width: 1px 0; background: rgba(10, 10, 10, .52); font-size: 23px; line-height: 1.55; }
.trace-richtext { display:grid; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(10,10,10,.52); }
.trace-format-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:2px; min-height:45px; padding:6px 12px; border-bottom:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.035); }
.trace-format-toolbar button { display:grid; width:31px; height:31px; place-items:center; border:0; border-radius:4px; background:transparent; color:#d4d0cd; cursor:pointer; font-size:18px; }
.trace-format-toolbar button:hover,.trace-format-toolbar button:focus-visible,.trace-format-toolbar button.is-active { background:#7f2227; color:#fff; outline:2px solid #e2797d; outline-offset:1px; }
.trace-toolbar-divider { width:1px; height:22px; margin:0 5px; background:rgba(255,255,255,.16); }
.trace-rich-input { min-height:230px; padding:18px 20px; outline:0; color:#e7e1de; font:500 23px/1.55 "Cormorant Garamond",Georgia,serif; overflow-wrap:anywhere; }
.trace-rich-input:empty::before { color:#7d7672; content:attr(data-placeholder); pointer-events:none; }
.trace-rich-input:focus { box-shadow:inset 3px 0 0 #aa3439; }
.trace-rich-input p { margin:0 0 16px; }.trace-rich-input p:last-child { margin-bottom:0; }
.trace-rich-input strong,.trace-rich-input b { color:#fff7f4; font-weight:800 !important; }.trace-rich-input em,.trace-rich-input i { color:#eadfda; font-style:italic !important; }.trace-rich-input s,.trace-rich-input strike,.trace-rich-input del { color:#aaa19d; text-decoration:line-through !important; }
.trace-rich-input code { padding:2px 5px; background:#252020; color:#eeb4b2; font:12px/1.45 ui-monospace,SFMono-Regular,Consolas,monospace; }
.trace-rich-input blockquote { margin:12px 0; padding:3px 0 3px 16px; border-left:2px solid #bd464a; color:#d9cfca; }
.trace-rich-input ul,.trace-rich-input ol { margin:12px 0; padding-left:26px; }.trace-rich-input li { margin:4px 0; }
.trace-plain-input { display:block; }.trace-plain-input textarea { display:block; width:100%; min-height:230px; padding:18px 20px; resize:vertical; border:0; outline:0; color:#e7e1de; background:rgba(10,10,10,.52); font:500 23px/1.55 "Cormorant Garamond",Georgia,serif; overflow-wrap:anywhere; }.trace-plain-input textarea:focus { box-shadow:inset 3px 0 0 #aa3439; }
.trace-preview { border-bottom: 1px solid var(--line); background: #0d0d0d; }
.trace-preview img { width: 100%; max-height: 500px; object-fit: contain; }
.editor-footer { display: flex; align-items: center; gap: 14px; padding: 16px 20px; }
.media-picker { display: inline-flex; align-items: center; min-height: 40px; padding: 0 12px; border: 1px solid var(--line); color: #d6d6d6; cursor: pointer; font-family: Inter, sans-serif; font-size: 12px; text-transform: uppercase; }
.media-picker:hover { border-color: var(--red-hot); }
.character-count { margin-left: auto; color: #777; font-family: Inter, sans-serif; font-size: 12px; }
.trace-aside { display: flex; flex-direction: column; justify-content: center; padding: 24px 0 24px 28px; border-left: 1px solid var(--line); }
.trace-aside p:last-child { margin-bottom: 0; color: #aaa; }
.trace-honeypot { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; }
.trace-feed { padding-top: 28px; border-top: 1px solid var(--line); }
.trace-feed-head { margin-bottom: 22px; }
.trace-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.trace-card, .empty-trace {
  display: grid;
  gap: 14px;
  align-content: start;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  background: rgba(17, 17, 17, .78);
  padding: 20px;
}
.trace-card img {
  width: calc(100% + 40px);
  max-width: none;
  height: 280px;
  margin: -20px -20px 0;
  border-bottom: 1px solid var(--line);
  background: #101010;
}
.trace-card p { margin: 14px 0 0; color: #d4d4d4; font-size: 18px; line-height: 1.7; }
.notice {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  font-family: Inter, sans-serif;
  font-size: 13px;
}
.notice.success { color: #d7ffd7; border-color: rgba(0, 255, 65, .28); background: rgba(0, 255, 65, .055); }
.notice.error { color: #ffd6d6; border-color: rgba(178, 34, 34, .5); background: rgba(139, 0, 0, .12); }
.empty-trace { grid-column: 1 / -1; color: #999; font-family: Inter, sans-serif; font-size: 14px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.eclipse { --red: #2d1b69; --red-hot: #00ff41; }

.home-shell { position:relative; z-index:2; width:min(1320px, calc(100% - 48px)); margin:0 auto; padding:clamp(30px, 6vw, 86px) 0 54px; }
.home-hero { display:grid; grid-template-columns:minmax(0, .88fr) minmax(360px, 1.12fr); min-height:min(690px, calc(100vh - 140px)); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.home-copy { display:grid; align-content:center; justify-items:start; padding:clamp(34px, 7vw, 104px) clamp(22px, 5vw, 76px) clamp(34px, 7vw, 104px) 0; }
.home-copy h1 { max-width:620px; margin:0; font-size:clamp(52px, 7.8vw, 118px); }
.home-intro { max-width:480px; margin:18px 0 0; color:#d6d3d1; font-size:clamp(22px, 2.2vw, 31px); line-height:1.4; }
.home-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 20px; margin-top:32px; font-family:Inter, system-ui, sans-serif; }
.text-link { position:relative; padding:8px 0; color:#c4a6a6; font-size:13px; }.text-link::after { position:absolute; right:0; bottom:3px; left:0; height:1px; background:var(--red-hot); content:""; transform:scaleX(.35); transform-origin:left; transition:transform .2s ease; }.text-link:hover::after,.text-link:focus-visible::after { transform:scaleX(1); }.text-link:focus-visible { outline:1px solid var(--red-hot); outline-offset:4px; }
.home-quiet-note { max-width:360px; margin:42px 0 0; color:#797675; font:12px/1.65 Inter, system-ui, sans-serif; }
.home-featured { position:relative; display:grid; grid-template-rows:minmax(360px, 1fr) auto; min-height:0; overflow:hidden; background:#111; }.home-featured::after { position:absolute; right:0; bottom:0; left:0; height:45%; background:linear-gradient(transparent, rgba(0,0,0,.75)); content:""; pointer-events:none; }
.home-featured-media { position:relative; display:grid; min-height:390px; place-items:center; overflow:hidden; background:#111; }.home-featured-media::before { position:absolute; inset:18px; z-index:1; border:1px solid rgba(201, 78, 78, .38); content:""; pointer-events:none; }.home-featured-media img { width:100%; height:100%; min-height:390px; object-fit:cover; filter:brightness(.6) saturate(.72); transition:transform .55s ease, filter .35s ease; }.home-featured:hover .home-featured-media img { transform:scale(1.025); filter:brightness(.75) saturate(.82); }.home-featured-media span { color:#7e292d; font:clamp(100px, 16vw, 210px)/1 Nosifer, fantasy; opacity:.72; }
.home-featured-copy { position:relative; z-index:2; display:grid; gap:14px; margin-top:-185px; padding:30px clamp(24px, 4vw, 52px) 34px; color:#ece9e6; font-family:Inter, system-ui, sans-serif; }.home-featured-copy > div { display:flex; justify-content:space-between; gap:14px; color:#c98182; font-size:11px; letter-spacing:.09em; text-transform:uppercase; }.home-featured-copy p { margin:0; }.home-featured-copy time { color:#aaa3a1; white-space:nowrap; }.home-featured-copy strong { max-width:620px; font:600 clamp(19px, 2vw, 29px)/1.35 "Cormorant Garamond", Georgia, serif; }.home-featured-copy > span { color:#e4b5b5; font-size:12px; }
.home-routes { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); border-bottom:1px solid var(--line); }.home-routes a { display:grid; grid-template-columns:34px minmax(0, 1fr); gap:13px; min-height:144px; padding:24px; border-right:1px solid var(--line); transition:background .2s ease; }.home-routes a:last-child { border-right:0; }.home-routes a:hover { background:rgba(139, 0, 0, .09); }.home-routes > a > span { color:#bb5558; font:11px/1.5 "Source Code Pro", monospace; }.home-routes strong,.home-routes small { display:block; }.home-routes strong { color:#e8e5e2; font-size:23px; line-height:1.2; }.home-routes small { margin-top:7px; color:#8f8c89; font:12px/1.55 Inter, system-ui, sans-serif; }
.home-listening-wrap { display:grid; grid-template-columns:88px minmax(0, 1fr); width:min(660px, 100%); gap:16px; margin:42px 0 0; padding:14px; border:1px solid var(--line); background:rgba(17,17,17,.84); font-family:Inter, system-ui, sans-serif; box-shadow:0 18px 42px rgba(0,0,0,.2); }
@keyframes sigil {
  0%, 100% { transform: rotateX(0deg) scale(1); filter: blur(0); }
  50% { transform: rotateX(10deg) scale(1.025); filter: blur(.4px); }
}

@media (max-width: 1024px) {
  .home-shell { width:min(100% - 32px, 880px); padding-top:28px; }
  .home-hero { grid-template-columns:1fr; min-height:0; }
  .home-copy { padding:62px 34px 48px; }
  .home-featured { grid-template-rows:420px auto; }.home-featured-media { min-height:420px; }.home-featured-media img { min-height:420px; }
  .post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reader { grid-template-columns: 1fr; }
  .reader-media { position: static; }
  .contact-section, .trace-workspace { grid-template-columns: 1fr; }
  .trace-aside { padding: 24px 0; border-left: 0; border-top: 1px solid var(--line); }
  .trace-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  body { font-size: 18px; }
  .site-header { align-items: center; flex-direction: row; gap: 12px; padding: 14px 16px; }
  .site-nav { right: 16px; width: min(320px, calc(100vw - 32px)); }
  .home-shell { width:100%; padding:0 16px 38px; }
  .home-hero { margin:0; border-top:0; }.home-copy { padding:48px 8px 40px; }.home-copy h1 { font-size:clamp(50px, 16vw, 78px); }.home-intro { margin-top:14px; font-size:24px; }.home-actions { align-items:flex-start; gap:10px 18px; margin-top:26px; }.home-quiet-note { margin-top:30px; }.home-featured { grid-template-rows:350px auto; }.home-featured-media,.home-featured-media img { min-height:350px; }.home-featured-media::before { inset:12px; }.home-featured-copy { gap:12px; margin-top:-150px; padding:24px 22px 28px; }.home-featured-copy > div { align-items:flex-start; flex-direction:column; gap:2px; }.home-featured-copy time { white-space:normal; }.home-routes { grid-template-columns:1fr; }.home-routes a { min-height:0; padding:20px 8px; border-right:0; border-bottom:1px solid var(--line); }.home-routes a:last-child { border-bottom:0; }.home-routes strong { font-size:21px; }.home-listening-wrap { grid-template-columns:72px minmax(0, 1fr); gap:12px; width:100%; margin-top:30px; padding:11px; }.home-listening-wrap .now-listening-cover { width:72px; height:72px; }
  .toolbar { grid-template-columns: 1fr; }
  .post-grid { grid-template-columns: 1fr; }
  .trace-grid, .share-card-grid { grid-template-columns: 1fr; }
  .about-hero { grid-template-columns: 1fr; }
  .profile-portrait { width: min(220px, 100%); }
  .profile-facts { width:100%; max-width:420px; }
  .archive-doors, .contact-form-row { grid-template-columns: 1fr; }
  .archive-door + .archive-door { border-top: 1px solid var(--line); border-left: 0; }
  .traces-hero { display: grid; align-items: start; }
  .editor-footer { flex-wrap: wrap; }
  .character-count { margin-left: 0; }
  .editor-footer .button { margin-left: auto; }
  .post-nav { grid-template-columns: 1fr; }
  .post-nav a:last-child { text-align: left; }
  .now-listening, .now-listening--page { grid-template-columns: 72px minmax(0, 1fr); gap: 12px; width: 100%; margin-top: 24px; padding: 11px; }
  .now-listening--page { margin-bottom: 28px; }
  .now-listening-cover, .now-listening--page .now-listening-cover { width: 72px; height: 72px; }
  .now-listening-cover::after { inset: 7px; }
  .now-listening strong { font-size: 16px; }
  .now-listening-topline span { font-size: 9px; }
  .echo-grid { grid-template-columns: 1fr; }
  .echo-card { grid-template-columns: 86px minmax(0, 1fr); }
  .echo-thumb { height: 100%; min-height: 92px; }
  .diary-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .diary-filter-grid { grid-template-columns: 1fr 1fr; }
  .diary-filter-grid label:first-child { grid-column: 1 / -1; }
  .diary-layout { grid-template-columns: 1fr; gap: 28px; }
  .diary-insights { position: static; }
  .diary-entry { grid-template-columns: 46px minmax(0, 1fr) auto; gap: 10px; }
  .diary-cover { width: 46px; height: 46px; }
}

@media (max-width: 460px) {
  .diary-filterbar { padding: 13px; }
  .diary-filter-grid { grid-template-columns: 1fr; }
  .diary-filter-grid label:first-child { grid-column: auto; }
  .diary-filter-status { align-items: flex-start; flex-direction: column; }
  .diary-summary span { padding: 13px; }
  .diary-day > header h2 { font-size: 27px; }
}

/* Ana sayfa: arşiv görseli ile metni ayrı, okunabilir iki katmanda tutar. */
.home-hero { min-height:min(640px, calc(100vh - 132px)); }
.home-featured { grid-template-rows:minmax(0, 1fr) auto; min-height:0; background:#101010; box-shadow:0 26px 54px rgba(0,0,0,.22); }
.home-featured::after { display:none; }
.home-featured-media { min-height:0; height:100%; background:#0c0c0c; }
.home-featured-media::before { display:none; }
.home-featured-media img { min-height:0; height:100%; filter:brightness(.72) saturate(.7) contrast(1.03); }
.home-featured:hover .home-featured-media img { filter:brightness(.8) saturate(.78) contrast(1.03); }
.home-featured-copy { display:grid; gap:12px; margin:0; padding:22px clamp(24px, 3vw, 38px) 24px; border-top:1px solid rgba(255,255,255,.07); background:#101010; }
.home-featured-copy > div { align-items:center; color:#a76d6e; font-size:10px; }
.home-featured-copy > p { display:-webkit-box; overflow:hidden; max-width:560px; margin:0; color:#efedeb; font:600 clamp(20px, 1.75vw, 27px)/1.35 "Cormorant Garamond", Georgia, serif; -webkit-box-orient:vertical; -webkit-line-clamp:3; }
.home-featured-action { width:max-content; padding-bottom:3px; border-bottom:1px solid var(--red-hot); color:#d5a2a3; font:11px Inter,system-ui,sans-serif; }
.home-featured:hover .home-featured-action { color:#fff1f1; }
.home-listening-wrap { grid-template-columns:160px 76px minmax(0, 1fr); width:100%; max-width:900px; gap:16px; margin:48px 0 0; padding:18px 0; border:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:transparent; box-shadow:none; }
.home-listening-signature { display:grid; align-content:center; gap:3px; padding:0 18px 0 0; border-right:1px solid var(--line); font-family:Inter,system-ui,sans-serif; }
.home-listening-signature span { color:#a75b5e; font:10px "Source Code Pro",monospace; }
.home-listening-signature p { margin:0; color:#e4e0dd; font-size:12px; font-weight:600; letter-spacing:.03em; text-transform:uppercase; }
.home-listening-signature small { color:#777473; font-size:10px; line-height:1.45; }
.home-listening-wrap .now-listening-cover { width:76px; height:76px; border-color:rgba(178,34,34,.36); }
.home-listening-wrap .now-listening-cover::after { inset:7px; }
.home-listening-wrap .now-listening-copy { gap:3px; }
.home-listening-wrap .now-listening-topline p { color:#a76d6e; font-size:9px; }
.home-listening-wrap .now-listening-progress { margin-top:7px; }
.home-listening-wrap .now-listening-time { margin-top:1px; }

@media (max-width:1024px) {
  .home-featured { grid-template-rows:430px auto; }
  .home-featured-media { height:430px; }
}
@media (max-width:720px) {
  .home-featured { grid-template-rows:310px auto; }
  .home-featured-media { height:310px; }
  .home-featured-copy { padding:18px 18px 21px; }
  .home-featured-copy > p { font-size:23px; -webkit-line-clamp:4; }
  .home-listening-wrap { grid-template-columns:60px minmax(0,1fr); gap:12px; margin-top:32px; padding:14px 0; }
  .home-listening-signature { grid-column:1/-1; grid-template-columns:auto 1fr; gap:2px 10px; padding:0 0 10px; border-right:0; border-bottom:1px solid rgba(255,255,255,.07); }
  .home-listening-signature span { grid-row:1/span 2; align-self:center; }
  .home-listening-signature small { grid-column:2; }
  .home-listening-wrap .now-listening-cover { width:60px; height:60px; }
}

/* Ana sayfa: tek parça, görselin taşıdığı editoryal açılış. */
.home-page { background:#090909; }
.home-shell { width:min(1460px, calc(100% - 64px)); padding:28px 0 86px; }
.home-hero { position:relative; display:block; min-height:clamp(640px, calc(100vh - 128px), 820px); overflow:hidden; border:0; background:#111; isolation:isolate; }
.home-hero.is-featured-hidden { min-height:clamp(500px, calc(100vh - 128px), 680px); background:linear-gradient(115deg, #111 0%, #171010 100%); }
.home-hero.is-featured-hidden .home-copy { max-width:780px; }
.home-featured { position:absolute; inset:0; display:block; min-height:0; overflow:hidden; background:#0e0e0e; box-shadow:none; }
.home-featured::before { position:absolute; z-index:1; inset:0; background:linear-gradient(90deg, rgba(5,5,5,calc(var(--home-hero-overlay, .72) + .18)) 0%, rgba(5,5,5,var(--home-hero-overlay, .72)) 34%, rgba(5,5,5,calc(var(--home-hero-overlay, .72) * .44)) 64%, rgba(5,5,5,calc(var(--home-hero-overlay, .72) * .32)) 100%), linear-gradient(0deg, rgba(5,5,5,calc(var(--home-hero-overlay, .72) * .88)) 0%, transparent 45%); content:""; pointer-events:none; }
.home-featured::after { position:absolute; z-index:1; right:0; bottom:0; left:0; display:block; height:1px; background:rgba(185,51,54,.62); content:""; }
.home-featured-media { position:absolute; inset:0; display:block; width:100%; height:100%; min-height:0; background:#111; }
.home-featured-media::before { display:none; }
.home-featured-media img { width:100%; height:100%; min-height:0; object-fit:cover; object-position:center; filter:grayscale(var(--home-hero-grayscale, 20%)) brightness(var(--home-hero-brightness, .72)) contrast(1.08); transform:scale(var(--home-hero-zoom, 1)); }
.home-featured:hover .home-featured-media img { transform:scale(calc(var(--home-hero-zoom, 1) + .01)); filter:grayscale(var(--home-hero-grayscale, 20%)) brightness(var(--home-hero-brightness, .72)) contrast(1.08); }
.home-featured-media span { position:absolute; inset:0; display:grid; place-items:center; color:rgba(170,45,48,.32); font:clamp(120px, 22vw, 290px)/1 Nosifer, fantasy; }
.home-copy { position:relative; z-index:2; display:flex; min-height:clamp(640px, calc(100vh - 128px), 820px); max-width:660px; align-items:flex-start; flex-direction:column; justify-content:center; padding:clamp(58px, 8vw, 126px); padding-right:38px; }
.home-copy .kicker { margin-bottom:17px; color:#cf6869; font-size:10px; letter-spacing:.22em; }
.home-copy h1 { max-width:560px; color:#f2efec; font-size:clamp(62px, 8.1vw, 132px); font-weight:600; line-height:.86; text-wrap:balance; text-shadow:0 4px 28px rgba(0,0,0,.33); }
.home-intro { max-width:420px; margin:28px 0 0; color:#d9d3cf; font-size:clamp(21px, 2vw, 30px); line-height:1.35; }
.home-actions { gap:12px 22px; margin-top:36px; }
.home-actions .button.primary { min-height:46px; border-color:#b73e41; background:#a3262a; box-shadow:none; }
.home-actions .button.primary:hover { background:#c13c40; box-shadow:none; transform:translateY(-1px); }
.home-actions .text-link { color:#e0d5d2; }
.home-quiet-note { max-width:310px; margin-top:54px; color:#918987; font-size:11px; line-height:1.75; }
.home-featured-copy { position:absolute; z-index:2; right:clamp(24px, 4.3vw, 74px); bottom:clamp(28px, 5vw, 68px); display:grid; width:min(470px, calc(100% - 48px)); gap:12px; margin:0; padding:0; border:0; background:transparent; color:#f0ece8; text-align:left; }
.home-featured-copy > div { display:flex; align-items:center; justify-content:space-between; gap:14px; color:#d59b9a; font:10px/1 Inter,system-ui,sans-serif; letter-spacing:.13em; text-transform:uppercase; }
.home-featured-copy > .home-featured-meta { display:inline-flex; width:max-content; max-width:100%; justify-content:flex-start; gap:10px; }
.home-featured-copy > p { display:-webkit-box; overflow:hidden; margin:0; color:#f0ece9; font:600 clamp(22px, 2vw, 34px)/1.18 "Cormorant Garamond", Georgia, serif; -webkit-box-orient:vertical; -webkit-line-clamp:3; text-shadow:0 2px 18px rgba(0,0,0,.68); }
.home-featured-copy time { color:#bcb3af; font-size:10px; letter-spacing:.06em; white-space:nowrap; }
.home-featured-meta time { display:inline-flex; align-items:center; min-height:14px; padding-left:10px; border-left:1px solid rgba(213,155,154,.46); }
.home-featured-action { display:flex; width:max-content; align-items:center; gap:8px; padding:0 0 5px; border-bottom:1px solid #bc3e42; color:#f1dfdc; font:11px/1 Inter,system-ui,sans-serif; }
.home-featured-action::after { content:"\2197"; font-size:14px; }
.home-routes { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); margin-top:36px; border-top:1px solid rgba(255,255,255,.1); border-bottom:1px solid rgba(255,255,255,.1); }
.home-routes a { grid-template-columns:28px minmax(0,1fr); min-height:118px; padding:22px 0; border-right:0; transition:color .2s ease, background .2s ease; }
.home-routes a + a { border-left:1px solid rgba(255,255,255,.1); padding-left:26px; }
.home-routes a:not(:last-child) { padding-right:26px; }
.home-routes a:hover { background:transparent; color:#fff; }
.home-routes > a > span { color:#9c4749; }
.home-routes strong { color:#e9e5e1; font-size:24px; font-weight:600; }
.home-routes small { max-width:230px; color:#898583; }
.home-listening-wrap { grid-template-columns:140px 72px minmax(0, 1fr); width:min(820px, 100%); gap:18px; margin:52px 0 0; padding:0; border:0; background:transparent; box-shadow:none; }
.home-listening-signature { padding:8px 16px 8px 0; border-right:1px solid rgba(255,255,255,.1); }
.home-listening-signature p { color:#e5dfda; }
.home-listening-wrap .now-listening-cover { width:72px; height:72px; border:0; background:#171211; }
.home-listening-wrap .now-listening-cover::after { display:none; }
.home-listening-wrap .now-listening-copy { min-height:72px; gap:3px; }
.home-listening-wrap .now-listening-topline p { color:#bf7475; }
.home-listening-wrap .now-listening-progress { max-width:470px; background:rgba(255,255,255,.13); }

@media (max-width:1024px) {
  .home-shell { width:min(100% - 40px, 920px); }
  .home-hero,.home-copy { min-height:700px; }
  .home-copy { max-width:570px; padding:76px 54px; }
  .home-featured-copy { right:36px; bottom:38px; }
}
@media (max-width:720px) {
  .home-shell { width:100%; padding:0 16px 54px; }
  .home-hero { min-height:680px; margin:0; }
  .home-featured::before { background:linear-gradient(180deg, rgba(5,5,5,calc(var(--home-hero-overlay, .72) * .6)) 0%, rgba(5,5,5,calc(var(--home-hero-overlay, .72) + .12)) 54%, rgba(5,5,5,calc(var(--home-hero-overlay, .72) + .22)) 100%); }
  .home-copy { min-height:680px; max-width:100%; justify-content:flex-start; padding:74px 24px 238px; }
  .home-copy h1 { max-width:360px; font-size:clamp(58px, 18vw, 88px); }
  .home-intro { max-width:310px; margin-top:21px; font-size:23px; }
  .home-actions { gap:10px 18px; margin-top:30px; }
  .home-quiet-note { margin-top:34px; }
  .home-featured-copy { right:24px; bottom:29px; left:24px; width:auto; }
  .home-featured-copy > div { align-items:flex-start; flex-direction:column; gap:5px; }
  .home-featured-copy > .home-featured-meta { flex-direction:row; flex-wrap:wrap; align-items:center; gap:8px; }
  .home-featured-copy > p { font-size:25px; -webkit-line-clamp:3; }
  .home-routes { grid-template-columns:1fr; margin-top:22px; }
  .home-routes a,.home-routes a + a,.home-routes a:not(:last-child) { min-height:0; padding:18px 0; border-right:0; border-left:0; }
  .home-routes a + a { border-top:1px solid rgba(255,255,255,.1); }
  .home-routes strong { font-size:22px; }
  .home-listening-wrap { grid-template-columns:60px minmax(0,1fr); gap:13px; margin-top:36px; }
  .home-listening-signature { grid-column:1/-1; grid-template-columns:auto 1fr; gap:2px 10px; padding:0 0 12px; border-right:0; border-bottom:1px solid rgba(255,255,255,.1); }
  .home-listening-signature span { grid-row:1 / span 2; align-self:center; }
  .home-listening-signature small { grid-column:2; }
  .home-listening-wrap .now-listening-cover { width:60px; height:60px; }
  .home-listening-wrap .now-listening-copy { min-height:60px; }
}

/* Ana sayfadaki gecisler ve dinleme kaydi, acik eylemlerle okunur kalir. */
.home-routes a {
  display:grid;
  grid-template-columns:28px minmax(0, 1fr) auto;
  align-items:center;
  column-gap:15px;
  min-height:132px;
  transition:background .2s ease, color .2s ease;
}
.home-routes a > div { min-width:0; }
.home-routes a > .home-route-index { align-self:start; padding-top:4px; }
.home-routes .home-route-action {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-width:102px;
  min-height:34px;
  padding:0 11px;
  border:1px solid rgba(205,96,98,.45);
  color:#e1b0af;
  font:10px/1 Inter,system-ui,sans-serif;
  letter-spacing:.07em;
  text-transform:uppercase;
  white-space:nowrap;
  transition:background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}
.home-routes .home-route-action i { font-size:15px; font-style:normal; transition:transform .2s ease; }
.home-routes a:hover,
.home-routes a:focus-visible { background:rgba(169,38,42,.08); outline:0; }
.home-routes a:hover .home-route-action,
.home-routes a:focus-visible .home-route-action { border-color:#cf5052; background:#a82c30; color:#fff8f6; transform:translateY(-1px); }
.home-routes a:hover .home-route-action i,
.home-routes a:focus-visible .home-route-action i { transform:translateX(3px); }

.home-listening-wrap {
  grid-template-columns:170px 86px minmax(0, 1fr) auto;
  align-items:center;
  width:min(100%, 1060px);
  max-width:1060px;
  gap:21px;
  margin:58px auto 0;
  padding:22px 26px;
  border:1px solid rgba(255,255,255,.11);
  background:linear-gradient(90deg, rgba(255,255,255,.025), rgba(255,255,255,0));
}
.home-listening-signature { min-height:86px; align-content:center; padding-left:0; }
.home-listening-wrap .now-listening-cover { width:86px; height:86px; }
.home-listening-wrap .now-listening-copy { min-width:0; }
.home-listening-wrap .now-listening-copy strong,
.home-listening-wrap .now-listening-artist,
.home-listening-wrap .now-listening-meta { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.home-listening-wrap .now-listening-progress { width:100%; max-width:none; }
.home-listening-link {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:38px;
  padding:0 13px;
  border:1px solid rgba(255,255,255,.22);
  color:#d6cfca;
  font:10px/1 Inter,system-ui,sans-serif;
  letter-spacing:.07em;
  text-transform:uppercase;
  white-space:nowrap;
  transition:background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}
.home-listening-link span { font-size:15px; transition:transform .2s ease; }
.home-listening-link:hover,
.home-listening-link:focus-visible { border-color:#c64b4e; background:rgba(169,38,42,.16); color:#fff; outline:0; transform:translateY(-1px); }
.home-listening-link:hover span,
.home-listening-link:focus-visible span { transform:translateX(3px); }

/* Ana sayfada yalnızca müzik kapağı dış çerçeve taşır. */
.home-featured-media::before { display:none; }
.home-listening-wrap .now-listening-cover { border:0; outline:1px solid rgba(205,96,98,.35); outline-offset:4px; }

.profile-portrait { position:relative; overflow:hidden; background:#101010; }
.profile-portrait > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:grayscale(.28) contrast(1.04); }
.profile-portrait::after { display:none; }
.profile-portrait-mark { position:relative; z-index:1; }
.archive-door { display:grid; grid-template-rows:auto auto minmax(0,1fr) auto; align-items:start; min-height:226px; gap:11px; }
.archive-door > span:last-child { color:#aaa; }
.archive-door > .archive-door-action { display:inline-flex; width:max-content; min-width:106px; min-height:34px; align-items:center; justify-content:center; gap:9px; padding:0 11px; border:1px solid rgba(205,96,98,.45); color:#e1b0af; font:10px/1 Inter,system-ui,sans-serif; letter-spacing:.07em; text-transform:uppercase; white-space:nowrap; transition:background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease; }
.archive-door-action i { font-size:15px; font-style:normal; transition:transform .2s ease; }
.archive-door:hover .archive-door-action,.archive-door:focus-visible .archive-door-action { border-color:#cf5052; background:#a82c30; color:#fff8f6; transform:translateY(-1px); }
.archive-door:hover .archive-door-action i,.archive-door:focus-visible .archive-door-action i { transform:translateX(3px); }
.archive-door:focus-visible { outline:1px solid #cf5052; outline-offset:-1px; }

@media (max-width:720px) {
  .home-routes a,
  .home-routes a + a,
  .home-routes a:not(:last-child) {
    grid-template-columns:24px minmax(0, 1fr);
    gap:4px 12px;
    min-height:0;
    padding:18px 4px;
  }
  .home-routes a > .home-route-index { grid-row:1 / span 2; padding-top:3px; }
  .home-routes .home-route-action { grid-column:2; justify-self:start; min-width:96px; min-height:32px; margin-top:8px; }
  .home-listening-wrap {
    grid-template-columns:60px minmax(0, 1fr);
    gap:12px;
    width:100%;
    margin:38px 0 0;
    padding:14px 0 15px;
    border-right:0;
    border-left:0;
    background:transparent;
  }
  .home-listening-signature { grid-column:1 / -1; min-height:0; }
  .home-listening-link { grid-column:1 / -1; justify-self:start; margin-top:3px; }
  .home-listening-wrap .now-listening-cover { outline-offset:3px; }
  .archive-door { min-height:0; }
}

/* Community trace feed and individual trace reader. */
.trace-feed-head { display:flex; justify-content:space-between; align-items:end; gap:18px; }
.trace-feed-count { margin:0; color:#98918e; font:12px/1.4 Inter,system-ui,sans-serif; text-align:right; }
.trace-feed-count strong { color:#e8e2de; font-size:15px; font-weight:600; }
.trace-grid { align-items:stretch; }
.trace-card { min-height:352px; padding:0; border-color:rgba(138,66,68,.34); background:rgba(15,16,16,.92); transition:border-color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease; }
.trace-card:hover { border-color:rgba(204,76,79,.7); background:#161718; box-shadow:0 18px 44px rgba(0,0,0,.24); transform:translateY(-2px); }
.trace-card-link { display:grid; height:100%; color:inherit; text-decoration:none; }
.trace-card.has-image .trace-card-link { grid-template-rows:184px minmax(0,1fr); }
.trace-card-media { display:block; overflow:hidden; border-bottom:1px solid rgba(255,255,255,.1); background:#0d0e0f; }
.trace-card .trace-card-media img { display:block; width:100%; max-width:100%; height:100%; min-height:0; margin:0; border:0; object-fit:cover; transition:transform .35s ease, filter .25s ease; }
.trace-card:hover .trace-card-media img { transform:scale(1.025); filter:brightness(.78); }
.trace-card-copy { display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:13px; min-width:0; padding:18px; }
.trace-card .meta { align-items:center; color:#918784; font:11px/1.3 Inter,system-ui,sans-serif; }
.trace-card .meta span:first-child { overflow:hidden; color:#d6ceca; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.trace-card .meta time { flex:0 0 auto; color:#807875; font-size:10px; white-space:nowrap; }
.trace-card-excerpt { display:-webkit-box; overflow:hidden; align-self:start; color:#d8d3cf; font:500 18px/1.58 "Cormorant Garamond", Georgia, serif; -webkit-box-orient:vertical; -webkit-line-clamp:6; }
.trace-card-action { display:inline-flex; width:max-content; align-items:center; gap:8px; padding-bottom:4px; border-bottom:1px solid rgba(199,66,69,.72); color:#dea3a3; font:11px/1 Inter,system-ui,sans-serif; transition:color .2s ease, border-color .2s ease; }
.trace-card-action i { font-size:14px; font-style:normal; transition:transform .2s ease; }
.trace-card:hover .trace-card-action { border-color:#d8585b; color:#fff2f0; }
.trace-card:hover .trace-card-action i { transform:translateX(3px); }
.trace-card:focus-within { border-color:#d8585b; box-shadow:0 0 0 2px rgba(216,88,91,.18); }
.trace-card-link:focus-visible { outline:2px solid #e78284; outline-offset:-3px; }
.trace-pagination { display:grid; grid-template-columns:minmax(108px,1fr) auto minmax(108px,1fr); align-items:center; gap:14px; margin-top:30px; padding-top:20px; border-top:1px solid var(--line); font:12px/1 Inter,system-ui,sans-serif; }
.trace-pagination > a:last-child, .trace-pagination > .is-disabled:last-child { justify-self:end; }
.trace-pagination > a, .trace-pagination > .is-disabled { color:#d7d2cf; }
.trace-pagination > a:hover { color:#fff; }
.trace-pagination .is-disabled { color:#5f5d5b; cursor:default; }
.trace-pagination-pages { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; }
.trace-pagination-pages a, .trace-pagination-pages .is-current, .trace-pagination-pages > span { display:grid; min-width:31px; min-height:31px; place-items:center; border:1px solid var(--line); color:#bdb8b5; }
.trace-pagination-pages a:hover { border-color:#bf5153; color:#fff; }
.trace-pagination-pages .is-current { border-color:#b9474a; background:#92272b; color:#fff; }
.trace-pagination-pages > span:not(.is-current) { min-width:16px; border:0; }
.trace-detail-page { position:relative; z-index:2; width:min(880px, calc(100% - 32px)); margin:0 auto; padding:44px 0 92px; }
.trace-detail-back { display:inline-flex; align-items:center; gap:8px; margin-bottom:24px; color:#c7a19f; font:12px/1 Inter,system-ui,sans-serif; }
.trace-detail-back:hover { color:#fff2f0; }
.trace-detail-card { overflow:hidden; border:1px solid rgba(142,67,69,.45); background:rgba(15,16,16,.9); }
.trace-detail-head { display:flex; justify-content:space-between; align-items:end; gap:18px; padding:30px clamp(22px,4vw,44px); border-bottom:1px solid var(--line); }
.trace-detail-head h1 { margin:4px 0 0; color:#f1ece8; font-size:clamp(36px,6vw,65px); }
.trace-detail-head time { flex:0 0 auto; color:#a39a96; font:11px/1.35 Inter,system-ui,sans-serif; white-space:nowrap; }
.trace-detail-media { margin:0; background:#0c0d0e; }
.trace-detail-media img { display:block; width:100%; max-height:min(72vh,760px); object-fit:contain; }
.trace-detail-copy { max-width:760px; padding:clamp(28px,5vw,60px) clamp(22px,6vw,72px) clamp(30px,6vw,66px); }
.trace-detail-copy p { margin:0 0 25px; color:#e2ddda; font:500 clamp(21px,2.3vw,29px)/1.62 "Cormorant Garamond", Georgia, serif; }
.trace-detail-copy p:last-child { margin-bottom:0; }
.trace-detail-footer { display:flex; justify-content:space-between; gap:18px; padding:17px clamp(22px,4vw,44px); border-top:1px solid var(--line); color:#938a87; font:11px/1 Inter,system-ui,sans-serif; text-transform:uppercase; letter-spacing:.08em; }
.trace-detail-footer a { display:inline-flex; gap:8px; color:#e0b3b1; }
.trace-detail-footer a:hover { color:#fff; }
.trace-detail-footer i { font-style:normal; font-size:14px; }
.trace-detail-missing { display:grid; justify-items:start; gap:16px; min-height:420px; align-content:center; }
.trace-detail-missing h1 { margin:0; font-size:clamp(40px,7vw,76px); }
.trace-detail-missing p:not(.kicker) { max-width:430px; margin:0; color:#aaa3a0; }
@media (max-width:720px) {
  .trace-feed-head { align-items:start; flex-direction:column; gap:8px; }
  .trace-feed-count { text-align:left; }
  .trace-card { min-height:0; }
  .trace-card.has-image .trace-card-link { grid-template-rows:200px auto; }
  .trace-card-copy { min-height:230px; }
  .trace-card-excerpt { font-size:20px; -webkit-line-clamp:5; }
  .trace-pagination { grid-template-columns:1fr 1fr; gap:14px 10px; }
  .trace-pagination-pages { grid-column:1 / -1; grid-row:1; }
  .trace-pagination > a:last-child, .trace-pagination > .is-disabled:last-child { justify-self:end; }
  .trace-detail-page { width:min(100% - 32px, 880px); padding-top:30px; }
  .trace-detail-head { align-items:start; flex-direction:column; gap:10px; padding:25px 20px; }
  .trace-detail-head time { white-space:normal; }
  .trace-detail-copy { padding:30px 22px 38px; }
  .trace-detail-copy p { font-size:24px; }
  .trace-detail-footer { align-items:start; flex-direction:column; padding:17px 20px; }
}

/* Editorial reader for a single community trace. */
.trace-detail-page { width:min(980px, calc(100% - 32px)); padding:56px 0 104px; }
.trace-detail-back { min-height:34px; margin-bottom:32px; padding:0 0 5px; border-bottom:1px solid rgba(201,74,77,.55); color:#ddb0ae; letter-spacing:.04em; }
.trace-reader { overflow:hidden; border-top:1px solid rgba(203,77,80,.72); border-bottom:1px solid rgba(255,255,255,.12); background:rgba(13,14,14,.58); }
.trace-reader-head { display:grid; gap:12px; justify-items:start; padding:clamp(30px,6vw,70px) clamp(24px,8vw,112px) clamp(26px,5vw,54px); }
.trace-reader-head h1 { max-width:720px; margin:0; color:#f2edeb; font:600 clamp(42px,7vw,82px)/.98 "Cormorant Garamond", Georgia, serif; overflow-wrap:anywhere; }
.trace-reader-meta { display:flex; flex-wrap:wrap; gap:9px 14px; align-items:center; color:#aaa19e; font:11px/1.4 Inter,system-ui,sans-serif; }
.trace-reader-meta span { padding-left:14px; border-left:1px solid rgba(255,255,255,.22); color:#cc9796; }
.trace-reader-media { position:relative; margin:0 clamp(0px,3vw,30px); background:#080909; }
.trace-reader-media::after { position:absolute; inset:0; border:1px solid rgba(255,255,255,.09); content:""; pointer-events:none; }
.trace-reader-media img { display:block; width:100%; max-height:min(72vh,840px); object-fit:contain; }
.trace-reader-copy { display:grid; grid-template-columns:64px minmax(0,1fr); gap:clamp(14px,3vw,30px); max-width:860px; padding:clamp(40px,7vw,92px) clamp(24px,8vw,112px) clamp(42px,7vw,88px); }
.trace-reader-mark { color:#ba3e42; font:600 80px/.65 "Cormorant Garamond", Georgia, serif; }
.trace-reader-copy > div { min-width:0; }
.trace-reader-copy p { max-width:690px; margin:0 0 29px; color:#e2ddda; font:500 clamp(22px,2.6vw,31px)/1.64 "Cormorant Garamond", Georgia, serif; overflow-wrap:anywhere; }
.trace-reader-copy p:first-child::first-letter { float:left; margin:8px 10px 0 0; color:#dfaaab; font-size:1.72em; line-height:.72; }
.trace-reader-copy p:last-child { margin-bottom:0; }
.trace-reader-footer { display:grid; grid-template-columns:minmax(130px,1fr) auto minmax(130px,1fr); align-items:center; gap:18px; padding:20px clamp(24px,5vw,60px); border-top:1px solid rgba(255,255,255,.1); font-family:Inter,system-ui,sans-serif; }
.trace-reader-origin { display:grid; gap:4px; }
.trace-reader-origin span { color:#817975; font-size:10px; letter-spacing:.11em; text-transform:uppercase; }
.trace-reader-origin strong { color:#ded7d3; font-size:12px; font-weight:600; }
.trace-reader-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:7px; }
.trace-reader-actions button { min-height:35px; border:1px solid rgba(211,87,90,.52); background:transparent; color:#e8c4c1; padding:0 11px; cursor:pointer; font:11px/1 Inter,system-ui,sans-serif; transition:background .2s ease, border-color .2s ease, color .2s ease; }
.trace-reader-actions button:hover, .trace-reader-actions button:focus-visible { border-color:#d95a5d; background:#9d292e; color:#fff; outline:0; }
.trace-reader-actions [data-trace-share-status] { flex-basis:100%; min-height:15px; color:#a7c5aa; font-size:10px; text-align:center; }
.trace-reader-return { justify-self:end; display:inline-flex; align-items:center; gap:8px; color:#ddb0ae; font-size:11px; white-space:nowrap; }
.trace-reader-return:hover { color:#fff6f4; }
.trace-reader-return i { font-size:15px; font-style:normal; transition:transform .2s ease; }
.trace-reader-return:hover i { transform:translateX(3px); }
@media (max-width:720px) {
  .trace-detail-page { width:min(100% - 28px, 980px); padding:32px 0 70px; }
  .trace-detail-back { margin-bottom:21px; }
  .trace-reader-head { padding:34px 22px 26px; }
  .trace-reader-head h1 { font-size:clamp(45px,14vw,66px); }
  .trace-reader-media { margin:0; }
  .trace-reader-copy { grid-template-columns:34px minmax(0,1fr); gap:10px; padding:38px 22px 48px; }
  .trace-reader-mark { font-size:58px; }
  .trace-reader-copy p { font-size:25px; line-height:1.58; }
  .trace-reader-footer { grid-template-columns:1fr; justify-items:start; padding:20px 22px 24px; }
  .trace-reader-actions { justify-content:start; }
  .trace-reader-actions [data-trace-share-status] { text-align:left; }
  .trace-reader-return { justify-self:start; }
}

/* The trace detail deliberately uses the same quiet reading surface as post.html. */
.trace-post-detail { position:relative; z-index:2; }
.trace-post-detail .trace-reader { overflow:visible; border:0; background:transparent; }
.trace-post-detail .trace-reader--text-only { grid-template-columns:minmax(0,720px); justify-content:center; }
.trace-post-detail .trace-reader-text { min-width:0; max-width:720px; }
.trace-post-detail .trace-reader-meta { justify-content:flex-start; margin:0; color:var(--muted); font:12px/1.4 Inter,system-ui,sans-serif; }
.trace-post-detail .trace-reader-meta span { padding-left:12px; border-left:1px solid var(--line); color:#ba8b89; }
.trace-reader-signature { display:grid; gap:3px; margin:19px 0 28px; color:#ded8d4; font:600 13px/1.35 Inter,system-ui,sans-serif; }
.trace-reader-signature span { color:#af5455; font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.trace-post-copy { max-width:720px; }
.trace-post-copy p { max-width:100%; margin:0 0 25px; color:#e4dfdc; font:500 clamp(18px,1.9vw,23px)/1.64 "Cormorant Garamond", Georgia, serif; overflow-wrap:anywhere; }
.trace-post-copy p:last-child { margin-bottom:0; }
.trace-post-detail .share-cards { max-width:720px; }
.trace-post-detail .trace-reader-nav { max-width:720px; margin-top:34px; }
@media (max-width:820px) {
  .trace-post-detail .trace-reader { grid-template-columns:1fr; gap:28px; }
  .trace-post-detail .reader-media { position:static; }
  .trace-post-detail .trace-reader--text-only { grid-template-columns:1fr; }
  .trace-post-detail .trace-reader-text { max-width:none; }
}
@media (max-width:560px) {
  .trace-post-detail { width:min(100% - 28px, 1180px); padding-top:30px; padding-bottom:70px; }
  .trace-reader-signature { margin:16px 0 24px; }
  .trace-post-copy p { font-size:20px; line-height:1.62; }
  .trace-post-detail .share-card-grid { grid-template-columns:1fr; }
  .trace-post-detail .post-nav { grid-template-columns:1fr; justify-items:start; gap:12px; }
  .trace-post-detail .post-nav span { display:none; }
}

/* Trace composer: identity and upload choices should not look like ambiguous icons. */
.editor-identity { display:block; min-width:0; margin:0; padding:17px 20px 16px; border:0; border-bottom:1px solid rgba(255,255,255,.08); }
.editor-identity-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.editor-identity-title { margin:0; color:#a75a5b; font:700 10px/1 Inter,system-ui,sans-serif; letter-spacing:.13em; text-transform:uppercase; }
.editor-identity-heading > span { color:#8c8582; font:10px/1 Inter,system-ui,sans-serif; }
.editor-identity-input { display:block; margin-top:10px; }
.editor-identity-input input { width:100%; min-height:42px; border:1px solid rgba(255,255,255,.14); border-radius:0; background:rgba(7,7,7,.52); color:#ece8e5; padding:0 12px; font:14px/1.3 Inter,system-ui,sans-serif; }
.editor-identity-input input::placeholder { color:#8d8582; opacity:1; }
.editor-identity-input input:hover { border-color:rgba(207,89,92,.46); }
.editor-identity-input input:focus { border-color:#c34b4e; box-shadow:0 0 0 3px rgba(174,42,46,.13); }
.editor-identity-help { margin:8px 0 0; color:#99928f; font:11px/1.5 Inter,system-ui,sans-serif; }
.editor-identity-help strong { color:#d5ceca; font-weight:600; }
.editor-footer { align-items:stretch; gap:10px; }
.media-picker { min-height:48px; min-width:165px; align-items:flex-start; flex-direction:column; justify-content:center; gap:3px; padding:7px 12px; border-color:rgba(255,255,255,.16); color:#e8e4e1; text-transform:none; }
.media-picker strong { font-size:12px; font-weight:700; }
.media-picker small { color:#8d8785; font-size:10px; line-height:1.25; }
.media-picker:hover, .media-picker:focus-within { border-color:#c84e51; background:rgba(139,0,0,.1); }
.media-status { display:grid; min-width:0; align-content:center; color:#aaa29f; font:11px/1.4 Inter,system-ui,sans-serif; }
.character-count { display:grid; align-content:center; margin-left:auto; white-space:nowrap; }
.trace-submit { min-height:48px; min-width:128px; }
.trace-reader-nav { display:flex; max-width:720px; margin-top:34px; padding-top:19px; border-top:1px solid var(--line); }
.trace-reader-return-button { gap:10px; min-height:45px; border-color:rgba(202,79,82,.7); background:rgba(138,25,29,.2); color:#fff1ef; font-size:13px; font-weight:700; }
.trace-reader-return-button span { font-size:18px; line-height:1; transition:transform .2s ease; }
.trace-reader-return-button:hover, .trace-reader-return-button:focus-visible { border-color:#df6063; background:#972a2e; box-shadow:0 0 24px rgba(139,0,0,.24); outline:0; }
.trace-reader-return-button:hover span { transform:translateX(-3px); }
.trace-share-cards { padding:19px; border:1px solid rgba(255,255,255,.11); background:rgba(14,14,14,.62); }
.trace-share-cards .trace-share-head { align-items:flex-start; margin-bottom:14px; }
.trace-share-head > div { display:grid; gap:5px; }
.trace-share-head small { color:#908986; font-size:11px; line-height:1.45; }
.trace-share-note { display:grid; gap:4px; margin:0 0 14px; padding:11px 12px; border-left:2px solid #b24144; background:rgba(139,0,0,.09); font:11px/1.45 Inter,system-ui,sans-serif; }
.trace-share-note strong { color:#e4d9d6; font-size:12px; }
.trace-share-note span { color:#9f9794; }
.trace-share-cards .share-card-grid { grid-template-columns:repeat(3, minmax(0,1fr)); }
.trace-share-cards .share-card { min-height:76px; }
@media (max-width:720px) {
  .editor-footer { display:grid; grid-template-columns:1fr auto; }
  .media-picker { grid-column:1 / -1; }
  .media-status { min-height:31px; }
  .character-count { margin-left:0; }
  .trace-submit { min-width:130px; }
  .trace-share-cards { padding:15px; }
  .trace-share-cards .share-card-grid { grid-template-columns:1fr; }
}

/* Trace upload, CAPTCHA and share controls. */
.media-picker { flex-direction:row; align-items:center; gap:10px; }
.media-picker-icon { display:grid; flex:0 0 25px; width:25px; height:25px; place-items:center; border:1px solid rgba(204,72,76,.72); color:#ef7475; font-size:17px; line-height:1; }
.media-picker-copy { display:grid; gap:3px; min-width:0; }
.media-picker-copy strong { display:block; }
.media-picker-copy strong em { margin-left:5px; color:#dc6769; font:700 9px/1 Inter,system-ui,sans-serif; letter-spacing:.08em; text-transform:uppercase; }
.media-picker-copy small { display:block; }
.trace-captcha { display:grid; grid-template-columns:minmax(0,1fr) minmax(190px,.7fr); gap:18px; align-items:end; padding:15px 20px; border-bottom:1px solid rgba(255,255,255,.09); background:rgba(18,18,18,.55); font-family:Inter,system-ui,sans-serif; }
.trace-captcha p { margin:0 0 4px; color:#ded8d4; font-size:12px; font-weight:700; }
.trace-captcha small { color:#99918d; font-size:10px; line-height:1.45; }
.trace-captcha label { display:grid; gap:7px; color:#c9c1bd; font-size:11px; font-weight:600; }
.trace-captcha input { min-height:40px; border:1px solid rgba(255,255,255,.15); border-radius:0; background:#0a0a0a; color:#f1ece8; padding:0 11px; font:14px/1 Inter,system-ui,sans-serif; }
.trace-captcha input:focus { border-color:#c84e51; outline:0; box-shadow:0 0 0 3px rgba(174,42,46,.13); }
.trace-recaptcha { align-items:center; }
.trace-recaptcha .g-recaptcha { justify-self:end; max-width:100%; overflow:hidden; }
.trace-captcha-unavailable { margin:0; color:#e09a9b; font:12px/1.5 Inter,system-ui,sans-serif; }
.trace-publication-hint { margin-top:18px; padding-top:14px; border-top:1px solid rgba(198,75,78,.28); color:#bdb4af; font:11px/1.55 Inter,system-ui,sans-serif; }
.trace-share-cards .share-card { grid-template-columns:25px minmax(0,1fr); align-items:center; align-content:center; gap:10px; padding:12px; }
.trace-share-cards .share-card > i { color:#de6d6f; font-size:20px; line-height:1; }
.trace-share-cards .share-card-copy { display:grid; gap:4px; min-width:0; }
.trace-share-cards .share-card-copy strong { color:#e9e4e1; font-size:12px; }
.trace-share-cards .share-card-copy span { color:#97908d; font-size:10px; line-height:1.3; }
@media (max-width:720px) {
  .trace-captcha { grid-template-columns:1fr; gap:12px; padding:14px 16px; }
  .trace-recaptcha .g-recaptcha { justify-self:start; transform-origin:left center; }
  .trace-rich-input { min-height:190px; padding:16px; font-size:20px; }
  .trace-format-toolbar { padding:6px 10px; }
}

/* Visitor-controlled reading preferences. */
.a11y-widget { position:fixed; right:18px; bottom:18px; z-index:20; font-family:Inter,system-ui,sans-serif; }
.a11y-toggle { display:grid; width:46px; height:46px; margin-left:auto; place-items:center; border:1px solid rgba(216,91,94,.72); border-radius:50%; background:#151616; box-shadow:0 12px 30px rgba(0,0,0,.38); color:#f2e9e7; cursor:pointer; font:700 16px/1 Inter,system-ui,sans-serif; }
.a11y-toggle:hover,.a11y-toggle:focus-visible { border-color:#ef7778; background:#7f2227; outline:0; }
.a11y-panel { width:min(350px,calc(100vw - 32px)); margin:0 0 10px; overflow:hidden; border:1px solid rgba(204,82,85,.48); background:rgba(16,17,17,.98); box-shadow:0 22px 60px rgba(0,0,0,.52); color:#e9e4e0; }
.a11y-panel header { display:flex; align-items:start; justify-content:space-between; gap:16px; padding:17px 18px; border-bottom:1px solid rgba(255,255,255,.1); }
.a11y-panel header p { margin:0 0 4px; color:#d6696a; font-size:9px; font-weight:700; letter-spacing:.13em; }
.a11y-panel header strong { font-size:15px; }
.a11y-panel header button { width:30px; height:30px; border:0; background:transparent; color:#b9b1ad; cursor:pointer; font-size:24px; line-height:1; }
.a11y-options { display:grid; padding:7px 18px; }
.a11y-options label { display:grid; grid-template-columns:18px minmax(0,1fr); gap:10px; align-items:center; padding:11px 0; border-bottom:1px solid rgba(255,255,255,.08); cursor:pointer; }
.a11y-options label:last-child { border-bottom:0; }
.a11y-options input { width:16px; height:16px; accent-color:#be4147; }
.a11y-options span { display:grid; gap:3px; }
.a11y-options b { color:#e9e3e0; font-size:12px; line-height:1.25; }
.a11y-options small { color:#98918d; font-size:10px; line-height:1.35; }
.a11y-panel footer { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 18px; border-top:1px solid rgba(255,255,255,.1); }
.a11y-panel footer button { border:0; border-bottom:1px solid #bc5053; background:transparent; color:#efc0bd; padding:3px 0; cursor:pointer; font-size:11px; }
.a11y-panel footer span { color:#847e7a; font-size:10px; line-height:1.35; text-align:right; }
html.a11y-text-large body { font-size:22px; }
html.a11y-text-large .card-body p,html.a11y-text-large .trace-post-copy p,html.a11y-text-large .trace-reader-copy p,html.a11y-text-large .post-copy p,html.a11y-text-large .contact-intro p,html.a11y-text-large .trace-aside p { font-size:1.13em; }
html.a11y-comfortable-spacing .card-body p,html.a11y-comfortable-spacing .trace-post-copy p,html.a11y-comfortable-spacing .trace-reader-copy p,html.a11y-comfortable-spacing .post-copy p,html.a11y-comfortable-spacing .trace-aside p { line-height:1.9; }
html.a11y-clear-links main a:not(.button):not(.brand) { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; }
html.a11y-high-contrast { --bg:#050505; --panel:#0b0b0b; --panel-2:#121212; --text:#f7f4f2; --muted:#c4bdb8; --line:rgba(226,92,95,.62); --red-hot:#e44e54; }
html.a11y-high-contrast body::before { opacity:.14; }
html.a11y-high-contrast .site-header,html.a11y-high-contrast .trace-card,html.a11y-high-contrast .share-cards { border-color:rgba(236,112,115,.68); }
html.a11y-readable-font body,html.a11y-readable-font .trace-post-copy p,html.a11y-readable-font .trace-reader-copy p,html.a11y-readable-font .post-copy p { font-family:Georgia,"Times New Roman",serif; letter-spacing:0; }
html.a11y-focus-visible :focus-visible { outline:3px solid #f2d17d !important; outline-offset:3px; }
html.a11y-reduce-motion *,html.a11y-reduce-motion *::before,html.a11y-reduce-motion *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
html.a11y-reduce-motion #particles { display:none; }
@media (prefers-reduced-motion:reduce) { #particles { display:none; } *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; } }
@media (max-width:560px) { .a11y-widget { right:12px; bottom:12px; }.a11y-panel { margin-bottom:8px; }.a11y-panel footer { display:grid; }.a11y-panel footer span { text-align:left; } }
