/* Theme Settings only. The approved picker and all other pages keep their baseline. */
.customize-settings.settings-workspace{height:calc(100dvh - 150px);min-height:360px;overflow:hidden;background:transparent;}
.customize-settings.settings-workspace .app,.customize-settings.settings-workspace .main,.customize-settings.settings-workspace .content{height:100%;min-height:0;padding:0;overflow:visible;}
.customize-settings.settings-workspace .layout{display:grid;grid-template-columns:320px minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:16px;height:100%;margin:0;overflow:hidden;}
.customize-settings.settings-workspace [hidden]{display:none!important;}
.customize-settings.settings-workspace .settings-dock{grid-column:1;grid-row:1;display:flex;flex-direction:column;min-height:0;border:1px solid var(--line);border-radius:8px;background:var(--surface);padding:12px;overflow:hidden;}
.customize-settings.settings-workspace .settings-dock>label{font-size:12px;font-weight:600;margin-bottom:5px;}
.customize-settings.settings-workspace #settings-category{width:100%;padding:5px 8px;margin-bottom:10px;border:1px solid var(--line);border-radius:5px;background:var(--field);color:var(--text);font-size:13px;text-align:center;text-align-last:center;}
.customize-settings.settings-workspace .settings-control-scroll{flex:1;min-height:0;overflow:auto;padding-right:6px;}
.customize-settings.settings-workspace .settings-category-panel{display:block;}
.customize-settings.settings-workspace .preview-tools .settings-edit-mode{display:flex;align-items:center;gap:5px;flex:0 0 100%;white-space:nowrap;}
.customize-settings.settings-workspace .settings-edit-mode input{width:16px;height:16px;min-height:16px;min-width:16px;flex:none;margin:0;}
.customize-settings.settings-workspace [data-settings-selected]{outline:2px solid var(--focus);outline-offset:-2px;}
.customize-settings.settings-workspace .settings-category-panel>h2{font-size:15px;margin:0 0 12px;}
.customize-settings.settings-workspace :is(.theme-view,.advanced-grid,.background-options){display:block;}
.customize-settings.settings-workspace :is(.advanced-group,.background-view){padding:0;border:0;background:transparent;height:auto;}
.customize-settings.settings-workspace :is(.advanced-control,.layout-control,.background-choice,.density){display:grid;grid-template-columns:1fr;gap:5px;padding:9px 0;}
.customize-settings.settings-workspace :is(.advanced-control,.layout-control,.background-choice,.density) :is(input:not([type=checkbox]),select){width:100%;max-width:100%;min-width:0;}
.customize-settings.settings-workspace .advanced-control input[type=checkbox]{justify-self:start;}
.customize-settings.settings-workspace .control{grid-template-columns:minmax(0,1fr) 44px;}
.customize-settings.settings-workspace .scheme-grid{display:grid;grid-template-columns:1fr 1fr;}
.customize-settings.settings-workspace .collapsible-heading{font-size:13px;}
.customize-settings.settings-workspace .settings-dock-footer{flex-shrink:0;border-top:1px solid var(--line);margin-top:8px;}
.customize-settings.settings-workspace .settings-dock-footer .actions{width:100%;min-width:0;display:flex;flex-wrap:wrap;gap:5px;margin:8px 0;}
.customize-settings.settings-workspace .settings-dock-footer .btn{font-size:11px;padding:6px;}
.customize-settings.settings-workspace .settings-dock-footer .status{margin:4px 0;font-size:11px;}
.customize-settings.settings-workspace .dirty-bar{display:block;padding:6px;font-size:10px;}
.customize-settings.settings-workspace .preview-panel{grid-column:2;grid-row:1;display:flex;flex-direction:column;min-height:0;min-width:0;padding:0;overflow:hidden;}
.customize-settings.settings-workspace .preview-head{padding:12px;font-size:14px;flex-shrink:0;}
.customize-settings.settings-workspace .settings-feedback{display:block;font-size:11px;font-weight:400;margin-top:4px;}
.customize-settings.settings-workspace .preview-tools{display:flex;flex-wrap:wrap;gap:8px;padding:10px;font-size:11px;flex-shrink:0;}
.customize-settings.settings-workspace .preview-stage{position:relative;isolation:isolate;flex:1;min-height:0;overflow:auto;padding:12px;background:var(--page);}
.customize-settings.settings-workspace .preview-stage::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-color:var(--canvas-base);background-image:linear-gradient(var(--canvas-overlay),var(--canvas-overlay)),var(--canvas-image);background-size:cover,var(--canvas-size);background-position:center,var(--canvas-position);background-repeat:no-repeat,var(--canvas-repeat);opacity:var(--canvas-opacity);filter:blur(var(--canvas-blur));}
.customize-settings.settings-workspace .settings-preview-frame{display:grid;grid-template-columns:minmax(60px,calc(var(--sidebar-width) * .45)) minmax(0,1fr);grid-template-rows:var(--header-height) auto;width:100%;max-width:var(--content-max);margin:auto;border:1px solid var(--line);}
.customize-settings.settings-workspace .settings-preview-header{grid-column:1/-1;display:flex;align-items:center;padding:12px;background:var(--header);color:var(--text);border-bottom:1px solid var(--line);font-size:12px;}
.customize-settings.settings-workspace .settings-preview-nav{padding:10px;background:var(--sidebar);color:var(--on-sidebar);display:flex;flex-direction:column;gap:8px;overflow:hidden;font-size:11px;}
.customize-settings.settings-workspace .settings-preview-nav button{background:transparent;color:inherit;border:0;border-radius:var(--button-radius);padding:8px;font:inherit;text-align:left;}
.customize-settings.settings-workspace .settings-preview-nav .active{background:var(--active);color:var(--text);}
.customize-settings.settings-workspace[data-nav-style=outline] .settings-preview-nav .active{background:transparent;border:1px solid currentColor;color:inherit;}
.customize-settings.settings-workspace[data-nav-style=indicator] .settings-preview-nav .active{border-left:3px solid var(--primary);}
.customize-settings.settings-workspace[data-nav-style=underline] .settings-preview-nav .active{border-bottom:2px solid var(--primary);}
.customize-settings.settings-workspace[data-sidebar-collapsed=true] .settings-preview-frame{grid-template-columns:60px minmax(0,1fr);}
.customize-settings.settings-workspace .preview-body{min-width:0;padding:calc(12px * var(--density-space));background:color-mix(in srgb,var(--surface) calc(var(--panel-opacity) * 100%),transparent);}
.customize-settings.settings-workspace .preview-body .stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;}
.customize-settings.settings-workspace .preview-body .stat{padding:8px;overflow-wrap:anywhere;}
.customize-settings.settings-workspace .preview-body table{table-layout:fixed;width:100%;}
.customize-settings.settings-workspace .preview-body :is(td,th){overflow-wrap:anywhere;}
.customize-settings.settings-workspace :is(.modal-layer,.drawer-layer){position:absolute;inset:0;z-index:5;}
.customize-settings.settings-workspace .modal-card{max-width:calc(100% - 24px);max-height:100%;overflow:auto;}
.customize-settings.settings-workspace .drawer-card{max-width:calc(100% - 24px);overflow:auto;}
.customize-settings.settings-workspace :is(.modal-card,.drawer-card) p{font-size:calc(14px * var(--type-scale,1));line-height:1.5;}
.customize-settings.settings-workspace .drawer-card{max-width:90%;}
@media(max-width:1000px){.customize-settings.settings-workspace .layout{grid-template-columns:260px minmax(0,1fr);gap:10px;}.customize-settings.settings-workspace .preview-body .stats{grid-template-columns:1fr;}}
@media(max-width:760px){.customize-settings.settings-workspace{height:calc(100dvh - 145px);min-height:480px;}.customize-settings.settings-workspace .layout{grid-template-columns:1fr;grid-template-rows:minmax(210px,1fr) minmax(220px,1fr);}.customize-settings.settings-workspace .preview-panel{grid-column:1;grid-row:1;}.customize-settings.settings-workspace .settings-dock{grid-column:1;grid-row:2;}.customize-settings.settings-workspace .preview-tools{padding:5px;}.customize-settings.settings-workspace .preview-body .stats{grid-template-columns:repeat(3,minmax(0,1fr));}}

.customize-settings.settings-workspace .settings-dock{font:12px "Segoe UI",sans-serif;}
.customize-settings.settings-workspace .settings-dock :is(label,p,small,h3,.section-help){font-size:12px;line-height:1.4;}
.customize-settings.settings-workspace .settings-dock :is(input,select,button){font-size:12px;line-height:1.3;}
.customize-settings.settings-workspace .settings-dock :is(input:not([type=checkbox]):not([type=range]),select){min-height:30px;height:32px;padding:5px;}
.customize-settings.settings-workspace .settings-category-panel>h2{font-size:14px;}
.customize-settings.settings-workspace .preview-tools :is(select,button){font:11px "Segoe UI",sans-serif;min-height:26px;height:28px;padding:3px;max-width:100%;}
.customize-settings.settings-workspace .preview-tools label{font:11px "Segoe UI",sans-serif;flex:1;min-width:65px;}
.customize-settings.settings-workspace .preview-tools{gap:5px;padding:6px;}
.customize-settings.settings-workspace .preview-body .field-demo :is(input,select){height:var(--field-height);min-height:var(--field-height);padding:6px;font-size:13px;}
.customize-settings.settings-workspace .preview-body .toolbar{margin:8px 0;}
.customize-settings.settings-workspace .preview-body h2{font-size:16px;}
.customize-settings.settings-workspace .settings-dock .advanced-group>h3{font-size:12px;}

.customize-settings.settings-workspace .preview-stage{padding:calc(var(--page-spacing) * .4);}
.customize-settings.settings-workspace[data-vignette=true] .preview-stage{box-shadow:inset 0 0 100px #0005;}

/* Preview starts with the actual three-pane shell; styling stays inside this sample. */
.customize-settings.settings-workspace .settings-preview-frame{grid-template-columns:30px minmax(72px,calc(var(--sidebar-width) * .45)) minmax(0,1fr);grid-template-rows:var(--header-height) minmax(0,1fr);}
.customize-settings.settings-workspace .settings-preview-rail{grid-column:1;grid-row:1/3;background:var(--sidebar);border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;padding:5px 2px;gap:5px;}
.customize-settings.settings-workspace .settings-preview-rail button{width:25px;height:28px;background:transparent;border:0;color:var(--on-sidebar,var(--text));padding:4px;border-radius:5px;}
.customize-settings.settings-workspace .settings-preview-rail svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;}
.customize-settings.settings-workspace .settings-preview-rail .active{background:var(--active);}
.customize-settings.settings-workspace .settings-preview-header{grid-column:3;grid-row:1;}
.customize-settings.settings-workspace .settings-preview-nav{grid-column:2;grid-row:1/3;border-right:1px solid var(--line);}
.customize-settings.settings-workspace .preview-body{grid-column:3;grid-row:2;background:var(--page);}
.customize-settings.settings-workspace[data-sidebar-collapsed=true] .settings-preview-frame{grid-template-columns:30px 40px minmax(0,1fr);}
.customize-settings.settings-workspace .current-ui-cards{display:grid;gap:8px;}
.customize-settings.settings-workspace .current-ui-cards article{padding:12px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--panel-shadow);font-size:calc(12px * var(--type-scale,1));}
.customize-settings.settings-workspace .current-ui-cards p{color:var(--muted);font-size:calc(11px * var(--type-scale,1));line-height:1.4;}
.customize-settings.settings-workspace .current-ui-module h3{font-size:calc(14px * var(--type-scale,1));}
.customize-settings.settings-workspace .settings-dock>button{margin-bottom:8px;font-size:12px;}

.customize-settings.settings-workspace .settings-preview-nav{color:var(--on-sidebar,var(--text));}

/* Full-page layout is scaled, never compressed into narrow preview columns. */
.customize-settings.settings-workspace .preview-stage{max-width:none;width:100%;}
.customize-settings.settings-workspace .settings-zoom-canvas{position:relative;flex-shrink:0;margin:0 auto;}
.customize-settings.settings-workspace .settings-zoom-canvas .settings-preview-frame{position:absolute;top:0;left:0;max-width:none;transform-origin:top left;grid-template-columns:60px var(--sidebar-width) minmax(0,1fr);min-height:600px;}
.customize-settings.settings-workspace .settings-preview-frame .settings-preview-rail{padding:12px 8px;gap:8px;}
.customize-settings.settings-workspace .settings-preview-frame .settings-preview-rail button{width:40px;height:40px;padding:10px;}
.customize-settings.settings-workspace .settings-preview-frame .settings-preview-rail svg{width:20px;height:20px;}
.customize-settings.settings-workspace .settings-preview-frame .settings-preview-nav{font-size:calc(14px * var(--type-scale,1));padding:16px;}
.customize-settings.settings-workspace .settings-preview-frame .settings-preview-nav button{padding:10px;}
.customize-settings.settings-workspace .settings-preview-frame .settings-preview-header{font-size:calc(14px * var(--type-scale,1));padding:16px;}
.customize-settings.settings-workspace .settings-preview-frame .preview-body{padding:var(--page-spacing);}
.customize-settings.settings-workspace .settings-preview-frame .current-ui-cards{grid-template-columns:repeat(var(--preview-card-columns,3),minmax(0,1fr));gap:12px;}
.customize-settings.settings-workspace .settings-preview-frame .current-ui-module{margin-bottom:20px;}
.customize-settings.settings-workspace .settings-preview-frame .current-ui-module h3{font-size:calc(18px * var(--type-scale,1));margin:0 0 12px;}
.customize-settings.settings-workspace .settings-preview-frame .current-ui-cards article{font-size:calc(14px * var(--type-scale,1));padding:calc(var(--panel-pad,20px) * .8);}
.customize-settings.settings-workspace .settings-preview-frame .preview-body>h2{font-size:calc(24px * var(--type-scale,1));margin:0 0 20px;}
.customize-settings.settings-workspace[data-sidebar-collapsed=true] .settings-zoom-canvas .settings-preview-frame{grid-template-columns:60px 60px minmax(0,1fr);}

.customize-settings.settings-workspace .settings-zoom-canvas .settings-preview-frame{height:720px;min-height:720px;}
.customize-settings.settings-workspace .settings-preview-frame .preview-body{min-height:0;overflow:auto;}

/* Owner-requested edge-to-edge Theme Settings; no other page is affected. */
.theme-app > .workspace:has(.settings-workspace){padding:0;overflow:hidden;}
.theme-app > .workspace:has(.settings-workspace) > .workspace-content{display:flex;flex-direction:column;height:100%;min-height:0;width:100%;max-width:none;margin:0;}
.theme-app > .workspace:has(.settings-workspace) > .workspace-content > .page-header{flex:none;padding:14px 18px;margin:0;border-bottom:1px solid var(--line);}
.customize-settings.settings-workspace{flex:1;height:auto;min-height:0;width:100%;}
.customize-settings.settings-workspace .layout{gap:0;}
.customize-settings.settings-workspace .settings-dock{border:0;border-right:1px solid var(--line);border-radius:0;padding:14px;box-shadow:none;}
.customize-settings.settings-workspace .preview-panel{height:100%;margin:0;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;}
@media(max-width:760px){.customize-settings.settings-workspace .layout{grid-template-rows:minmax(0,1fr) minmax(0,1fr);}.customize-settings.settings-workspace .settings-dock{border-right:0;border-top:1px solid var(--line);}}

/* Preserve bottom rail placement in the full-page preview. */
.customize-settings.settings-workspace .settings-preview-rail .settings-preview-rail-bottom{margin-top:auto;}

/* Prevent imported large-demo typography from overflowing the compact control dock. */
/* Mirror the host's existing panel orientation and mobile breakpoint in the preview. */
.theme-app .customize-settings.settings-workspace .settings-zoom-canvas .settings-preview-frame{grid-template-areas:"rail navigation header" "rail navigation content";}
.customize-settings.settings-workspace .settings-preview-frame .settings-preview-rail{grid-area:rail;}
.customize-settings.settings-workspace .settings-preview-frame .settings-preview-nav{grid-area:navigation;min-width:0;overflow:auto;}
.customize-settings.settings-workspace .settings-preview-frame .settings-preview-header{grid-area:header;}
.customize-settings.settings-workspace .settings-preview-frame .preview-body{grid-area:content;}
.theme-app .customize-settings.settings-workspace .settings-zoom-canvas .settings-preview-frame[data-rail-top=true]{grid-template-columns:var(--user-module-width,var(--sidebar-width)) minmax(0,1fr);grid-template-rows:52px var(--header-height) minmax(0,1fr);grid-template-areas:"rail rail" "navigation header" "navigation content";}
.theme-app .customize-settings.settings-workspace .settings-zoom-canvas .settings-preview-frame[data-navigation-top=true]{grid-template-columns:var(--user-rail-width,60px) minmax(0,1fr);grid-template-rows:60px var(--header-height) minmax(0,1fr);grid-template-areas:"rail navigation" "rail header" "rail content";}
.theme-app .customize-settings.settings-workspace .settings-zoom-canvas .settings-preview-frame[data-rail-top=true][data-navigation-top=true]{grid-template-columns:minmax(0,1fr);grid-template-rows:52px 60px var(--header-height) minmax(0,1fr);grid-template-areas:"rail" "navigation" "header" "content";}
.customize-settings.settings-workspace .settings-preview-frame[data-rail-top=true] .settings-preview-rail{flex-direction:row;padding:4px 8px;gap:2px;min-width:0;border-right:0;border-bottom:1px solid var(--line);}
.customize-settings.settings-workspace .settings-preview-frame[data-rail-top=true] .settings-preview-rail button{width:clamp(24px,calc((100% - 40px)/11),44px);height:44px;flex:none;padding:6px;}
.customize-settings.settings-workspace .settings-preview-frame[data-rail-top=true] .settings-preview-rail .settings-preview-rail-bottom{margin-top:0;margin-left:auto;}
.customize-settings.settings-workspace .settings-preview-frame[data-navigation-top=true] .settings-preview-nav{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:6px;padding:8px;border-right:0;border-bottom:1px solid var(--line);}
.customize-settings.settings-workspace .settings-preview-frame[data-navigation-top=true] .settings-preview-nav strong{display:none;}
.customize-settings.settings-workspace .settings-preview-frame[data-navigation-top=true] .settings-preview-nav button{white-space:nowrap;flex:none;width:auto;}
.theme-app .customize-settings.settings-workspace .settings-zoom-canvas .settings-preview-frame[data-mobile=true]:not([data-navigation-top=true]){grid-template-columns:56px minmax(0,1fr);grid-template-areas:"rail header" "rail content";}
.theme-app .customize-settings.settings-workspace .settings-zoom-canvas .settings-preview-frame[data-mobile=true][data-rail-top=true]:not([data-navigation-top=true]){grid-template-columns:minmax(0,1fr);grid-template-rows:52px var(--header-height) minmax(0,1fr);grid-template-areas:"rail" "header" "content";}
.customize-settings.settings-workspace .settings-preview-frame[data-mobile=true]:not([data-navigation-top=true]) .settings-preview-nav{display:none;}
.customize-settings.settings-workspace .settings-dock :is(.section-help,.scheme small,.advanced-control select,.advanced-control input,.advanced-group>p){font-size:12px!important;}
.customize-settings.settings-workspace .settings-dock .scheme-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.customize-settings.settings-workspace .settings-dock .scheme{min-width:0;overflow-wrap:anywhere;}
.customize-settings.settings-workspace .settings-dock .scheme strong{font-size:12px;}
.customize-settings.settings-workspace .settings-dock .scheme-colors{flex-wrap:wrap;}
/* Keep current-page preview tied to frame settings. */
.customize-settings.settings-workspace .settings-preview-frame .preview-body > *{max-width:var(--content-max);margin-left:auto;margin-right:auto;}
.customize-settings.settings-workspace .settings-preview-nav button{display:flex;align-items:center;gap:8px;}
.customize-settings.settings-workspace .settings-preview-nav button svg{width:18px;height:18px;flex:none;}
.customize-settings.settings-workspace .settings-preview-frame[data-navigation-collapsed=true] .settings-preview-nav button span{display:none;}
.theme-app .customize-settings.settings-workspace .settings-zoom-canvas .settings-preview-frame[data-navigation-collapsed=true]:not([data-navigation-top=true]):not([data-rail-top=true]){grid-template-columns:60px 60px minmax(0,1fr);}
.theme-app .customize-settings.settings-workspace .settings-zoom-canvas .settings-preview-frame[data-navigation-collapsed=true][data-rail-top=true]:not([data-navigation-top=true]){grid-template-columns:60px minmax(0,1fr);}
.customize-settings.settings-workspace .preview-body.table-head-primary th{background:var(--primary);color:var(--on-primary);}
.customize-settings.settings-workspace .preview-body.table-head-filled th{background:color-mix(in srgb,var(--active) 28%,var(--surface));color:var(--text);}
/* Saved rows must fit the bounded settings dock without hiding their names. */
.customize-settings.settings-workspace .saved-theme{grid-template-columns:minmax(0,1fr);align-items:start;gap:8px;}
.customize-settings.settings-workspace .saved-theme-main{width:100%;min-width:0;}
.customize-settings.settings-workspace .saved-theme-name{width:100%;min-width:0;font-size:12px;box-sizing:border-box;}
.customize-settings.settings-workspace .saved-theme small{font-size:12px!important;}
.customize-settings.settings-workspace .saved-theme-tools{display:flex;flex-wrap:wrap;gap:4px;}
.customize-settings.settings-workspace .saved-theme-tools button{font-size:12px;padding:4px 6px;}

/* Keep edited dark/light hover surfaces readable without changing default colors. */
.customize-settings.settings-workspace .btn:hover,.customize-settings.settings-workspace .preview-tools button:hover{color:var(--on-hover,var(--text));}
.customize-settings.settings-workspace .settings-preview-nav button.active{color:var(--on-active,var(--text));}

.customize-settings.settings-workspace .settings-preview-rail button.active{color:var(--on-active,var(--text));}

/* Status samples follow the preview palette instead of the locked host shell. */
.customize-settings.settings-workspace .settings-preview-frame .theme-card-status{background:var(--field);color:var(--muted);}
.customize-settings.settings-workspace .settings-preview-frame .theme-card-status dd,
.customize-settings.settings-workspace .settings-preview-frame .theme-card-status.has-count{color:var(--text);}
/* Preview status labels must use this palette, not the host preview-panel span rule. */
.customize-settings.settings-workspace .preview-body .badge{color:var(--text);}
.customize-settings.settings-workspace .preview-body .badge.good{background:color-mix(in srgb,var(--success) 12%,var(--surface));}
.customize-settings.settings-workspace .preview-body .badge.pending{background:color-mix(in srgb,var(--warning) 12%,var(--surface));}
.customize-settings.settings-workspace .preview-body .state-banner{color:var(--text);}
.customize-settings.settings-workspace .preview-state-success .state-banner{background:color-mix(in srgb,var(--success) 15%,var(--surface));}
.customize-settings.settings-workspace .preview-state-warning .state-banner{background:color-mix(in srgb,var(--warning) 15%,var(--surface));}
.customize-settings.settings-workspace .preview-state-error .state-banner{background:color-mix(in srgb,var(--danger) 15%,var(--surface));}