/* A22: common spacing tokens, natural-flow pages, no automatic image shrinking. */
:root{--a22-gap:var(--nn-space-16);--a22-pad:var(--nn-space-24)}
.how-link{font-size:12pt;line-height:1.6;color:var(--accent);padding:var(--nn-space-16);background:var(--nn-texture-paper),var(--label-bg)}
.check ul{display:block!important;columns:1!important}.check li+li{margin-top:var(--nn-space-8)!important}.check li{line-height:1.45!important}
@media print{
 .sheet{overflow:visible!important}.page-body{top:32mm!important;height:auto!important;min-height:230mm;gap:var(--a22-gap)!important;display:flex!important}
 .slot{position:relative!important;top:auto!important;left:auto!important;width:100%!important;height:auto!important;min-height:0!important;overflow:visible!important}
 .title{margin:0!important}h1{font-size:24pt;line-height:1.25}
 .steps,.memo,.explanation,.steps p,.memo p{font-size:12pt;line-height:1.7}.steps p,.memo p{margin-bottom:var(--nn-space-8)}
 .request{font-size:12pt!important;line-height:1.75!important;padding:var(--a22-pad)!important}.request p+p{margin-top:var(--nn-space-12)!important}
 .check{padding:var(--a22-pad)!important}.check li{font-size:16pt!important}.check ul{padding-left:5mm!important}
 .slot.answer .capture,.slot.result .capture,.slot.answer .frame,.slot.result .frame{height:auto!important}
 .slot.answer img,.slot.result img{height:auto!important;width:100%!important;max-height:none!important;object-fit:contain!important}
 .answer .frame{width:100%!important}.answer img{image-rendering:auto}.answer figcaption{margin-bottom:var(--nn-space-8)}
 .step-result .answer{max-width:100%}.step-result .check{margin-top:0}
 .how-page .diagram .frame,.how-page .diagram .visual,.how-page .diagram .ink{height:auto!important}
 .how-page .diagram img{height:auto!important;width:100%!important;max-height:none!important}
 .how-page .diagram{margin-top:var(--nn-space-16)}
 .px-grid img{width:100%;height:auto}.px-size-compare{padding:var(--nn-space-8);margin:var(--nn-space-8) 0}.px-size-compare>div{display:flex;gap:var(--nn-space-12);align-items:end}.px-size-compare span{display:flex;flex-direction:column}.px-size-compare em{font-style:normal;white-space:nowrap}.px-size-compare b,.px-size-compare figcaption{font-size:9pt}
 .cover-image .ink{min-height:0!important}.cover-image .capture:first-child{align-self:center}
 .continuation .continuation-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--nn-space-24)}
 .continuation .continuation-grid img{height:55mm!important;width:100%;object-fit:contain}
 #obsolete-17 .steps{font-size:15pt;line-height:1.9}#obsolete-17 .steps li+li{margin-top:var(--nn-space-24)}
}
@media screen{
 .spread{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);max-width:1600px!important;align-items:start}.spread.solo{display:block!important;max-width:850px!important}
 .sheet{width:100%;min-width:0}.step-request .request,.step-request .explanation{order:initial}.answer img{width:100%;height:auto}
 .step-result .result,.step-result .answer,.step-result .check{order:initial}
 .px-grid img{width:100%;height:auto}.px-size-compare>div{display:flex;flex-wrap:wrap;gap:var(--nn-space-12)}.px-size-compare span{display:flex;flex-direction:column}
 .continuation-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--nn-space-24)}.continuation-grid img{width:100%}
}
@media screen and (max-width:899px){.spread{display:flex!important;flex-direction:column}.sheet{width:100%}.capture figcaption{white-space:normal}.continuation-grid{grid-template-columns:1fr}.how-link{font-size:16px}.progress{position:relative}.px-size-compare em{font-style:normal}}
.request-context{margin-top:var(--nn-space-16)}.request-context figcaption{font-size:10pt;margin-bottom:var(--nn-space-8)}.request-context img{width:100%;height:auto}
@media print{
 #obsolete-2 .page-body{gap:var(--nn-space-12)!important}#obsolete-2 .check li{font-size:15pt!important}
 #obsolete-6 .request{padding:var(--nn-space-20)!important;font-size:11.5pt!important;line-height:1.65!important}
 #obsolete-10 .px-grid{max-width:120mm}#obsolete-10 .steps p{font-size:11.5pt;line-height:1.6}#obsolete-10 .steps{line-height:1.6}
 #obsolete-16 .diagram img{width:115mm!important;margin:auto}#obsolete-16 .diagram .frame{width:115mm!important}
 #obsolete-17 .steps{font-size:12pt;line-height:1.7}#obsolete-17 .steps li+li{margin-top:var(--nn-space-12)}
 #obsolete-20 .diagram .phone-pair .capture,#obsolete-20 .diagram .phone-pair .annotated{width:66mm!important;flex-basis:66mm!important}
}
@media print{
 #obsolete-8 .request-context,#obsolete-12 .request-context,#obsolete-18 .request-context{max-width:110mm}
 #obsolete-10 .diagram{max-width:65mm!important;align-self:center}#obsolete-10 .px-grid{max-width:100mm}
 #obsolete-10 .page-body{gap:var(--nn-space-12)!important}
 #obsolete-16 .annotated{aspect-ratio:320/437!important;max-height:none!important;overflow:visible!important}
 #obsolete-20 .phone-pair .annotated{aspect-ratio:auto!important;max-height:none!important;min-height:119mm!important}
 #obsolete-20 .phone-pair img{max-height:none!important}
 #obsolete-2 .page-body{gap:var(--nn-space-8)!important}
}
