@font-face{font-family:'DM Serif';src:url('assets/fonts/dm-serif-latin.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Great Vibes';src:url('assets/fonts/great-vibes-latin.woff?v=2') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Bodoni Moda';src:url('assets/fonts/bodoni-moda-latin.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Nunito';src:url('assets/fonts/nunito-latin.woff') format('woff');font-style:normal;font-weight:200 1000;font-display:swap}
@font-face{font-family:'Nunito';src:url('assets/fonts/nunito-italic-latin.woff') format('woff');font-style:italic;font-weight:200 1000;font-display:swap}
@font-face{font-family:'Fraunces';src:url('assets/fonts/fraunces-text-latin.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Kalam';src:url('assets/fonts/kalam-regular-latin.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Kalam';src:url('assets/fonts/kalam-bold-latin.woff') format('woff');font-style:normal;font-weight:700;font-display:swap}
:root{
  --ink:#12376a;--red:#b82137;--pink:#f4a9c2;--paper:#fff9ed;--butter:#f2e394;--blue-paper:#c5d8ed;
  --serif:'DM Serif',Georgia,serif;--hand:'Great Vibes',Georgia,serif;--book:min(1260px,calc(100% - 5rem));
  --line:rgba(18,55,106,.18);--shadow:0 12px 24px rgba(47,38,45,.13);
  --torn-edge:polygon(0 0,100% 0,100% 70%,98% 86%,96% 58%,93% 81%,90% 64%,88% 96%,85% 72%,82% 90%,79% 65%,76% 79%,73% 57%,70% 87%,67% 70%,64% 98%,61% 76%,58% 90%,55% 61%,52% 85%,49% 70%,46% 96%,43% 72%,40% 89%,37% 58%,34% 78%,31% 65%,28% 95%,25% 73%,22% 84%,19% 60%,16% 89%,13% 72%,10% 95%,7% 69%,4% 88%,2% 65%,0 83%);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:2rem}
body{margin:0;padding:1.5rem 0 2rem;background-color:var(--ink);background-image:repeating-linear-gradient(90deg,transparent 0 23px,rgba(255,249,237,.06) 23px 24px);color:var(--ink);font:1rem/1.7 Arial,Helvetica,sans-serif}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-underline-offset:.25em}
button{font:inherit;color:inherit}
a,button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
a:focus-visible,button:focus-visible{outline:3px solid var(--red);outline-offset:5px}
h1,h2,h3,p,figure,blockquote{margin:0}
h1,h2,h3{font-weight:400;overflow-wrap:break-word}
em{font-family:var(--hand);font-style:normal;font-weight:400}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:1rem;left:1rem;z-index:50;padding:.6rem 1rem;background:var(--butter);transform:translateY(-200%)}
.skip-link:focus{transform:none}
.site-header,.diary,.site-footer{width:var(--book);margin-inline:auto}
.diary{position:relative;background:var(--paper);box-shadow:6px 4px 0 #eedbba,12px 8px 0 #9eb8d7,17px 13px 0 rgba(0,0,0,.17)}
.site-header{position:relative;z-index:10;border-radius:12px 12px 0 0;background:var(--paper)}
.header-inner{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:0 2.75rem;min-height:106px;border-bottom:1px solid var(--line)}
.brand{display:block;position:relative;width:202px;height:83px;flex:0 0 202px;overflow:hidden}
.brand img{position:absolute;top:50%;left:0;width:202px;transform:translateY(-50%)}
nav{display:flex;gap:.35rem;align-items:flex-end;align-self:stretch;padding-top:1.7rem;font-size:.875rem}
nav>a{display:flex;align-items:center;justify-content:center;min-height:55px;padding:.8rem 1rem;border:1px solid var(--line);border-bottom:0;border-radius:12px 12px 0 0;text-decoration:none;transition:transform .2s}
nav>a:hover{transform:translateY(-4px)}
.tab-pages{background:var(--pink)}.tab-topics{background:var(--butter)}.tab-travel{background:var(--blue-paper)}.tab-about{background:#eadbe8}
nav>.nav-instagram{background:var(--ink);color:var(--paper)}
.menu-toggle{display:none;background:var(--paper);border:1px solid var(--ink);padding:.45rem 1rem;border-radius:4px;min-height:44px;font-size:.875rem;cursor:pointer}
.section-shell{position:relative;width:calc(100% - 7rem);margin-inline:auto}
.eyebrow{font-size:.875rem;line-height:1.5;letter-spacing:.075em;text-transform:uppercase;font-weight:700}
.section-tab{position:absolute;bottom:100%;left:-1px;padding:.55rem 1.5rem .45rem;border:1px solid var(--line);border-bottom:0;border-radius:13px 13px 0 0;background:var(--pink);font-size:.875rem;letter-spacing:.04em;white-space:nowrap}
.page-number{position:absolute;right:1.5rem;bottom:1.2rem;font:italic .875rem Georgia,serif;color:var(--ink)}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:.65rem 1.55rem;border:1px solid currentColor;border-radius:4px;font-size:.9375rem;line-height:1.5;text-decoration:none;transition:transform .2s,box-shadow .2s,background .2s}
.button:hover{transform:translateY(-3px);box-shadow:3px 5px 0 rgba(18,55,106,.16)}
.button-ink{background:var(--red);color:var(--paper);border-color:var(--red);box-shadow:3px 4px 0 #e8b0bc}
.button-cream{background:var(--paper);color:var(--ink);border-color:var(--ink)}
.cover{position:relative;background-color:var(--paper);background-image:linear-gradient(rgba(184,33,55,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(184,33,55,.09) 1px,transparent 1px);background-size:26px 26px}
.cover-inner{position:relative;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:3.5rem;align-items:center;min-height:704px;padding:4.4rem 5rem 5.5rem}
.cover-copy{position:relative;z-index:2}
.cover .eyebrow{font-size:.8125rem;color:var(--red);margin-bottom:1.65rem;letter-spacing:.09em}
h1{font-family:var(--serif);font-size:clamp(3.6rem,6.65vw,6.15rem);line-height:1.02;letter-spacing:-.035em}
h1>span{display:block}
h1>span:nth-child(2){color:var(--red)}
h1 .last-line{margin-top:.06em}
h1 em{font-size:1.14em;letter-spacing:-.005em;line-height:1.15;color:var(--ink)}
.cover-note{margin:1.65rem 0 1.7rem;font-size:1.125rem;line-height:1.7}
.cover-note em{font-size:1.95em;line-height:1.1;color:var(--red);background:linear-gradient(transparent 72%,rgba(242,227,148,.7) 72% 92%,transparent 92%)}
.cover-collage{position:relative;isolation:isolate;width:100%;max-width:350px;justify-self:end;padding:1.7rem .25rem 1.25rem}
.cover-collage:before{content:'';position:absolute;inset:2rem -1.25rem .3rem 1.4rem;z-index:-1;transform:rotate(-8deg);border:1px solid rgba(184,33,55,.15);background:repeating-linear-gradient(90deg,#f7b9ca 0 12px,#fbd8e2 12px 24px);box-shadow:var(--shadow)}
.contents-note{position:relative;padding:2rem 1.9rem 2.5rem;transform:rotate(5deg);background-color:var(--butter);background-image:repeating-linear-gradient(transparent 0 31px,rgba(18,55,106,.14) 31px 32px);border:1px solid rgba(18,55,106,.13);border-bottom:0;filter:drop-shadow(3px 5px 5px rgba(18,55,106,.14))}
.contents-note:before{position:absolute;content:'';width:43%;height:1.65rem;top:-.8rem;left:27%;background:repeating-linear-gradient(90deg,rgba(190,214,237,.8) 0 8px,rgba(190,214,237,.5) 8px 16px);transform:rotate(-9deg)}
.contents-note:after,.subject-row:after{position:absolute;content:'';left:-1px;right:-1px;bottom:-10px;height:12px;background:inherit;clip-path:var(--torn-edge);pointer-events:none}
.contents-note h2{font-family:var(--hand);color:var(--red);font-size:3.2rem;line-height:1.3;margin-bottom:1.1rem}
.contents-note a{display:flex;gap:1rem;align-items:center;min-height:49px;font-family:Georgia,serif;font-size:1.125rem;text-decoration:none;border-bottom:1px dotted rgba(18,55,106,.18)}
.contents-note a:hover{color:var(--red)}
.contents-note a span{font:italic .875rem Georgia,serif;color:var(--red)}
.note-signoff{display:block;text-align:right;margin-top:1.2rem;font-family:var(--hand);font-size:2.2rem;line-height:1.2;color:var(--red)}
.cover-seal{position:absolute;width:79px;height:79px;border-radius:50%;left:-1.4rem;bottom:-.2rem;z-index:2;transform:rotate(-13deg);box-shadow:2px 4px 8px rgba(18,55,106,.17)}
.archive{position:relative;padding:5.6rem 0 4.75rem;background:repeating-linear-gradient(90deg,#f4a9c2 0 19px,#f7bed0 19px 38px)}
.archive:before{position:absolute;content:'';height:13px;left:0;right:0;top:-1px;background:radial-gradient(circle at 50% 0,var(--paper) 11px,transparent 11.5px) 0 0/23px 14px repeat-x}
.archive-sheet{padding:2.4rem 2.5rem 3.8rem;border:1px solid rgba(184,33,55,.25);border-radius:0 8px 8px 8px;background:#ffdfdf;box-shadow:7px -10px 0 #dc8fa9,12px -18px 0 #efd3b7,var(--shadow)}
.archive .section-tab{background:#ffdfdf}
.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:2.5rem}
.section-heading h2{font:clamp(2.7rem,4.25vw,4.1rem)/1.18 var(--serif)}
.section-heading h2 em{color:var(--red);font-size:1.35em}
.archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.9rem;align-items:start}
.story{min-width:0}
.story-books{padding-top:1.35rem}
.artwork-link{display:block;position:relative;box-shadow:3px 5px 10px rgba(18,55,106,.2);transition:transform .2s;transform:rotate(-2.5deg)}
.story-books .artwork-link{transform:rotate(2deg)}.story-music .artwork-link{transform:rotate(-1deg)}
.artwork-link:hover{transform:rotate(0) translateY(-3px)}
.artwork-link img{width:100%;aspect-ratio:4/5;object-fit:contain}
.artwork-caption{position:absolute;right:.5rem;bottom:.5rem;background:var(--paper);padding:.25rem .6rem;font-size:.8125rem;opacity:0;transition:opacity .2s}
.artwork-link:hover .artwork-caption,.artwork-link:focus-visible .artwork-caption{opacity:1}
.story-meta{display:flex;justify-content:space-between;gap:.6rem;margin:1.6rem 0 .7rem;padding-bottom:.55rem;border-bottom:1px solid rgba(184,33,55,.25);font-size:.75rem;text-transform:uppercase;letter-spacing:.045em}
.story h3{font:1.75rem/1.2 var(--serif);margin-bottom:.7rem;text-wrap:pretty}
.story p{font-size:1rem;line-height:1.65}
.subjects{position:relative;padding:4.5rem 0 4.25rem;background-color:var(--butter);background-image:linear-gradient(90deg,rgba(255,249,237,.48) 50%,transparent 50%),linear-gradient(rgba(255,249,237,.48) 50%,transparent 50%);background-size:40px 40px}
.subjects-inner{padding:0 .75rem 2.2rem}
.subjects-intro{margin-bottom:2.5rem;text-align:center}
.subjects .section-tab{position:static;display:inline-block;padding:.25rem 1rem;border:1px solid rgba(18,55,106,.2);border-radius:0;background:var(--paper);font-size:.8125rem;margin-bottom:.8rem;transform:rotate(-2deg)}
.subjects h2{font:clamp(2.6rem,4.2vw,3.8rem)/1.22 var(--serif)}
.subjects h2 em{color:var(--red);font-size:1.32em}
.subject-index{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2.6rem 2.2rem;padding:.5rem}
.subject-row{display:grid;grid-template-columns:2rem minmax(0,1fr);gap:.85rem;position:relative;min-width:0;padding:2.25rem 2rem 2rem;border:1px solid rgba(18,55,106,.12);border-bottom:0;background-color:var(--paper);transform:rotate(-1.5deg);filter:drop-shadow(3px 7px 5px rgba(18,55,106,.13))}
.subject-row:before{content:'';position:absolute;top:-.7rem;left:36%;width:30%;height:1.45rem;background:rgba(244,169,194,.62);transform:rotate(3deg)}
.subject-books{background-image:repeating-linear-gradient(transparent 0 31px,rgba(18,55,106,.11) 31px 32px)}
.subject-screen{background-color:var(--blue-paper);background-image:radial-gradient(rgba(18,55,106,.2) .8px,transparent 1px);background-size:12px 12px;transform:rotate(1.4deg);margin-top:.65rem}
.subject-screen:before{background:rgba(255,249,237,.6);transform:rotate(-4deg)}
.subject-music{background-color:#fbd5df;background-image:linear-gradient(rgba(184,33,55,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(184,33,55,.09) 1px,transparent 1px);background-size:24px 24px;transform:rotate(.8deg)}
.subject-music:before{background:rgba(190,214,237,.7);transform:rotate(-5deg)}
.subject-life{transform:rotate(-1deg);margin-top:.65rem;background-image:repeating-linear-gradient(transparent 0 31px,rgba(18,55,106,.11) 31px 32px)}
.index-number{font:italic 1.4rem/1.5 Georgia,serif;color:var(--red)}
.subject-row h3{font:1.95rem/1.2 var(--serif);margin-bottom:.85rem}
.subject-row p{font-size:1.0625rem;line-height:1.8}
.astro-note{display:flex;gap:1.2rem;align-items:baseline;margin:2.75rem .7rem 0;border-top:1px solid rgba(18,55,106,.24);padding-top:1rem}
.astro-note h3{font:1.15rem/1.5 var(--serif);white-space:nowrap}
.astro-note p{font-size:.875rem;line-height:1.6}
.subjects .page-number{right:.5rem;bottom:-.1rem}
.travel{padding:5.5rem 0 4.5rem;background-color:var(--ink);background-image:repeating-linear-gradient(90deg,transparent 0 17px,rgba(255,249,237,.08) 17px 18px)}
.travel-sheet{display:grid;grid-template-columns:1.05fr 1fr;gap:2.5rem;align-items:center;padding:2.8rem 2.6rem 3.1rem;background:var(--paper);border:9px solid var(--paper);border-image:repeating-linear-gradient(135deg,var(--paper) 0 11px,var(--red) 11px 20px,var(--paper) 20px 31px,var(--ink) 31px 40px) 9;box-shadow:6px 7px 0 rgba(0,0,0,.2);transform:rotate(-.7deg)}
.travel .section-tab{left:-9px;bottom:calc(100% + 9px);background:var(--blue-paper);border-color:transparent}
.travel h2{font:clamp(2.6rem,4vw,3.75rem)/1.2 var(--serif);margin-bottom:1.3rem}
.travel h2 em{color:var(--red);font-size:1.3em}
.travel-copy>p:not(.eyebrow){font-size:1.0625rem;line-height:1.8}
.travel-copy .travel-note{margin-top:1.3rem;font-family:Georgia,serif;font-style:italic;font-size:1rem;color:var(--red)}
.travel-art{border-left:1px solid var(--line);padding:2rem 0 2rem 1.5rem}
.travel-scraps{width:100%;transform:rotate(3deg)}
.travel .page-number{bottom:.65rem;right:1.2rem}
.about{padding:5.5rem 0 4.5rem;background:repeating-linear-gradient(90deg,#c5d8ed 0 20px,#a9c3e2 20px 40px)}
.about-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);grid-template-areas:'photos title' 'photos bio' 'quote quote';gap:0 3rem;padding:2.75rem 3rem 3.5rem;background-color:var(--paper);background-image:radial-gradient(rgba(18,55,106,.15) .8px,transparent 1px);background-size:12px 12px;border:1px solid var(--line);border-radius:0 8px 8px 8px;box-shadow:7px -10px 0 #eadbb8,12px -17px 0 #f4bccd,var(--shadow)}
.about-intro{grid-area:title}
.about h2{font:4.9rem/1.06 var(--serif);margin-bottom:1.45rem}
.about h2>span{display:block;color:var(--red);font-family:var(--hand);font-size:.8em;line-height:1.05}
.about-visual{grid-area:photos;position:relative;isolation:isolate;align-self:center;min-width:0;padding:0 1rem 4.8rem 0;margin:.5rem 0 1rem}
.about-visual:before{position:absolute;content:'';z-index:-1;inset:2rem .1rem 4.5rem 0;background-color:var(--pink);background-image:repeating-linear-gradient(90deg,rgba(255,249,237,.4) 0 14px,transparent 14px 28px);transform:rotate(-5deg);border:1px solid rgba(184,33,55,.12);box-shadow:var(--shadow)}
.portrait{position:relative;transform:rotate(-2deg)}
.portrait img{width:100%;filter:drop-shadow(2px 3px 1px rgba(18,55,106,.08))}
.childhood{position:absolute;z-index:2;width:43%;max-width:210px;bottom:0;right:-.8rem;transform:rotate(10deg)}
.childhood img{width:100%;filter:drop-shadow(2px 4px 3px rgba(18,55,106,.22))}
.childhood span{position:relative;display:table;margin:-.35rem auto 0;padding:.03rem .8rem;background:var(--butter);font:2.4rem/1.2 var(--hand);color:var(--red);transform:rotate(-7deg)}
.about-copy{grid-area:bio}
.about-lead{font:1.35rem/1.55 var(--serif);margin-bottom:1rem}
.about-copy>p:not(.about-lead){font-size:1.0625rem;line-height:1.8;margin-top:1rem}
.about-copy .handwritten{font:1.95rem/1.4 var(--hand)!important;color:var(--red);margin-top:1.3rem}
.personal-note{grid-area:quote;position:relative;width:93%;justify-self:center;margin-top:2.5rem;padding:1.7rem 1.5rem 1.8rem;background:#f7bed0;border:1px solid rgba(184,33,55,.17);box-shadow:4px 6px 0 rgba(184,33,55,.12);transform:rotate(-1.3deg);text-align:center}
.personal-note:before{content:'';position:absolute;width:6.5rem;height:1.3rem;left:calc(50% - 3.25rem);top:-.65rem;background:rgba(242,227,148,.85);transform:rotate(5deg)}
.personal-note p{font:clamp(1.5rem,2.5vw,2.3rem)/1.5 var(--serif)}
.personal-note em{font-size:1.38em;line-height:1.3;color:var(--red)}
.instagram-band{position:relative;background:var(--pink);padding:2rem 0 2.2rem}
.instagram-band:before{content:'';position:absolute;bottom:100%;left:0;right:0;height:12px;background:radial-gradient(circle at 50% 100%,var(--pink) 11px,transparent 11.5px) 0 0/23px 12px repeat-x}
.instagram-inner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.instagram-inner .eyebrow{font-size:.8125rem;margin-bottom:.5rem}
.instagram-inner h2{font:2.6rem/1.2 var(--serif)}
.instagram-inner h2 em{font-size:1.35em;color:var(--red)}
.instagram-inner .button{flex-shrink:0}
.site-footer{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.7rem 3rem;border-top:1px solid var(--line);border-radius:0 0 10px 10px;background:var(--paper)}
.footer-brand{display:flex;gap:.8rem;align-items:center}
.footer-brand img{width:48px;height:48px;border-radius:50%}
.footer-brand strong{display:block;font:1.2rem/1.4 var(--serif)}
.footer-brand span{display:block;font-size:.8125rem}
.site-footer>a{font-size:.875rem}.copyright{font-size:.8125rem;white-space:nowrap}
@media(max-width:1100px){
  :root{--book:calc(100% - 3rem)}
  .header-inner{padding-inline:2rem;gap:1rem}.brand{width:185px;flex-basis:185px}.brand img{width:185px}nav>a{padding-inline:.75rem}
  .cover-inner{padding:4rem 3.5rem 4.75rem;gap:2.6rem;min-height:650px}h1{font-size:clamp(3.2rem,6.8vw,5.5rem)}
  .contents-note{padding:1.8rem 1.5rem 2rem}.contents-note h2{font-size:2.8rem}.cover-seal{width:69px;height:69px}
  .section-shell{width:calc(100% - 5rem)}.archive-sheet{padding-inline:2rem}.archive-grid{gap:1.5rem}
  .subject-row{padding:2rem 1.5rem 1.8rem;gap:.65rem;grid-template-columns:1.7rem 1fr}.subject-row h3{font-size:1.8rem}
  .travel-sheet{padding:2.2rem 2rem 2.7rem;gap:1.75rem}
  .about-inner{padding:2.5rem 2.25rem 3rem;gap:0 2.2rem}.about h2{font-size:4.3rem}
}
@media(max-width:850px){
  :root{--book:calc(100% - 2.5rem)}body{padding-block:1rem 1.5rem}.diary{box-shadow:5px 3px 0 #eedbba,9px 6px 0 #9eb8d7,13px 10px 0 rgba(0,0,0,.17)}
  .header-inner{flex-wrap:wrap;min-height:88px}.menu-toggle:not([hidden]){display:block}.brand{height:80px}
  nav{width:100%;padding:.2rem 0 1rem;flex-wrap:wrap;gap:.45rem}nav>a{min-height:44px;border-bottom:1px solid var(--line);border-radius:6px}html.has-js nav:not(.is-open){display:none}
  .cover-inner{padding:3.5rem 2.7rem 4.25rem;gap:2rem;min-height:580px;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}h1{font-size:clamp(2.8rem,6.7vw,3.7rem)}
  .cover .eyebrow{font-size:.75rem;letter-spacing:.04em}.cover-note{font-size:1.0625rem}
  .contents-note{padding:1.6rem 1.2rem 1.8rem}.contents-note h2{font-size:2.3rem}.contents-note a{font-size:1rem;gap:.7rem}.cover-collage:before{right:-.65rem}.cover-seal{width:61px;height:61px;left:-.8rem}
  .section-shell{width:calc(100% - 4rem)}.archive-sheet{padding-inline:1.5rem}.archive-grid{gap:1.3rem}.story h3{font-size:1.5rem}.story-meta{letter-spacing:0}
  .subject-index{gap:2rem 1.6rem}.subject-row{padding:1.8rem 1.3rem;display:block}.index-number{display:block;font-size:1.1rem;margin-bottom:.5rem}.subject-row h3{font-size:1.8rem}.subject-row p{font-size:1rem}
  .astro-note{display:block}.astro-note h3{margin-bottom:.4rem;white-space:normal}
  .travel-sheet{gap:1.3rem;padding-inline:1.6rem}.travel h2{font-size:2.6rem}.travel-art{padding-left:1rem}
  .about-inner{padding:2.25rem 2rem 3rem;gap:0 1.8rem}.about h2{font-size:3.7rem}.about-visual{padding:0 .5rem 3.5rem 0}.about-lead{font-size:1.22rem}.about-copy>p:not(.about-lead){font-size:1rem}.about-copy .handwritten{font-size:1.75rem!important}.childhood{width:48%;right:-.6rem}.childhood span{font-size:2rem}
  .personal-note{width:98%;margin-top:1.8rem}.instagram-inner h2{font-size:2.25rem}.instagram-inner .button{font-size:.875rem;padding-inline:1rem}.site-footer{padding-inline:2rem;flex-wrap:wrap}
}
@media(max-width:680px){
  .cover-inner{display:block;padding:3rem 2rem 3.7rem}.cover-copy{text-align:center}h1{font-size:clamp(3rem,11.5vw,4.8rem)}.cover .eyebrow{letter-spacing:.055em}
  .cover-collage{max-width:320px;width:85%;margin:2.8rem auto 0}.contents-note{padding:1.6rem 1.7rem 1.7rem}.contents-note h2{font-size:2.9rem}.contents-note a{font-size:1.0625rem;min-height:45px}.cover-seal{width:68px;height:68px}.note-signoff{font-size:2.1rem}
  .archive-grid{grid-template-columns:1fr;gap:2.6rem}.story{max-width:390px;margin-inline:auto;width:100%}.story-books{padding-top:0}.story h3{font-size:1.9rem}.artwork-caption{opacity:1}.story-meta{margin-top:1.4rem}
  .section-heading{margin-bottom:2.1rem}.section-heading h2{font-size:2.7rem}
  .subject-index{grid-template-columns:1fr;gap:2rem;padding:.35rem .5rem}.subject-row{display:grid;grid-template-columns:1.7rem 1fr;padding:1.8rem 1.5rem;gap:.8rem;max-width:460px;width:100%;margin-inline:auto}.subject-screen,.subject-life{margin-top:0}.index-number{font-size:1.25rem;margin:0}.subject-row h3{font-size:2rem}.subject-row p{font-size:1rem}
  .subjects h2{font-size:2.5rem}.subjects h2 em{display:block;line-height:1.2}.astro-note{margin-top:2.3rem}
  .travel-sheet{display:block;padding:2rem 1.7rem 2.8rem}.travel-art{border-left:0;border-top:1px solid var(--line);padding:1.8rem 0 0;margin-top:1.5rem}.travel-scraps{max-width:340px;margin:auto}.travel h2{font-size:2.9rem}
  .about-inner{grid-template-columns:1fr;grid-template-areas:'title' 'photos' 'bio' 'quote';padding:2rem 1.8rem 3rem;gap:0}.about h2{text-align:center;font-size:4.2rem;margin-bottom:1.5rem}.about h2>span{display:inline;margin-right:.2em;font-size:.9em}
  .about-visual{width:87%;max-width:370px;justify-self:center;margin:1rem 0 2rem;padding:0 1.2rem 4rem 0}.about-visual:before{bottom:3.8rem}.childhood{width:44%;right:-.5rem}.childhood span{font-size:2.2rem}.about-lead{font-size:1.3rem}.about-copy>p:not(.about-lead){font-size:1.0625rem}
  .personal-note{width:100%;padding:1.35rem 1rem;margin-top:2rem}.personal-note p{font-size:1.65rem;line-height:1.45}.personal-note em{font-size:1.25em}.personal-note br{display:none}
  .instagram-inner{display:block}.instagram-inner .button{margin-top:1.3rem;font-size:.9375rem}.footer-brand{width:100%}.copyright{margin-left:auto}
}
@media(max-width:440px){
  :root{--book:calc(100% - 1.5rem)}body{padding-block:.65rem 1rem}.diary{box-shadow:3px 2px 0 #eedbba,6px 4px 0 #9eb8d7,9px 7px 0 rgba(0,0,0,.17)}
  .header-inner{padding-inline:1rem;gap:.5rem;min-height:78px}.brand{width:168px;flex-basis:168px;height:72px}.brand img{width:168px}nav>a{flex:1 1 40%}
  .cover-inner{padding:2.5rem 1.25rem 3.4rem}.cover .eyebrow{font-size:.75rem;letter-spacing:.02em;margin-bottom:1.4rem}h1{font-size:clamp(2.65rem,11.8vw,3.5rem)}.cover-note{font-size:1rem}
  .cover-collage{width:87%;margin-top:2.35rem}.contents-note{padding:1.5rem 1.2rem 1.7rem}.contents-note h2{font-size:2.45rem}.contents-note a{font-size:1rem;gap:.7rem}.cover-seal{width:57px;height:57px}
  .section-shell{width:calc(100% - 2rem)}.section-tab{font-size:.8125rem;padding:.5rem 1rem;max-width:100%;white-space:normal}.page-number{font-size:.8125rem;right:1rem}
  .archive{padding:4.5rem 0 3rem}.archive-sheet{padding:1.6rem 1.35rem 3rem;box-shadow:4px -7px 0 #dc8fa9,8px -13px 0 #efd3b7,var(--shadow)}.section-heading h2{font-size:2.25rem}.story h3{font-size:1.75rem}
  .subjects{padding:2.8rem 0 3.2rem}.subjects-inner{padding-inline:0}.subjects-intro{margin-bottom:1.8rem}.subjects h2{font-size:2.2rem}.subject-index{padding-inline:.25rem}.subject-row{padding:1.65rem 1.1rem;grid-template-columns:1.2rem 1fr;gap:.6rem}.subject-row h3{font-size:1.75rem}.subject-row p{line-height:1.85}.index-number{font-size:1rem}.astro-note{margin-inline:.3rem}
  .travel{padding:4.6rem 0 3rem}.travel-sheet{padding:1.6rem 1.2rem 2.5rem;border-width:7px;transform:rotate(-.35deg)}.travel .section-tab{left:-7px;bottom:calc(100% + 7px)}.travel h2{font-size:2.4rem}.travel-copy>p:not(.eyebrow){font-size:1rem}.travel-art{padding-top:1.3rem}
  .about{padding:4.5rem 0 3rem}.about-inner{padding:1.8rem 1.35rem 3rem;box-shadow:4px -7px 0 #eadbb8,8px -13px 0 #f4bccd,var(--shadow)}.about h2{font-size:3.4rem}.about h2>span{display:block;margin-right:0;font-size:1em;line-height:1.1}.about-visual{width:93%;margin-top:.5rem;padding-right:.9rem}.childhood{right:-.4rem}.about-lead{font-size:1.22rem}.about-copy>p:not(.about-lead){font-size:1rem}.personal-note p{font-size:1.45rem}.personal-note em{font-size:1.32em}
  .instagram-inner{padding-inline:.3rem}.instagram-inner h2{font-size:2.1rem}.site-footer{padding:1.4rem;gap:1.1rem}.footer-brand strong{font-size:1.12rem}.footer-brand span{font-size:.75rem}
}
@media(max-width:360px){.contents-note h2{font-size:2.15rem}}
/* Detached notebook sheets: open circular perforations, as in the supplied reference. */
:root{--display:'Bodoni Moda',Didot,'Times New Roman',serif}
h1,.section-heading h2,.subjects h2,.travel h2,.about h2,.instagram-inner h2,.personal-note p{font-family:var(--display);font-weight:400;font-optical-sizing:auto;letter-spacing:-.025em}
.cover{padding:4.2rem 0 3.2rem;background:var(--red)}
.cover-inner{display:block;width:calc(100% - 7rem);margin-inline:auto;min-height:0;padding:2.8rem 3rem 3.5rem;background-color:var(--paper);background-image:linear-gradient(rgba(18,55,106,.075) 1px,transparent 1px),linear-gradient(90deg,rgba(18,55,106,.075) 1px,transparent 1px);background-size:28px 28px;text-align:center}
.cover-copy{max-width:850px;margin-inline:auto}
h1{font-size:clamp(3.5rem,6.8vw,6.15rem);line-height:1.08}
h1 em{letter-spacing:0}
.cover .eyebrow{margin-bottom:1.3rem}
.cover-note{margin:1.5rem 0 1.6rem}
.perforated-sheet{border-top:0;border-radius:0;box-shadow:0 9px 18px rgba(18,55,106,.12)}
.perforated-sheet:before{content:'';position:absolute;left:0;right:0;top:-34px;height:36px;background:inherit;pointer-events:none;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 36'%3E%3Cpath d='M0 0H19V9A12 12 0 1 0 29 9V0H48V36H0Z'/%3E%3C/svg%3E") 0 0/48px 36px repeat-x;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 36'%3E%3Cpath d='M0 0H19V9A12 12 0 1 0 29 9V0H48V36H0Z'/%3E%3C/svg%3E") 0 0/48px 36px repeat-x}
.archive{padding-top:5rem}
.archive:before{display:none}
.archive-sheet{background:var(--paper);padding-top:2rem}
.perforated-sheet .section-tab{position:static;display:block;border:0;border-radius:0;padding:0;margin:0 0 .85rem;background:none;font-size:.8125rem;color:var(--red);white-space:normal}
.about-inner{padding-top:2.7rem}
.subject-recipes{grid-column:1/-1;max-width:none;background-color:#fff3c7;background-image:repeating-linear-gradient(transparent 0 31px,rgba(18,55,106,.12) 31px 32px);transform:rotate(.6deg)}
.subject-recipes p{max-width:48rem}
.subject-recipes:before{background:rgba(190,214,237,.75);left:43%;width:17%}
.personal-note p{letter-spacing:0}
@media(max-width:1100px){.cover-inner{width:calc(100% - 5rem)}}
@media(max-width:850px){.cover-inner{width:calc(100% - 4rem);padding:2.4rem 2rem 3rem}h1{font-size:clamp(3.3rem,8.5vw,5rem)}}
@media(max-width:680px){.cover-inner{padding:2rem 1.5rem 3rem}.cover{padding-top:3.8rem;padding-bottom:2.5rem}.cover-copy{text-align:center}h1{font-size:clamp(2.8rem,9.8vw,4.5rem)}.subject-recipes{grid-column:auto}.perforated-sheet:before{-webkit-mask-size:40px 30px;mask-size:40px 30px;height:30px;top:-28px}.about-inner{padding-top:2rem}}
@media(max-width:440px){.cover-inner{width:calc(100% - 2rem);padding:1.8rem 1.1rem 2.8rem}h1{font-size:clamp(2.45rem,10vw,3.3rem)}.cover .eyebrow{font-size:.75rem}.cover-note{font-size:1rem}.archive-sheet{padding-top:1.6rem}.subject-recipes:before{left:35%;width:30%}.about-inner{padding-top:1.8rem}}
/* Rounded reading type against the editorial and handwritten titles. */
:root{--reading:'Nunito','Trebuchet MS',sans-serif}
body{font-family:var(--reading)}
.story p,.subject-row p,.travel-copy>p:not(.eyebrow),.about-copy>p:not(.about-lead):not(.handwritten),.astro-note p,.cover-note{font-family:var(--reading);font-weight:400;letter-spacing:0}
.subject-row p{font-size:1.125rem;line-height:1.8}
.about-lead{font-family:var(--reading);font-size:1.3rem;font-weight:500;line-height:1.6}
.about-copy .bio-aside{font-family:var(--serif);font-size:1.1rem;color:var(--red)}
/* Colored dividers use the same editorial type as the opening title. */
.header-inner{position:relative;flex-wrap:wrap;gap:0;min-height:0;padding:0 2.75rem;border-bottom:0}
.brand{height:92px}
nav{position:static;display:flex;flex:1 0 100%;flex-direction:column;align-items:stretch;gap:0;padding:0;font-size:1rem}
.folder-tabs{display:flex;align-items:flex-end;padding:5px 0 0;isolation:isolate}
.folder-tab{--tab-paper:var(--pink);position:relative;isolation:isolate;display:flex;align-items:center;justify-content:flex-start;flex:1 1 25%;min-width:0;min-height:78px;padding:15px 32px 13px 24px;border:0;border-radius:16px 16px 0 0;background:none;text-decoration:none;filter:drop-shadow(3px -2px 2px rgba(18,55,106,.12));transition:transform .2s;transform:none}
.folder-tab+.folder-tab{margin-left:-15px}
.folder-tab:before,.folder-tab:after{content:'';position:absolute;z-index:-1;background-color:var(--tab-paper);background-image:repeating-linear-gradient(0deg,transparent 0 3px,rgba(18,55,106,.025) 3px 4px);pointer-events:none}
.folder-tab:before{inset:18px 0 0;border-radius:0 20px 0 0}
.folder-tab:after{top:0;bottom:0;left:0;width:81%;border-radius:17px 18px 0 0}
.tab-caption{display:block;position:relative;max-width:100%;padding:.2rem 0;background:transparent;border:0;box-shadow:none;color:var(--ink);font:400 1.65rem/1.2 var(--display);font-optical-sizing:auto;letter-spacing:-.035em;white-space:normal;text-wrap:balance}
.tab-pages{--tab-paper:#f4a9c2;z-index:4;min-height:84px}.tab-topics{--tab-paper:#f2e394;z-index:3;min-height:78px}.tab-travel{--tab-paper:#b5d1eb;z-index:2;min-height:86px}.tab-about{--tab-paper:#f4c5d2;z-index:1;min-height:80px}
.folder-tab:hover,.folder-tab:focus-visible{z-index:5;transform:translateY(-5px)}
.folder-tab:hover .tab-caption{color:var(--red)}
nav>.nav-instagram{position:absolute;top:24px;right:2.75rem;display:inline-flex;flex-direction:row;align-items:center;gap:.6rem;min-height:44px;min-width:0;padding:.3rem 0;background:none;color:var(--ink);border:0;border-radius:0;box-shadow:none;font-size:.9375rem;font-weight:600;text-decoration:underline;text-decoration-color:var(--pink);text-decoration-thickness:2px;text-underline-offset:5px;transform:none}
nav>.nav-instagram:hover{color:var(--red);transform:none}
@media(max-width:1100px){.header-inner{padding-inline:2rem}.brand{width:185px;flex-basis:185px}.brand img{width:185px}.folder-tab{padding-inline:21px 26px}.tab-caption{font-size:1.5rem;padding-inline:0}nav>.nav-instagram{right:2rem}}
@media(max-width:850px){.header-inner{min-height:88px;justify-content:space-between}.brand{height:88px;width:185px;flex-basis:185px}.brand img{width:185px}.menu-toggle{border-radius:18px 18px 4px 4px;background:var(--butter);font-weight:600}nav{padding:0 0 .8rem;gap:.4rem;align-items:stretch}.folder-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;align-items:stretch}.folder-tab{min-height:76px;padding:15px 18px 13px;border-radius:17px 18px 0 0}.folder-tab+.folder-tab{margin-left:0}.folder-tab:nth-child(even){margin-left:-10px}.folder-tab:nth-child(n+3){margin-top:-5px}.folder-tab:before{border-radius:0 20px 3px 3px}.folder-tab:after{border-radius:17px 18px 0 3px}.tab-caption{font-size:1.5rem}.tab-pages{z-index:2}.tab-topics{z-index:1}.tab-travel{z-index:4}.tab-about{z-index:3}nav>.nav-instagram{position:static;align-self:center;flex:0 1 auto;margin:.2rem auto 0;padding:.35rem .7rem}.subject-row p{font-size:1.0625rem}.about-copy>p:not(.about-lead):not(.handwritten){font-size:1.0625rem}}
@media(max-width:440px){.header-inner{min-height:80px;padding-inline:1rem}.brand{height:80px;width:168px;flex-basis:168px}.brand img{width:168px}.folder-tab{padding-inline:13px 14px;min-height:74px}.tab-caption{font-size:1.3rem;padding:.2rem 0}.subject-row p{font-size:1.0625rem;line-height:1.8}.about-copy>p:not(.about-lead):not(.handwritten){font-size:1.0625rem;line-height:1.8}.about-lead{font-size:1.2rem}}
.subject-row .column-topic{font:400 .8125rem/1.5 var(--reading);color:var(--red);margin-bottom:.5rem}
.subject-curiosities{background-color:#d4e2ef;background-image:radial-gradient(rgba(18,55,106,.2) .8px,transparent 1px);background-size:12px 12px;transform:rotate(-1.2deg)}
.subject-curiosities:before{background:rgba(255,249,237,.7)}
.subject-recipes{grid-column:auto;margin-top:.65rem}
@media(max-width:680px){.subject-recipes{margin-top:0}}
/* Illustrated keepsakes sit around the reading area, never on top of copy. */
.diary-sticker{height:auto;pointer-events:none;user-select:none;filter:drop-shadow(2px 4px 2px rgba(18,55,106,.14))}
.cover-stickers{display:contents}
.cover-stickers .diary-sticker{position:absolute;z-index:3;width:clamp(108px,14vw,175px);bottom:2.5rem}
.sticker-reading{left:-1.4rem;transform:rotate(-12deg)}
.sticker-listening{right:-1.4rem;transform:rotate(12deg)}
.subject-row.has-sticker{padding-top:4rem}
.subject-sticker{position:absolute;width:82px;right:.4rem;top:-1.4rem;z-index:2;transform:rotate(11deg)}
.subject-recipes .subject-sticker{transform:rotate(-9deg)}
.personal-note{margin-top:4rem}
.crown-pin{position:relative;z-index:1;width:106px;margin:-3.65rem auto .4rem;transform:rotate(-8deg);filter:none}
@media(max-width:850px){.cover-stickers{position:relative;display:flex;justify-content:space-between;align-items:center;height:90px;margin:1rem -.4rem -1.5rem}.cover-stickers .diary-sticker{position:static;width:100px}.subject-sticker{width:76px;top:-1.15rem}.subject-row.has-sticker{padding-top:3.9rem}}
@media(max-width:440px){.cover-stickers{height:80px;margin-top:.9rem;margin-bottom:-1.2rem}.cover-stickers .diary-sticker{width:88px}.subject-sticker{right:.3rem;width:72px}.subject-row.has-sticker{padding-top:3.75rem}.crown-pin{width:94px;margin-top:-3.2rem}.personal-note{margin-top:3.5rem}}
/* The archive keeps its paper layout while making each column easy to find. */
.archive-heading{align-items:flex-end;gap:2rem}
.archive-heading>div:first-child{min-width:0;flex:1}
.archive-intro{max-width:39ch;margin-top:.85rem;font-size:.9375rem;line-height:1.65}
.archive-tools{flex:0 1 280px;min-width:240px;padding:1rem 1.1rem .8rem;background-color:#fbd5df;background-image:repeating-linear-gradient(90deg,rgba(255,249,237,.35) 0 10px,transparent 10px 20px);border:1px solid rgba(184,33,55,.17);box-shadow:3px 4px 0 rgba(18,55,106,.08);transform:rotate(1deg)}
.archive-tools label{display:block;font-size:.875rem;font-weight:700;margin-bottom:.4rem}
.archive-tools select{display:block;width:100%;min-width:0;min-height:44px;padding:.55rem .65rem;border:1px solid var(--ink);border-radius:5px;background:var(--paper);color:var(--ink);font:600 1rem/1.4 var(--reading);cursor:pointer}
.archive-tools select:focus-visible{outline:3px solid var(--red);outline-offset:4px}
#archive-count{margin-top:.5rem;font-size:.8125rem;line-height:1.5}
.archive-grid{row-gap:3.5rem}
.archive-tools[hidden],.archive-empty[hidden],.archive-grid .story[hidden]{display:none}
.archive-empty{padding:2.3rem 1.5rem;text-align:center;border:1px dashed rgba(18,55,106,.4);background-image:radial-gradient(rgba(18,55,106,.14) .7px,transparent 1px);background-size:12px 12px}
.archive-empty h3{font:1.8rem/1.3 var(--serif);margin-bottom:.65rem}
.archive-empty p{font-size:1rem}
.archive-reset{margin-top:1.3rem;background:var(--paper);cursor:pointer}
.subject-beauty{background-color:#fbd5df;background-image:repeating-linear-gradient(transparent 0 31px,rgba(184,33,55,.1) 31px 32px);transform:rotate(-.8deg)}
.subject-beauty:before{background:rgba(190,214,237,.8);transform:rotate(-5deg)}
.subject-health{background-color:#e1ebf3;background-image:linear-gradient(rgba(18,55,106,.075) 1px,transparent 1px),linear-gradient(90deg,rgba(18,55,106,.075) 1px,transparent 1px);background-size:24px 24px;transform:rotate(1deg);margin-top:.65rem}
.subject-health:before{background:rgba(242,227,148,.8)}
@media(max-width:850px){.archive-heading{display:block}.archive-tools{width:100%;max-width:340px;min-width:0;margin-top:1.5rem;transform:none}.archive-intro{max-width:48ch}}
@media(max-width:680px){.archive-grid{row-gap:2.6rem}.subject-health{margin-top:0}}
/* A softer editorial title family, paired with rounded reading type and handwriting. */
:root{--serif:'Fraunces',Georgia,serif;--display:'Fraunces',Georgia,serif}
h1,.section-heading h2,.subjects h2,.travel h2,.about h2,.instagram-inner h2{letter-spacing:-.04em}
.story h3{font-size:1.6rem;line-height:1.3;letter-spacing:-.025em}
.cover{padding:4.3rem 0 3.5rem;background-color:var(--red);background-image:repeating-linear-gradient(90deg,transparent 0 17px,rgba(255,249,237,.055) 17px 18px)}
.cover-inner{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:2.25rem;align-items:center;padding:2.5rem 3rem 3rem;min-height:520px;text-align:left;background-color:var(--paper);background-image:linear-gradient(90deg,transparent 0 28px,rgba(184,33,55,.16) 28px 29px,transparent 29px),repeating-linear-gradient(transparent 0 31px,rgba(18,55,106,.075) 31px 32px);background-size:auto;box-shadow:5px 7px 0 #e9dbbd,0 15px 25px rgba(55,12,27,.14)}
.cover-copy{width:100%;max-width:none;margin:0;padding-left:.6rem;text-align:left}
.cover .eyebrow{font-size:.72rem;letter-spacing:.09em;line-height:1.7;margin-bottom:1.65rem}
.cover h1{font:400 clamp(3rem,5.35vw,4.8rem)/1.08 var(--display);letter-spacing:-.055em}
.cover h1>span:nth-child(2){display:table;white-space:nowrap;color:var(--red);background:linear-gradient(transparent 79%,rgba(244,169,194,.55) 79% 94%,transparent 94%)}
.cover h1 .last-line{display:flex;align-items:baseline;gap:.12em;margin-top:.08em;white-space:nowrap}
.cover h1 em{font-family:var(--hand);font-size:1.55em;line-height:1.12;letter-spacing:0;color:var(--ink)}
.cover-note{margin:1.6rem 0 1.45rem;font-size:1.08rem;line-height:1.75}
.cover-note em{font:600 italic 1em/1.75 var(--reading);color:var(--red);background:none}
.cover .button-ink{gap:1.4rem;padding:.7rem 1.4rem;border-radius:30px;background:var(--ink);border-color:var(--ink);box-shadow:3px 4px 0 var(--pink);font-weight:700}
.cover .button-ink span{font-size:1.4rem;line-height:1}
.cover-keepsakes{position:relative;isolation:isolate;width:100%;max-width:410px;aspect-ratio:1;justify-self:center;margin:0;pointer-events:none}
.scrap-paper{position:absolute;display:block;border:1px solid rgba(18,55,106,.15);box-shadow:3px 6px 10px rgba(18,55,106,.12)}
.scrap-striped{inset:13% 4% 4% 20%;transform:rotate(9deg);background:repeating-linear-gradient(90deg,#f3afc4 0 13px,#f8cddd 13px 26px)}
.scrap-grid{inset:3% 17% 17% 0;transform:rotate(-7deg);background-color:#f8edbd;background-image:linear-gradient(rgba(18,55,106,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(18,55,106,.14) 1px,transparent 1px);background-size:22px 22px}
.scrap-grid:after{position:absolute;content:'';left:-1px;right:-1px;bottom:-8px;height:11px;background:inherit;clip-path:var(--torn-edge)}
.scrap-tape{position:absolute;z-index:2;left:22%;top:0;width:31%;height:24px;transform:rotate(-11deg);background:repeating-linear-gradient(90deg,rgba(180,207,232,.8) 0 8px,rgba(208,228,246,.8) 8px 16px);border-inline:1px dashed rgba(18,55,106,.2)}
.cover-keepsakes .hero-book{position:absolute;width:85%;left:-5%;top:15%;transform:rotate(-13deg);z-index:2}
.cover-keepsakes .hero-music{position:absolute;width:53%;right:-3%;bottom:-2%;transform:rotate(12deg);z-index:3}
.hero-seal{position:absolute;z-index:4;width:23%;right:0;top:0;border-radius:50%;transform:rotate(12deg);box-shadow:2px 3px 5px rgba(18,55,106,.15)}
/* Loose column pages: horizontal native scrolling, with visible next-page edges. */
.subjects-inner{padding-inline:0;min-width:0}
.subjects-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;text-align:left;margin-bottom:1rem;padding-inline:1rem}
.subjects h2{font-size:clamp(2.4rem,4vw,3.5rem)}
.columns-hint{font-size:.9375rem;line-height:1.6;margin-top:.7rem}
.column-controls{display:flex;flex-shrink:0;gap:.6rem;padding-bottom:.15rem}
.column-controls[hidden]{display:none}
.column-arrow{display:grid;place-items:center;width:48px;height:48px;padding:0;border:1px solid var(--ink);border-radius:50%;background:var(--paper);box-shadow:2px 3px 0 rgba(18,55,106,.13);font:400 1.7rem/1 var(--reading);cursor:pointer;transition:background .2s,transform .2s}
.column-arrow:not(:disabled):hover{background:var(--pink);transform:translateY(-2px)}
.column-arrow:disabled{opacity:.35;cursor:default;box-shadow:none}
.subject-index{position:relative;display:flex;align-items:stretch;gap:1.75rem;min-width:0;width:100%;padding:1.6rem 1rem 2rem;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:1rem;scrollbar-width:thin;scrollbar-color:var(--red) rgba(255,249,237,.6)}
.subject-index:focus-visible{outline:3px solid var(--red);outline-offset:5px;border-radius:3px}
.subject-index::-webkit-scrollbar{height:7px}
.subject-index::-webkit-scrollbar-track{background:rgba(255,249,237,.6);border-radius:8px}
.subject-index::-webkit-scrollbar-thumb{background:var(--red);border-radius:8px}
.subject-index .subject-row{flex:0 0 calc((100% - 3.5rem)/2.15);display:grid;grid-template-columns:minmax(0,1fr) 105px;grid-template-rows:105px auto;align-content:start;gap:.8rem 1rem;width:auto;max-width:none;min-width:0;margin:0;padding:1.4rem 1.65rem 2rem;scroll-snap-align:start;scroll-margin:0;transform:rotate(-.65deg)}
.subject-index .subject-row:nth-child(even){transform:rotate(.65deg)}
.subject-index .subject-row>div{grid-column:1/-1;grid-row:2;min-width:0}
.subject-index .subject-sticker{position:static;grid-column:2;grid-row:1;width:105px;height:105px;object-fit:contain;align-self:center;justify-self:end;transform:rotate(8deg)}
.subject-index .subject-row:nth-child(even) .subject-sticker{transform:rotate(-8deg)}
.subject-index .index-number{grid-column:1;grid-row:1;align-self:start;margin:.25rem 0 0;font:600 .875rem/1.5 var(--reading);color:var(--red);letter-spacing:.08em}
.subject-index .subject-row h3{font:400 1.8rem/1.24 var(--display);letter-spacing:-.035em;margin-bottom:.9rem;text-wrap:pretty}
.subject-index .subject-row p{font-size:1.02rem;line-height:1.75}
.subject-index .subject-row .column-topic{font-size:.78rem;line-height:1.5;margin-bottom:.5rem;color:var(--red)}
.subject-astrology{background-color:#f9ebce;background-image:radial-gradient(rgba(18,55,106,.18) .7px,transparent 1px);background-size:15px 15px}
.subject-astrology:before{background:rgba(190,214,237,.8)}
@media(max-width:1100px){.cover-inner{padding-inline:2.4rem;gap:1.6rem;min-height:470px}.cover h1{font-size:clamp(2.6rem,5.3vw,4rem)}.subject-index .subject-row{flex-basis:calc((100% - 3rem)/2.05);padding-inline:1.4rem}.subject-index .subject-row h3{font-size:1.7rem}}
@media(max-width:850px){.cover-inner{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);padding:2.2rem 2rem 2.8rem;gap:1.4rem;min-height:440px}.cover-copy{padding-left:0}.cover h1{font-size:clamp(2.5rem,5.2vw,3.5rem)}.cover .eyebrow{font-size:.68rem;letter-spacing:.06em}.cover-note{font-size:1rem}.cover-keepsakes{max-width:290px}.subject-index .subject-row{flex-basis:68%;max-width:390px}.subjects-intro{padding-inline:.75rem}.subjects h2{font-size:2.8rem}}
@media(max-width:680px){.cover{padding-top:3.7rem;padding-bottom:2.7rem}.cover-inner{display:flex;flex-direction:column;gap:2rem;padding:2rem 1.8rem 2.5rem;min-height:0}.cover-copy{text-align:center}.cover .eyebrow{font-size:.7rem;margin-bottom:1.25rem}.cover h1{font-size:clamp(2.65rem,8.8vw,4.25rem)}.cover h1>span:nth-child(2){margin-inline:auto}.cover h1 .last-line{justify-content:center}.cover-note{margin:1.15rem 0 1.2rem}.cover-keepsakes{max-width:270px;width:80%;aspect-ratio:1.12;margin:.25rem auto .5rem}.cover-keepsakes .hero-book{width:80%;top:8%;left:-2%}.cover-keepsakes .hero-music{width:50%;right:-1%;bottom:-3%}.hero-seal{width:21%}.scrap-tape{height:18px}.subjects-intro{align-items:center;gap:1rem}.subjects h2{font-size:2.45rem}.subjects h2 em{display:inline;line-height:1.2}.columns-hint{font-size:.875rem;max-width:28ch}.column-arrow{width:44px;height:44px;font-size:1.5rem}.column-controls{gap:.4rem}.subject-index{gap:1.2rem;padding-inline:.65rem;scroll-padding-inline:.65rem}.subject-index .subject-row{flex-basis:86%;max-width:360px;padding:1.3rem 1.5rem 1.8rem;grid-template-columns:minmax(0,1fr) 96px;grid-template-rows:96px auto}.subject-index .subject-sticker{width:96px;height:96px}.subject-index .subject-row h3{font-size:1.8rem}.subject-index .subject-row p{font-size:1rem}.story h3{font-size:1.7rem}}
@media(max-width:440px){.cover-inner{padding:1.7rem 1.1rem 2.2rem;gap:1.75rem}.cover h1{font-size:clamp(2.35rem,9.5vw,3.2rem)}.cover .eyebrow{font-size:.66rem;letter-spacing:.025em}.cover-keepsakes{width:85%;max-width:235px}.subjects-intro{display:block;padding-inline:.5rem}.subjects h2{font-size:2.3rem}.column-controls{margin-top:1.1rem;justify-content:flex-end}.columns-hint{max-width:none}.subject-index .subject-row{padding-inline:1.2rem;flex-basis:89%}.subject-index .subject-row h3{font-size:1.65rem}}
/* Archive pages follow the same horizontal, hand-operated reading as the columns. */
.archive-heading{margin-bottom:1.6rem}
.archive-navigation{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.3rem}
.archive-navigation p{font-size:.875rem;line-height:1.6}
.archive-controls{display:flex;flex-shrink:0;gap:.6rem}
.archive-grid{position:relative;display:flex;align-items:flex-start;gap:2rem;min-width:0;width:calc(100% + 1.5rem);margin-inline:-.75rem;padding:1.25rem .75rem 1.75rem;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:.75rem;scrollbar-width:thin;scrollbar-color:var(--red) rgba(18,55,106,.09)}
.archive-grid .story{flex:0 0 calc((100% - 3rem)/2.35);width:auto;max-width:350px;min-width:0;margin:0;padding:0;scroll-snap-align:start;scroll-margin:0}
.archive-grid:focus-visible{outline:3px solid var(--red);outline-offset:4px;border-radius:3px}
.archive-grid::-webkit-scrollbar{height:7px}
.archive-grid::-webkit-scrollbar-track{background:rgba(18,55,106,.09);border-radius:8px}
.archive-grid::-webkit-scrollbar-thumb{background:var(--red);border-radius:8px}
.archive-navigation[hidden],.archive-controls[hidden],.archive-grid[hidden]{display:none}
@media(max-width:850px){.archive-grid .story{flex-basis:68%;max-width:340px}}
@media(max-width:680px){.archive-grid{gap:1.5rem}.archive-grid .story{flex-basis:89%}.archive-controls{gap:.4rem}}
@media(max-width:440px){.archive-navigation{align-items:flex-end}.archive-navigation p{max-width:17ch;font-size:.8125rem}.archive-grid .story h3{font-size:1.5rem}}
/* The biography keeps Clara's exact text, with the handwritten feel of her reference. */
.about .about-inner .about-copy>p{font-family:'Kalam','Segoe Print',cursive;font-size:1.25rem;font-weight:400;line-height:1.75;letter-spacing:0}
.about .about-inner .about-copy>.about-lead{font-size:1.35rem;font-weight:700;line-height:1.65}
.cover-note em{font:400 1.85em/1.1 var(--hand);color:var(--red)}
@media(max-width:440px){.about .about-inner .about-copy>p{font-size:1.1875rem;line-height:1.75}.about .about-inner .about-copy>.about-lead{font-size:1.25rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Mapa astral: entrance inside Claridade nos Astros. */
.astro-teaser{padding:2.4rem 0;background:#e8eef2;border-block:1px solid var(--line)}
.astro-teaser-inner{display:grid;grid-template-columns:100px minmax(0,1fr) auto;gap:2rem;align-items:center}
.astro-teaser img{width:100px;height:100px;object-fit:contain;transform:rotate(-7deg)}
.astro-teaser h2{font:400 clamp(1.9rem,3vw,2.7rem)/1.2 var(--serif);margin:.5rem 0}
.astro-teaser h2 em{font-size:1.25em}.astro-teaser p:not(.eyebrow){max-width:620px}.astro-teaser .eyebrow{font-size:.75rem}.astro-teaser .button{white-space:nowrap}
@media(max-width:900px){.astro-teaser-inner{grid-template-columns:80px minmax(0,1fr);gap:1rem}.astro-teaser .button{grid-column:2;justify-self:start}.astro-teaser img{width:80px;height:80px}}
@media(max-width:600px){.astro-teaser-inner{grid-template-columns:1fr}.astro-teaser img{display:none}.astro-teaser .button{grid-column:1;white-space:normal}.astro-teaser .section-shell{width:calc(100% - 2.5rem)}}
