/* 001で確認した表示方針を002〜012へ適用。本文は各HTMLに保持する。 */
.main{width:100%;min-width:0}.edition-nav{display:flex;justify-content:flex-end;margin:0 0 16px}
.section-heading{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:12px 24px;margin-bottom:20px}
.section-heading h2,.section-heading h3{margin:0;flex:1 1 220px}
a.pair-link{display:inline-flex;align-items:center;justify-content:center;margin:0;padding:9px 14px;background:#b91c1c;color:#fff;border:1px solid #991b1b;border-radius:999px;font-size:14px;font-weight:700;line-height:1.5;text-decoration:none;white-space:nowrap}
a.pair-link:hover{background:#991b1b;color:#fff;text-decoration:underline}a.pair-link:focus-visible{outline:3px solid #fca5a5;outline-offset:3px}
.mini .section-heading{gap:10px;margin-bottom:16px}.mini .section-heading h3{flex-basis:100%}.mini .pair-link{margin-left:auto}
.draft-note{border-left:5px solid #b45309;background:#fff8ed;padding:14px 18px;border-radius:8px;margin:14px 0;line-height:1.75}
.flow{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:16px!important;min-width:0!important;overflow:visible!important;padding:14px 0 24px}
.flow .node,.flow .step{min-width:0!important;padding:18px 12px;overflow-wrap:break-word}
.flow>.arrow,.flow>.connector{display:none}.flow .node:after,.flow .step:after{display:none!important}
.grid,.grid.three{min-width:0}.grid>*{min-width:0}.mini,.card{overflow-wrap:break-word}
.diagram{min-width:0;max-width:100%;padding:24px 20px}.tree,.tree-row,.bridge,.timeline,.waterfall{min-width:0!important;max-width:100%}
.tree-row{flex-wrap:wrap}.tree-box{min-width:0;flex:1 1 140px}.bridge{grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr) 28px minmax(0,1fr)}.bridge .big{min-width:0;padding:14px 10px;overflow-wrap:break-word}
.timeline{padding-left:0;padding-right:0}.timeline .segment,.timeline .time-seg{min-width:0}.timeline .segment span,.timeline .time-seg span{width:100%;overflow-wrap:break-word}
.waterfall .bar{min-width:0}.waterfall .bar span{overflow-wrap:break-word}
.matrix{min-width:0!important;grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr))}.matrix>div{min-width:0;padding:10px 6px;overflow-wrap:break-word}
input,select{max-width:100%}.formula{max-width:100%;overflow:auto}.toc-toggle{display:none}
@media(max-width:900px){
 .layout{display:block}aside,.side{position:relative;height:auto}
 .main{padding:20px 18px 60px}.main>section,.main>.chapter{padding:26px 20px;margin-top:28px}
 .hero{padding:30px 24px}.hero h1{font-size:31px}
 .section-heading h2{font-size:24px}.pair-link{margin-left:auto}
 .grid,.grid.three{grid-template-columns:1fr}.mini,.card{padding:20px}
 .flow{grid-template-columns:1fr!important}.flow .node,.flow .step{font-size:14px}
 .bridge{display:flex;flex-direction:column;gap:14px}.bridge>.big{width:100%}.bridge>.arrow{transform:rotate(90deg)}
 .tree-row{flex-direction:column}.tree-box{flex:auto;width:100%}
 aside nav:not(.open){display:none}aside nav.open{display:flex;flex-direction:column;max-height:none}
 .toc-toggle{display:block;width:100%;margin-top:12px;padding:12px;background:#1f2937;border:1px solid #475569;border-radius:8px;color:#fff;font-size:14px;text-align:left}
 .timeline{padding-top:40px;padding-bottom:65px}.timeline .segment span,.timeline .time-seg span{font-size:10px}
}
@media print{.edition-nav,.pair-link,.toc-toggle{display:none!important}}
/* 003高校生版の計算判断図・資金コスト図も小画面に収める。 */
.decision-line,.sign-flow,.relation,.meter,.rate-scale,.rate-stack,.curve-wrap,.scale,.pv-stack{min-width:0!important;max-width:100%}
.decision-line{grid-template-columns:minmax(0,1fr) 54px minmax(0,1fr)}
.decision-line .side,.relation .rbox{min-width:0;overflow-wrap:break-word}
.curve-wrap svg{max-width:100%;height:auto}
@media(max-width:900px){
 .decision-line,.relation{display:flex;flex-direction:column;gap:14px}
 .decision-line>.side,.relation>.rbox{width:100%}.relation>.rarrow{transform:rotate(90deg)}
 .sign-flow,.meter,.rate-scale{grid-template-columns:1fr}.rate-stack{flex-wrap:wrap}.rate-part{flex:1 1 45%}.rate-total{width:100%}
}