/* Principles remain readable articles; one upright photograph accompanies the desktop reading route. */
.about-page [data-about-body] .studio-principles.principle-editorial{--principle-rail:calc(clamp(96px,12svh,128px) + var(--wp-admin--admin-bar--height,0px));background:var(--musou-paper);color:var(--musou-ui-ink)}
.principle-editorial-heading{margin-bottom:clamp(64px,8vw,154px)}
.principle-editorial-layout{position:relative;overflow-anchor:none}
.principle-chapter{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center;min-height:88svh;padding-block:clamp(48px,10svh,120px);scroll-margin-top:24px}
.principle-chapter-text{min-width:0}
.principle-index{display:block;font-size:clamp(32px,3.6vw,60px);font-weight:400;line-height:1;letter-spacing:-.035em;margin-bottom:24px;font-variant-numeric:tabular-nums}
/* Native fragments meet the .45 viewport reading line after html's 100px scroll padding. */
.principle-chapter h3{font-size:clamp(34px,min(4.6vw,8.2svh),88px);font-weight:500;line-height:1.07;letter-spacing:-.035em;max-width:17ch;margin:0;text-wrap:balance;scroll-margin-top:max(24px,calc(45svh - 101px))}
.principle-chapter-copy{max-width:34ch;margin-top:32px;font-size:clamp(18px,1.3vw,25px);line-height:1.55}
.principle-native-image{margin:0;min-width:0}
.principle-native-image img{width:100%;height:min(58svh,650px);object-fit:cover}
.principle-native-image figcaption{font-size:10px;line-height:1.5;margin-top:10px}
.principle-visual[hidden]{display:none}
.has-principle-editorial .principle-editorial-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:8vw;align-items:start}
.has-principle-editorial .principle-chapter{display:flex;align-items:center}
/* Keep each source image/caption available once to assistive technology. */
.has-principle-editorial .principle-native-image{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.principle-visual{align-self:stretch;min-width:0}
.principle-visual-sticky{position:sticky;top:var(--principle-rail)}
.principle-image-window{position:relative;height:min(68svh,calc(100svh - var(--principle-rail) - 92px));overflow:hidden;isolation:isolate;background:var(--musou-paper)}
.principle-image-layer{position:absolute;inset:0;background:var(--musou-paper);clip-path:inset(100% 0 0)}
.principle-image-layer:first-child{clip-path:none}
.principle-image-layer img{display:block;width:100%;height:100%;object-fit:cover;transform:translateY(var(--principle-image-y,0px)) scale(var(--principle-image-scale,1));transform-origin:center}
.principle-controls{display:flex;gap:32px;align-items:center;margin-top:18px}
.principle-progress{position:relative;flex:1;height:1px;background:var(--agency-rule);overflow:hidden}
.principle-progress::after{content:"";position:absolute;inset:0;background:currentColor;transform:scaleX(var(--principle-progress,0));transform-origin:left}
.principle-chapter-links{display:flex;gap:12px}
.principle-chapter-links a{display:grid;place-items:center;position:relative;width:52px;height:56px;font-size:clamp(32px,2.7vw,44px);font-weight:400;letter-spacing:-.025em;line-height:1;font-variant-numeric:tabular-nums}
/* Scale only the numeral; fixed link boxes keep the reading rail still. */
.principle-link-number{display:block;opacity:.56;transform:scale(.45);transform-origin:50% 85%;transition:transform 520ms cubic-bezier(.16,1,.3,1),opacity 360ms ease-out}
.principle-chapter-links a[aria-current] .principle-link-number{opacity:1;transform:scale(1)}
.principle-chapter-links a{background:none;text-decoration:none}
.principle-chapter-links a:focus-visible{outline:2px solid currentColor;outline-offset:3px}
@media(max-width:899px){
 .principle-chapter{min-height:0;padding-block:48px;gap:5vw}
 .principle-chapter h3{font-size:clamp(32px,5.5vw,52px)}
 .principle-index{margin-bottom:22px}
 .principle-chapter-copy{font-size:18px;margin-top:24px}
 .principle-native-image img{height:48vw;max-height:600px}
}
@media(max-width:700px){
 .principle-editorial-heading{margin-bottom:24px}
 .principle-chapter{display:block;padding-block:40px}
 .principle-chapter h3{font-size:clamp(34px,9vw,62px);max-width:18ch}
 .principle-native-image{margin-top:32px}
 .principle-native-image img{height:85vw;max-height:600px}
}
@media(prefers-reduced-motion:reduce){
 .principle-chapter{min-height:0;padding-block:48px}
 .principle-link-number{transition:none}
}
@media print{
 .about-page [data-about-body] .studio-principles.principle-editorial{background:#fff;color:#000;transition:none}
 .principle-editorial-heading{margin-bottom:8mm}
 .principle-editorial-layout,.principle-chapter{display:block!important}
 .principle-chapter{min-height:0;padding-block:8mm;break-inside:avoid}
 .principle-chapter h3{font-size:24pt}.principle-chapter-copy{font-size:11pt;max-width:none}
 .principle-native-image{position:static!important;width:auto!important;height:auto!important;clip-path:none!important;overflow:visible!important;white-space:normal!important;margin:6mm 0 0!important}
 .principle-native-image img{height:50mm;width:auto;max-width:100%}
 .principle-visual{display:none!important}
}