
/* Reflow the actual blocks. Never scale a page of text to fit a phone. */
main{width:100%;min-width:0}
.visual-paper,.teaching-visuals .paper{width:100%;height:auto;min-height:0}
.visual-footer{position:static;margin-top:20px}
.visual-block{margin-bottom:24px}
.visual-paper h2{font-size:clamp(30px,5vw,47px)}
.sheet-kicker{display:none}
.visual-paper{padding:24px;line-height:1.5}
.visual-paper p{line-height:1.55}
.visual-paper .visual-block h3{margin-bottom:14px}
.visual-paper .city-diagram{height:auto}
.teaching-visuals .paper{padding-bottom:24px}
.teaching-visuals .paper>section{margin-bottom:24px}
.language-choice button{min-height:44px}
.note-header .topline{flex-wrap:wrap}
@media(max-width:700px){
 body{padding:0}main{max-width:100%}
 .note-header,.reader-intro{padding:18px 16px}
 .note-header h1{font-size:30px}
 .visual-paper{padding:20px 16px;font-size:18px}
 .visual-subtitle{font-size:20px}
 .visual-paper h3{font-size:24px;line-height:1.4}
 .visual-paper h4{font-size:22px}
 .visual-paper p,.visual-paper small,.visual-note,.visual-caution{font-size:17px!important}
 .time-line,.sentence-train{flex-direction:column;align-items:stretch;gap:8px}
 .time-line>span{transform:rotate(90deg);text-align:center}
 .time-line strong{white-space:normal;font-size:20px}
 .time-line>div{padding:12px}.time-line p br{display:none}
 .object-row,.rule-columns,.sound-gates,.vowel-grid{grid-template-columns:1fr}
 .object-row>div{display:grid;grid-template-columns:80px 1fr;column-gap:14px;align-items:center;text-align:left;padding:12px}
 .object-row>div>.doodle{grid-row:1/3;width:76px;height:76px}
 .object-row h4,.object-row p{min-width:0}
 .anchor-list p{grid-template-columns:1fr;gap:3px;padding:12px 4px}
 .word-join{gap:8px}.word-join>div{font-size:28px;padding:10px}
 .word-join>.join-rule{font-size:25px}
 .sound-flow p{padding:12px 0;grid-template-columns:1fr;gap:4px;font-size:22px!important}
 .conditional-map p{grid-template-columns:1fr;gap:2px;padding:12px 0}
 .sentence-train b{font-size:29px}.sentence-train small{font-size:16px!important}
 .agreement{gap:8px;padding:12px}.agreement b{font-size:22px}
 .study-doodle{gap:12px;align-items:flex-start}.study-doodle .doodle{flex:0 0 64px}
 .contents,.reading-sheet{padding:22px 16px}
 .contents ol{columns:1}
 .reading-sheet table{min-width:0;display:block}
 .table-wrap{overflow:visible;border:0;border-radius:0}
 .reading-sheet tbody{display:block}
 .reading-sheet tr:first-child:has(th){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .reading-sheet tr:has(td){display:block;margin:0 0 18px;border:1px solid #a6bba9;border-radius:10px;overflow:hidden}
 .reading-sheet td{display:block;border:0;border-bottom:1px solid #d8dfcf;padding:10px 12px;font-size:16px}
 .reading-sheet td:last-child{border-bottom:0}
 .reading-sheet td::before{content:attr(data-label);display:block;font-size:14px;line-height:1.5;color:#285c62;font-weight:700;margin-bottom:4px}
 .reading-sheet td:first-child{background:#e1eddb;font-weight:700;font-size:18px}
 .reading-sheet table .translation{font-size:16px}
 .teaching-visuals .paper{padding:20px 16px;font-size:18px!important;line-height:1.5!important}
 .teaching-visuals h1,.teaching-visuals .sheet:nth-child(2) h1{font-size:32px;white-space:normal;padding:0;line-height:1.3;letter-spacing:0}
 .teaching-visuals .brand{position:static;display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
 .teaching-visuals .brand span{margin:0;font-size:16px}
 .teaching-visuals .subtitle{font-size:19px;line-height:1.6}
 .teaching-visuals .section-label,.teaching-visuals .sheet:nth-child(2) .section-label{font-size:23px;line-height:1.4}
 .teaching-visuals .stages{flex-direction:column;gap:10px;align-items:stretch}
 .teaching-visuals .stage{flex:auto;height:auto;min-height:136px;padding:10px 18px;gap:18px}
 .teaching-visuals .stages>.arrow{transform:rotate(90deg);text-align:center}
 .teaching-visuals .equation,.teaching-visuals .sheet:nth-child(2) .equation{white-space:normal;font-size:20px;line-height:1.7}
 .teaching-visuals .twins{grid-template-columns:1fr;gap:20px}
 .teaching-visuals .motive{height:auto;display:grid;grid-template-columns:1fr;justify-items:center;gap:12px}
 .teaching-visuals .motive+.motive{border-left:0;border-top:1px dashed #185c76;padding:20px 0 0}
 .teaching-visuals .motive .art,.teaching-visuals .motive .reading-boy{position:static;width:170px;height:151px}
 .teaching-visuals .bubble,.teaching-visuals .motive-label,.teaching-visuals .reason{position:static;white-space:normal;font-size:21px;line-height:1.5}
 .teaching-visuals .star{display:none}
 .teaching-visuals .join{height:auto;margin:16px 0}.teaching-visuals .join p{font-size:20px}
 .teaching-visuals .need-row{grid-template-columns:1fr;height:auto;gap:4px;margin-bottom:12px}
 .teaching-visuals .need-level{width:100%!important;max-width:none;height:70px;clip-path:none;padding:8px 12px;border-radius:8px}
 .teaching-visuals .need-level strong{font-size:23px}
 .teaching-visuals .need-arrow{transform:rotate(90deg);font-size:27px;line-height:1}
 .teaching-visuals .need-action{padding:10px 12px;height:auto}
 .teaching-visuals .support-map,.teaching-visuals .case-flow{grid-template-columns:1fr;gap:20px}
 .teaching-visuals .support,.teaching-visuals .sheet:nth-child(2) .support{padding:16px}
 .teaching-visuals .support p,.teaching-visuals .support blockquote{font-size:20px!important;line-height:1.6}
 .teaching-visuals .central-arrow{display:none}
 .teaching-visuals .case-step,.teaching-visuals .sheet:nth-child(2) .case-step{min-height:0;padding:16px}
 .teaching-visuals .case-step:not(:last-child):after{content:'↓';right:calc(50% - 8px);top:auto;bottom:-29px}
 .teaching-visuals .case-step p{font-size:19px!important;line-height:1.6!important}
 .teaching-visuals .paper *{max-width:100%;min-width:0}
 .teaching-visuals .paper p{white-space:normal}
}
