/* v7 · A more legible, composed catalogue, using the established palette. */
:root{--studio-ink:#354039;--studio-muted:#66735f;--studio-rule:#d8ded2;--polish-soft:#f7f9f4;--polish-accent:#536a42}
*{ -webkit-tap-highlight-color:transparent }
button,a,input,summary{touch-action:manipulation}
button:disabled{opacity:.4;cursor:default}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--polish-accent);outline-offset:4px}
.ui-icon{width:18px;height:18px;display:block;flex-shrink:0}
.page{padding:22px 34px 28px}
header{padding-bottom:18px;gap:24px;border-bottom:1px solid #9ca695}
.brand-title{font-size:26px}.brand-copy .eyebrow{font-size:9px;letter-spacing:.18em}.brand-icon{width:40px;height:40px}
nav a{font-size:14px;position:relative}nav [data-collection-count]{font-family:Arial,Helvetica,sans-serif;font-size:10px;color:#536447}
.header-author{font-size:10px;line-height:1.5;color:#65715e}
.studio-intro{padding:18px 0 18px;align-items:center}.studio-intro h1{font-size:clamp(33px,3.15vw,45px);line-height:1.1;letter-spacing:-.025em;margin-top:8px}.studio-intro .eyebrow{font-size:9px;color:#67735f}.studio-intro>p{font-size:13px;color:#66735f;line-height:1.55}
.studio-scales{margin-bottom:22px}.studio-scales>button{grid-template-columns:36px minmax(0,1fr) auto;padding:14px 17px;gap:13px;min-height:76px;transition:background .15s ease}.studio-scales>button:hover{background:#f5f7f1}.studio-scales>button[aria-pressed=true]{background:#edf2e7;box-shadow:inset 0 -3px var(--polish-accent)}.studio-scales .scale-icon{width:36px;height:36px}.studio-scales strong{font-size:27px}.scale-view{font-size:11px;display:block;color:#65745b}.scale-index{font-family:Arial,Helvetica,sans-serif;font-size:9px;color:#7c8874}.scale-count{font-size:11px;color:#66735f}.scale-count em{font-size:10px;line-height:1.3;margin-top:3px;color:#486337}.scale-label{gap:4px}
.studio-workspace{gap:24px}.composer-column{top:18px}.composer-viewer{border-color:#cfd8c8;background:#fff;overflow:hidden}
.graphic-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:17px 19px 12px;flex-direction:row;flex-wrap:nowrap}.graphic-toolbar>div:first-child{min-width:0}.graphic-toolbar .eyebrow{font-size:10px;letter-spacing:.1em;color:#6b7863;display:flex;align-items:center;gap:8px;line-height:1.4}.graphic-toolbar .eyebrow>span{color:#afb8a7}.graphic-toolbar h2{font-size:clamp(23px,2vw,29px);line-height:1.16;margin-top:6px;letter-spacing:-.02em}.graphic-controls{width:auto;gap:0}.graphic-controls button,.graphic-controls button:last-child{display:flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:8px 10px;border:1px solid #cfd8c8;color:#52664a;background:white;font:11px Arial,Helvetica,sans-serif;line-height:1.2;white-space:nowrap}.graphic-controls button:hover{background:#edf2e7;border-color:#8da07f}.graphic-controls .ui-icon{width:16px;height:16px}
.combined-graphic{padding:0 9px}.combined-graphic svg{width:100%;height:auto;max-height:none}.combined-graphic:focus:not(:focus-visible){outline:none}.combined-graphic:focus-visible{outline:2px solid var(--polish-accent);outline-offset:-5px}
.graphic-caption{padding:11px 18px 14px;font-size:11px;line-height:1.5;color:#64735a;gap:18px;min-height:47px}.graphic-caption button{font-size:11px;line-height:1.5;color:#486039;text-decoration:none;padding:4px 0;border-bottom:1px solid #acb9a0;flex-shrink:0}.graphic-caption button:hover{color:#283f1e;border-bottom-color:#536a42}.has-preview .graphic-caption{background:#f6f8f1}.has-preview .graphic-caption>span{color:#3e5830}
.position-strip{padding:10px 13px;gap:4px;background:#fafbf8}.position-strip>button{font-size:10px;line-height:1.35;padding:6px 7px;min-height:28px;color:#64745a;transition:background .15s ease}.position-strip>button:hover{background:#edf2e7}.position-strip>button[aria-pressed=true]{background:#edf2e7;border-color:#a9b99d;color:#3f572f}.position-strip>button>span{width:4px;height:4px}
.graphic-intro{padding:12px 18px;background:#fbfcf9}.graphic-intro p{font-size:11px;line-height:1.55;color:#68775e}.graphic-intro strong{font:inherit;font-weight:600;color:#4c6340}
.graphic-inspector{padding:15px 18px;background:#f4f7ed}.inspector-top .eyebrow{font-size:10px;line-height:1.4;color:#536a42}.inspector-top>button{display:grid;place-items:center;min-height:28px;min-width:28px;font-size:22px;color:#5d7150}.graphic-inspector h3{font-size:25px;margin-bottom:8px}.graphic-inspector>p{font-size:12px;line-height:1.6;color:#53684a}.graphic-inspector .replacement-note{font-size:11px;color:#716d4c}.inspector-links{margin-top:12px;gap:12px}.inspector-links>a{font-size:11px;line-height:1.4;color:#4d643f}.inspector-links .choose-strategy{min-width:84px}
.selected-strip{padding:13px 18px}.selected-strip .eyebrow{font-size:9px;letter-spacing:.1em;color:#65735c;display:flex;align-items:center;gap:7px}.selection-total{font:10px Arial,Helvetica,sans-serif;letter-spacing:0;display:inline-grid;place-items:center;min-width:19px;height:19px;background:#edf2e7;border-radius:50%;color:#4b633d}.selected-strip>div{margin-bottom:10px}.selected-strip>div>button{font-size:11px;color:#617354;padding:3px 0}.selected-strip ul{gap:6px}.selected-strip li{background:#f8faf4;border-color:#d8e1cf;border-left-color:var(--force)}.selected-strip li button{font-size:11px;line-height:1.35;padding:7px 8px;color:#4f6542}.selected-strip li button:last-child{font-size:16px;min-width:26px;padding-left:4px;padding-right:6px}.selected-strip li button:hover{background:#e9f0e1}.empty-selection{font-size:11px;line-height:1.5;color:#728068}
.graphic-footer{padding:12px 17px;font-size:10px;gap:17px;color:#6c7864;flex-wrap:wrap}.graphic-footer>button{font-size:10px;color:#536b45;padding:3px 0}.graphic-footer>button:hover{text-decoration:underline;text-underline-offset:4px}
.strategy-controls{margin-bottom:16px}.studio-search{padding:5px 0 11px;margin-bottom:12px;gap:9px;border-color:#a9b69e;transition:border-color .15s}.studio-search:focus-within{border-color:#536a42;box-shadow:0 1px #536a42}.studio-search>.ui-icon{width:17px;height:17px;color:#718462}.studio-search input{font:12px/1.5 Arial,Helvetica,sans-serif;padding:5px 0;outline:none;color:#354039}.studio-search input::placeholder{color:#6c7d60}
.force-controls{gap:5px}.force-controls>button{font-size:11px;line-height:1.25;min-height:32px;padding:7px 10px;color:#5b6e50;border-color:#d8dfd2}.force-controls>button>span{width:7px;height:7px}.force-controls>button:hover{background:#f5f7f1}.force-controls>button[aria-pressed=true]{background:#edf2e7;border-color:#9aaa8c;color:#3e582e}
.library-options{gap:12px;flex-wrap:wrap;font-size:11px;color:#65745d;margin-top:13px;min-height:22px}.library-options>p{line-height:1.4}.library-options>button{font-size:11px;color:#5e754e;padding:3px 0}.library-options>button:hover{text-decoration:underline;text-underline-offset:3px}.library-options>button[aria-pressed=true]{font-weight:600;color:#3f5a2d}
.studio-grid{gap:12px}.strategy-tile{border-color:#d8dfd2;transition:border-color .15s ease,box-shadow .15s ease;background:#fff}.strategy-tile:hover{border-color:#97aa86;box-shadow:0 3px 12px #35403908}.strategy-tile.is-selected{border-color:#9aad89;box-shadow:inset 0 3px #8aa276;background:#fcfdf9}.strategy-tile.is-focused{border-color:#536a42;box-shadow:inset 0 3px #536a42;background:#f8faf3}
.tile-meta,.studio-library .tile-meta{padding:12px 12px 0;font:10px/1.4 Arial,Helvetica,sans-serif;color:#66785a;min-height:32px;align-items:center}.tile-meta>span{min-width:0}.tile-meta>a{width:25px;height:25px;display:grid;place-items:center;flex-shrink:0;color:#687e59}.tile-meta>a:hover{background:#edf2e7;color:#354d29}.tile-meta .ui-icon{width:16px;height:16px}
.tile-graphic{padding:7px 10px 4px;transition:background .15s ease}.tile-graphic:hover{background:#f8faf4}.tile-graphic>svg,.studio-library .tile-graphic>svg{height:105px}.tile-title,.studio-library .tile-title{font:400 21px/1.13 Libron,Georgia,serif;color:#354b2c;letter-spacing:-.015em;padding:6px 12px 11px;min-height:66px;overflow-wrap:normal;hyphens:none}.tile-title:hover{color:#607d48}.strategy-tile>.tags,.studio-library .strategy-tile>.tags{padding:0 12px 14px;gap:5px 9px;min-height:28px}.strategy-tile .tag{font-size:10px;color:#65775a;line-height:1.4}.strategy-tile .tag:before{width:6px;height:6px}
.tile-bottom,.studio-library .tile-bottom{padding:10px 11px 7px;gap:7px;border-top-color:#e0e6da;min-height:48px}.tile-bottom>a,.studio-library .tile-bottom>a{font-size:10px;line-height:1.3;color:#617652}.choose-strategy,.studio-library .choose-strategy{font:11px/1.2 Arial,Helvetica,sans-serif;min-width:72px;min-height:32px;padding:7px 9px;gap:9px;border-color:#a6b798;color:#486337;background:#edf3e5}.choose-strategy>span:last-child{font-size:15px}.choose-strategy.is-selected{background:#f5f8ef;border-color:#c2cfb5;color:#526c41}.choose-strategy:hover{background:#e3edd8;border-color:#8da57a}.choose-strategy.is-selected:hover{background:#edf2e6}.tile-replaces{font-size:10px;line-height:1.4;min-height:37px;padding:0 11px 9px;color:#76724e}.tile-reading{font-size:12px;line-height:1.65;color:#5b6f51}
.related-strategy-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.studio-note{font-size:12px;color:#66765d;margin-top:30px;gap:25px;padding-top:18px}.studio-note p{font-size:12px;line-height:1.6;max-width:740px}.studio-note span{font-size:11px;color:#64765a}.studio-method{font-size:12px;color:#617255;max-width:790px;padding-top:20px}.studio-method summary{font-size:12px;color:#48633a}.studio-method p{line-height:1.7}.studio-empty{background:#fafcf7}.studio-empty p{color:#64735c}
.diagram-dialog{width:min(1100px,calc(100vw - 56px));padding:26px 30px;color:#354039;border-color:#c3cebb;max-height:calc(100dvh - 40px)}.diagram-dialog-heading{align-items:center;gap:20px;margin-bottom:16px}.diagram-dialog-heading h2{font:400 32px/1.15 Libron,Georgia,serif;margin:7px 0 0}.diagram-dialog-heading .eyebrow{font:10px Arial,Helvetica,sans-serif;letter-spacing:.12em;color:#697a5f}.diagram-dialog-heading .button{display:flex;align-items:center;gap:15px;font:12px Arial,Helvetica,sans-serif;padding:9px 12px;background:white;border:1px solid #c8d3bf}.diagram-dialog-heading .button>span{font-size:19px}.diagram-dialog>svg{max-height:65vh}.dialog-legend{display:flex;gap:18px;align-items:center;border-top:1px solid #d8ded2;padding-top:15px;margin-top:12px;font:11px Arial,Helvetica,sans-serif;color:#5e7151;flex-wrap:wrap}.dialog-legend>span{display:flex;align-items:center;gap:7px}.dialog-legend i{width:8px;height:8px;background:var(--force)}.dialog-legend>p{margin-left:auto;font-size:10px;color:#73816b}
@media(min-width:1101px){.studio-workspace{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr)}.studio-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1500px){.page{padding-left:42px;padding-right:42px}.studio-library .tile-graphic>svg{height:125px}.studio-library .tile-title{font-size:24px}}
@media(min-width:851px) and (max-width:1250px){.page{padding:20px 25px 28px}.studio-workspace{gap:20px}.graphic-toolbar{padding:15px 15px 10px}.graphic-toolbar h2{font-size:25px}.graphic-controls button>span{display:none}.graphic-controls button,.graphic-controls button:last-child{width:36px;height:36px;padding:8px}.studio-scales>button{grid-template-columns:32px minmax(0,1fr) auto;gap:10px;padding:14px}.studio-scales .scale-icon{width:32px;height:32px}.scale-index{display:none}.studio-scales strong{font-size:25px}.studio-library .tile-title{font-size:21px;padding-left:10px;padding-right:10px}.studio-library .tile-meta{font-size:10px;padding-left:10px;padding-right:8px}.studio-library .tile-bottom{padding-left:9px;padding-right:9px}.studio-library .tile-bottom>a{font-size:10px}.studio-library .choose-strategy{min-width:64px;font-size:10px;padding:7px;gap:6px}.studio-library .tile-graphic>svg{height:96px}.force-controls>button{font-size:10px;padding:7px 9px}.graphic-footer{gap:12px}}
@media(min-width:851px) and (max-width:1100px){.studio-workspace{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr)}.studio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.studio-intro>p{font-size:12px}.graphic-toolbar h2{font-size:23px}.graphic-caption{align-items:flex-start;padding-left:15px;padding-right:15px;font-size:10px;gap:12px}.graphic-caption button{font-size:10px;max-width:120px;white-space:normal;text-align:right}.studio-scales strong{font-size:24px}.scale-count{font-size:10px}.studio-library .tile-graphic>svg{height:105px}.selected-strip{padding-left:15px;padding-right:15px}.graphic-inspector{padding-left:15px;padding-right:15px}.graphic-footer>span{flex-basis:100%}}
@media(max-width:850px){.page{padding:20px 23px 26px}.studio-intro{padding:23px 0}.studio-intro h1{font-size:35px}.studio-intro>p{font-size:12px}.studio-scales>button{grid-template-columns:32px minmax(0,1fr);gap:6px 10px;padding:13px}.studio-scales .scale-icon{width:32px;height:32px;grid-row:1 / 3}.studio-scales .scale-label{gap:4px}.studio-scales strong{font-size:24px}.studio-scales .scale-count{grid-column:2;font-size:10px}.studio-scales .scale-count em{display:inline;margin-left:6px;font-size:10px}.scale-view{display:none}.scale-index{display:none}.studio-workspace{display:block}.composer-column{position:static;padding:0;z-index:auto}.studio-library{margin-top:25px}.graphic-toolbar{padding:16px 18px 10px}.graphic-toolbar h2{font-size:27px}.combined-graphic{padding:0 10px}.combined-graphic svg{max-height:320px}.composer-column .position-strip{display:flex}.composer-column .selected-strip{display:block}.composer-column .graphic-inspector{display:block}.composer-column .graphic-intro{display:none}.graphic-inspector>p{font-size:12px}.selected-strip{padding:12px 18px}.graphic-footer{font-size:10px}.graphic-footer>span{display:block;flex-basis:auto}.graphic-footer>button{font-size:10px}.studio-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.tile-title,.studio-library .tile-title{font-size:22px}.tile-graphic>svg,.studio-library .tile-graphic>svg{height:112px}.library-options{font-size:11px}.force-controls>button{font-size:11px;min-height:34px;padding:8px 12px}.studio-note{align-items:flex-start;gap:10px}.studio-note p{font-size:12px}.studio-note span{font-size:11px}.header-author{display:none}}
@media(max-width:550px){.related-strategy-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.page{padding:17px 16px 24px}header{padding-bottom:15px;gap:17px}.brand-title{font-size:24px}.brand-copy .eyebrow{font-size:8px}.brand-icon{width:35px;height:35px}header nav{gap:24px}nav a{font-size:14px}.studio-intro{padding:22px 0 20px}.studio-intro h1{font-size:34px;max-width:320px}.studio-intro>p{font-size:12px;margin-top:12px}.studio-scales{margin-bottom:19px}.studio-scales>button{grid-template-columns:minmax(0,1fr);justify-items:start;gap:8px;padding:12px 10px;min-height:130px;align-content:start}.studio-scales .scale-icon{width:28px;height:28px;grid-row:auto}.studio-scales strong{font-size:clamp(17px,4.5vw,21px);letter-spacing:-.02em}.studio-scales .scale-count{grid-column:1;font-size:10px;white-space:normal}.studio-scales .scale-count em{display:block;margin:3px 0 0;font-size:10px}.graphic-toolbar{padding:14px 13px 10px;gap:9px}.graphic-toolbar h2{font-size:23px}.graphic-toolbar .eyebrow{font-size:9px;gap:7px}.graphic-controls button>span{display:none}.graphic-controls button,.graphic-controls button:last-child{width:34px;height:34px;min-height:34px;padding:8px}.combined-graphic{padding:0 5px}.combined-graphic svg{max-height:none}.graphic-caption{padding:10px 13px 13px;font-size:10px;gap:12px;align-items:flex-start}.graphic-caption>span{max-width:none;flex:1}.graphic-caption button{font-size:10px;max-width:100px;text-align:right;white-space:normal}.position-strip{padding:8px;gap:3px}.position-strip>button{font-size:10px;padding:5px 6px}.selected-strip{padding:12px 13px}.selected-strip li button{font-size:10px}.graphic-inspector{padding:13px}.graphic-inspector h3{font-size:24px}.graphic-inspector>p{font-size:12px}.inspector-links>a{font-size:11px}.graphic-footer{padding:10px 13px;gap:10px;justify-content:space-between}.graphic-footer>span{display:none}.graphic-footer>button{font-size:10px}.studio-library{margin-top:23px}.studio-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tile-meta,.studio-library .tile-meta{font-size:10px;padding-left:10px;padding-right:8px;min-height:38px}.tile-graphic>svg,.studio-library .tile-graphic>svg{height:100px}.tile-title,.studio-library .tile-title{font-size:21px;min-height:68px;padding-left:10px;padding-right:10px;overflow-wrap:break-word}.strategy-tile>.tags,.studio-library .strategy-tile>.tags{padding-left:10px;padding-right:10px;gap:5px 7px}.strategy-tile .tag{font-size:10px}.tile-bottom,.studio-library .tile-bottom{padding:9px 8px 6px;gap:5px}.tile-bottom>a,.studio-library .tile-bottom>a{font-size:10px}.choose-strategy,.studio-library .choose-strategy{font-size:10px;min-width:63px;min-height:32px;padding:7px;gap:6px}.tile-replaces{font-size:10px;padding-left:9px;padding-right:9px;min-height:37px}.force-controls{gap:5px}.force-controls>button{font-size:10px;padding:8px;min-height:33px}.studio-search input{font-size:12px;min-height:32px}.library-options{gap:10px;font-size:11px}.library-options>button{font-size:11px}.library-options>p{flex-basis:100%}.studio-note{margin-top:26px}.studio-method{font-size:12px}.studio-method summary{font-size:12px}.diagram-dialog{width:calc(100vw - 24px);padding:18px}.diagram-dialog-heading{align-items:flex-start;gap:14px}.diagram-dialog-heading h2{font-size:26px}.diagram-dialog-heading .eyebrow{font-size:9px}.diagram-dialog-heading .button{font-size:11px;gap:9px;padding:8px}.dialog-legend{gap:12px}.dialog-legend>p{flex-basis:100%;margin:0}}
@media(max-width:359px){.page{padding-left:12px;padding-right:12px}.studio-scales>button{padding-left:7px;padding-right:7px}.studio-scales strong{font-size:19px}.studio-grid{gap:8px}.tile-bottom{flex-wrap:wrap}.tile-title,.studio-library .tile-title{font-size:20px}.graphic-toolbar h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}
@media print{html,body,#catalogue-shell,.site-scroll{height:auto!important;overflow:visible!important}header,footer,.studio-scales,.studio-library,.graphic-controls,.graphic-footer,.position-strip,.studio-method,.studio-note{display:none!important}.page{max-width:none;padding:0}.studio-workspace{display:block}.composer-column{position:static}.composer-viewer{border:0}.graphic-toolbar{padding-left:0}.combined-graphic svg{max-height:none}.graphic-caption button,.selected-strip>div>button,.selected-strip li button:last-child,.graphic-intro,.inspector-links{display:none!important}.studio-intro{padding:15px 0}.studio-intro h1{font-size:32px}.selected-strip{break-inside:avoid}}

/* v8: compact strategy cards without shrinking the shared graphic. */
.strategy-tile .tile-meta,.studio-library .tile-meta{padding:7px 10px 0;min-height:28px}
.strategy-tile .tile-graphic{padding:2px 8px 0}
.strategy-tile .tile-graphic>svg,.studio-library .tile-graphic>svg{height:78px}
.strategy-tile .tile-title,.studio-library .tile-title{padding:4px 10px 7px;min-height:0;font-size:21px;line-height:1.1}
.strategy-tile>.tags,.studio-library .strategy-tile>.tags{padding:0 10px 8px;min-height:0;gap:4px 8px}
.strategy-tile .tile-bottom,.studio-library .tile-bottom{padding:6px 9px;min-height:42px}
.strategy-tile .tile-replaces{min-height:0;padding:0 9px 7px;line-height:1.35}
.strategy-tile .tile-replaces:empty{display:none}
.strategy-tile .tile-reading{padding:0 10px 9px}
@media(min-width:1500px){.strategy-tile .tile-graphic>svg,.studio-library .tile-graphic>svg{height:90px}.strategy-tile .tile-title,.studio-library .tile-title{font-size:22px}}
@media(max-width:550px){.strategy-tile .tile-title,.studio-library .tile-title{font-size:20px}.strategy-tile .tile-meta,.studio-library .tile-meta{padding-left:9px;padding-right:7px}.strategy-tile .tile-bottom,.studio-library .tile-bottom{padding:6px 8px}.strategy-tile .tile-graphic>svg,.studio-library .tile-graphic>svg{height:74px}}

/* v10: scale selectors follow the header without an introductory banner. */
#content[data-view="collection"]>.studio-scales{margin-top:20px}

/* v11: precedents begin with their sorting controls. */
#content[data-view="precedents"]>.precedent-controls{margin-top:20px}
/* v14: a quiet centered exit between the catalogue title and author credit. */
.catalogue-footer{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:baseline;gap:12px 20px}
.catalogue-footer .footer-title{grid-column:1;grid-row:1;margin:0}
.catalogue-footer .footer-exit{grid-column:2;grid-row:1;justify-self:center;margin:0;color:#adb2aa}
.catalogue-footer .footer-exit:hover,.catalogue-footer .footer-exit:focus-visible{color:#65715f}
.catalogue-footer .footer-credit{grid-column:3;grid-row:1;justify-self:end;text-align:right;width:auto;margin:0}
.catalogue-footer .footer-portal{grid-column:1 / -1;grid-row:2;justify-self:end;margin:0}
@media(max-width:550px){.catalogue-footer{gap:10px 12px}.catalogue-footer .footer-title,.catalogue-footer .footer-credit,.catalogue-footer .footer-exit{font-size:9px}}

/* v20: soften replacement colors toward a warm neutral. */
.strategy-tile.is-replacement{background:#faf8f4;border-color:#af9d8a}
.strategy-tile.is-replacement:hover{border-color:#8d7c68;background:#faf8f4}
.strategy-tile.is-replacement.is-focused{border-color:#8d7c68;box-shadow:inset 0 3px #af9d8a}
.strategy-tile.is-replacement .tile-bottom{border-top-color:#af9d8a40}
.strategy-tile.is-replacement .tile-replaces,.graphic-inspector .replacement-note{color:#81705d}
.choose-strategy.is-replacement{background:#f5f1e9;border-color:#af9d8a;color:#746450}
.choose-strategy.is-replacement:hover{background:#f1ece2;border-color:#8d7c68}

/* v21: optional combined-scale model in the existing left-hand viewer. */
.catalogue-view-switch{display:flex;gap:5px;margin:0 0 12px;padding:4px;border:1px solid #d9dfd5;background:#f7f9f4;border-radius:6px}
.catalogue-view-switch button{flex:1;background:transparent;border:0;padding:10px 8px;border-radius:4px;color:#71816a;font-size:12px;cursor:pointer}
.catalogue-view-switch button[aria-pressed="true"]{background:#fff;color:#32452e;box-shadow:0 1px 4px #24351c15}
.joint-frame{display:block;width:100%;height:470px;border:0;border-radius:4px;background:#f8faf5}
.joint-expand{display:flex;align-items:center;gap:7px;text-decoration:none;font-size:12px;color:#6f8066}
.joint-focus-note{font-size:11px;color:#7c886f;margin:10px 18px}
.joint-composer .graphic-caption{gap:10px;flex-wrap:wrap}
.joint-composer .graphic-caption button{font-size:10px}
@media(min-width:1400px){.joint-frame{height:530px}}
@media(max-width:700px){.joint-frame{height:440px}.catalogue-view-switch button{font-size:11px}}

/* Named strategy selections are stored locally across all scales. */
.selection-save-actions{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:-3px 0 12px}
.selection-save-actions button{font:inherit;font-size:11px;padding:8px 11px;border:1px solid #ccd6c6;border-radius:4px;background:#fff;color:#52684a;cursor:pointer}
.selection-save-actions button:first-child{background:#edf2e7;border-color:#afbea3;color:#3c5335}
.selection-save-actions button:hover:not(:disabled){background:#e4ecd9;border-color:#829575}
.selection-save-actions button:disabled{opacity:.45;cursor:default}

.saved-selections-dialog{width:min(580px,calc(100vw - 28px));max-height:85vh;overflow:auto;border:1px solid #cbd5c3;border-radius:8px;padding:25px;background:#fff;color:#35472f;box-shadow:0 18px 70px #26351c2e}
.saved-selections-dialog::backdrop{background:#1c291f66}
.selection-dialog-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px}
.selection-dialog-heading h2{font:30px/1.12 Libron,Georgia,serif;margin:0}
.saved-selections-dialog button{font:inherit;font-size:11px;border:1px solid #ccd6c6;border-radius:4px;background:#f8faf5;color:#52684a;padding:8px 11px;cursor:pointer;white-space:nowrap}
.saved-selections-dialog button:hover:not(:disabled){background:#eaf0e2;border-color:#91a381}
.saved-selections-dialog button:disabled{opacity:.45;cursor:default}
.saved-selections-dialog button:focus-visible,.saved-selections-dialog input:focus-visible,.selection-save-actions button:focus-visible{outline:3px solid #8baf91;outline-offset:3px}
.selection-dialog-note{font-size:12px;line-height:1.5;color:#7b8772;margin:17px 0 20px}
#save-selection-form>label{display:block;font-size:11px;font-weight:600;margin-bottom:7px}
#selection-name{width:100%;padding:10px 12px;border:1px solid #cbd6c1;border-radius:4px;background:#fff;font:inherit;font-size:14px;color:#35472f}
.selection-current-count{font-size:11px;color:#7c8b70;margin:17px 0 8px}
.selection-current-list{list-style:none;padding:0;margin:0 0 17px;max-height:220px;overflow:auto;border-top:1px solid #e5eade}
.selection-current-list li{font-size:12px;padding:9px 0;border-bottom:1px solid #e5eade}
.selection-current-list li span{display:inline-block;min-width:82px;color:#8a957e;font-size:10px}
.saved-selections-dialog .selection-save-submit{background:#4a643d;color:#fff;border-color:#4a643d;min-width:130px}
.saved-selections-dialog .selection-save-submit:hover:not(:disabled){background:#3d5730;color:#fff}
.saved-selection-list article{display:flex;align-items:center;gap:18px;justify-content:space-between;padding:16px 0;border-top:1px solid #e2e8dc}
.saved-selection-list article>div{min-width:0}
.saved-selection-list h3{font:21px/1.2 Libron,Georgia,serif;margin:0 0 5px;overflow-wrap:anywhere}
.saved-selection-list p{font-size:10px;line-height:1.5;margin:3px 0;color:#839077}
.saved-selection-list .saved-selection-names{font-size:11px;color:#65785b;overflow-wrap:anywhere}
.selection-empty{font-size:12px;color:#839077;line-height:1.6;padding:12px 0}
.selection-dialog-status{min-height:16px;font-size:11px;color:#5d8253;line-height:1.5;margin:17px 0 0}
.selection-dialog-status.is-error{color:#aa6652}
@media(max-width:550px){.saved-selections-dialog{padding:19px}.selection-dialog-heading h2{font-size:26px}.selection-current-list li span{min-width:70px}}

/* The combined view swaps only the existing graphic. */
.graphic-controls .viewer-swap{padding:7px 10px;border:1px solid var(--rule,#d8dacf);border-radius:5px;background:#f8f9f5;color:var(--ink,#354634);font:inherit;font-size:11px;white-space:nowrap;cursor:pointer}
.graphic-controls .viewer-swap:hover{background:#edf0e5}
.graphic-controls .viewer-swap:focus-visible{outline:2px solid #5f7654;outline-offset:2px}

/* Shared selection actions sit with the combination they save. */
.composer-viewer > .selection-save-actions{margin:0;padding:12px 20px 15px}
.composer-viewer > .graphic-inspector + .selection-save-actions{padding-top:14px}
.saved-selection-actions{display:flex;flex-direction:column;align-items:flex-end;gap:7px;flex-shrink:0}
.saved-selections-dialog [data-studio="delete-selection"]{box-sizing:border-box;display:grid;place-items:center;width:calc(1lh + 18px);height:calc(1lh + 18px);min-width:0;min-height:0;padding:0;background:#fff;color:#945f50;border-color:#ddc8c0}
.saved-selections-dialog [data-studio="delete-selection"]:hover:not(:disabled){background:#fbf1ed;border-color:#be9383}
.saved-selections-dialog .selection-undo,.saved-selections-dialog [data-studio="retry-selections"]{margin-top:10px}
.selection-dialog-note a{color:#52684a;text-underline-offset:3px}
@media(max-width:550px){.composer-viewer > .selection-save-actions{padding:12px 13px}.composer-viewer > .graphic-inspector + .selection-save-actions{padding-top:12px}.saved-selection-list article{align-items:flex-start;flex-direction:row;gap:12px}.saved-selection-actions{flex-direction:column;flex-wrap:nowrap}}

.selection-dialog-feedback{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.selection-dialog-feedback .selection-dialog-status{flex:1;min-width:160px}

/* Guidance belongs with the graphic title; combination actions share one row. */
.graphic-toolbar{grid-template-columns:minmax(0,1fr) minmax(0,38%)}
.graphic-guidance{margin:0;text-align:right;align-self:end;font-size:10px;line-height:1.45;color:#7a8b6c;overflow-wrap:anywhere}
.selection-save-actions .selection-graphic-action{margin-left:auto;padding:6px 0;border:0;border-radius:0;background:none;color:#4d683a;font-size:10px;text-align:right;text-decoration:underline;text-underline-offset:3px}
.selection-save-actions .selection-graphic-action:hover:not(:disabled){background:none;color:#314d24}
@media(max-width:550px){.graphic-toolbar{grid-template-columns:minmax(0,1fr) minmax(0,42%)}.graphic-guidance{font-size:10px}.selection-save-actions .selection-graphic-action{white-space:normal}}

/* Sort key and direction share one control. */
#content[data-view="precedents"] .precedent-sort-control{display:grid;gap:8px;width:250px;max-width:100%;flex:0 1 250px}
#content[data-view="precedents"] .precedent-sort-box{display:flex;align-items:stretch;width:100%;min-height:44px;border:1px solid #b7c3ad;background:#fff}
#content[data-view="precedents"] .precedent-sort-box select{min-width:0;width:0;flex:1 1 auto;min-height:42px;border:0;border-radius:0;margin:0;padding:10px 34px 10px 12px;background-color:transparent}
#content[data-view="precedents"] .sort-direction-button{display:grid;place-items:center;flex:0 0 44px;width:44px;min-width:44px;min-height:42px;margin:0;padding:0;border:0;border-left:1px solid #d5ddcf;border-radius:0;background:#f8faf6;color:#3c5745;cursor:pointer}
#content[data-view="precedents"] .sort-direction-button:hover{background:#eaf0e5}
#content[data-view="precedents"] .sort-direction-button svg{display:block;pointer-events:none}
#content[data-view="precedents"] .sort-direction-button[data-direction="asc"] svg{transform:rotate(180deg)}
#content[data-view="precedents"] .sort-direction-button:focus-visible,#content[data-view="precedents"] .precedent-sort-box select:focus-visible{position:relative;z-index:1;outline:2px solid #5e7b60;outline-offset:-3px}
@media(max-width:620px){#content[data-view="precedents"] .precedent-sort-control{width:250px;max-width:100%;flex:0 1 250px}}

/* Keep the precedent toolbar close to the control's own height. */
#content[data-view="precedents"]>.precedent-controls{margin:0 0 16px;padding:8px 0;gap:8px 28px;align-items:center}
#content[data-view="precedents"] .precedent-controls p{margin:0 0 0 auto}
@media(max-width:620px){#content[data-view="precedents"] .precedent-controls p{margin:0}}

/* Route focus supports navigation without outlining the whole page. */
main#content[tabindex="-1"]:focus{outline:none}