:root{
  --ink:#FFF6EF; --ink-soft:#E7D9D2; --ink-dim:#D9CBC4;
  --gray:#9C93A4; --gray-dim:#8E8497;
  --peach:#FFDDBC; --pink:#FF9EC4; --lavender:#C9A9E8; --blue:#7FC8D8;
  --author:oklch(0.63 0.088 268); --dnf:oklch(0.66 0.021 262);
  --rule:rgba(255,246,239,.11); --rule-soft:rgba(255,246,239,.08);
  --serif:'EB Garamond',Georgia,serif; --sans:'Public Sans',system-ui,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:linear-gradient(175deg,#0B0B0E 0%,#111036 55%,#13134C 100%);
  background-attachment:fixed; min-height:100vh;
  font-family:var(--sans); color:var(--ink); font-weight:300;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--pink);text-decoration:none}
a:hover{color:var(--peach)}
::selection{background:var(--pink);color:#13134C}
@keyframes riseIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* header */
.site-header{position:sticky;top:0;z-index:10;background:rgba(11,11,20,.78);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,246,239,.1)}
.site-nav{max-width:860px;margin:0 auto;padding:15px 28px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 28px}
.site-nav a{font-family:var(--serif);font-size:17px;color:oklch(0.886 0.018 50);padding-bottom:3px;border-bottom:1px solid transparent;transition:color .25s ease,border-color .25s ease}
.site-nav a[data-accent="peach"]:hover{color:oklch(0.886 0.055 68);border-bottom-color:var(--peach)}
.site-nav a[data-accent="pink"]:hover{color:oklch(0.92 0.085 349);border-bottom-color:var(--pink)}
.site-nav a[data-accent="lavender"]:hover{color:oklch(0.886 0.09 305);border-bottom-color:var(--lavender)}
.site-nav a[data-accent="blue"]:hover{color:oklch(0.92 0.055 213);border-bottom-color:var(--blue)}
.site-nav a[aria-current="page"]{color:var(--ink)}

/* band */
.band{width:100%;height:184px;background-size:cover;background-position:center 38%;
  mask-image:linear-gradient(to bottom,#000 42%,transparent 100%);
  -webkit-mask-image:linear-gradient(to bottom,#000 42%,transparent 100%)}
.band::after{content:"";display:block;height:100%;background:linear-gradient(to bottom,rgba(11,11,20,.28) 0%,rgba(15,14,48,.5) 62%,rgba(15,14,48,.7) 100%)}

/* layout */
.page{padding:72px 28px 80px}
.page--band{padding-top:40px}
.wrap{max-width:600px;margin:0 auto;animation:riseIn .55s ease both}
.wrap--wide{max-width:940px}
.wrap--cv{max-width:680px}
.wrap--reading{max-width:1040px;display:flex;flex-wrap:wrap;align-items:flex-start;gap:40px 56px}

.eyebrow{display:flex;align-items:center;gap:12px}
.eyebrow span:first-child{width:22px;height:1px}
.eyebrow em{font-style:normal;font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;white-space:nowrap}
.eyebrow[data-accent="pink"] span:first-child{background:var(--pink)} .eyebrow[data-accent="pink"] em{color:var(--pink)}
.eyebrow[data-accent="lavender"] span:first-child{background:var(--lavender)} .eyebrow[data-accent="lavender"] em{color:var(--lavender)}
.eyebrow[data-accent="blue"] span:first-child{background:var(--blue)} .eyebrow[data-accent="blue"] em{color:var(--blue)}

h1.title{margin:16px 0 0;font-family:var(--serif);font-weight:400;font-size:40px;line-height:1.1;color:var(--ink)}
h2.section{margin:54px 0 8px;font-family:var(--serif);font-weight:400;font-size:27px;line-height:1.2;color:var(--ink)}
.rule{border-top:1px solid var(--rule)}

/* about */
.about{min-height:calc(100vh - 240px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 28px 48px}
.about-inner{width:100%;max-width:600px;display:flex;flex-direction:column;align-items:center;animation:riseIn .7s ease both}
.headshot{width:132px;height:132px;border-radius:50%;object-fit:cover;filter:saturate(.92);box-shadow:0 0 0 1px rgba(255,246,239,.18),0 10px 30px rgba(0,0,0,.45)}
.name{margin:26px 0 0;font-family:var(--serif);font-weight:400;font-size:46px;line-height:1.05;color:var(--ink)}
.tagline{margin:14px 0 0;display:flex;align-items:center;gap:11px}
.tagline span.dash{width:16px;height:1px;background:var(--peach);opacity:.5}
.tagline em{font-style:normal;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--peach)}
.bio{margin:34px 0 0;max-width:530px;font-size:16px;line-height:1.8;color:var(--ink-soft);text-align:center;text-wrap:pretty}
.bio a{color:var(--ink);border-bottom:1px solid rgba(255,158,196,.55)}
.bio a:hover{color:var(--pink);border-bottom-color:var(--pink)}
.now-line{margin:46px 0 0;width:100%;max-width:530px;border-top:1px solid var(--rule);padding-top:20px;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:7px 12px}
.now-line .label{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--blue)}
.now-line .book{font-family:var(--serif);font-size:18px;font-style:italic;color:var(--ink)}
.now-line .who{font-size:14px;color:var(--gray)}
.now-line a{font-size:12.5px;color:var(--blue)}
.now-line a:hover{color:var(--peach)}
.small-links{margin:36px 0 0;display:flex;gap:26px;align-items:center}
.small-links a{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--gray);border-bottom:1px solid transparent;padding-bottom:2px;transition:color .25s ease,border-color .25s ease}
.small-links a:hover{color:var(--ink);border-bottom-color:var(--pink)}

/* writing list */
.samples{margin:56px 0 0;display:flex;flex-direction:column}
.sample{display:block;padding:26px 16px;margin:0 -16px;border-top:1px solid var(--rule);transition:background-color .3s ease}
.sample:hover{background-color:rgba(255,158,196,.07)}
.sample .kind{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gray-dim)}
.sample h2{margin:9px 0 0;font-family:var(--serif);font-weight:400;font-size:24px;line-height:1.3;color:var(--ink);text-wrap:pretty;transition:color .25s ease}
.sample:hover h2{color:var(--pink)}
.sample .meta{margin:12px 0 0;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
.sample .meta .date{font-size:12.5px;color:var(--gray)}
.sample .meta .dot{width:3px;height:3px;border-radius:50%;background:#5E566B}
.sample .meta .note{font-family:var(--serif);font-size:13px;font-style:italic;color:#C9BDB8}
.closing{border-top:1px solid var(--rule);padding-top:34px;font-family:var(--serif);font-size:17px;font-style:italic;color:#C9BDB8}

/* gallery */
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin:52px 0 0;align-items:start}
.gallery img{width:100%;height:auto;display:block}
.thumb{appearance:none;-webkit-appearance:none;font:inherit;color:inherit;padding:0;margin:0;width:100%;display:block;background:none;cursor:zoom-in;border:1px solid rgba(255,246,239,.09);transition:opacity .3s ease,border-color .3s ease}
.thumb:hover{opacity:.86;border-color:rgba(201,169,232,.5)}
.thumb:focus-visible{outline:1px solid var(--lavender);outline-offset:3px}
.gallery--flow[data-masonry="on"]{grid-auto-rows:8px;grid-auto-flow:row dense;gap:0 20px}
.gallery--flow[data-masonry="on"] .thumb{margin:0 0 20px}

/* social */
.social-list{margin:52px 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:38px 36px;align-items:start}
.social-item{display:flex;flex-direction:row;align-items:flex-start;gap:20px;padding:24px 0 0;border-top:1px solid var(--rule)}
.social-cover{position:relative;flex:0 0 136px;width:136px}
.social-cover .thumb{border-radius:4px;overflow:hidden}
.social-cover .thumb:not(:first-of-type){display:none}
.social-cover img{width:100%;height:auto;display:block}
.count-badge{position:absolute;bottom:8px;right:8px;pointer-events:none;white-space:nowrap;font-size:9px;font-weight:400;letter-spacing:.1em;padding:3px 6px;color:var(--ink-soft);background:rgba(11,11,20,.72);border:1px solid var(--rule)}
.social-body{flex:1 1 auto;min-width:0}
.social-body h2{margin:0;font-family:var(--serif);font-weight:400;font-size:20px;line-height:1.3;color:var(--ink);text-wrap:pretty}
.social-body h2 .acct{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.04em;color:var(--gray-dim);margin-left:10px;white-space:nowrap}
.social-meta{margin:10px 0 0;display:flex;flex-direction:column;align-items:flex-start;gap:5px;font-size:12.5px;color:var(--gray)}
.social-meta .dot{width:3px;height:3px;border-radius:50%;background:#5E566B}
.social-meta .plat{display:inline-flex;align-items:center;gap:7px}
.social-meta .plat-icon{width:14px;height:14px;flex:0 0 auto;display:block;opacity:.72}
.social-meta a.plat{color:var(--gray);border-bottom:1px solid transparent;padding-bottom:1px;transition:color .25s ease,border-color .25s ease}
.social-meta a.plat:hover{color:var(--ink-soft);border-bottom-color:var(--pink)}
.social-meta a.plat:hover .plat-icon{opacity:1}
.social-meta .out{font-size:11px;opacity:.8}
.social-brief{margin:12px 0 0;max-width:58ch;font-size:13.5px;line-height:1.7;color:var(--ink-dim);text-wrap:pretty}
.social-open{margin:14px 0 0;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--blue)}
.reels{margin:28px 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(184px,1fr));gap:22px}
.reel img{width:100%;aspect-ratio:9/16;object-fit:cover;display:block;border:1px solid rgba(255,246,239,.09);transition:opacity .3s ease,border-color .3s ease}
.reel:hover img{opacity:.86;border-color:rgba(255,158,196,.5)}
.reel .t{margin:11px 0 0;font-family:var(--serif);font-size:17px;line-height:1.3;color:var(--ink)}
.reel .p{margin:4px 0 0;font-size:11.5px;letter-spacing:.04em;color:var(--gray)}
.ba-item{margin:30px 0 0}
.ba-title{margin:0 0 16px;font-family:var(--serif);font-weight:400;font-size:21px;color:var(--ink)}
.ba{display:grid;grid-template-columns:repeat(auto-fit,minmax(238px,1fr));gap:20px}
.ba .lab{margin:0 0 9px;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gray-dim)}

/* lightbox */
.lightbox{border:0;padding:0;margin:0;max-width:none;max-height:none;width:100%;height:100%;background:transparent;overflow:hidden;color:var(--ink)}
.lightbox:not([open]){display:none}
.lightbox::backdrop{background:rgba(8,8,14,.93);backdrop-filter:blur(6px)}
.lightbox-inner{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:56px 72px;cursor:zoom-out;animation:riseIn .3s ease both}
.lightbox-img{max-width:min(92vw,1400px);max-height:82vh;width:auto;height:auto;object-fit:contain;display:block;cursor:default;border:1px solid rgba(255,246,239,.14);box-shadow:0 22px 64px rgba(0,0,0,.6)}
.lightbox-cap{margin:0;font-family:var(--serif);font-size:16px;font-style:italic;color:var(--ink-dim)}
.lightbox-close,.lightbox-nav{position:fixed;appearance:none;-webkit-appearance:none;background:rgba(11,11,20,.62);border:1px solid var(--rule);color:var(--ink-soft);cursor:pointer;line-height:1;transition:color .25s ease,border-color .25s ease,background-color .25s ease}
.lightbox-close:hover,.lightbox-nav:hover{color:var(--ink);border-color:rgba(201,169,232,.55);background:rgba(11,11,20,.85)}
.lightbox-close{top:22px;right:24px;width:40px;height:40px;font-size:24px;padding:0 0 3px}
.lightbox-nav{top:50%;transform:translateY(-50%);width:44px;height:64px;font-size:30px;padding:0 0 4px}
.lightbox-nav[data-dir="prev"]{left:20px}
.lightbox-nav[data-dir="next"]{right:20px}
@media (max-width:640px){
  .lightbox-inner{padding:64px 12px 76px}
  .lightbox-img{max-width:96vw;max-height:74vh}
  .lightbox-nav{top:auto;bottom:16px;transform:none;width:52px;height:44px;font-size:26px}
  .lightbox-nav[data-dir="prev"]{left:calc(50% - 62px)}
  .lightbox-nav[data-dir="next"]{right:calc(50% - 62px)}
}

/* reading */
.reading-side{position:sticky;top:96px;flex:0 0 168px;display:flex;flex-direction:column;gap:26px}
.reading-side h1{margin:14px 0 0;font-family:var(--serif);font-weight:400;font-size:30px;line-height:1.15;color:var(--ink)}
.reading-side nav{display:flex;flex-direction:column;gap:11px;border-top:1px solid var(--rule);padding-top:20px}
.reading-side nav a{font-size:12.5px;letter-spacing:.03em;color:var(--gray);transition:color .25s ease}
.reading-side nav a:hover{color:var(--ink)}
.reading-main{flex:1 1 420px;min-width:0}
.reading-main section{scroll-margin-top:96px}
.block-label{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--blue);border-bottom:1px solid var(--rule);padding-bottom:9px}
.now-card{margin:20px 0 0;display:flex;flex-wrap:wrap;align-items:flex-start;gap:26px}
.now-card .cover{width:124px;height:186px;flex:0 0 auto;border-radius:3px;object-fit:cover;border:1px solid rgba(255,246,239,.12)}
.now-card .body{flex:1 1 300px;min-width:0}
.now-card .book{font-family:var(--serif);font-size:24px;line-height:1.3;color:var(--ink);text-wrap:pretty}
.now-card .thoughts-label{margin:18px 0 0;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gray-dim)}
.now-card p{margin:9px 0 0;max-width:56ch;font-size:14.5px;line-height:1.75;color:var(--ink-dim);text-wrap:pretty}
.author{margin:5px 0 0;font-size:12.5px;letter-spacing:.01em;color:var(--author)}
.section-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 18px;border-bottom:1px solid var(--rule);padding-bottom:10px}
.section-head h2{margin:0;font-family:var(--serif);font-weight:400;font-size:27px;line-height:1.2;color:var(--ink)}
.section-head .count{font-size:12.5px;color:var(--gray)}
.book-cols{margin:32px 0 0;column-width:300px;column-gap:48px}
.year-page{margin:32px 0 0;display:flex;flex-direction:column;gap:34px}
.year-page .month{margin:0}
.year-page .month ul{margin:16px 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:16px 32px}
.year-cols{display:flex;flex-wrap:wrap;align-items:flex-start;gap:40px 48px}
.year-col{flex:1 1 300px;max-width:340px;min-width:0;scroll-margin-top:96px}
.year-months{margin:28px 0 0;display:flex;flex-direction:column;gap:32px}
.month{break-inside:avoid;margin:0 0 34px}
.year-months .month{margin:0}
.month > .m-label{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gray-dim);border-bottom:1px solid var(--rule-soft);padding-bottom:8px}
.month ul{margin:14px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:11px}
.book-line{font-family:var(--serif);font-size:17.5px;line-height:1.35;color:var(--ink-soft);text-wrap:pretty}
.book-line .t.dnf{color:var(--dnf)}
.book-line .n{font-size:11.5px;color:var(--gray-dim);letter-spacing:.04em;margin-left:12px;white-space:nowrap;font-family:var(--sans);font-weight:300}
.author-line{margin:3px 0 0;font-size:12.5px;letter-spacing:.01em;color:var(--author)}

/* blog */
.posts{margin:56px 0 0;display:flex;flex-direction:column}
.post-link{display:block;padding:26px 16px;margin:0 -16px;border-top:1px solid var(--rule);transition:background-color .3s ease}
.post-link:hover{background-color:rgba(255,221,188,.06)}
.post-link h2{margin:0;font-family:var(--serif);font-weight:400;font-size:24px;line-height:1.3;color:var(--ink);text-wrap:pretty}
.post-link:hover h2{color:var(--peach)}
.post-meta{margin:10px 0 0;display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;font-size:12.5px;color:var(--gray)}
.tag{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.prose{margin:44px 0 0;font-size:16.5px;line-height:1.85;color:var(--ink-soft);text-wrap:pretty}
.prose h2{margin:44px 0 12px;font-family:var(--serif);font-weight:400;font-size:27px;color:var(--ink)}
.prose h3{margin:34px 0 10px;font-family:var(--serif);font-weight:400;font-size:21px;color:var(--ink)}
.prose img{max-width:100%;height:auto;display:block;margin:32px 0;border:1px solid rgba(255,246,239,.09)}
.prose blockquote{margin:32px 0;padding-left:20px;border-left:1px solid var(--lavender);font-family:var(--serif);font-size:19px;font-style:italic;color:var(--ink-dim)}
.prose a{border-bottom:1px solid rgba(255,158,196,.5)}

/* cv */
.cv-head{margin:16px 0 0;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:16px 24px}
.btn{font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-soft);border:1px solid rgba(255,246,239,.22);padding:9px 16px;transition:border-color .25s ease,color .25s ease,background-color .25s ease}
.btn:hover{border-color:var(--lavender);color:var(--ink);background-color:rgba(201,169,232,.09)}
.entry{padding:24px 0;border-top:1px solid var(--rule-soft)}
.entry .top{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 12px}
.entry h3{margin:0;font-family:var(--serif);font-weight:400;font-size:21px;line-height:1.3;color:var(--ink)}
.entry .when{font-size:12.5px;color:var(--gray)}
.entry .role{margin:5px 0 0;font-family:var(--serif);font-size:16.5px;font-style:italic;color:#C9BDB8}
.entry ul{margin:13px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:7px}
.entry li{display:grid;grid-template-columns:15px auto;font-size:14.5px;line-height:1.65;color:var(--ink-dim)}
.entry li::before{content:"\2022";color:#7C7288}

@media(max-width:660px){
  .name{font-size:38px} h1.title{font-size:32px}
  .reading-side{position:static;flex:1 1 100%}
}

/* DNF note + toggle */
.dnf-note{margin:22px 0 0;font-family:var(--serif);font-size:18px;font-style:italic;line-height:1.7;color:var(--gray);text-wrap:pretty}
.dnf-bar{display:flex;justify-content:flex-end;margin:0 0 22px}
.dnf-toggle{display:flex;align-items:center;gap:9px;background:none;border:0;padding:6px 0;cursor:pointer;font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gray);transition:color .25s ease}
.dnf-toggle:hover{color:var(--ink-soft)}
.dnf-toggle .box{width:11px;height:11px;flex:0 0 auto;border:1px solid rgba(255,246,239,.28);transition:border-color .25s ease,background-color .25s ease}
.dnf-toggle:hover .box{border-color:var(--blue)}
.dnf-toggle[aria-pressed="true"]{color:var(--ink-soft)}
.dnf-toggle[aria-pressed="true"] .box{background-color:var(--blue);border-color:var(--blue)}
html[data-hide-dnf="1"] li.is-dnf{display:none}
html[data-hide-dnf="1"] .month:not(:has(li[data-book]:not(.is-dnf))){display:none}