@import url('/static/vendor/fonts/fonts.css');

:root{
  color-scheme:dark;
  --bg:#0b0d10;
  --surface:#11151a;
  --surface-raised:#151a20;
  --line:#282f37;
  --line-strong:#39424d;
  --text:#e7eaed;
  --muted:#9aa3ad;
  --accent:#d2ad72;
  --accent-soft:#e3c794;
  --body-ink:#cfd4d9;--editorial-link:#e3c794;--editorial-code:#1e242b;--editorial-hover:#1b2026;
  --editorial-comment:#12161b;--editorial-tag:#aeb6bf;--editorial-side:#c8ced4;--editorial-active:#211d17;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{
  margin:0;min-height:100vh;background:var(--bg);color:var(--text);
  font-family:Georgia,'Times New Roman',serif;font-size:16px;line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
button,input,textarea{font:inherit}

.journal-header{
  position:sticky;top:0;z-index:20;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  min-height:60px;padding:10px clamp(18px,4vw,54px);border-bottom:1px solid var(--line);
  background:rgba(11,13,16,.92);backdrop-filter:blur(14px);
}
.journal-header a{text-decoration:none}
.journal-home,.journal-admin{
  color:var(--muted);font:500 .72rem 'IBM Plex Mono',monospace;letter-spacing:.08em;text-transform:uppercase;
}
.journal-home:hover,.journal-admin:hover{color:var(--text)}
.journal-admin{text-align:right}
.journal-mark{color:var(--text);font:600 1.35rem 'Cormorant Garamond',serif;letter-spacing:.035em}
#reading-progress{position:fixed;left:0;top:0;z-index:50;width:0;height:2px;background:var(--accent);transition:width .08s linear}

main{width:min(1120px,calc(100% - 40px));margin:auto;padding:clamp(50px,7vw,88px) 0 100px}
.archive-head{
  display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:clamp(34px,6vw,72px);align-items:end;
  margin-bottom:42px;padding:0 0 clamp(34px,5vw,52px);border-bottom:1px solid var(--line);
}
.eyebrow,.post-kicker,.side-label{
  color:var(--accent);font:500 .7rem 'IBM Plex Mono',monospace;letter-spacing:.13em;text-transform:uppercase;
}
.archive-head h1,.post-title{
  margin:.12em 0;color:var(--text);font:600 clamp(3.2rem,7vw,5.5rem)/.94 'Cormorant Garamond',serif;
  letter-spacing:-.025em;text-wrap:balance;
}
.archive-head h1{max-width:8ch}
.archive-intro{max-width:560px;margin:18px 0 0;color:var(--muted);font-size:1.05rem;line-height:1.65}
.archive-controls{display:grid;gap:15px}
.archive-search{
  width:100%;margin-top:7px;padding:12px 14px;border:1px solid var(--line);border-radius:5px;
  background:var(--surface);color:var(--text);font-size:.9rem;outline:none;
}
.archive-search::placeholder{color:#707985}
.archive-search:focus{border-color:var(--line-strong);box-shadow:0 0 0 3px rgba(210,173,114,.08)}
.archive-filters{display:flex;gap:7px;flex-wrap:wrap}
.archive-filters button{
  padding:6px 11px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);
  font:500 .7rem 'IBM Plex Mono',monospace;cursor:pointer;
}
.archive-filters button:hover,.archive-filters button:focus-visible{border-color:var(--line-strong);color:var(--text)}
.archive-filters button.on{border-color:#776347;background:#211d17;color:var(--accent-soft)}

.archive-list{display:grid;border-top:1px solid var(--line)}
.archive-card{
  display:grid;grid-template-columns:8rem minmax(0,1fr) auto;gap:28px;align-items:start;padding:26px 18px;
  border-bottom:1px solid var(--line);background:transparent;text-decoration:none;transition:background .16s ease;
}
.archive-card:hover,.archive-card:focus-visible{background:var(--surface);outline:none}
.archive-date,.archive-meta,.post-meta{color:#89939e;font:500 .7rem 'IBM Plex Mono',monospace;letter-spacing:.025em}
.archive-copy h2{margin:0 0 7px;color:var(--text);font:600 clamp(1.55rem,3vw,2rem)/1.12 'Cormorant Garamond',serif}
.archive-copy p{max-width:680px;margin:0;color:var(--muted);font-size:.94rem}
.archive-tags,.post-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:13px}
.tag{display:inline-flex;padding:2px 8px;border:1px solid var(--line);border-radius:99px;color:#aeb6bf;font:500 .65rem 'IBM Plex Mono',monospace}
.archive-read{white-space:nowrap;color:var(--accent);font:500 .7rem 'IBM Plex Mono',monospace}
.archive-empty,.journal-loading{padding:60px 0;text-align:center;color:var(--muted)}

.post-layout{display:grid;grid-template-columns:minmax(0,760px) 260px;gap:clamp(34px,5vw,62px);align-items:start}
.post-layout>article{padding:clamp(34px,5vw,56px);border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--text)}
.post-head{margin-bottom:34px;padding-bottom:28px;border-bottom:1px solid var(--line)}
.post-title{font-size:clamp(3rem,7vw,5.2rem)}
.post-meta{display:flex;gap:13px;flex-wrap:wrap}
.post-body{font-size:1.02rem;line-height:1.82;color:#cfd4d9}
.post-body p{margin:0 0 1.3em}
.post-body h2,.post-body h3,.post-body h4{
  margin:1.6em 0 .55em;color:var(--text);font-family:'Cormorant Garamond',serif;font-weight:600;line-height:1.1;
}
.post-body h2{font-size:2.25rem}.post-body h3{font-size:1.75rem}
.post-body code{padding:.1em .34em;border-radius:3px;background:#1e242b;color:#e3c794;font-family:'IBM Plex Mono',monospace;font-size:.82em}
.post-body pre{overflow:auto;padding:20px;border:1px solid var(--line);border-radius:4px;background:#090b0e;color:#d9dde1}
.post-body pre code{padding:0;background:none;color:inherit}
.post-body blockquote{margin:1.7em 0;padding:.2em 0 .2em 1.25em;border-left:2px solid var(--accent);color:#adb5bd}
.post-body a{color:var(--accent-soft);text-decoration-color:#776347;text-underline-offset:3px}

.post-engagement{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:42px 0 0;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.post-engagement button{
  padding:7px 10px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);cursor:pointer;
}
.post-engagement button:hover,.post-engagement button:focus-visible,.post-engagement button.on{border-color:#776347;background:#211d17;color:var(--accent-soft)}
.post-reactions{display:flex;gap:6px;flex-wrap:wrap}
.engagement-status,.comment-status{min-height:1.5em;color:var(--muted);font-size:.86rem}
.post-nav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:32px 0 30px;padding-top:24px}
.post-nav a{padding:15px;border:1px solid var(--line);border-radius:4px;background:#0e1115;text-decoration:none;color:#c9cfd5}
.post-nav a:hover{border-color:var(--line-strong);background:var(--surface-raised)}
.post-nav a:last-child{text-align:right}
.post-comments{margin-top:48px}
.post-comments h2{color:var(--text);font:600 2.2rem 'Cormorant Garamond',serif}
.comment-list{display:grid;gap:12px}
.comment{padding:15px 17px;border:1px solid var(--line);border-radius:4px;background:#0e1115}
.comment small{color:#828c96}.comment p{margin:5px 0}.comment .comment{margin:12px 0 0 18px}
.comment-form{display:grid;gap:10px;margin-top:18px}
.comment-form input,.comment-form textarea{
  width:100%;padding:11px;border:1px solid var(--line);border-radius:4px;background:#0c0f12;color:var(--text);outline:none;
}
.comment-form input:focus,.comment-form textarea:focus{border-color:var(--line-strong);box-shadow:0 0 0 3px rgba(210,173,114,.08)}
.comment-form button{justify-self:start;padding:8px 16px;border:1px solid #776347;border-radius:4px;background:#211d17;color:var(--accent-soft);cursor:pointer}

.post-side{position:sticky;top:92px;display:grid;gap:26px;padding-left:24px;border-left:1px solid var(--line)}
.side-block{padding-top:15px;border-top:1px solid var(--line)}
.side-block:first-child{padding-top:0;border-top:0}
.side-block a{display:block;padding:8px 0;color:#c8ced4;font-size:.88rem;line-height:1.4;text-decoration:none}
.side-block a:hover{color:var(--accent-soft)}
.side-block small{color:#7f8994}

.is-embedded .journal-header{display:none}
.is-embedded #reading-progress{top:0}
.is-embedded main{width:100%;padding:30px}
.is-embedded .archive-head{margin-bottom:24px}
.is-embedded .post-layout{grid-template-columns:minmax(0,1fr) 230px;gap:24px}
.is-embedded .post-layout>article{padding:clamp(32px,5vw,50px)}

@media(max-width:780px){
  .archive-head,.post-layout,.is-embedded .post-layout{grid-template-columns:1fr}
  .archive-head{gap:30px}
  .archive-card{grid-template-columns:1fr;gap:8px;padding:24px 12px}
  .archive-read{display:none}
  .post-layout>article{padding:38px 24px}
  .post-side{position:static;padding:24px 0 0;border-top:1px solid var(--line);border-left:0}
  .post-nav{grid-template-columns:1fr}
  .journal-mark{font-size:1.18rem}
  main{width:min(100% - 24px,760px);padding-top:36px}
  .is-embedded main{padding:18px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.archive-card{transition:none}}

/* Editorial reading rhythm: quiet surfaces, strong hierarchy, generous whitespace. */
:root[data-theme="light"]{color-scheme:light;--bg:#faf9f6;--surface:#faf9f6;--surface-raised:#f2f0ec;--line:#dedbd5;--line-strong:#b9b3aa;--text:#202022;--muted:#62646a;--accent:#866b41;--accent-soft:#654c2a;--body-ink:#303236;--editorial-link:#694b2b;--editorial-code:#eeece8;--editorial-hover:#f1efeb;--editorial-comment:#f2f0ec;--editorial-tag:#5f6167;--editorial-side:#3d4145;--editorial-active:#ece6db}
html{background:var(--bg)}body{background:var(--bg);color:var(--text);font-family:Georgia,'Times New Roman',serif;line-height:1.65}
.journal-header{background:var(--bg);backdrop-filter:none}.journal-mark{font:600 1rem/1.3 Georgia,'Times New Roman',serif;letter-spacing:-.02em}
main{padding-top:clamp(54px,8vw,110px)}
.archive-head h1,.post-title{font-family:Georgia,'Times New Roman',serif;font-weight:600;line-height:1.04;letter-spacing:-.052em}
.archive-head h1{max-width:none}.archive-copy h2{font-family:Georgia,'Times New Roman',serif;font-weight:600;letter-spacing:-.03em}
.eyebrow,.post-kicker,.side-label{font-family:Georgia,'Times New Roman',serif;font-weight:600;letter-spacing:.02em;text-transform:none}
.post-layout{grid-template-columns:minmax(0,700px) minmax(180px,230px);gap:clamp(38px,6vw,86px)}
.post-layout>article{padding:0;border:0;border-radius:0;background:transparent}
.post-head{margin-bottom:clamp(36px,5vw,64px);padding-bottom:26px}.post-title{margin:18px 0 24px;font-size:clamp(2.65rem,5.6vw,4.9rem)}
.post-body{font-size:1.08rem;line-height:1.8;color:var(--body-ink)}.post-body h2,.post-body h3,.post-body h4{font-family:Georgia,'Times New Roman',serif;font-weight:600;line-height:1.22;letter-spacing:-.025em;color:var(--text)}
.post-body h2{font-size:1.9rem;margin:2.1em 0 .7em}.post-body h3{font-size:1.42rem;margin:1.8em 0 .6em}.post-body p{margin:0 0 1.4em}
.post-body a{color:var(--editorial-link);text-decoration-color:var(--accent)}.post-body code{background:var(--editorial-code);color:var(--text)}.post-body pre{background:var(--editorial-code);color:var(--text);border-color:var(--line)}
.post-body blockquote{color:var(--muted);border-color:var(--accent)}
.post-body figure{margin:2.25em 0}.post-body figure img{display:block;width:auto;max-width:100%;height:auto;margin:auto;border-radius:2px}
.archive-date,.archive-meta,.post-meta,.tag,.archive-read{font-family:Georgia,'Times New Roman',serif;letter-spacing:0;color:var(--muted)}
.archive-card:hover,.archive-card:focus-visible{background:var(--editorial-hover)}.archive-copy p{color:var(--muted)}.tag{border-radius:3px;color:var(--editorial-tag)}
.archive-filters button{font-family:Georgia,'Times New Roman',serif;letter-spacing:0}.archive-filters button.on,.post-engagement button.on{background:var(--editorial-active);color:var(--accent-soft);border-color:var(--accent)}
.post-side{border-color:var(--line)}.side-block a{color:var(--editorial-side)}.post-nav a,.comment,.comment-form input,.comment-form textarea{background:var(--editorial-comment);color:var(--text)}
.post-comments h2{font:600 1.7rem Georgia,'Times New Roman',serif}.post-engagement button,.comment-form button{background:transparent;color:var(--muted)}
.is-embedded .post-layout>article{padding:0}
@media(max-width:780px){.post-layout,.is-embedded .post-layout{grid-template-columns:1fr}.post-side{position:static}.post-title{font-size:clamp(2.35rem,9vw,4rem)}.post-layout>article{padding:0}}

.journal-actions{display:flex;align-items:center;justify-content:flex-end;gap:18px}
#journal-theme{padding:5px 8px;border:1px solid var(--line);border-radius:3px;background:transparent;color:var(--muted);font:500 .72rem Georgia,'Times New Roman',serif;cursor:pointer}
#journal-theme:hover,#journal-theme:focus-visible{color:var(--text);border-color:var(--line-strong)}
#journal-theme:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* Keep appearance reachable when the journal is opened inside a Device window. */
.is-embedded .journal-header{display:flex;justify-content:flex-end;min-height:42px;padding:5px 18px}
.is-embedded .journal-home,.is-embedded .journal-mark,.is-embedded .journal-admin{display:none}
