/* Shared viewport shell for articles, library, contact and private insights. */
html{height:100%;width:100%;overflow:hidden}
body.adaptive-page{height:100vh;height:100dvh;min-height:0;min-width:0;width:100%;display:flex;flex-direction:column;overflow:hidden}
.adaptive-page>header{flex:0 0 auto;display:flex;flex-wrap:nowrap;min-width:0;gap:16px;padding:12px clamp(12px,2vw,28px);position:relative;z-index:10}
.adaptive-page>header>a{flex:0 1 auto;min-width:0}
.adaptive-page>header .silo-brand{gap:12px}
.adaptive-page>header .silo-brand>div{min-width:0}
.adaptive-page>header .silo-brand h1{font-size:clamp(14px,1.7vw,20px)}
.adaptive-page>header .silo-brand small{font-size:9px;letter-spacing:1px}
.adaptive-page>header nav{flex:0 1 auto;min-width:0;width:auto;max-width:100%;display:flex;flex-wrap:nowrap;gap:clamp(12px,1.7vw,24px);overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;white-space:nowrap;padding:6px 2px;margin:0 0 0 auto;justify-content:flex-start}
.adaptive-page>header nav>a,.adaptive-page>header nav>span{flex:0 0 auto}
.adaptive-page>.page-scroll{flex:1 1 0;min-height:0;min-width:0;width:100%;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scroll-behavior:smooth}
.adaptive-page>.page-scroll:focus{outline:none}
.adaptive-page>.page-scroll:focus-visible{outline:2px solid #999;outline-offset:-2px}
.page-scroll>main{width:100%;min-width:0}
.page-scroll .concept-page,.page-scroll .contact-page{padding-left:clamp(14px,4vw,56px);padding-right:clamp(14px,4vw,56px)}
.page-scroll .guide-page{padding-left:clamp(12px,3vw,48px);padding-right:clamp(12px,3vw,48px)}
.page-scroll img{max-width:100%;height:auto}
.page-scroll :is(.concept-hero,.concept-section,.example-comparison,.example-fill,.guide-layout,.contact-card,.contact-operator,.metrics,.columns)>*{min-width:0}
.page-scroll :is(p,h1,h2,h3,li,dd,figcaption){overflow-wrap:anywhere}
.page-scroll .concept-hero{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(16px,4vw,64px);padding:clamp(36px,6vw,98px) 0}
.page-scroll .concept-hero h1{font-size:clamp(28px,4.4vw,60px)}
.page-scroll .hero-mark{padding:clamp(8px,2vw,30px)}
.page-scroll .hero-mark svg{width:clamp(85px,18vw,200px);max-width:100%;height:auto}
.page-scroll .concept-section{grid-template-columns:minmax(90px,25%) minmax(0,1fr);gap:clamp(14px,4vw,50px);padding:clamp(30px,4vw,66px) 0}
.page-scroll .name-origin{flex-wrap:wrap;gap:clamp(12px,2vw,28px)}
.page-scroll .origin-word{font-size:clamp(20px,3vw,36px)}
.page-scroll .example-comparison{grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr);gap:clamp(8px,1.5vw,22px)}
.page-scroll .example-arrow{width:28px;transform:none;margin-top:-35px}
.page-scroll .example-comparison figcaption{flex-wrap:wrap;gap:4px 10px;align-items:baseline}
.page-scroll .example-fill{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,3vw,40px)}
.page-scroll .example-fill-image{padding:clamp(8px,1.5vw,22px)}
.page-scroll .guide-layout{grid-template-columns:clamp(95px,17vw,195px) minmax(0,1fr);gap:clamp(12px,4vw,60px)}
.page-scroll .guide-toc{display:block;align-self:stretch;min-width:0}
.page-scroll .guide-toc nav{position:sticky;top:16px;max-height:calc(100dvh - 130px);overflow:auto;scrollbar-width:thin;padding-right:4px}
.page-scroll .guide-toc a{font-size:clamp(10px,1.2vw,12px);overflow-wrap:anywhere}
.page-scroll .guide-content{min-width:0}
.page-scroll .quick-steps{grid-template-columns:repeat(4,minmax(0,1fr))}
.page-scroll .quick-steps li+li{border-left:1px solid #ddd;border-top:0}
.page-scroll .quick-steps a{height:100%;min-width:0;gap:8px;padding:clamp(10px,1.5vw,19px) clamp(6px,1.2vw,16px);font-size:clamp(10px,1.1vw,12px)}
.page-scroll .table-scroll{max-width:100%;overflow:auto}
.page-scroll .tab-guide{grid-template-columns:minmax(65px,26%) minmax(0,1fr);gap:9px 12px}
.page-scroll .contact-card{grid-template-columns:minmax(0,1fr) clamp(125px,27vw,290px);gap:clamp(16px,4vw,65px);padding:clamp(26px,4vw,48px) 0}
.page-scroll .contact-qr a{width:260px;max-width:100%}
.page-scroll .contact-operator{grid-template-columns:minmax(70px,12%) minmax(0,1fr);gap:clamp(12px,2vw,24px)}
.page-scroll .contact-info h2{font-size:clamp(19px,2.5vw,25px)}
.page-scroll .instagram-handle{font-size:clamp(13px,1.8vw,18px)}
.page-scroll .instagram-button{max-width:100%;gap:12px;padding:14px 12px}
.page-scroll .operator-name{font-size:clamp(16px,2vw,21px)}
.library-view .shared-library{width:calc(100% - clamp(20px,4vw,56px));max-width:1500px;margin:clamp(12px,2vw,28px) auto 30px;padding:clamp(14px,2vw,26px);min-width:0}
.library-view .library-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr));gap:clamp(10px,1.5vw,18px)}
.library-view .library-tabs{flex-wrap:nowrap;max-width:100%;overflow-x:auto;scrollbar-width:thin;padding-bottom:4px}
.library-view .library-tabs button{flex:0 0 auto;white-space:nowrap}
.library-view .library-card{min-width:0}
.insights-view .page-scroll>main{padding:clamp(22px,4vw,52px) clamp(12px,3vw,32px)}
.insights-view .heading{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.insights-view .filters{margin-top:0;flex-wrap:wrap}
.insights-view .metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(8px,1.3vw,16px)}
.insights-view .metrics article{padding:clamp(12px,1.8vw,23px)}
.insights-view .metrics strong{font-size:clamp(26px,3.2vw,38px);overflow-wrap:anywhere}
.insights-view .columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,2vw,22px)}
.insights-view .panel{min-width:0;padding:clamp(12px,2vw,26px);overflow-x:auto}
.page-scroll footer.site-footer{width:calc(100% - clamp(28px,8vw,112px));min-width:0}
@media(max-width:900px){
 .adaptive-page>header{flex-wrap:wrap;gap:4px 12px;padding-top:8px;padding-bottom:8px}
 .adaptive-page>header nav{flex:1 1 100%;width:100%;margin-left:0}
 .adaptive-page>header .silo-brand svg{width:28px;height:38px}
 .page-scroll .guide-toc nav{max-height:calc(100dvh - 150px)}
}
@media(max-width:540px){
 .page-scroll .section-label h2{font-size:15px}
 .page-scroll .section-label>span{font-size:9px;letter-spacing:.5px}
 .page-scroll .section-content p{font-size:12px;line-height:2.1}
 .page-scroll .section-content .section-lead{font-size:20px}
 .page-scroll .example-fill-copy>p:not(.eyebrow){font-size:12px}
 .page-scroll .example-fill-copy h3{font-size:20px}
 .page-scroll .guide-section h2{font-size:19px}
 .page-scroll .guide-section p,.page-scroll .guide-section li{font-size:12px}
 .page-scroll .guide-section ol,.page-scroll .guide-section ul{padding-left:17px}
 .page-scroll .guide-toc nav{top:8px}
 .page-scroll .guide-toc a{padding:8px 0}
 .page-scroll .scale-example>div{gap:6px;font-size:20px;flex-wrap:wrap}
 .page-scroll .guide-note{padding:12px}
 .page-scroll .contact-info>p:not(.contact-label){font-size:12px}
 .page-scroll .contact-qr figcaption{font-size:10px}
 .page-scroll .instagram-button{font-size:12px}
 .insights-view .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-height:540px){.adaptive-page>header{padding-top:4px;padding-bottom:4px}.adaptive-page>header .silo-brand svg{width:22px;height:30px}.page-scroll .guide-toc nav{top:8px;max-height:calc(100dvh - 100px)}}
@media(prefers-reduced-motion:reduce){.adaptive-page>.page-scroll{scroll-behavior:auto}}

.library-view .library-card img{height:clamp(150px,22vw,190px);width:100%;object-fit:contain}