.appearance-settings{display:grid;gap:13px;padding-bottom:22px;border-bottom:1px solid var(--line);margin-bottom:23px}
.appearance-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px}
.appearance-section-head h3,.optic-heading{font-size:12px;font-weight:700;color:var(--ink)}
.appearance-auto{font-size:10px;font-weight:650;color:var(--accent-display);text-decoration:underline;text-underline-offset:3px;padding:3px 0}
.appearance-segment{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:4px;background:var(--soft-fill);border:1px solid var(--glass-border);border-radius:12px}
.appearance-segment button{min-height:36px;border-radius:9px;font-size:12px;color:var(--muted);font-weight:600}
.appearance-segment button[aria-pressed=true]{color:var(--ink);background:color-mix(in srgb,var(--theme-accent) 14%,transparent);box-shadow:inset 0 0 0 1px var(--glass-border),0 2px 8px #133b6433}
html[data-ads-theme=dark] .appearance-segment button[aria-pressed=true]{color:var(--ink);background:color-mix(in srgb,var(--theme-accent) 20%,transparent);box-shadow:inset 0 0 0 1px #a9d5e668,0 2px 8px #0209146b}
.appearance-presets{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.appearance-preset{display:grid;gap:6px;min-width:0;padding:5px 5px 8px;border-radius:9px;font-size:10px;font-weight:600;color:var(--ink);text-align:center;box-shadow:none}
.appearance-preset[aria-pressed=true]{outline:2px solid var(--accent-display);outline-offset:1px}
.appearance-swatch{display:block;position:relative;width:100%;height:40px;border-radius:6px;background:linear-gradient(135deg,var(--swatch-a),var(--swatch-b) 52%,var(--swatch-c));border:1px solid var(--glass-border)}
.appearance-swatch::after{content:'';position:absolute;right:5px;bottom:5px;width:11px;height:11px;border-radius:50%;background:var(--swatch-accent);border:1px solid #ffffffb8;box-shadow:0 1px 3px #07182755}
.appearance-colors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.appearance-color{display:grid;grid-template-columns:39px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:8px;min-width:0;border:1px solid var(--glass-border);border-radius:9px;padding:7px;background:var(--soft-fill);cursor:pointer}
.appearance-color>span{grid-column:2;font-size:10px;line-height:1.2;font-weight:650;white-space:normal;overflow-wrap:anywhere}
.appearance-color>input{grid-column:1;grid-row:1/3;width:39px;height:39px;border:0;padding:0;background:none;cursor:pointer}
.appearance-color>input::-webkit-color-swatch-wrapper{padding:0}.appearance-color>input::-webkit-color-swatch{border:1px solid var(--glass-border);border-radius:6px}
.appearance-color output{grid-column:2;font-size:9px;color:var(--muted);font-variant-numeric:tabular-nums}
.appearance-gradient-colors{margin-bottom:2px}
.optic-heading{margin:0 0 4px}

/* ADS semantic tokens. Layout and the default Glass geometry remain unchanged. */
:root{--theme-accent:#075aff;--theme-secondary:#159d91;--theme-text:#111829;--blue:var(--accent-display,#075aff)}
html[data-ads-theme]{color:var(--ink);background:var(--theme-bg-2)}
html[data-ads-theme=light]{color-scheme:light;--scrim:#254a7529}
html[data-ads-theme=dark]{color-scheme:dark;--scrim:#02091499;--shadow:0 8px 25px #02091466,0 2px 5px #02091433;--green:#70ddbc;--orange:#f2c478;--red:#ff9ab0}
body{background:var(--theme-bg-2,#e2efff);color:var(--ink)}
.glass,[data-glass]{border-color:var(--glass-border);background:var(--glass-fill)}
.glass-painted.glass{background:transparent;border-color:var(--glass-border)}
.glass-off .glass{background:var(--surface-fill)}
.button,.dialog-close,.profile-row,.select-option,.screen-link{color:var(--ink)}
.button.primary,.dialog .primary,.select-option.selected{color:#fff}
.primary:not(.glass-painted),.glass-off .primary,.select-option.selected:not(.glass-painted){background:#075aff}
/* Dark primary actions use the current scene palette in both optical and CSS modes. */
html[data-ads-theme=dark] .button.primary,html[data-ads-theme=dark] .select-option.selected{color:#fff;border-color:color-mix(in srgb,var(--theme-accent) 38%,var(--glass-border));box-shadow:inset 0 1px 0 #ffffff30,inset 0 -1px 0 #00000026,0 4px 14px #00000024}
html[data-ads-theme=dark] .primary:not(.glass-painted),html[data-ads-theme=dark].glass-off .primary,html[data-ads-theme=dark] .select-option.selected:not(.glass-painted){background:linear-gradient(135deg,#ffffff0d,transparent 60%),var(--primary-glass);backdrop-filter:blur(12px)}
html[data-ads-theme=dark] .auth-card .auth-submit:not(.glass-painted),html[data-ads-theme=dark].glass-off .auth-card .auth-submit{background:linear-gradient(135deg,#ffffff0d,transparent 60%),var(--primary-glass)}
html[data-ads-theme=dark] .button.primary:focus-visible{outline:2px solid var(--accent-display);outline-offset:3px}
.auth-card .auth-submit,.auth-card .auth-submit .loading-label{color:#fff!important}
.auth-card .field-shell input:is(:autofill,:-webkit-autofill){-webkit-text-fill-color:var(--ink)!important;caret-color:var(--ink)}
.button:not(.primary).is-loading,.button:not(.primary) .loading-label{color:var(--ink)!important}
.field-shell input::placeholder,.field-shell textarea::placeholder,.search input::placeholder{color:var(--placeholder)}
.nav-item,.data-table th,.kbd,.chart text{color:var(--muted);fill:var(--muted)}
.nav-item.active,.nav-item:hover{color:var(--ink)}
.tab.active,.chip,.filter-count,.demo-badge,.search .icon,.check-group summary .icon{color:var(--accent-display)}
.tab.active,.chip,.filter-count,.demo-badge,.nav-item:hover,.profile-row:hover{background:var(--soft-fill)}
.choice.active{border-color:var(--accent-display);background:var(--soft-fill)}
.choice,.check-group,.account-option{border-color:var(--line)}
.chart-tooltip{background:var(--surface-fill);color:var(--ink)}
.chart .mainline{stroke:var(--theme-accent)}.chart .altline{stroke:var(--theme-secondary)}
.dialog-scrim,.mobile-backdrop{background:var(--scrim)}
.dialog-scroll{scrollbar-color:var(--muted) transparent}
html[data-ads-theme=dark] .status{background:var(--soft-fill);color:var(--muted)}
html[data-ads-theme=dark] .status.good{color:var(--green)}
html[data-ads-theme=dark] .status.warn{color:var(--orange)}
html[data-ads-theme=dark] .status.bad{color:var(--red)}
html[data-ads-theme=dark] .status.info{color:var(--accent-display)}
html[data-ads-theme=dark] .step.done span{background:#175c50;color:#abf3de}
html[data-ads-theme=dark] .creative-labels>span{background:var(--surface-fill);color:var(--ink)}
html[data-ads-theme=dark] .ad-preview,html[data-ads-theme=dark] .ad-image,html[data-ads-theme=dark] .creative-visual{background:var(--soft-fill);border-color:var(--glass-border)}
/* Brand logos and media keep their original colors on a pale badge. */
.platform-logo{background:#edf7ffcf}
/* Narrow campaign-detail KPI cards must retain the complete period caption. */
.kpi-change{white-space:normal;overflow-wrap:anywhere}
.appearance-presets{grid-template-columns:repeat(3,minmax(0,1fr))}
.appearance-preset{justify-content:stretch;justify-items:stretch}
.appearance-swatch{height:44px}
.appearance-color{grid-template-columns:28px minmax(0,1fr);gap:6px}
.appearance-color>input{width:28px;height:34px}
.appearance-color output{overflow-wrap:anywhere}
.dialog:has(.appearance-settings) .form-actions{flex-wrap:wrap}
@media(max-width:440px){.appearance-colors{grid-template-columns:1fr}.appearance-color{grid-template-columns:34px minmax(0,1fr) auto}.appearance-color>input{grid-row:1;grid-column:1}.appearance-color>span{grid-row:1;grid-column:2}.appearance-color>output{grid-row:1;grid-column:3}.appearance-settings{gap:10px}.appearance-presets{gap:7px}.appearance-swatch{height:33px}}
/* Consistent content spacing and independent, resizable region columns. */
.platform-row>.grow{min-width:0;overflow-wrap:anywhere}
.platform-row>.grow>b,.platform-row>.grow>small{display:block}
.platform-row>.grow>small{margin-top:6px;line-height:1.5;color:var(--muted)}
.panel>.tabs+.notice{margin-top:18px}
.panel>.notice+.button,.panel>.notice+a.button{margin-top:18px}
.creative-grid{align-content:start;align-items:start}
.creative-grid>.empty{grid-column:1/-1;min-height:280px;align-self:start;display:flex;flex-direction:column;justify-content:center;gap:16px}
.creative-grid>.empty h2,.creative-grid>.empty p{margin:0}
.regions-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,var(--regions-side,320px));gap:24px;position:relative;align-items:start}
.regions-layout>.panel,.regions-layout>.map{min-width:0}
.regions-layout>.map{height:var(--regions-height,520px);min-height:360px}
.regions-layout .map-svg{height:100%;min-height:0}
.regions-layout .map-toolbar{flex-wrap:wrap;align-items:flex-start}
.regions-layout .map-toolbar>.select-wrap{max-width:min(320px,100%)}
.region-resize{position:absolute;z-index:5;padding:0;display:grid;place-items:center;background:var(--control-fill,#dcecffcc);color:var(--ink);border:1px solid var(--line);border-radius:12px;touch-action:none;user-select:none;box-shadow:0 2px 8px #15375b22}
.region-resize-width{right:calc(var(--regions-side,320px) + 4px);top:calc(var(--regions-height,520px)/2 - 28px);width:16px;height:56px;cursor:col-resize;font-size:22px}
.region-resize-height{bottom:4px;left:calc(50% - 28px);width:56px;height:20px;cursor:row-resize;letter-spacing:4px}
.region-resize:hover,.region-resize:focus-visible{outline:2px solid var(--theme-accent,#075aff);outline-offset:2px}
.regions-layout.is-resizing{user-select:none}.regions-layout.is-resizing .map-svg{pointer-events:none}
@media(max-width:1050px){.regions-layout{grid-template-columns:minmax(0,1fr)}.region-resize-width{display:none}.regions-layout>.map{height:min(var(--regions-height,520px),75vh)}}
@media(max-width:600px){.platform-row{flex-wrap:wrap}.platform-row>.grow{flex-basis:calc(100% - 60px)}.regions-layout{gap:20px}.regions-layout .map-toolbar{gap:8px}.creative-grid>.empty{min-height:240px;padding:28px 16px}}
.regions-layout .map-svg{height:calc(100% - 32px)}
