/* Hallmark · macrostructure: full-page notebook · theme: Japanese notebook
 * genre: editorial · design-system: docs/design.md · nav: notebook masthead
 * footer: letter close · pre-emit critique: P4 H5 E4 S5 R5 V4 */
html{overflow-x:clip}
body[data-public="true"]{display:flex;flex-direction:column;min-height:100dvh;overflow-x:clip;--page-gutter:clamp(16px,3vw,48px)}
body[data-public="true"] .topbar-inner,body[data-public="true"] .desktop-navigation{width:100%;max-width:none}
body[data-public="true"] .app-layout{display:flex;flex-direction:column;flex:1;width:100%;max-width:none;margin:0}
body[data-public="true"] main{display:flex;flex-direction:column;flex:1;width:100%;min-width:0;max-width:none;padding:var(--space-lg) var(--page-gutter) calc(88px + env(safe-area-inset-bottom));min-height:calc(100dvh - 72px)}
body[data-public="true"] main> :not(dialog){flex-shrink:0;min-width:0}
body[data-public="true"] h1,body[data-public="true"] h2,body[data-public="true"] h3{min-width:0;overflow-wrap:anywhere;font-style:normal}
body[data-public="true"] .footer{position:relative;margin-top:auto;padding-top:var(--space-2xl);padding-bottom:var(--space-md);border-top:0;box-shadow:none}
body[data-public="true"] main>.footer::before{content:"";position:absolute;top:var(--space-lg);left:0;right:0;height:1px;background:var(--color-rule)}
body[data-public="true"] .notebook-welcome{grid-template-columns:minmax(0,1fr);gap:var(--space-lg);margin-bottom:var(--space-xl)}
body[data-public="true"] .notebook-workspace{grid-template-columns:minmax(0,1fr);gap:var(--space-2xl)}
body[data-public="true"] .curriculum{padding-top:0}
body[data-public="true"] .notebook-sheet{width:100%;min-width:0}
body[data-public="true"] .curriculum-copy,body[data-public="true"] .lesson-row-copy{min-width:0;overflow-wrap:anywhere}
body[data-public="true"] .notebook-welcome .inline-actions{flex-wrap:wrap;padding-right:0}
body[data-public="true"] .notebook-welcome .welcome-lede{max-width:58ch}
body[data-public="true"] .btn,body[data-public="true"] .text-link,body[data-public="true"] .nav-link,body[data-public="true"] .footer a{white-space:nowrap}
body[data-public="true"] .bottom-nav a{white-space:nowrap}
body[data-public="true"] .japan-note{flex-direction:column;align-items:flex-start;gap:var(--space-lg);padding:var(--space-lg);margin-top:var(--space-xl)}
body[data-public="true"] .japan-note-mark{writing-mode:horizontal-tb}
body[data-public="true"] .japan-note .btn{margin-left:0}
body[data-public="true"] .japan-note-copy{flex-basis:auto}
body[data-public="true"] .lesson-body{width:100%;max-width:75ch}
body[data-public="true"] .lesson-image{max-width:100%;height:auto;align-self:flex-start}
body[data-public="true"] main>audio{width:100%;max-width:600px}
body[data-public="true"] .plan-grid{grid-template-columns:minmax(0,1fr)}
body[data-public="true"][data-page="auth"] main{padding-bottom:var(--space-lg);min-height:calc(100dvh - 72px)}
body[data-public="true"] .auth-page{width:100%;max-width:none}
body[data-public="true"] .auth-page-footer{width:100%;max-width:none;margin-top:auto;padding-top:var(--space-xl)}
body[data-public="true"] .account-security{width:100%;max-width:36rem}
@media(min-width:40rem){
 body[data-public="true"] main{padding-top:var(--space-xl)}
 body[data-public="true"] .notebook-welcome{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:var(--space-xl)}
 body[data-public="true"] .notebook-welcome h1{max-width:24ch;font-size:clamp(32px,3.6vw,64px)}
 body[data-public="true"] .notebook-workspace{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:var(--space-xl)}
 body[data-public="true"] .japan-note{flex-direction:row;align-items:center;flex-wrap:wrap;padding:var(--space-xl)}
 body[data-public="true"] .japan-note-copy{flex:1 1 45%}
 body[data-public="true"] .plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(min-width:900px){
 body[data-public="true"] main{min-height:calc(100dvh - 144px);padding-bottom:var(--space-lg)}
 body[data-public="true"] .notebook-welcome{min-height:360px;gap:var(--space-3xl);margin-bottom:var(--space-2xl)}
 body[data-public="true"] .notebook-workspace{gap:var(--space-3xl)}
 body[data-public="true"] .notebook-sheet{padding:var(--space-xl)}
 body[data-public="true"] .curriculum-row{min-height:88px}
 body[data-public="true"] .curriculum-copy strong{font-size:var(--text-body)}
 body[data-public="true"] .kana-stage{min-height:240px}
 body[data-public="true"] .auth-page{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2xl);flex:1}
 body[data-public="true"] .auth-companion{width:100%;max-width:600px;justify-self:center}
 body[data-public="true"] .auth-entry{width:100%;max-width:480px;justify-self:center}
 body[data-public="true"] .auth-page-footer{margin-top:var(--space-xl)}
}
@media(min-width:90rem){
 body[data-public="true"] .notebook-welcome{min-height:420px}
 body[data-public="true"] .mochi-scene.mochi-companion{height:420px}
 body[data-public="true"] .mochi-companion .mochi-button{max-width:500px}
 body[data-public="true"] .notebook-workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 body[data-public="true"] .plan-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-height:480px) and (max-width:899px){body[data-public="true"] main{padding-bottom:var(--space-lg)}}
@media(prefers-reduced-motion:reduce){body[data-public="true"] .notebook-welcome{scroll-behavior:auto}}