/* One continuous veil, behind every chapter and the footer. No section edges. */
html{overflow-x:clip}
:root{--haze-tint:var(--intro-tint);--body-ink:#183429;--reading-ink:#10291f;--reading-muted:#263b30;--ray:#eff7dd;--post-fill:rgba(255,255,255,.12)}
:root[data-theme=evening]{--body-ink:#34251e;--reading-ink:#2d201a;--reading-muted:#38281f;--ray:#f8d29d}
:root[data-theme=night]{--body-ink:#e2eee4;--reading-ink:#fcfff4;--reading-muted:#e0ebdf;--ray:#6d9d9b}
.scene-wash{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;
 background:linear-gradient(90deg,color-mix(in srgb,var(--haze-tint) 84%,transparent),color-mix(in srgb,var(--haze-tint) 70%,transparent) 30%,color-mix(in srgb,var(--haze-tint) 50%,transparent) 68%,color-mix(in srgb,var(--haze-tint) 30%,transparent)),radial-gradient(ellipse at 35% 90%,color-mix(in srgb,var(--haze-tint) 30%,transparent),transparent 72%),linear-gradient(116deg,transparent 18%,color-mix(in srgb,var(--ray) 7%,transparent) 20%,transparent 25%,transparent 39%,color-mix(in srgb,var(--ray) 5%,transparent) 41%,transparent 48%);
 filter:none;backdrop-filter:none;-webkit-backdrop-filter:none;transform:translateZ(0)}
.intro:before{content:none!important}
/* Open editorial content; glass is reserved for navigation/controls and posts. */
.section-heading,.project-card,.milestone-panel,.connect-panel,.about-story,.about-side,.focus-copy,.philosophy{
 background:none!important;border:0;border-radius:0;box-shadow:none;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.section-heading{padding:0;margin-bottom:36px}
.chapter p:not(.eyebrow),.page-footer,.section-end-link,.closing-note{color:var(--body-ink)}
.section-end-link,.closing-note,.page-footer{text-shadow:none}
#about{overflow-x:clip}
.about-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(40px,6vw,100px);align-items:start}
.about-text{position:relative;isolation:isolate}
/* Broad, feathered radial gradients extend beyond text; never a rectangular panel. */
.about-text:before{content:"";position:absolute;z-index:-1;inset:-100px -95px;pointer-events:none;
 background:radial-gradient(ellipse closest-side,color-mix(in srgb,var(--haze-tint) 60%,transparent) 68%,color-mix(in srgb,var(--haze-tint) 42%,transparent) 82%,transparent 100%)}
.about-story{padding:0}.about-story h3{font-size:clamp(26px,2.5vw,36px);margin:30px 0 24px}
#about p:not(.eyebrow),#about .inline-skills,#about .signature{font-size:16px;line-height:1.8;color:var(--reading-ink)}
.about-story p{max-width:56ch;margin:0 0 18px}
#about .signature{font-family:Georgia,serif;font-style:italic;font-size:23px;border:0;padding:12px 0 0;margin-top:25px}
.about-side{display:flex;flex-direction:column;gap:48px;padding:8px 0 0;grid-template-columns:none;grid-template-rows:none}
.focus-copy h3{font-size:clamp(28px,2.6vw,38px);line-height:1.15;margin:16px 0 24px}
.inline-skills{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px 0}
.inline-skills li{display:inline;background:none;border:0;border-radius:0;padding:0;box-shadow:none}
.inline-skills li:not(:last-child):after{content:"·";padding:0 12px;opacity:.6}
.philosophy{margin:0;padding:0 0 0 24px;border-left:1px solid color-mix(in srgb,var(--accent) 60%,transparent)}
.philosophy blockquote{margin:0 0 20px;font:italic clamp(30px,3vw,44px)/1.2 Georgia,serif;letter-spacing:-.025em;color:var(--reading-ink)}
.philosophy figcaption{color:var(--reading-muted);font-size:10px;letter-spacing:1.4px}
.project-card{overflow:visible}.project-card:hover{transform:none}
.project-art{margin:0;border-radius:0;background:none;border-bottom:1px solid color-mix(in srgb,var(--ink) 22%,transparent)}
.project-body{padding:24px 0}.project-body p{font-size:16px;line-height:1.7}
.project-grid{gap:32px}.project-body .tag-list span{border:0;border-radius:0;padding:0;background:none;font-size:11px}.project-body .tag-list span:not(:last-child):after{content:"·";margin-left:7px}
.milestone-panel{padding:0}.connect-panel{overflow:visible;padding:24px 0}.page-footer{line-height:1.8}
/* Six journal entries: the only content cards. */
.medium-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:stretch}
.medium-card{display:flex;flex-direction:column;min-width:0;overflow:hidden;border-radius:20px;border:1px solid color-mix(in srgb,var(--ink) 12%,#ffffff4a);background:var(--post-fill);box-shadow:inset 0 1px 0 #ffffff26,0 12px 28px #061b2012;backdrop-filter:blur(12px) saturate(150%);-webkit-backdrop-filter:blur(12px) saturate(150%);transition:transform .25s ease;isolation:isolate}
.medium-cover{aspect-ratio:16/9;overflow:hidden;position:relative;background:linear-gradient(135deg,color-mix(in srgb,var(--art-a) 80%,transparent),color-mix(in srgb,var(--art-b) 45%,transparent))}
.medium-cover:before{content:"✦";position:absolute;inset:0;display:grid;place-items:center;font:40px Georgia,serif;color:var(--accent);opacity:.5}
.medium-cover img{position:relative;display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.medium-body{display:flex;flex-direction:column;flex:1;gap:16px;padding:22px;background:color-mix(in srgb,var(--haze-tint) 76%,transparent)}
.medium-card h3{font-size:23px;line-height:1.25;letter-spacing:-.035em;color:var(--reading-ink);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.chapter .medium-card p{font-size:16px;line-height:1.65;color:var(--reading-ink);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.medium-meta{color:var(--reading-muted);font-size:12px;line-height:1.5;margin-top:auto;display:flex;gap:6px;flex-wrap:wrap}
.medium-read{font-size:13px;font-weight:600;color:var(--reading-ink);padding-top:14px;border-top:1px solid color-mix(in srgb,var(--ink) 15%,transparent)}
.notes-status{font-size:14px;margin-top:24px;max-width:55ch}.notes-status a{text-decoration:underline;text-underline-offset:4px}.notes-status:empty{display:none}
@media(hover:hover){.medium-card[href]:hover{transform:translateY(-4px)}.medium-card[href]:hover img{transform:scale(1.03)}}
@media(min-width:640px){.medium-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1025px){.medium-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:899px){.about-grid{grid-template-columns:minmax(0,1fr);gap:52px}.about-side{gap:38px}.about-text:before{inset:-90px -70px}.about-story p{max-width:65ch}}
@media(max-width:767px),(max-width:950px) and (max-height:500px){
 .scene-wash{background:linear-gradient(90deg,color-mix(in srgb,var(--haze-tint) 79%,transparent),color-mix(in srgb,var(--haze-tint) 60%,transparent) 75%,color-mix(in srgb,var(--haze-tint) 44%,transparent)),radial-gradient(ellipse at 20% 80%,color-mix(in srgb,var(--haze-tint) 12%,transparent),transparent 80%)}
 .section-heading{padding:0;margin-bottom:28px}.section-heading h2{font-size:clamp(32px,8vw,42px)}
 .section-heading.split{gap:24px}.section-heading.split>.button{align-self:flex-start}
 .about-grid{gap:44px}.about-side{padding:0}.about-text:before{inset:-80px -65px}.philosophy{padding-left:20px}
 .medium-card{backdrop-filter:blur(12px) saturate(150%)!important;-webkit-backdrop-filter:blur(12px) saturate(150%)!important}
 .medium-body{padding:20px}.medium-card h3{font-size:23px}.project-body{padding:22px 0}.project-grid{gap:34px}
 .connect-panel{padding:24px 0}.page-footer{font-size:11px}.connect-panel .eyebrow{letter-spacing:1px;font-size:10px}
}
/* A masked shimmer uses only transform. It stops for reduced motion/hidden tabs. */
.skeleton{pointer-events:none}.skeleton .medium-cover:before{content:""}
.skeleton-line{height:14px;border-radius:4px;background:color-mix(in srgb,var(--ink) 10%,transparent)}
.skeleton-line.short{width:58%}.skeleton .medium-body{min-height:250px}
.skeleton:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,#ffffff18 50%,transparent 80%);transform:translateX(-100%);animation:journal-shimmer 1.5s ease-in-out infinite}
.skeleton{position:relative}
@keyframes journal-shimmer{to{transform:translateX(100%)}}
@media(prefers-reduced-motion:reduce){.medium-card,.medium-cover img{transition:none}.skeleton:after{animation:none;display:none}}
