/* Shared site surfaces. Artist-selected portfolio themes keep their own palette. */
html[data-appearance] body[data-ui=clear]{
 --paper:#fff;--page-bg:#f1f2f4;--ink:#202934;--muted:#566274;--line:#cfd6df;
 --soft:#f5f6f8;--surface-soft:#f5f6f8;--surface-blue:#f5f6f8;
 --surface-green:#f5f6f8;--surface-purple:#f5f6f8;--text-soft:#566274;
 --accent:#2467df;--accent-soft:#edf3ff;--card-radius:12px;
 --preview-shadow:0 5px 18px #24354c08;
 background:var(--page-bg);color:var(--ink);
}
html[data-appearance=dark] body[data-ui=clear]{
 --paper:#222730;--page-bg:#15181e;--ink:#edf1f7;--muted:#b4bfcd;--line:#47515e;
 --soft:#1b2028;--surface-soft:#1b2028;--surface-blue:#1b2028;
 --surface-green:#1b2028;--surface-purple:#1b2028;--text-soft:#b4bfcd;
 --accent:#9bbcff;--accent-soft:#2a3952;--preview-shadow:0 5px 18px #0002;
 background:var(--page-bg);
}
body[data-ui=clear] :is(.site-header,.site-footer){border-color:var(--line)}
body[data-ui=clear] :is(
 .profile-fields>.profile-card,.portfolio-url-editor,.studio-business-card.talent-directory,
 .showreel-library-row,.showreel-settings-card,.showreel-preview-header,
 .upload-section,.upload-reel-card,.upload-panel,.studio-section,
 .account-card,.account-current,.account-panel,.admin-section,
 .feedback-panel,.shot-row-card,.editor-sidebar,.editor-panel
){background:var(--paper)!important;border:1px solid var(--line);border-radius:var(--card-radius);box-shadow:var(--preview-shadow)}
body[data-ui=clear] :is(.profile-card,.portfolio-url-editor,.studio-business-card.talent-directory):before{display:none}
body[data-ui=clear] :is(.portfolio-url-editor,.studio-business-card.talent-directory){border-top:1px solid var(--line)}
body[data-ui=clear] .profile-card>.profile-card-summary,
body[data-ui=clear] .showreel-settings-card>.showreel-settings-summary{background:var(--paper);color:var(--ink)}
body[data-ui=clear] :is(.profile-card-kicker,.eyebrow.blue){color:var(--muted)}
body[data-ui=clear] :is(.profile-card-title,.showreel-settings-title){color:var(--ink)}
body[data-ui=clear] :is(.profile-card-summary,.showreel-settings-summary):hover{background:var(--soft)}
body[data-ui=clear] :is(.profile-card[open]>.profile-card-summary,.showreel-settings-card[open]>.showreel-settings-summary){border-bottom:1px solid var(--line)}
body[data-ui=clear] :is(.profile-card-content,.showreel-settings-content){background:var(--paper)}
body[data-ui=clear] :is(.profile-card-content .form-section,.banner-editor,.resume-entry,.banner-saved-library,.banner-editor-panel,.showreel-settings-management,.admin-search,.admin-member-row,.email-preferences){background:var(--soft);border-color:var(--line);box-shadow:none}
body[data-ui=clear] :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),select,textarea){background:var(--paper);border-color:var(--line);color:var(--ink)}
body[data-ui=clear] :is(.button:not(.primary):not(.danger),.appearance-toggle){background:var(--paper);border-color:var(--line);color:var(--ink);box-shadow:none}
body[data-ui=clear] :is(.button.primary,.button.primary:hover){background:#2467df;border-color:#2467df;color:#fff}
body[data-ui=clear] :is(.studio-section.active,.studio-section[aria-current=page],.admin-tabs a[aria-current=page],.studio-tabs a[aria-current=page]){background:var(--accent-soft)!important;color:var(--accent);border-color:var(--accent);box-shadow:inset 0 -2px var(--accent)}
body[data-ui=clear] :is(.profile-card-summary:after,.showreel-settings-summary:after){color:var(--muted)}
body[data-ui=clear] :is(.portfolio-link-guide,.feedback-note,.studio-tip){background:var(--soft);border-color:var(--line)}
body[data-ui=clear] .feedback-card:hover{border-color:var(--accent);box-shadow:0 5px 20px #2467df12}
body[data-ui=clear] :is(.banner-crop-tip,.banner-editor-help){background:var(--accent-soft);border-color:var(--line);border-left-color:var(--accent)}

/* One continuous page canvas, including the existing header and footer. */
body[data-ui=clear] :is(.site-header,.site-footer){background:transparent!important}
body[data-ui=clear] .homepage-redesign{--bg:var(--page-bg);--card:var(--paper);background:var(--page-bg)!important}

/* Independent cards avoid the old list frame meeting each rounded corner. */
body[data-ui=clear] .showreel-library-rows{display:grid;gap:18px;border:0;border-radius:0;overflow:visible;background:transparent}
body[data-ui=clear] .showreel-library-row:last-child{border-bottom:1px solid var(--line)}
body[data-ui=clear] .profile-card-summary:after{grid-row:1/3}
body[data-ui=clear] .profile-card-title{font-size:24px;font-weight:500;letter-spacing:-.04em}
body[data-ui=clear] :is(.legal-notice,.pricing-draft,.account-empty,.upload-reel-url,.file-drop,.showreel-settings-tabs,.activity-trend,.activity-metrics>div){background:var(--soft);border-color:var(--line);color:var(--ink)}
body[data-ui=clear] :is(.plan-card,.auth-card,.login-card,.feedback-card){background:var(--paper);border-color:var(--line)}
body[data-ui=clear] .plan-card.featured{background:var(--accent-soft);border-color:var(--accent)}
body[data-ui=clear] .account-card:before{display:none}
body[data-ui=clear] .is-main-showreel .showreel-status.main{background:var(--soft);border-color:var(--line);color:var(--ink)}

/* Community and public utility pages share the same panel hierarchy as Studio. */
body[data-ui=clear] :is(.contact-card,.feedback-panel,.admin-list,.talent-directory){background:var(--paper);border-color:var(--line);border-radius:var(--card-radius);box-shadow:var(--preview-shadow)}
body[data-ui=clear] .feedback-tabs a{border:1px solid var(--line);border-radius:9px;background:var(--paper);color:var(--muted)}
body[data-ui=clear] .feedback-tabs a[aria-current]{background:var(--accent-soft);color:var(--accent);border-color:var(--accent)}
body[data-ui=clear] .feedback-tabs a:hover{border-color:var(--accent);color:var(--accent)}
body[data-ui=clear] :is(.feedback-card-thumbnail,.feedback-tag,.feedback-reply-form,.feedback-shot-details){background:var(--soft);border-color:var(--line)}
body[data-ui=clear] .feedback-tag{color:var(--muted)}
body[data-ui=clear] .feedback-panel h2{font-weight:500;letter-spacing:-.04em}
html[data-appearance=dark] body[data-ui=clear] .feedback-workspace .button:not(.primary):not(.danger){background:var(--paper);color:var(--ink);border-color:var(--line)}
body[data-ui=clear] .profile-card-number{color:var(--muted);margin-right:.4em;font-variant-numeric:tabular-nums}
@media(max-width:740px){body[data-ui=clear] .profile-card-title{font-size:20px}}

/* Match a single directory card instead of stretching the preview across its panel. */
@media screen{
 body[data-ui=clear] .studio-business-card .talent-card{width:100%;max-width:600px;min-height:230px;box-sizing:border-box;margin:0 auto 12px}
}
@media screen and (max-width:600px){body[data-ui=clear] .studio-business-card .talent-card{min-height:240px}}

/* Compact banner adjustments: short paired tracks and a quiet shadow row. */
body[data-ui=clear] .banner-adjustment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:16px;align-items:start}
body[data-ui=clear] .banner-adjustment{min-width:0}
body[data-ui=clear] .banner-text-editor .banner-adjustment label{margin:0;display:block}
body[data-ui=clear] .banner-adjustment .field-help{margin:2px 0 0;font-size:11px;line-height:1.5}
body[data-ui=clear] .banner-text-editor input[type=range]{display:block;width:100%;height:32px;min-height:32px;padding:0;margin:2px 0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer}
body[data-ui=clear] .banner-text-editor input[type=range]::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:var(--line)}
body[data-ui=clear] .banner-text-editor input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:14px;height:14px;margin-top:-5.5px;border:2px solid var(--paper);border-radius:50%;background:var(--accent);box-shadow:0 0 0 1px var(--accent)}
body[data-ui=clear] .banner-text-editor input[type=range]::-moz-range-track{height:3px;border-radius:3px;background:var(--line)}
body[data-ui=clear] .banner-text-editor input[type=range]::-moz-range-thumb{width:10px;height:10px;border:2px solid var(--paper);border-radius:50%;background:var(--accent);box-shadow:0 0 0 1px var(--accent)}
body[data-ui=clear] .banner-text-editor input[type=range]:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
body[data-ui=clear] .banner-text-editor input[type=range]:disabled{opacity:.45;cursor:default}
body[data-ui=clear] .banner-shadow-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px 20px;align-items:center;margin:14px 0;padding:10px 14px}
body[data-ui=clear] .banner-shadow-controls label{margin:0}
body[data-ui=clear] .banner-shadow-controls>.field-help{grid-column:1/-1;margin:0;font-size:11px;line-height:1.5}
@media(max-width:600px){body[data-ui=clear] .banner-adjustment-grid,body[data-ui=clear] .banner-shadow-controls{grid-template-columns:1fr;gap:10px}body[data-ui=clear] .banner-text-editor input[type=range]{height:40px;min-height:40px}}

/* Banner controls stay on a white canvas, with no grey flush-edged wrapper. */
body[data-ui=clear] .profile-card-content .banner-editor{background:transparent;border:0;padding:0}
body[data-ui=clear] .banner-editor>p.muted{background:transparent;padding:0;margin:0 0 16px}
body[data-ui=clear] :is(.banner-manager,.banner-design-workspace,.banner-art-controls){background:var(--paper)}
body[data-ui=clear] .banner-create-options>div{display:flex;gap:8px;flex-wrap:wrap}
body[data-ui=clear] .banner-create-options{margin-top:14px}
body[data-ui=clear] .banner-editor :is(.form-grid,.banner-design-workspace)>*{min-width:0;max-width:100%;box-sizing:border-box}
body[data-ui=clear] .banner-editor .studio-palette{box-sizing:border-box;max-width:100%;align-self:start}
body[data-ui=clear] .banner-editor .studio-palette-swatches{grid-template-columns:repeat(auto-fit,minmax(28px,1fr));gap:6px;max-width:260px}
body[data-ui=clear] .banner-editor .studio-palette-swatch{width:100%;height:28px;min-height:28px;min-width:0;padding:0;box-sizing:border-box;aspect-ratio:auto}
body[data-ui=clear] .banner-editor .studio-palette details{margin-top:8px}
@media(pointer:coarse){body[data-ui=clear] .banner-editor .studio-palette-swatches{grid-template-columns:repeat(auto-fit,minmax(44px,1fr))}body[data-ui=clear] .banner-editor .studio-palette-swatch{height:44px;min-height:44px}}

body[data-ui=clear] .banner-editor #banner-composer{background:transparent;padding:0}
body[data-ui=clear] #banner-composer:has(.banner-art-controls:not([hidden]))>#banner-crop-tip{display:none}
/* Banner starting choices must read as actions, not blend into the white panel. */
body[data-ui=clear] .banner-editor #banner-create-options .button{background:var(--accent-soft);border:1px solid var(--accent);color:var(--accent);min-height:44px;font-weight:600;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
body[data-ui=clear] .banner-editor #banner-create-options .button:hover,
body[data-ui=clear] .banner-editor #banner-create-options .button:focus-visible{background:#2467df;border-color:#2467df;color:#fff}
body[data-ui=clear] .banner-editor #banner-create-options .button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
body[data-ui=clear] .banner-editor .button:not(.primary):not(.danger):not(:disabled):hover{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
body[data-ui=clear] .banner-editor #banner-create-options .button:hover{background:#2467df;border-color:#2467df;color:#fff}
