body[data-size-page],
body[data-size-page].framed-page>.page { --paper:#eeece6; --sheet:var(--paper); background:var(--paper); }
[data-size-page] .compact-masthead,
[data-size-page] .compact-breadcrumb { background:var(--paper); }
[data-size-page] #mobile-menu { --paper:#eeece6; background:var(--paper); }
[data-product-reference] .compact-product-actions { grid-template-columns:1fr; }
.compact-product-actions .choose-size { display:flex; justify-content:space-between; gap:24px; width:100%; text-transform:none; }
[data-size-page] .compact-designer { margin-top:24px; border-top:0; }
[data-size-page] .size-page-back { margin:0 0 20px; font-size:13px; }
[data-size-page] .size-page-back a { display:inline-flex; align-items:center; min-height:44px; color:inherit; text-decoration:none; }
[data-size-page] .compact-designer-heading { margin-bottom:20px; }
.size-drawing-stage { display:contents; }
/* The desktop workspace occupies the first screen; the footer follows in normal flow. */
@media screen and (min-width:761px) {
 body[data-size-page] { padding-top:72px; }
 body[data-size-page].framed-page>.page { padding:0 24px 32px; }
 [data-size-page] .compact-masthead { height:72px; min-height:72px; padding:8px max(24px,calc((100vw - 1320px)/2)); }
 [data-size-page] #main-content { display:flex; flex-direction:column; max-width:1320px; min-height:calc(100svh - 72px); margin:0 auto; }
 [data-size-page] .compact-breadcrumb { display:none; }
 [data-size-page] #custom-size { display:flex; flex:1; flex-direction:column; width:100%; max-width:none; margin:0; padding:8px 0 16px; border:0; }
 [data-size-page] .size-page-back { margin:0 0 4px; font-size:12px; line-height:1.4; }
 [data-size-page] .size-page-back a { min-height:28px; }
 [data-size-page] .compact-designer-heading,
 [data-size-page] .compact-designer-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(340px,.85fr); column-gap:clamp(24px,3vw,44px); }
 [data-size-page] .compact-designer-heading { align-items:end; margin:0 0 12px; }
 [data-size-page] .compact-designer-heading h2 { font-size:clamp(20px,1.8vw,26px); line-height:1.2; }
 [data-size-page] .compact-kicker { margin:0 0 3px; font-size:11px; line-height:1.4; }
 [data-size-page] .compact-designer-heading>p { max-width:44ch; margin:0; font-size:12px; line-height:1.4; }
 [data-size-page] .compact-designer-grid { flex:1; align-items:stretch; min-height:0; }
 [data-size-page] .drawing-section { display:flex; flex-direction:column; align-self:stretch; min-height:0; }
 [data-size-page] .drawing-sheet { flex:1; min-height:0; }
 [data-size-page] .drawing-meta,
 [data-size-page] .drawing-caption { flex:none; padding:8px 12px; font-size:10px; line-height:1.4; }
 [data-size-page] .drawing-caption>span { max-width:none; }
 [data-size-page] .drawing-caption>span:last-child { text-align:right; }
 [data-size-page] .size-drawing-stage { display:grid; flex:1; min-height:0; place-items:center; container-type:size; }
 /* Keep the SVG and its percentage-positioned annotations on the same 800:540 canvas. */
 [data-size-page] .drawing-canvas { width:min(100%,calc((100svh - 330px)*800/540)); max-width:100%; aspect-ratio:800/540; margin:0; }
 @supports (width:1cqh) {
  [data-size-page] .drawing-canvas { width:min(100cqw,calc(100cqh*800/540)); }
 }
 [data-size-page] .dimension-tag { font-size:11px; }
 [data-size-page] .dimensions-strip { flex:none; min-height:40px; padding:8px 0; font-size:14px; line-height:1.4; }
 [data-size-page] .dimensions-strip small { font-size:11px; }
 [data-size-page] .compact-designer-controls { display:flex; flex-direction:column; min-width:0; }
 [data-size-page] .compact-custom-size { display:flex; align-items:center; min-height:28px; margin:0; font-size:12px; line-height:1.4; }
 [data-size-page] .dimension-control { display:grid; grid-template-columns:80px minmax(0,1fr) 88px; align-items:center; column-gap:10px; min-height:53px; padding:2px 0; }
 [data-size-page] .control-heading { display:contents; }
 [data-size-page] .control-heading>label { grid-column:1; grid-row:1; gap:0; min-height:36px; font-size:13px; }
 [data-size-page] .axis-letter { display:none; }
 [data-size-page] .number-field { grid-column:3; grid-row:1; min-width:0; gap:4px; align-items:center; }
 [data-size-page] .number-field input { width:66px; min-width:0; min-height:36px; padding:2px 0; font-size:18px; letter-spacing:-.025em; }
 [data-size-page] .number-field>span { font-size:11px; }
 [data-size-page] .dimension-range { grid-column:2; grid-row:1; width:100%; min-width:0; height:36px; margin:0; }
 [data-size-page] .range-limits { grid-column:2; grid-row:2; font-size:10px; line-height:1.2; }
 [data-size-page] .fixed-dimension { grid-column:2; grid-row:1; margin:0; font-size:11px; line-height:1.3; }
 [data-size-page] .dimension-control:has(.dimension-range) .fixed-dimension { grid-column:2/-1; grid-row:2; font-size:10px; }
 [data-size-page] .dimension-control:has(.dimension-range):has(.fixed-dimension) .range-limits { display:none; }
 [data-size-page] .dimension-control:has(.dimension-choices) .number-field { display:none; }
 [data-size-page] .dimension-choices { grid-column:2/-1; grid-row:1; margin:0; gap:8px; }
 [data-size-page] .dimension-choice { min-height:36px; padding:4px 8px; font-size:13px; }
 [data-size-page] .control-footer { min-height:32px; padding:0; }
 [data-size-page] .control-footer>span { font-size:10px; }
 [data-size-page] .reset-button { min-height:32px; padding:4px 0 4px 8px; font-size:12px; }
 [data-size-page] .compact-custom-finish { display:grid; grid-template-columns:50px minmax(0,1fr) auto; align-items:center; gap:10px; margin:0; padding:8px 0; }
 [data-size-page] .compact-custom-finish h3 { margin:0; font-size:13px; }
 [data-size-page] .compact-custom-finish .finish-fields { min-width:0; }
 [data-size-page] .compact-custom-finish select { width:100%; min-height:36px; padding:6px 22px 6px 0; font-size:13px; }
 [data-size-page] .compact-custom-finish .finish-select::after { top:15px; right:4px; }
 [data-size-page] .finish-picker-trigger { min-height:36px; padding:4px 0; gap:8px; font-size:13px; }
 [data-size-page] .compact-custom-finish .text-link { min-height:36px; max-width:66px; margin:0; font-size:11px; line-height:1.4; }
 [data-size-page] .compact-custom-purchase { gap:12px; margin-top:auto; padding-top:8px; }
 [data-size-page] .compact-custom-purchase>div>span { font-size:11px; line-height:1.4; }
 [data-size-page] .compact-custom-purchase output { font-size:23px; line-height:1.25; }
 [data-size-page] .compact-custom-purchase button { min-height:44px; padding:8px 18px; font-size:14px; }
 [data-size-page] .compact-custom-note { margin:4px 0 0; font-size:11px; line-height:1.4; }
 [data-size-page] .compact-designer-controls>.text-link { min-height:28px; margin:0; font-size:12px; line-height:1.4; }
 [data-size-page] .site-footer { max-width:1320px; margin:0 auto; }
}
.centre-split-control { margin-top:12px; padding-top:12px; border-top:1px solid var(--ink); }
.centre-split-control>p:first-child { margin:0 0 8px; font-size:14px; }
.centre-split-control .dimension-choices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
[data-size-page] .centre-split-control .dimension-choice { min-height:44px; }
.centre-split-note { margin:8px 0 0; font-size:12px; line-height:1.5; }
@media(max-width:760px){
 [data-size-page] #custom-size { margin-top:0; }
 [data-size-page] #custom-size .compact-kicker { display:block; margin:0 0 4px; }
 [data-size-page] #custom-size .compact-designer-heading h2 { font-size:20px; line-height:1.3; }
 [data-size-page] #custom-size .size-page-back { margin:0 0 12px; padding-right:76px; }
 [data-size-page] #custom-size .reset-button { top:8px; }
}

/* Keep the drawing and each decision in its own readable, lightly framed panel. */
[data-size-page] #custom-size .drawing-section,
[data-size-page] .size-dimensions-panel,
[data-size-page] #custom-size .compact-custom-finish,
[data-size-page] .size-purchase-panel { border:1px solid var(--line); }
[data-size-page] #custom-size .dimensions-strip { padding:10px 12px; border-top:1px solid var(--fine-line); border-bottom:0; }
[data-size-page] .compact-designer-controls { display:flex; flex-direction:column; gap:12px; }
[data-size-page] .size-dimensions-panel,
[data-size-page] .size-purchase-panel { min-width:0; padding:12px 16px; }
[data-size-page] #custom-size .compact-custom-finish { margin:0; padding:12px 16px; }
[data-size-page] .size-purchase-panel { margin-top:auto; }
[data-size-page] #custom-size .compact-custom-purchase { margin:0; padding:0; border:0; }
[data-size-page] .size-purchase-panel>.text-link { display:inline-flex; align-items:center; min-height:32px; margin:0; font-size:12px; line-height:1.4; }
[data-size-page] .site-footer { margin-top:80px; }
@media(max-width:760px){
 [data-size-page] #custom-size .compact-designer-grid { gap:16px; }
 [data-size-page] .site-footer { margin-top:48px; }
}
