.composition-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 28px}
.composition-choices article{padding:22px;border:1.5px solid var(--rule);border-radius:16px}
.composition-choices h3{margin:4px 0 8px}
.composition-choices p{margin:0;font-size:17px;line-height:1.5}
.choice-number{font:800 14px var(--sans);color:var(--amber)}
.composition-principle{max-width:52em;margin:0;padding:18px 22px;border-left:4px solid var(--amber);background:var(--paper-2);border-radius:0 12px 12px 0}
.composition-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0 0 24px}
.composition-pair figure{margin:0;min-width:0;border:1.5px solid var(--rule);border-radius:18px;overflow:hidden}
.compare-frame{aspect-ratio:3/2;overflow:hidden;background:var(--body)}
.compare-frame img{display:block;width:100%;height:100%;object-fit:cover}
.compare-frame .portrait-close{object-position:50% 48%}
.compare-frame .singer-close{object-position:50% 69%;transform:scale(1.35);transform-origin:50% 18%}
.composition-pair figcaption{display:grid;gap:5px;padding:16px 18px 20px;font-size:16px;line-height:1.45}
.composition-pair figcaption strong{font:800 18px var(--sans)}
.photo-credit{font:600 13px/1.4 var(--sans);color:var(--muted);margin-top:5px}
.photo-credit a{color:inherit;text-decoration-color:var(--amber);text-underline-offset:2px}
.comparison-takeaway{max-width:52em;margin:0}
.composition-exercise{counter-reset:exercise;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 24px;padding:0}
.composition-exercise li{counter-increment:exercise;position:relative;padding:56px 20px 22px;border:1.5px solid var(--rule);border-radius:16px;font-size:17px;line-height:1.5}
.composition-exercise li::before{content:counter(exercise,decimal-leading-zero);position:absolute;top:18px;left:20px;font:800 22px var(--sans);color:var(--amber)}
.composition-exercise strong{font-family:var(--sans)}
.field-deliverable{max-width:52em;padding:18px 22px;background:var(--paper-2);border-radius:12px}
.composition-review{max-width:52em;margin:0 0 20px;padding-left:22px}
.composition-review li{margin-bottom:12px}
@media(max-width:850px){.composition-choices,.composition-exercise{grid-template-columns:1fr}}
@media(max-width:650px){.composition-pair{grid-template-columns:1fr}}