/* Hallmark · shape: app screen · genre: playful · theme: custom · redesign: full · idea: Tejj's days kept as a tactile open notebook
 * paper: oklch(98% .012 88) · accent: oklch(57% .16 28) · display: Caveat · body: DM Sans
 * nav: wordmark and journal tools · signature: open notebook with handwritten entries and taped memories · states: loading, empty, error, full
 * axes: light/handwritten/warm · posture: full palette, coral navigation, butter reflection, lilac notes · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E4 S4 R3 V5 · weakest: R, limited scrapbook objects to a photograph, reflection note, and one margin annotation per spread. */
/* Hallmark · waive 47c · user-supplied notebook references · the user explicitly requested the notebook material, fold and tape for this journal. */
/* Hallmark · dismissed 25 · sticky notes contain a single short reflection; narrative paragraphs use a 65ch maximum. */
/* Hallmark · answered F24 · physical page and photograph shadows reproduce the user's explicitly requested scrapbook reference. */
@import url('./tokens.css');
@import url('./base.css');
body{background:var(--color-desk);font-synthesis:none}
button,a{-webkit-tap-highlight-color:var(--color-clear);touch-action:manipulation}
button{cursor:pointer;border:0;background:var(--color-clear);color:inherit}
button:disabled{opacity:.55;cursor:not-allowed}
a{text-decoration:none}
button,input,textarea{border-radius:var(--radius-card)}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--color-focus);outline-offset:4px}
button:active,.button:active{transform:translateY(1px)}
button:hover:not(:disabled),a:hover{color:var(--color-focus)}
button.primary:hover,.primary:hover{background:var(--color-focus);color:var(--color-accent-ink)}
h1,h2,h3{font-weight:600;letter-spacing:var(--tracking-display);line-height:1.05}
button svg,a svg{width:18px;height:18px;flex:none}
.wrap{width:100%;max-width:var(--container);padding:0 var(--gutter);margin:auto}
.masthead{min-height:100px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg)}
.brand{font-family:var(--font-display);font-weight:700;font-size:38px;letter-spacing:-1.5px;white-space:nowrap;line-height:1.2}
.brand span{color:var(--color-accent)}
.nav{display:flex;align-items:center;gap:var(--space-lg);font-size:13px}
.nav-link{min-height:44px;display:flex;align-items:center;gap:var(--space-xs)}
.nav-link.active{color:var(--color-focus);text-decoration:underline;text-underline-offset:6px}
.button{display:inline-flex;justify-content:center;align-items:center;gap:var(--space-xs);border:1px solid var(--color-rule);padding:var(--space-sm) var(--space-note);min-height:44px;font-size:13px;font-weight:500;background:var(--color-paper);white-space:nowrap;line-height:1.4;transition:transform var(--dur-micro) var(--ease-out)}
.primary{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-accent-ink)}
.icon-button{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center}
.icon-button svg{width:19px;height:19px}.lock-label{display:none}
.small,.meta,.running-head,.folio,.status-line{font-size:12px;color:var(--color-muted);line-height:1.65}
.meta{display:flex;align-items:center;gap:var(--space-md);flex-wrap:wrap}
.book-stage{position:relative;margin:var(--space-xs) var(--space-note) var(--space-xl) 0}
.book{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);background:var(--color-paper);border-radius:8px 15px 15px 8px;box-shadow:var(--shadow-book);border-bottom:5px double var(--color-rule);}
.book::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:3;opacity:var(--texture-opacity);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 9 -4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");}
.book::after{content:'';position:absolute;top:0;bottom:0;left:50%;width:46px;transform:translateX(-50%);background:linear-gradient(90deg,var(--color-clear),var(--color-fold) 49%,var(--color-fold-light) 51%,var(--color-clear));pointer-events:none;z-index:2}
.page{padding:var(--space-xl) var(--space-page) var(--space-lg);position:relative;min-width:0;display:flex;flex-direction:column}
.page-left{border-radius:8px 0 0 8px;background:var(--color-paper)}
.page-right{border-radius:0 15px 15px 0;background-color:var(--color-paper-2)}
.grid-paper{background-image:linear-gradient(var(--color-grid) 1px,var(--color-clear) 1px),linear-gradient(90deg,var(--color-grid) 1px,var(--color-clear) 1px);background-size:24px 24px;background-position:var(--space-xs) var(--space-xs)}
.ruled-paper{background-image:repeating-linear-gradient(var(--color-clear) 0,var(--color-clear) 31px,var(--color-line) 31px,var(--color-line) 32px);background-position:0 8px}
.running-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);padding-bottom:var(--space-md);border-bottom:1px solid var(--color-rule);margin-bottom:var(--space-lg);color:var(--color-ink-2)}
.running-head span:last-child{text-align:right}.hand{font-family:var(--font-outlier);font-size:22px;line-height:1.45}
.book-tabs{position:absolute;right:-35px;top:var(--space-xl);display:flex;flex-direction:column;gap:var(--space-sm);z-index:4}
.book-tabs a{writing-mode:vertical-rl;padding:var(--space-md) var(--space-xs);font-size:12px;min-width:39px;min-height:85px;text-align:center;background:var(--color-lilac);border-radius:0 5px 5px 0;color:var(--color-ink);box-shadow:2px 2px 2px var(--color-shadow)}
.book-tabs a:nth-child(2){background:var(--color-butter)}.book-tabs a.active{background:var(--color-coral)}
.home-book{min-height:700px}.home-title{font-size:var(--text-display);max-width:10ch;transform:rotate(-2deg);margin:var(--space-xs) 0 var(--space-md)}
.intro-note{font-family:var(--font-outlier);font-size:21px;line-height:1.45;max-width:28ch;margin-bottom:var(--space-lg)}
.scrap-scene{position:relative;min-height:265px;margin-top:var(--space-sm);margin-bottom:var(--space-lg)}
.polaroid{background:var(--color-white);padding:var(--space-sm) var(--space-sm) var(--space-xs);box-shadow:var(--shadow-card);transform:rotate(-5deg);margin:0;width:70%;position:relative;}
.polaroid::before,.sticky::before{content:'';position:absolute;top:-13px;left:36%;width:91px;height:28px;background:var(--color-tape);transform:rotate(-6deg);z-index:2;clip-path:polygon(2% 0,98% 4%,100% 96%,1% 100%,3% 80%,0 66%,3% 45%,0 30%)}
.polaroid img{width:100%;height:178px;object-fit:cover;object-position:center 60%;filter:saturate(.72)}
.polaroid figcaption{font-family:var(--font-display);font-size:23px;line-height:1.3;text-align:center;padding:var(--space-sm) 0 var(--space-2xs)}
.margin-note{font-family:var(--font-display);font-size:27px;line-height:1.05;max-width:130px;position:absolute;right:-5px;bottom:var(--space-sm);transform:rotate(7deg)}
.margin-note .scribble-arrow{font-size:50px;display:block;transform:rotate(25deg);margin-left:var(--space-lg)}
.home-footer{display:flex;justify-content:space-between;align-items:end;gap:var(--space-lg);margin-top:auto;font-size:12px;color:var(--color-muted)}
.signature{font-family:var(--font-display);font-size:34px;color:var(--color-ink)}
.latest-top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);margin-bottom:var(--space-md)}
.date-stamp{display:flex;align-items:center;gap:var(--space-sm);font-family:var(--font-outlier);font-size:17px;line-height:1.3}.date-stamp strong{font-family:var(--font-display);font-size:48px;font-weight:700;color:var(--color-ink);line-height:1}
.sample-label{font-size:11px;color:var(--color-ink-2);background:var(--color-butter);padding:var(--space-2xs) var(--space-xs);border-radius:2px;white-space:nowrap}
.entry-title{font-size:clamp(35px,3.4vw,48px);line-height:1.05;max-width:14ch;margin-bottom:var(--space-md)}
.entry-excerpt{font-family:var(--font-outlier);font-size:22px;line-height:1.48;margin-bottom:var(--space-lg);max-width:45ch;white-space:pre-line}
.read-link{display:inline-flex;align-items:center;gap:var(--space-sm);font-size:13px;font-weight:600;min-height:44px;text-decoration:underline;text-underline-offset:5px}
.sticky{background:var(--color-butter);padding:var(--space-lg);position:relative;transform:rotate(2deg);box-shadow:var(--shadow-card);margin:var(--space-lg) 0 var(--space-xl);}
.sticky h2,.sticky h3{font-family:var(--font-outlier);font-size:20px;line-height:1.3;font-weight:400;margin-bottom:var(--space-xs)}
.sticky p{font-family:var(--font-display);font-size:30px;line-height:1.15;max-width:30ch;white-space:pre-wrap;overflow-wrap:anywhere}
.page-bottom{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:var(--space-md);padding-top:var(--space-lg);border-top:1px solid var(--color-rule);font-size:11px;color:var(--color-muted)}
.page-bottom a{display:inline-flex;align-items:center;gap:var(--space-xs);min-height:44px;font-size:12px}.page-bottom svg{width:16px;height:16px}
.entries-shelf{padding:var(--space-lg) 0 var(--space-xl);max-width:100%;}
.sectionbar{display:flex;justify-content:space-between;gap:var(--space-lg);align-items:center;border-bottom:1px solid var(--color-rule);padding-bottom:var(--space-md);margin-bottom:var(--space-xs)}
.sectionbar h2{font-family:var(--font-display);font-size:31px}.section-title span{font-family:var(--font-body);font-weight:400;font-size:12px;margin-left:var(--space-sm)}
.search-wrap{display:flex;align-items:center;gap:var(--space-xs);max-width:210px}.search-wrap svg{width:17px;height:17px;flex:none}.search{width:100%;min-width:0;border:0;background:var(--color-clear);padding:var(--space-xs) 0;font-size:13px;color:var(--color-ink)}
.search::placeholder{color:var(--color-muted)}
.entry{display:grid;grid-template-columns:90px minmax(0,1fr) 25px;align-items:center;gap:var(--space-lg);padding:var(--space-lg) 0;border-bottom:1px solid var(--color-rule)}
.entry h3{font-size:29px;margin-bottom:var(--space-xs)}.entry p{font-size:14px;color:var(--color-muted);overflow:hidden;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;margin-bottom:var(--space-xs)}
.datebox{font-size:12px;color:var(--color-muted)}.datebox strong{font-family:var(--font-display);font-size:37px;display:block;font-weight:600;color:var(--color-ink)}
.empty{padding:var(--space-xl) 0}.empty h2,.empty h3{font-size:37px;margin-bottom:var(--space-md)}.empty p{font-size:16px;color:var(--color-muted);margin-bottom:var(--space-lg);line-height:1.7}.empty .button{margin-top:var(--space-xs)}
.footer{display:flex;justify-content:space-between;gap:var(--space-lg);font-size:11px;color:var(--color-muted);padding:var(--space-lg) 0 var(--space-xl)}
.footer a{text-decoration:underline;text-underline-offset:3px}.footer-credit{max-width:390px;text-align:right}
.breadcrumb{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);margin:var(--space-xs) 0 var(--space-lg)}
.back{font-size:13px;display:inline-flex;align-items:center;gap:var(--space-xs);min-height:44px;color:var(--color-muted)}
.article-book .page{padding-top:var(--space-lg)}
.article-book h1{font-size:var(--text-display-s);line-height:1.06;margin:var(--space-xs) 0 var(--space-lg);max-width:14ch}
.story{font-family:var(--font-outlier);font-size:23px;line-height:1.5;max-width:65ch;overflow-wrap:anywhere;}
.story p{white-space:pre-wrap;margin-bottom:var(--space-lg)}
.article-photo{width:95%;margin:var(--space-lg) auto var(--space-xl);transform:rotate(-3deg)}
.article-photo img{height:210px}.article-photo figcaption{font-size:23px}
.continued{font-family:var(--font-display);font-size:29px;transform:rotate(-2deg);margin-bottom:var(--space-lg)}
.article-book .sticky{margin-top:var(--space-lg)}
.article-book .signature{margin:var(--space-sm) 0 var(--space-lg);align-self:flex-end}
.preview-caption{font-size:11px;color:var(--color-muted);margin-bottom:var(--space-md);max-width:50ch}
.article-tools{display:flex;align-items:center;gap:var(--space-md);justify-content:space-between;flex-wrap:wrap;margin-bottom:var(--space-xl)}
.actions{display:flex;gap:var(--space-sm);flex-wrap:wrap;align-items:center}
.original-notes{margin:var(--space-lg) 0;max-width:720px}.original-notes summary,summary{cursor:pointer;font-size:13px;min-height:44px;padding:var(--space-sm) 0}.original-notes p{font-size:16px;line-height:1.7;white-space:pre-wrap;padding-top:var(--space-md)}
.calendar-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-lg)}.calendar-heading h2{font-size:35px}.calendar-nav{display:flex;gap:var(--space-2xs)}
.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:var(--space-xs);text-align:center}.calendar-grid .day-name{font-size:12px;color:var(--color-muted);padding-bottom:var(--space-xs)}
.calendar-grid .day{min-height:38px;display:flex;align-items:center;justify-content:center;font-size:13px;border-radius:50%;position:relative}.calendar-grid .has-entry{background:var(--color-coral);color:var(--color-ink);font-weight:600}.calendar-grid .is-today{outline:1px solid var(--color-accent);outline-offset:1px}.calendar-note{margin:var(--space-lg) 0 var(--space-xl);font-size:12px;color:var(--color-muted)}
.archive-title{font-size:54px;margin-bottom:var(--space-md)}.archive-book{min-height:600px}.archive-list .entry{grid-template-columns:45px minmax(0,1fr) 18px;gap:var(--space-md)}.archive-list .entry h3{font-size:28px}.archive-list .entry p{display:none}.archive-list .datebox strong{font-size:29px}.archive-list .sectionbar{flex-wrap:wrap}.archive-note{background:var(--color-lilac);transform:rotate(-2deg);margin-top:var(--space-xl)}
.editor-book{grid-template-columns:minmax(0,1fr) 300px}.editor-book::after{left:auto;right:277px}.editor-book .page-right{padding:var(--space-xl) var(--space-lg)}
.editor h1{font-size:52px;margin-bottom:var(--space-sm)}.editor .status-line{margin-bottom:var(--space-md)}
label{display:block;font-size:13px;font-weight:500;margin:var(--space-lg) 0 var(--space-xs)}input,textarea{border:1px solid var(--color-muted);background:var(--color-paper);padding:var(--space-sm);width:100%;color:var(--color-ink);font-size:16px}textarea{resize:vertical;line-height:1.6}.form-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-lg)}
.title-input{font-family:var(--font-display);font-size:31px}.story-input{font-family:var(--font-outlier);font-size:23px;min-height:370px;background-image:repeating-linear-gradient(var(--color-clear) 0,var(--color-clear) 36px,var(--color-line) 36px,var(--color-line) 37px);line-height:37px;background-position:0 11px}
.editor .actions{margin:var(--space-lg) 0 var(--space-md)}.danger{color:var(--color-error);margin-left:auto}.error{color:var(--color-error);font-size:13px;min-height:20px;margin:var(--space-md) 0 0}.editor-aside h2{font-size:35px;margin:var(--space-md) 0}.editor-aside p{font-family:var(--font-outlier);font-size:22px;line-height:1.5;margin-bottom:var(--space-lg)}.editor-aside .sticky{padding:var(--space-note);margin-top:var(--space-xl)}
.settings h1{font-size:54px;margin-bottom:var(--space-lg)}.settings .page > section{padding:var(--space-lg) 0;border-bottom:1px solid var(--color-rule)}.settings h2{font-size:33px;margin-bottom:var(--space-md)}.settings p{font-size:15px;line-height:1.8;margin-bottom:var(--space-md)}.settings .button{margin-top:var(--space-xs)}
.gate-wrap{min-height:100dvh;max-width:1100px;margin:auto;padding:var(--space-lg) var(--space-xl) var(--space-xl)}.gate-masthead{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-xl);min-height:55px}.gate-masthead .small{font-size:13px}.gate-book{min-height:605px}.gate-cover h1{font-size:90px;max-width:5ch;line-height:.9;margin:var(--space-xl) 0 var(--space-lg);transform:rotate(-5deg)}.gate-cover{justify-content:space-between}.cover-subtitle{font-family:var(--font-outlier);font-size:24px;line-height:1.45;max-width:22ch;margin:var(--space-lg) 0}.cover-signature{font-family:var(--font-display);font-size:31px;transform:rotate(-4deg);margin:var(--space-xl) 0 var(--space-md)}.cover-label{font-size:12px;border-top:1px solid var(--color-rule);padding-top:var(--space-md)}
.gate-form{justify-content:center;padding:var(--space-xl) var(--space-page)}.gate-form h2{font-size:45px;max-width:10ch;margin-bottom:var(--space-md)}.gate-form p{font-size:14px;line-height:1.7;color:var(--color-muted)}.gate-form .button{width:100%;margin-top:var(--space-lg)}.gate-form .gate-footnote{font-family:var(--font-display);font-size:27px;color:var(--color-ink);transform:rotate(-3deg);margin-top:var(--space-xl)}.gate-form .setup-help{font-size:12px;margin-top:var(--space-sm)}
#toast{position:fixed;bottom:var(--space-lg);left:50%;transform:translateX(-50%);background:var(--color-ink);color:var(--color-paper);padding:var(--space-md) var(--space-lg);border-radius:var(--radius-card);font-size:14px;box-shadow:var(--shadow-card);z-index:var(--z-toast);display:none;max-width:90%;width:max-content}.loading-screen{min-height:80dvh;display:grid;place-content:center;text-align:center;gap:var(--space-lg)}.loading-screen h1{font-size:60px}.loading-screen p{color:var(--color-muted)}
@media(min-width:1441px){.wrap{max-width:1320px}.page{padding-inline:var(--space-book)}.home-book{min-height:730px}.home-title{font-size:84px}.polaroid img{height:205px}}
@media(max-width:1000px){:root{--space-page:32px;--gutter:28px}.nav{gap:var(--space-md)}.home-title{font-size:65px}.scrap-scene{min-height:240px}.polaroid img{height:150px}.margin-note{font-size:24px;max-width:100px}.entry-excerpt{font-size:21px}.editor-book{grid-template-columns:minmax(0,1fr) 240px}.editor-book::after{right:217px}.gate-cover h1{font-size:76px}}
@media(max-width:760px){:root{--gutter:20px;--space-page:28px}.masthead{min-height:88px;gap:var(--space-md)}.brand{font-size:33px}.nav{gap:var(--space-xs)}.nav .nav-link{display:none}.nav .button{padding:var(--space-sm);font-size:12px}.book-stage{margin-right:0;margin-top:var(--space-xl)}.book{grid-template-columns:minmax(0,1fr);border-radius:6px 6px 10px 10px}.book::after{display:none}.page{padding:var(--space-lg) var(--space-page)}.page-left,.page-right{border-radius:0}.page-right{border-top:1px solid var(--color-rule)}.book-tabs{top:-34px;right:var(--space-md);flex-direction:row;gap:var(--space-xs)}.book-tabs a{writing-mode:horizontal-tb;min-width:0;min-height:36px;padding:var(--space-xs) var(--space-md);border-radius:4px 4px 0 0;font-size:12px}.home-book{min-height:0}.home-title{font-size:64px;max-width:10ch;margin-top:var(--space-sm)}.home-book .page-left{padding-bottom:var(--space-lg)}.intro-note{max-width:32ch;font-size:22px}.scrap-scene{min-height:265px;max-width:390px;margin:var(--space-md) auto var(--space-lg);width:100%}.polaroid{width:70%}.polaroid img{height:190px}.margin-note{max-width:100px;font-size:25px;right:var(--space-zero);bottom:var(--space-zero)}.home-footer{margin-top:var(--space-md)}.entry-title{font-size:43px}.entry-excerpt{font-size:23px}.sticky{margin:var(--space-lg) var(--space-xs) var(--space-xl)}.sticky p{font-size:31px}.latest-top{margin-top:var(--space-xs)}.sample-label{font-size:12px}.running-head{font-size:12px}.home-book .page-right{padding-top:var(--space-xl)}.page-bottom{font-size:12px}.footer{flex-direction:column;gap:var(--space-xs);font-size:12px}.footer-credit{text-align:left}.sectionbar{gap:var(--space-md)}.sectionbar h2{font-size:29px}.search-wrap{max-width:160px}.search{font-size:16px}.entry{grid-template-columns:49px minmax(0,1fr) 20px;gap:var(--space-md)}.entry h3{font-size:29px}.entry p{font-size:14px}.meta{font-size:12px}.article-book h1{font-size:50px;max-width:15ch}.article-book .page-right{padding-top:var(--space-xl)}.article-photo{width:94%;max-width:400px;margin-top:var(--space-lg)}.article-photo img{height:230px}.story{font-size:23px;line-height:1.5}.breadcrumb{margin-bottom:var(--space-xl)}.breadcrumb .small{display:none}.continued{font-size:31px}.article-tools{gap:var(--space-md)}.article-tools .button{font-size:13px}.editor-book{grid-template-columns:minmax(0,1fr)}.editor-book .page-right{padding:var(--space-lg) var(--space-page)}.editor-aside{display:none}.editor h1{font-size:47px}.form-row{grid-template-columns:minmax(0,1fr)}.form-row>div+div label{margin-top:var(--space-xs)}.title-input{font-size:29px}.danger{margin-left:0}.archive-title{font-size:48px}.calendar-grid{gap:var(--space-sm)}.calendar-grid .day{min-height:40px}.archive-book .page-right{padding-top:var(--space-xl)}.settings h1{font-size:49px}.settings .page > section{padding-top:var(--space-md)}.gate-wrap{padding:var(--space-md) var(--space-note) var(--space-xl)}.gate-masthead{margin-bottom:var(--space-lg)}.gate-masthead .small{font-size:12px}.gate-cover{padding:var(--space-lg) var(--space-xl)}.gate-cover h1{font-size:72px;max-width:none;margin:var(--space-md) 0}.cover-subtitle{font-size:22px;max-width:27ch;margin:var(--space-lg) 0}.cover-signature{display:none}.cover-label{margin-top:var(--space-xs)}.gate-form{padding:var(--space-xl)}.gate-form h2{font-size:43px;max-width:none}.gate-form .gate-footnote{margin-top:var(--space-lg)}.gate-form input{font-size:16px}}
@media(max-width:374px){:root{--gutter:14px;--space-page:22px}.brand{font-size:30px}.nav .button{font-size:11px;padding:var(--space-xs)}.icon-button{width:34px}.home-title{font-size:59px}.sectionbar{flex-wrap:wrap}.scrap-scene{min-height:240px}.polaroid img{height:158px}.margin-note{font-size:22px;max-width:90px}.latest-top{align-items:flex-start}.sample-label{font-size:10px}.gate-form,.gate-cover{padding:var(--space-lg)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.section-title{display:flex;align-items:baseline;gap:var(--space-sm)}
@media(max-width:450px){.scrap-scene{min-height:0;padding-bottom:var(--space-lg)}.scrap-scene .polaroid{width:88%}.scrap-scene .margin-note{position:relative;display:block;max-width:none;text-align:right;font-size:25px;margin-top:var(--space-lg);transform:rotate(-3deg)}.margin-note br{display:none}.margin-note .scribble-arrow{display:none}}

.section-title span{white-space:nowrap}
@media(max-width:760px){.sectionbar{flex-direction:column;align-items:stretch}.section-title{justify-content:space-between}.sectionbar .search-wrap{max-width:none;width:100%}}

.takeaways h2{font-size:28px;line-height:1.15;margin-bottom:var(--space-md)}
.takeaways h3,.takeaways h4{font-family:var(--font-body);font-size:13px;font-weight:600;line-height:1.4;letter-spacing:0;margin:var(--space-md) 0 var(--space-xs)}
.takeaway-list{font-family:var(--font-display);font-size:26px;line-height:1.25;margin:0;padding-left:var(--space-lg)}
.takeaway-list li{padding-left:var(--space-2xs);margin-bottom:var(--space-xs);overflow-wrap:anywhere}
@media(max-width:760px){.takeaway-list{font-size:25px}}

/* The notebook's navigation stays in one place: the header and dated strip. */
.masthead{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--space-xl)}
.nav{justify-content:center;min-width:0;gap:var(--space-lg)}
.nav-link{white-space:nowrap}
.header-actions{display:flex;align-items:center;gap:var(--space-sm)}
.timeline{background:var(--color-paper);border:1px solid var(--color-rule);border-radius:6px;padding:var(--space-md) var(--space-lg) var(--space-sm);margin-bottom:var(--space-lg)}
.timeline-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);margin-bottom:var(--space-xs)}
.timeline-heading h2{font-size:28px;line-height:1.05}
.timeline-heading p{color:var(--color-muted);font-size:12px;margin-top:var(--space-2xs)}
.timeline-controls{display:flex;gap:var(--space-2xs)}
.timeline-days{position:relative;display:flex;gap:var(--space-2xs);overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--color-rule) var(--color-clear);padding:var(--space-2xs) 0 var(--space-xs)}
.timeline-day{position:relative;flex:0 0 48px;min-height:68px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2xs);border-radius:4px;color:var(--color-muted);font-size:11px;line-height:1}
.timeline-day strong{font-family:var(--font-body);font-size:17px;font-weight:500;line-height:1.2}
.timeline-day.empty-day{opacity:.6}
.timeline-day.has-story{color:var(--color-ink);background:var(--color-butter)}
.timeline-day.has-story:hover{background:var(--color-coral);color:var(--color-ink)}
.timeline-day.selected{background:var(--color-accent);color:var(--color-accent-ink)}
.timeline-day.selected:hover{background:var(--color-focus);color:var(--color-accent-ink)}
.timeline-day.today:not(.selected){box-shadow:inset 0 0 0 1px var(--color-rule)}
.timeline-mark{width:4px;height:4px;border-radius:50%;background:currentColor}
.summary-book{grid-template-columns:minmax(0,1fr)}
.summary-book::after{display:none}
.summary-page{padding:var(--space-xl) var(--space-book) var(--space-2xl);border-radius:8px}
.summary-title{font-size:var(--text-display-s);margin:var(--space-sm) 0 var(--space-md)}
.summary-intro{font-family:var(--font-outlier);font-size:22px;line-height:1.4;color:var(--color-ink-2);margin-bottom:var(--space-xl)}
.lesson-day{display:grid;grid-template-columns:180px minmax(0,1fr);gap:var(--space-xl);border-top:1px solid var(--color-rule);padding:var(--space-xl) 0}
.lesson-date{display:flex;align-items:flex-start;flex-direction:column;gap:var(--space-sm)}
.lesson-date time{font-family:var(--font-display);font-size:30px;font-weight:600;line-height:1.15}
.lesson-date a{display:inline-flex;align-items:center;gap:var(--space-xs);font-size:12px;text-decoration:underline;text-underline-offset:4px;min-height:44px}
.lesson-date a svg{width:16px;height:16px}
.lesson-entry + .lesson-entry{border-top:1px solid var(--color-rule);margin-top:var(--space-lg);padding-top:var(--space-lg)}
.lesson-entry h3{display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap;font-size:34px;margin-bottom:var(--space-lg)}
.lesson-entry .sample-label{font-family:var(--font-body);font-weight:400;letter-spacing:0}
.lesson-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-xl)}
.lesson-columns h4{font-family:var(--font-body);font-size:13px;font-weight:600;margin:0 0 var(--space-sm)}
.lesson-columns .takeaway-list{font-size:25px}
@media(max-width:760px){
 .masthead{min-height:0;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-xs) var(--space-sm);padding-top:var(--space-md);padding-bottom:var(--space-sm)}
 .masthead .brand{grid-column:1;grid-row:1}
 .header-actions{grid-column:2;grid-row:1;gap:var(--space-2xs)}
 .header-actions .button{padding:var(--space-xs) var(--space-sm);font-size:12px}
 .masthead .nav{grid-column:1/-1;grid-row:2;justify-content:flex-start;gap:var(--space-lg);overflow-x:auto;white-space:nowrap;scrollbar-width:thin}
 .masthead .nav .nav-link{display:flex;font-size:13px;min-height:44px}
 .timeline{padding:var(--space-sm) var(--space-md);margin-top:var(--space-xs);margin-bottom:var(--space-lg)}
 .timeline-heading h2{font-size:26px}
 .timeline-day{flex-basis:46px;min-height:64px}
 .book-stage{margin-top:var(--space-md)}
 .summary-page{padding:var(--space-lg) var(--space-page) var(--space-xl)}
 .summary-title{font-size:45px}
 .summary-intro{font-size:20px;margin-bottom:var(--space-lg)}
 .lesson-day{grid-template-columns:minmax(0,1fr);gap:var(--space-md);padding:var(--space-lg) 0}
 .lesson-date{flex-direction:row;align-items:center;justify-content:space-between}
 .lesson-date time{font-size:27px}
 .lesson-entry h3{font-size:30px}
 .lesson-columns{grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}
}
@media(max-width:374px){.header-actions .button{font-size:11px;padding:var(--space-xs)}.masthead .nav{gap:var(--space-md)}}
.settings .sticky p{font-family:var(--font-display);font-size:30px;line-height:1.15;color:var(--color-ink);margin:0}
.lesson-date a{white-space:nowrap}

/* A quiet page marker for the horizontally scrolling calendar. */
.timeline-days{scrollbar-width:auto;scrollbar-color:auto}
.timeline-days::-webkit-scrollbar{height:5px}
.timeline-days::-webkit-scrollbar-track{background:var(--color-paper-3);border-radius:var(--radius-pill)}
.timeline-days::-webkit-scrollbar-thumb{background:var(--color-muted);border-radius:var(--radius-pill)}
.timeline-days::-webkit-scrollbar-thumb:hover{background:var(--color-accent)}
@supports not selector(::-webkit-scrollbar){
  .timeline-days{scrollbar-width:thin;scrollbar-color:var(--color-muted) var(--color-paper-3)}
}

/* Running labels sit on a shared, legible notebook rule on every page. */
.running-head{
  align-items:center;
  flex-wrap:wrap;
  gap:var(--space-xs) var(--space-md);
  padding:var(--space-sm) var(--space-md);
  border-bottom:1px solid var(--color-rule);
  border-left:2px solid var(--color-accent);
  background:var(--color-paper-2);
  color:var(--color-ink);
  font-size:14px;
  font-weight:600;
  line-height:1.45;
}
.running-head > :last-child:not(:first-child):not(.sample-label){
  color:var(--color-ink-2);
  font-weight:500;
  font-variant-numeric:tabular-nums;
}
.running-head .sample-label{font-weight:600}
/* Reading type is larger and quieter than decorative handwriting. */
.story{font-family:var(--font-body);font-size:17px;line-height:1.85;color:var(--color-ink)}
.entry-excerpt{font-family:var(--font-body);font-size:16px;line-height:1.75;color:var(--color-ink-2)}
.story-input{font-family:var(--font-body);font-size:16px}
.takeaway-list,.lesson-columns .takeaway-list{font-family:var(--font-outlier);font-size:21px;line-height:1.5}
.takeaway-list li{margin-bottom:var(--space-sm)}
.small,.meta,.status-line,.timeline-heading p,.calendar-note,.footer,.preview-caption,.page-bottom{font-size:13px;line-height:1.6}
.nav-link,.button,.back,.lesson-date a,.read-link,.page-bottom a{font-size:14px}
.datebox,.sample-label{font-size:12px}
.timeline-day.empty-day{opacity:1;color:var(--color-ink-2)}
.timeline-day span{font-size:12px}
@media(max-width:760px){
  .running-head{font-size:13px;padding:var(--space-sm);gap:var(--space-xs) var(--space-sm)}
  .story{font-size:17px;line-height:1.8}
  .entry-excerpt{font-size:16px;line-height:1.7}
  .takeaway-list,.lesson-columns .takeaway-list{font-size:20px}
  .small,.meta,.status-line,.timeline-heading p,.calendar-note,.footer,.preview-caption,.page-bottom{font-size:13px}
  .masthead .nav .nav-link{font-size:14px}
}