.l1-tabs{display:flex;gap:3px;margin-bottom:12px}.l1-tabs button{flex:1;min-width:0;padding:8px 2px;background:#fff;border:1px solid #b5c6ca;border-radius:6px;font:inherit;font-size:13px;color:#24454c}.l1-tabs button[aria-selected=true]{background:#ddf2f6;border-color:#008aad}.l1-tabs button:focus-visible,.l1-die-card:focus-visible{outline:2px dashed #008aad;outline-offset:2px}.l1-dies-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}.l1-die-card{width:100%;background:white;border:1px solid #c1cdd0;border-radius:7px;padding:6px;font:inherit;cursor:pointer;color:inherit;touch-action:none}.l1-die-card img{width:100%;height:62px;object-fit:contain;pointer-events:none}.l1-die-card span,.l1-die-card small{display:block;font-size:11px}.l1-die-card[aria-pressed=true]{background:#efe4f8;border-color:#8a5ab4}.l1-rotate{display:block;width:100%;border:0;background:transparent;color:#24454c;padding:3px}.l1-compatible .region-hit{stroke:#8a5ab4;stroke-width:3px;stroke-dasharray:7 4}.l1-palette{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;max-height:none!important}.l1-palette button{width:100%;aspect-ratio:1;min-width:0}.l1-color-group{grid-column:1/-1;font-size:11px;color:#536b70;margin-top:7px}.focused-rail:has(.l1-tabs){overflow-y:auto}.has-l1-die>.region-image-clip,.has-l1-die>.region-color,.has-l1-die>.region-mat{visibility:hidden}.l1-die-overlay{pointer-events:auto}.has-added-mat .region-color-marker{display:block}.l1-selection,.l1-focus{pointer-events:none}.photo-region.is-selected:not(.is-over) .region-hit{stroke:transparent}.has-l1-die:focus-visible:not(.is-over) .region-hit{stroke:transparent}#l1-clear-entire{width:100%;margin-top:8px}#l1-selected-material{font-weight:600}.l1-drag-preview{position:fixed;z-index:10000;width:72px;height:72px;pointer-events:none;background:white;border:2px solid #8a5ab4;opacity:.85}.l1-drag-preview img{width:100%;height:100%;object-fit:contain}.page-preview-pattern .l1-selection,.page-preview-pattern .l1-focus,.page-preview-pattern .grid-mark-overlay{display:none}.focused-pattern.has-grid-paper:not(.page-preview-pattern) .pattern-base rect{opacity:.45}

.l1-palette button{touch-action:none}.photo-region:focus-visible .region-hit{stroke:transparent}.page-preview-pattern .l1-compatible .region-hit{stroke:transparent}
.l1-drop-outline{pointer-events:none}.l1-compatible .region-hit{stroke:transparent}.photo-region.is-over .region-hit{stroke-width:4}.page-preview-pattern .l1-drop-outline{display:none}

.l1-mat-intro{font-size:13px;line-height:1.45;margin:0 0 12px;color:#36565f}#l1-fixed-mat-note{font-weight:600}#mat-popover>#remove-mat{margin:10px 0}

#mat-popover .mat-sizes[hidden]{display:none!important}

/* October 12 owner-approved panel layout. Panel content scrolls without stretching the workspace. */
.focused-workspace{min-height:0;align-items:start}
.focused-rail:has(.l1-tabs),.focused-tools{box-sizing:border-box;height:var(--planner-panel-height,732px);min-height:0;max-height:var(--planner-panel-height,732px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c9d9dc transparent}
.focused-rail:has(.l1-tabs){padding:12px 16px 16px;gap:0;display:flex;flex-direction:column;align-self:start}
.l1-tabs{flex:0 0 auto;gap:3px;margin:0 0 12px;border-bottom:1px solid #b5c6ca}
.l1-tabs button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:8px 3px;border-radius:7px 7px 0 0;border-bottom:0;background:#f4f7f8;font-size:13px;cursor:pointer}
.l1-tabs button[aria-selected=true]{background:#e5f6f9;box-shadow:inset 0 3px #008aad}
.l1-photo-count{font-size:11px;min-width:18px;padding:2px 4px;border-radius:12px;background:#fff;color:#247a90;font-weight:700}
#l1-photos-pane,#l1-mat-pane,#l1-dies-pane{flex:0 0 auto;min-width:0}
#l1-photos-pane[hidden],#l1-mat-pane[hidden],#l1-dies-pane[hidden]{display:none!important}
#l1-photos-pane .focused-add{display:flex;margin:0 0 12px;flex-shrink:0}
#l1-photos-pane .focused-photo-grid{overflow:visible;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-height:none;min-height:0;padding:0;gap:10px;margin-bottom:12px}
#l1-photos-pane .focused-rail-help{display:block;margin-top:0}
#l1-mat-pane .focused-color-source{padding:0;margin:0;border:0}
.l1-mat-intro{margin:0 0 10px;line-height:1.4}
#color-source-trigger{margin:0 0 12px}
#color-source-popover{position:static;inset:auto;width:100%;margin:0 0 12px;max-height:none;overflow:visible;box-sizing:border-box}
.l1-palette{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;padding:3px}
.l1-palette button{width:30px;height:30px;aspect-ratio:auto;justify-self:center;border-radius:50%}
.l1-die-filters{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:6px}
.l1-fit-control{font-size:11px;line-height:1.25;display:flex;align-items:center;gap:4px;cursor:pointer}
.l1-fit-control input{margin:0;flex:0 0 auto}
.l1-die-filters .planner-select-trigger{font-size:12px;padding:5px 6px;min-height:34px;gap:4px}
.l1-dies-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin-top:10px}
.l1-tile{position:relative;min-width:0}
.l1-tile[hidden]{display:none!important}
.l1-die-card{height:124px;padding:18px 3px 4px;display:grid;grid-template-rows:55px 1fr;gap:3px;align-items:center}
.l1-die-card .l1-die-art{display:grid;place-items:center;width:100%;height:55px;min-width:0;overflow:hidden}
.l1-die-card .l1-die-art img{width:50px;height:50px;max-width:100%;object-fit:contain;display:block}
.l1-die-card .l1-die-caption{align-self:center;min-width:0;line-height:1.13}
.l1-die-card span,.l1-die-card small{font-size:10px;overflow-wrap:anywhere}
.l1-die-card .l1-die-caption>span:first-child{font-weight:700}
.l1-rotate{position:absolute;top:1px;right:1px;width:24px;height:24px;padding:0;display:grid;place-items:center;font-size:19px;border-radius:4px;background:#ffffffd9;cursor:pointer}
.l1-rotate:focus-visible{outline:2px solid #008aad;outline-offset:-2px}
.l1-die-results{font-size:11px;color:#536b70;margin:8px 0}
#mat-trigger{grid-template-columns:1fr auto;font-weight:600}
#mat-popover,.focused-tools .spot-color-popover{position:static;inset:auto;transform:none;width:100%;box-sizing:border-box;margin-top:8px;max-height:none}
#mat-popover .mat-sizes{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
#mat-popover .mat-sizes button{min-height:48px;font-size:23px;font-weight:700;padding:9px 3px;border-width:2px}
#mat-popover .mat-sizes button[hidden]{display:none!important}
#mat-popover .mat-sizes:has(button[data-mat-size="0.25"][hidden]){grid-template-columns:1fr}
#mat-popover #remove-mat{font-size:13px;font-weight:600;min-height:38px}
.photo-region .region-color-marker{pointer-events:none}
.photo-region.has-added-mat .region-color-marker{pointer-events:all;cursor:pointer}
.photo-region .region-color-marker:focus-visible>rect{stroke:#008aad;stroke-width:4}
@media(min-width:721px){
 .focused-workspace{display:grid;grid-template-columns:clamp(180px,21.1vw,270px) minmax(0,1fr) clamp(185px,19.5vw,250px)}
 .focused-rail{grid-column:1;grid-row:1}
 .focused-stage{grid-column:2;grid-row:1}
 .focused-tools{grid-column:3;grid-row:1;border-top:0;border-left:1px solid #dadada}
}
@media(max-width:1100px) and (min-width:721px){
 .focused-rail:has(.l1-tabs){padding-inline:10px}
 .focused-tools{padding-inline:10px}
 .l1-tabs button{font-size:12px;gap:3px}
 .l1-palette{gap:5px}
 .l1-palette button{width:24px;height:24px}
 .l1-die-card .l1-die-art img{width:42px;height:42px}
 .l1-die-card{height:124px}
}
@media(max-width:720px){
 .focused-workspace{display:flex;flex-direction:column}
 .focused-rail:has(.l1-tabs),.focused-tools{display:block;width:100%;height:var(--planner-panel-height,300px);max-height:var(--planner-panel-height,300px);flex:0 0 auto}
 .focused-rail:has(.l1-tabs){order:1}
 .focused-stage{order:2;align-self:stretch}
 .focused-tools{order:3}
 .l1-palette{grid-template-columns:repeat(8,minmax(0,1fr))}
 #l1-photos-pane .focused-photo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .focused-photo-card{width:100%}
 .l1-die-card{height:132px;grid-template-rows:65px 1fr}
 .l1-die-card .l1-die-art{height:65px}
 .l1-die-card .l1-die-art img{width:60px;height:60px}
}

#l1-mat-pane .paper-control-label[hidden]{display:none!important}

/* October 13 approved source guidance, bounded controls and toolbar grouping. */
.l1-source-instruction{flex:0 0 auto;margin:0 0 10px;padding:6px 3px;border-radius:4px;background:#e5f6f9;color:#164b5a;font-size:12px;font-weight:700;line-height:1.4;text-align:center;white-space:nowrap}
.l1-selected-color{flex:0 0 auto;font-size:12px;font-weight:600;color:#36565f;margin:0 0 8px}
.focused-tools{display:flex!important;flex-direction:column;overflow:hidden;padding-top:12px}
.planner-edit-actions{display:flex;gap:6px;flex:0 0 auto;padding-bottom:12px;border-bottom:1px solid #dadada;margin-bottom:12px}
.planner-edit-actions button{flex:1;min-width:0;border:1px solid #b5c6ca;border-radius:5px;padding:8px 3px;background:white;color:#24454c;font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.planner-edit-actions button:disabled{opacity:.45;cursor:default}
.planner-edit-actions button:focus-visible{outline:2px solid #008aad;outline-offset:2px}
.planner-tools-body{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;padding-right:6px}
.focused-tools .spot-color-control{min-width:0;max-width:100%;box-sizing:border-box}
.focused-tools #spot-color-popover{position:static;inset:auto;transform:none;width:100%;max-width:100%;box-sizing:border-box;padding:10px 8px;overflow:visible}
.focused-tools #spot-color-swatches{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
.focused-tools #spot-color-swatches button{min-width:0;width:100%;max-width:100%}
.focused-tools #spot-color-popover .paper-custom-control,.focused-tools #spot-color-popover .paper-hex-control{min-width:0}
.focused-tools #spot-color-hex{min-width:0;width:100%;box-sizing:border-box}
.focused-command-actions{gap:7px}
.focused-command-actions .page-editor-controls{margin-left:12px;margin-right:12px}
.focused-pattern{transition:none}
.focused-command-actions{transform:translateX(var(--toolbar-center-offset,0px))}
@media(max-width:1100px) and (min-width:721px){.l1-source-instruction{font-size:10px;padding-inline:1px}.planner-edit-actions button{font-size:12px}}
