
.composition-study{padding-top:96px;padding-bottom:88px;border-top:1px solid #d9d5cf}
.composition-heading{margin-bottom:32px}.composition-heading h2{font-size:clamp(30px,3vw,44px);font-weight:400;line-height:1.5;letter-spacing:.04em;margin:16px 0 24px}.composition-heading p{font-size:15px;line-height:2}
.composition-study figure{margin:0}.composition-photo{display:block;position:relative;width:100%;padding:0;border:0;border-radius:0;background:#eee;cursor:pointer;overflow:hidden}.composition-photo img{display:block;width:100%;height:auto}.composition-photo svg{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .3s;pointer-events:none}.composition-photo[aria-pressed="true"] svg{opacity:.5}.composition-photo:focus-visible{outline:3px solid #222;outline-offset:5px}.guide-chip{position:absolute;right:20px;bottom:20px;padding:10px 14px;background:rgba(255,255,255,.88);color:#242424;font-size:12px;letter-spacing:.05em}.composition-study figcaption{display:flex;justify-content:space-between;gap:16px;margin-top:15px;font-size:12px;line-height:1.8;color:#65615c}.composition-note{font-size:16px;line-height:2;margin:32px 0 64px}.photographer-quote{border-top:1px solid #d9d5cf;padding-top:40px;max-width:800px;margin:0 auto}.photographer-quote blockquote{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(20px,2vw,25px);font-style:italic;font-weight:400;line-height:2;letter-spacing:.04em;margin:0 0 24px}.quote-source{font-size:14px;line-height:2}.quote-source span{font-size:12px}.quote-source a{text-decoration:underline;text-underline-offset:4px}.quote-context{font-size:13px;line-height:2;color:#65615c;max-width:620px;margin-top:24px}
@media(hover:hover) and (pointer:fine){.composition-photo:hover svg{opacity:.5}}
@media(max-width:767px){.composition-study{padding-top:56px;padding-bottom:56px}.composition-heading h2{font-size:30px}.desktop-break{display:none}.composition-study figcaption{display:block}.composition-study figcaption span{display:block}.guide-chip{right:10px;bottom:10px;padding:7px 10px;font-size:11px}.composition-note{font-size:14px;margin:24px 0 40px}.photographer-quote{padding-top:28px}.quote-source span{display:block}}
@media(prefers-reduced-motion:reduce){.composition-photo svg{transition:none}}

.oa-composition-v2 *{box-sizing:border-box}
.oa-composition-v2 body{margin:0;background:#fafaf8;color:#202927;font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;line-height:1.9}
.oa-composition-v2 main{max-width:1160px;margin:auto;padding:36px 40px}
.oa-composition-v2 header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d7ded9;padding-bottom:24px}
.oa-composition-v2 header img{width:190px}
.oa-composition-v2 header span,.oa-composition-v2 .eyebrow{font-size:11px;letter-spacing:.15em;color:#577269}
.oa-composition-v2 .intro{padding:70px 0 52px}
.oa-composition-v2 h1{font-size:38px;font-weight:500;margin:12px 0}
.oa-composition-v2 h2{font-size:30px;font-weight:500;margin:0 0 12px}
.oa-composition-v2 p{margin:0 0 14px}
.oa-composition-v2 section{border-top:1px solid #d7ded9;padding:48px 0 58px}
.oa-composition-v2 .heading{display:flex;gap:28px;margin-bottom:28px;max-width:820px}
.oa-composition-v2 .number{font-size:36px;font-weight:300;color:#7c9189}
.oa-composition-v2 .eyebrow{margin-bottom:6px}
.oa-composition-v2 .photo{display:block;width:100%;padding:0;border:0;position:relative;background:none;cursor:pointer;color:#fff}
.oa-composition-v2 .photo img{display:block;width:100%;height:auto}
.oa-composition-v2 .photo svg{position:absolute;inset:0;width:100%;height:100%;opacity:.5;pointer-events:none}
.oa-composition-v2 .photo svg path{fill:none;stroke:#fff;stroke-width:3;vector-effect:non-scaling-stroke}
.oa-composition-v2 .photo svg .shadow{stroke:#18342b;stroke-width:6}
.oa-composition-v2 .photo .points{fill:white}
.oa-composition-v2 .chip{position:absolute;right:16px;bottom:16px;background:#173b30e8;border:1px solid #ffffff88;padding:8px 13px;font-size:12px}
.oa-composition-v2 .photo:focus-visible{outline:3px solid #176d53;outline-offset:5px}
.oa-composition-v2 .photo[aria-pressed=false] svg,.oa-composition-v2 .photo[aria-pressed=false] .node{display:none}
.oa-composition-v2 .notes{display:grid;grid-template-columns:1fr 1.4fr;gap:30px;margin-top:25px}
.oa-composition-v2 .notes strong{font-size:20px;font-weight:500}
.oa-composition-v2 .notes p{font-size:14px}
.oa-composition-v2 .credit{font-size:12px;color:#64766d}
.oa-composition-v2 .node{position:absolute;transform:translate(-50%,-50%);width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#173b30;border:1px solid white;font:16px Georgia}
.oa-composition-v2 .n1{left:18.33%;top:24.17%}
.oa-composition-v2 .n2{left:75.56%;top:24.17%}
.oa-composition-v2 .n3{left:24.44%;top:90%}
.oa-composition-v2 .n4{left:72.22%;top:90%}
.oa-composition-v2 .route-key{display:flex;justify-content:space-between;padding-left:20px;margin:18px 0 30px;font-size:14px;gap:22px}
.oa-composition-v2 .pair{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.oa-composition-v2 .pair figure{margin:0}
.oa-composition-v2 .pair img{width:100%;height:auto;display:block}
.oa-composition-v2 .pair figcaption{padding:20px 0}
.oa-composition-v2 .pair figcaption span{font-size:12px;color:#577269;letter-spacing:.1em}
.oa-composition-v2 .pair h3{font-size:22px;font-weight:500;margin:5px 0}
.oa-composition-v2 .pair p{font-size:14px}
.oa-composition-v2 .balance{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;background:#edf0eb;padding:24px;margin-bottom:18px}
.oa-composition-v2 .balance span{font-size:14px}
.oa-composition-v2 .balance b{display:block;font-size:12px;color:#577269;font-weight:400}
.oa-composition-v2 aside{border-top:1px solid #d7ded9;padding:50px 0;max-width:800px;margin:auto}
.oa-composition-v2 blockquote{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-style:italic;font-size:24px;line-height:2;margin:0 0 24px}
.oa-composition-v2 aside p{font-size:13px}
.oa-composition-v2 a{color:inherit}
.oa-composition-v2 footer{font-size:11px;color:#64766d;padding:25px 0;border-top:1px solid #d7ded9}
@media(max-width:767px){.oa-composition-v2 main{padding:24px 20px}
.oa-composition-v2 header img{width:155px}
.oa-composition-v2 header span{font-size:9px}
.oa-composition-v2 .intro{padding:42px 0 34px}
.oa-composition-v2 h1{font-size:28px}
.oa-composition-v2 h2{font-size:25px}
.oa-composition-v2 .heading{gap:16px}
.oa-composition-v2 .number{font-size:28px}
.oa-composition-v2 .heading p{font-size:14px}
.oa-composition-v2 section{padding:32px 0 38px}
.oa-composition-v2 .notes{display:block}
.oa-composition-v2 .notes strong{font-size:18px;display:block;margin-bottom:12px}
.oa-composition-v2 .pair{grid-template-columns:1fr;gap:20px}
.oa-composition-v2 .balance{grid-template-columns:1fr;padding:20px}
.oa-composition-v2 .chip{font-size:10px;right:8px;bottom:8px;padding:5px 8px}
.oa-composition-v2 .node{width:24px;height:24px;font-size:13px}
.oa-composition-v2 .route-key{font-size:12px;gap:12px}
.oa-composition-v2 blockquote{font-size:20px}
}
.oa-composition-v2 #composition-zpath .chip{top:10px;bottom:auto}

.oa-composition-v2 .photo img{margin:0}.oa-composition-v2 .pair figcaption{display:block}.oa-composition-v2 .heading h2{font-size:clamp(25px,3vw,30px)}
