@font-face{font-family:Gaegu;src:url('/assets/Gaegu-Light.ttf') format('truetype');font-weight:300;font-display:swap}
/* Landing notes use the same local handwriting face as the hero title. */
.hero p,.features h2,.features p,.carousel-caption,.example-callout{font-family:Gaegu,cursive;font-weight:300}
.hero p,.features p{font-size:clamp(1.35rem,2.5vw,1.65rem);line-height:1.65}
.hero .eyebrow{font-size:1.15rem}.hero .muted{font-size:1.3rem}
.features h2{font-size:clamp(1.9rem,3.5vw,2.3rem)}
.record-examples{max-width:58rem;margin:0 auto 4rem}
.carousel-window{overflow:hidden}
.carousel-track{display:flex;align-items:flex-start;transition:transform .4s ease}
.example-slide{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,22rem) minmax(0,1fr);grid-template-rows:repeat(3,minmax(0,1fr));align-items:center;column-gap:1.5rem;flex:0 0 100%;min-width:0;padding:2rem 1rem}
.memo-card{container-type:inline-size;grid-column:2;grid-row:1 / 4;width:100%;margin:0;padding:0;position:relative;border-radius:.25rem;filter:drop-shadow(0 3px 4px #29271f0a);transform-origin:50% 75%;transition:transform .25s ease,filter .25s ease}
.memo-card img{display:block;width:100%;height:auto;border-radius:inherit}
.memo-copy{position:absolute;margin:0;color:var(--ink);font:300 clamp(.7rem,5cqw,1.15rem)/1.35 Gaegu,cursive;pointer-events:none;white-space:normal;text-align:left}
.memo-copy--graph{top:24%;left:15%;width:28%}
.memo-copy--question-title{top:11%;left:10%;width:80%;text-align:center}
.memo-copy--rank{font-size:9cqw;line-height:1}
.memo-copy--rank-two{top:58%;left:23%}.memo-copy--rank-one{top:50%;left:48%}.memo-copy--rank-three{top:60%;left:74%}
.memo-copy--question-reason{top:76.5%;left:15%;width:69%}
.memo-copy--reflection{top:17%;left:17%;width:47%}.memo-copy--reflection-end{top:75%;left:17%;width:65%}

.memo-card:focus-visible{outline:3px solid #4f624a;outline-offset:4px;transform:translateY(-8px) scale(1.025);filter:drop-shadow(0 12px 14px #29271f24)}
.example-callout{position:relative;z-index:3;grid-column:3;display:flex;flex-direction:column;align-items:flex-start;min-width:0;font-size:1.55rem;line-height:1.4;transform:rotate(-4deg)}
.example-callout p{margin:0}
.example-callout--top-left,.example-callout--bottom-left{grid-column:1;align-items:flex-end;text-align:right;transform:rotate(3deg)}
.example-callout--top-left{grid-row:1}
.example-callout--top-right{grid-row:1}
.example-callout--middle-right{grid-row:2}
.example-callout--bottom-left,.example-callout--bottom-right{grid-row:3;flex-direction:column-reverse}
.callout-arrows{position:absolute;inset:0;z-index:2;width:100%;height:100%;pointer-events:none;overflow:visible;color:var(--ink)}
.callout-arrows path{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.carousel-caption{text-align:center;margin:.35rem 0;font-size:1.4rem}
.carousel-controls{display:flex;flex-direction:column;align-items:center;gap:.25rem}
.carousel-navigation{display:flex;justify-content:center;align-items:center;gap:.5rem}
.carousel-dots{display:flex}
.carousel-arrow,.carousel-dot{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:transparent;color:var(--ink);cursor:pointer}
.carousel-arrow{font:300 2rem Gaegu,cursive}
.carousel-dot:before{content:'';width:.5rem;height:.5rem;border-radius:50%;background:var(--line)}
.carousel-dot[aria-pressed=true]:before{background:var(--ink)}
.carousel-arrow:focus-visible,.carousel-dot:focus-visible{outline:3px solid #4f624a;outline-offset:1px;border-radius:.25rem}
.journal-scene{position:relative;isolation:isolate;width:100%;max-width:42rem;aspect-ratio:1672 / 941;margin:0 auto 1.5rem}
.journal-part{position:absolute;display:block;height:auto;transition:transform .3s ease;transform-origin:center}
.journal-part--book{left:9%;top:8%;width:82%}
.journal-part--pencil{left:78.9%;top:32%;width:16.6%;clip-path:polygon(9% 5%,20% 6%,94% 83%,96% 93%,86% 96%,77% 94%,19% 28%)}
.journal-part--memo{left:-.5%;top:36.8%;width:27%;clip-path:inset(4% 14% 3% 18%)}
@media(max-width:52rem){
  .example-slide{grid-template-columns:repeat(2,minmax(0,11rem));grid-template-rows:auto auto auto;justify-content:center;column-gap:.5rem;row-gap:1.5rem;padding:1.25rem .5rem}
  .memo-card{grid-column:1 / 3;grid-row:2}
  .example-callout{font-size:1.35rem;transform:none;text-align:center;align-items:center}
  .example-callout--top-left{grid-column:1;grid-row:1;justify-self:start}
  .example-callout--top-right{grid-column:2;grid-row:1}
  .example-callout--middle-right,.example-callout--bottom-right{grid-column:2;grid-row:3;flex-direction:column-reverse;align-self:start}
  .example-callout--bottom-left{grid-column:1;grid-row:3;align-self:start}
}
@media(hover:hover) and (pointer:fine){.memo-card:hover{z-index:1;transform:translateY(-8px) scale(1.025);filter:drop-shadow(0 12px 14px #29271f24)}.journal-part:hover{transform:scale(1.025)}}
@media(prefers-reduced-motion:reduce){.carousel-track,.memo-card,.journal-part{transition:none}.memo-card:hover,.memo-card:focus-visible,.journal-part:hover{transform:none}}
:root{color-scheme:light;--cream:#fbf7ed;--ink:#29271f;--muted:#625f52;--paper:#fffdf6;--line:#d6d0bf}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:1.0625rem/1.8 system-ui,-apple-system,sans-serif}a{color:inherit;text-underline-offset:.2em}a:hover{text-decoration-thickness:2px}a:focus-visible,summary:focus-visible{outline:3px solid #4f624a;outline-offset:5px}header,main,footer,.preview{max-width:64rem;margin:auto;padding:1.5rem}header{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;border-bottom:1px solid var(--line)}.logo{font:300 clamp(1.75rem,14vw,2.75rem)/1.2 Gaegu,cursive;text-decoration:none}nav{display:flex;gap:1.25rem;flex-wrap:wrap;font-size:.9375rem}main{min-height:50vh;padding-top:3rem;padding-bottom:4rem}h1,h2,h3{line-height:1.45;overflow-wrap:anywhere}h1{font-size:clamp(1.8rem,5vw,2.6rem)}h2{font-size:1.5rem}h3{font-size:1.125rem}p{overflow-wrap:anywhere;white-space:pre-wrap}.hero{text-align:center;margin:1rem auto 3rem}.hero h1{font:300 clamp(2.5rem,8vw,4rem)/1.3 Gaegu,cursive;margin:.4em 0}.eyebrow{font-size:.9375rem;color:var(--muted)}.paper{position:relative;max-width:47rem;margin:1.5rem auto;padding:clamp(1.25rem,4vw,3rem);background:var(--paper);border:1px solid var(--line);box-shadow:3px 5px 0 #e6dfcd}.paper:before{content:'';position:absolute;top:-.7rem;left:calc(50% - 2.5rem);width:5rem;height:1.4rem;background:#ddcfaa99;transform:rotate(-3deg)}.sample{background:linear-gradient(135deg,var(--paper) calc(100% - 1.4rem),#e4dcc5 0);padding-bottom:2rem}.sample section+section{margin-top:1.5rem}.features{text-align:center;margin:3rem 0}.muted,footer{color:var(--muted)}.button{display:inline-block;border:1px solid var(--ink);border-radius:.5rem;padding:.65rem 1.4rem;min-height:44px;text-decoration:none;background:var(--ink);color:var(--paper)}footer{font-size:.9375rem;border-top:1px solid var(--line)}.preview{padding-top:.5rem;padding-bottom:0;font-weight:600}.skip{position:absolute;top:-5rem;left:1rem;background:var(--paper);padding:.5rem;z-index:1}.skip:focus{top:1rem}#share-content section{margin:1.75rem 0}#share-content img{display:block;max-width:100%;height:auto;margin:auto}#share-content figure{margin:2rem 0}figcaption{font-size:.9375rem}svg{display:block;width:100%;height:auto}svg line,svg path{stroke:#4a5e48;fill:none;stroke-width:3}svg .zero{stroke:#aba694;stroke-width:1;stroke-dasharray:5 5}svg text{font:14px system-ui;fill:var(--muted)}svg circle{fill:#4a5e48}table{width:100%;border-collapse:collapse}th,td{padding:.5rem;text-align:left;border-bottom:1px solid var(--line)}summary{cursor:pointer;padding:.6rem 0;min-height:44px}[hidden]{display:none!important}@media(max-width:25rem){header,main,footer{padding-left:1rem;padding-right:1rem}nav{gap:.75rem;font-size:.875rem}.paper{padding:1.25rem}main{padding-top:1.5rem}}
