/* Shared appearance layer. Stable neutral surfaces, four accessible accent families. */
:root{--a-accent:#244c3c;--a-soft:#d8e3cd;--a-deep:#182b23;--a-page:#f4f1e9;--a-card:#fffcf6;--a-ink:#182b23;--a-muted:#53645a;--a-line:#b6c3b8;--a-on-accent:#fffdf7}
:root[data-palette=ocean]{--a-accent:#205c78;--a-soft:#d8eaf0;--a-deep:#142f3c}
:root[data-palette=lavender]{--a-accent:#634285;--a-soft:#e9def2;--a-deep:#30213e}
:root[data-palette=terracotta]{--a-accent:#914a32;--a-soft:#f0dfd1;--a-deep:#3b271f}
:root[data-theme=dark]{--a-page:#111a17;--a-card:#1b2822;--a-ink:#f1f4ed;--a-muted:#becbc2;--a-line:#52665a;--a-soft:#293f32;--a-accent:#bad6b3;--a-deep:#182b23;--a-on-accent:#15251b}
:root[data-theme=dark][data-palette=ocean]{--a-page:#101a22;--a-card:#192b36;--a-line:#506a7b;--a-muted:#bbccd7;--a-soft:#203e50;--a-accent:#a3d8ef;--a-deep:#142f3c;--a-on-accent:#102c39}
:root[data-theme=dark][data-palette=lavender]{--a-page:#1b1622;--a-card:#2a2134;--a-line:#726180;--a-muted:#cebfda;--a-soft:#423051;--a-accent:#d7b8f0;--a-deep:#30213e;--a-on-accent:#30213e}
:root[data-theme=dark][data-palette=terracotta]{--a-page:#211813;--a-card:#33261f;--a-line:#7e6759;--a-muted:#d9c7b9;--a-soft:#4e3628;--a-accent:#edbd9e;--a-deep:#3b271f;--a-on-accent:#3b271f}
html[data-theme]{--r-paper:var(--a-page);--r-white:var(--a-card);--r-ink:var(--a-ink);--r-forest:var(--a-accent);--r-sage:var(--a-soft);--r-muted:var(--a-muted);--r-line:var(--a-line);accent-color:var(--a-accent)}
html[data-theme] body{background:var(--a-page);color:var(--a-ink)}
html[data-theme] body :is(header,.legal-footer){background:var(--a-page);color:var(--a-ink);border-color:var(--a-line)}
html[data-theme] body header :is(a,.brand>span,.brand small){color:var(--a-ink)}
html[data-theme] body :is(.access-card,.panel,.stat,.loginbox,.email-card,.result,.legal-notice,.project-card,.request-card,.doc-card,.photo-card,.quick,.service-dialog,.extra-dialog,dialog){background:var(--a-card);color:var(--a-ink);border-color:var(--a-line)}
html[data-theme] body :is(input:not([type=radio]):not([type=checkbox]),select,textarea){background:var(--a-card);color:var(--a-ink);border-color:var(--a-line)}
html[data-theme] body :is(input,textarea)::placeholder{color:var(--a-muted)}
html[data-theme] body :is(.access-card p,.access-details,.muted,.fine,.stat span,.quick p,.request-card p,.doc-card p,.profile-email,.section-intro p){color:var(--a-muted)}
html[data-theme] body :is(.access-story h1 em,.quick-icon,.service-breadcrumb a){color:var(--a-accent)}
html[data-theme] body .btn{background:var(--a-accent);color:var(--a-on-accent);border-color:var(--a-accent)}
html[data-theme] body .btn:is(.outline,.light){background:var(--a-card);color:var(--a-ink);border-color:var(--a-line)}
html[data-theme] body :is(.sidebar,.welcome-card,.upload-zone,.email-preview,.bubble,.suggestions button){background:var(--a-card);color:var(--a-ink);border-color:var(--a-line)}
html[data-theme] body :is(.sidebtn,.sidebar-label,.side-bottom,.bubble small,.welcome-card p,.quick strong){color:var(--a-ink)}
html[data-theme] body :is(.sidebtn.active,.sidebtn:hover,.bubble.user){background:var(--a-soft);color:var(--a-ink)}
html[data-theme] body .brand img{background:var(--a-deep)}
html[data-theme] body :focus-visible{outline-color:var(--a-accent)}
/* Keep the intentionally inverted pricing/footer panels readable in either mode. */
html[data-theme] body :is(.price-main,.price-side,.portal-teaser,.signature-footer){background:var(--a-deep);color:#f4f1e9}
html[data-theme] body :is(.price-main,.price-side,.portal-teaser,.signature-footer) :is(p,h2,h3,strong,.eyebrow,.fine,.muted,li,.footer-wordmark,.footer-meta,.footer-invite>a){color:#e4eadf}
html[data-theme] body .price-main .btn.light{background:#f4f1e9;color:#182b23}
html[data-theme] body .contact{background:var(--a-soft);color:var(--a-ink)}
html[data-theme] body .contact :is(h2,label,p,.eyebrow){color:var(--a-ink)}
html[data-theme] body .process{background:var(--a-soft);color:var(--a-ink)}
html[data-theme] body .process :is(h2,h3,p,.eyebrow,.step span){color:var(--a-ink)}
.appearance-picker{position:relative;flex:none;margin:0;border:0;z-index:60;font-family:var(--r-body,system-ui);font-size:13px;line-height:1.5}
.appearance-picker>summary{list-style:none;cursor:pointer;padding:10px 12px;border:1px solid var(--a-line);border-radius:24px;min-height:44px;display:flex;align-items:center;gap:8px;color:var(--a-ink);background:var(--a-card);white-space:nowrap}
.appearance-picker>summary::-webkit-details-marker{display:none}.appearance-picker>summary:before{content:'◐';font-size:18px}.appearance-picker>summary:after{content:none!important}
.appearance-panel{position:absolute;right:0;top:calc(100% + 10px);width:280px;max-width:calc(100vw - 32px);padding:22px;border:1px solid var(--a-line);border-radius:16px;background:var(--a-card);color:var(--a-ink);box-shadow:0 18px 55px #0003;text-align:left}
.appearance-panel strong{font-size:20px;font-weight:600}.appearance-panel p{font-size:13px;margin:7px 0 18px;color:var(--a-muted)}.appearance-panel>label{display:grid;gap:7px;font-size:13px}.appearance-panel select{width:100%;padding:10px;border:1px solid var(--a-line);border-radius:8px;font:inherit;min-height:44px}
.appearance-panel fieldset{border:0;padding:0;margin:20px 0 16px;display:grid;grid-template-columns:1fr 1fr;gap:7px}.appearance-panel legend{margin-bottom:9px;font-size:13px}.appearance-panel .palette-option{display:flex;align-items:center;gap:7px;min-height:44px;font-size:12px;cursor:pointer}.palette-option input{margin:0;width:16px;height:16px;flex:none}.palette-swatch{width:13px;height:13px;flex:none;border-radius:50%;background:#244c3c;border:1px solid #ffffff66}.palette-option[data-color=ocean] .palette-swatch{background:#205c78}.palette-option[data-color=lavender] .palette-swatch{background:#634285}.palette-option[data-color=terracotta] .palette-swatch{background:#914a32}.appearance-panel small{display:block;font-size:11px;color:var(--a-muted)}
@media(max-width:1100px){header nav{flex-wrap:wrap}.appearance-picker{margin-left:auto}}
@media(max-width:480px){.appearance-picker>summary{font-size:12px;padding:8px 10px}.appearance-panel{right:0}.appearance-picker{margin-left:0}header nav{gap:12px!important}}

html[data-theme] body header a.btn{color:var(--a-on-accent)}
html[data-theme] body header a.btn.outline{color:var(--a-ink)}

/* The fictional café retains its illustration, with matching readable surfaces. */
html[data-theme] body.demo-site :is(.cafe-hero p,.section-head>p,.dish p,.eyebrow,.cafe-info,.demo-footer){color:var(--a-muted)}
html[data-theme] body.demo-site .cafe-hero h1 em{color:var(--a-accent)}
html[data-theme] body.demo-site :is(.booking,.cafe-strip){background:var(--a-soft);color:var(--a-ink)}
html[data-theme] body.demo-site :is(.booking form,.demo-result){background:var(--a-card);color:var(--a-ink)}
html[data-theme] body.demo-site .btn.outline{color:var(--a-ink)}
html[data-theme] body.demo-site .menu-tabs button{color:var(--a-ink);border-color:var(--a-line)}
html[data-theme] body.demo-site .menu-tabs button.active{background:var(--a-accent);color:var(--a-on-accent)}
html[data-theme] body.demo-site .demo-footer .brand{color:var(--a-ink)}

/* Resilent Agency: one corporate identity. Appearance controls belong to the demo only. */
:root[data-palette=brand]{--a-page:#fffdfa;--a-card:#ffffff;--a-ink:#191919;--a-muted:#5b5553;--a-line:#d7cfcc;--a-accent:#b82e26;--a-soft:#f7e6e1;--a-deep:#191919;--a-on-accent:#ffffff;--r-forest:#b82e26;--r-sage:#f7e6e1}
html[data-palette=brand] body .brand img{background:#191919}
html[data-palette=brand] body .hero h1 em{color:var(--a-accent)}
html[data-palette=brand] body .focus-workbench{background:linear-gradient(135deg,#faede8,#f5dfd8);border-color:#b82e26}
html[data-palette=brand] body .focus-output{border-left-color:#b82e26}
html[data-palette=brand] body .brand-ribbon{background:#191919;color:#fffdfa;border-color:#191919}
html[data-palette=brand] body .brand-ribbon img{background:#b82e26;border-radius:50%;padding:5px}
html[data-palette=brand] body .identity-decision>span,html[data-palette=brand] body .service-number{color:#b82e26}
html[data-palette=brand] body .contact{background:#f7e6e1}
html[data-palette=brand] body .signature-footer .footer-wordmark>span{color:#f1aaa0}
html[data-palette=brand] body .sidebar{border-right:1px solid var(--a-line)}
html[data-palette=brand] body .appearance-picker{display:none}
/* Corporate dark mode keeps the same red identity; demo controls stay independent. */
:root[data-palette=brand][data-theme=dark]{--a-page:#111112;--a-card:#1b1b1d;--a-ink:#f4f1eb;--a-muted:#c2bcb7;--a-line:#514746;--a-accent:#ff7568;--a-soft:#32211f;--a-deep:#09090a;--a-on-accent:#201211;--r-forest:var(--a-accent);--r-sage:var(--a-soft)}
html[data-palette=brand][data-theme=dark] body .focus-workbench{background:linear-gradient(140deg,#2d1c1b,#1b1b1d);border-color:#89504a}
html[data-palette=brand][data-theme=dark] body .contact{background:#281d1c}
html[data-palette=brand][data-theme=dark] body :is(.identity-decision>span,.service-number){color:var(--a-accent)}
.corporate-mode{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex-shrink:0;min-height:44px;padding:10px 14px;border:1px solid var(--a-line);border-radius:24px;background:var(--a-card);color:var(--a-ink);font-size:12px;white-space:nowrap;cursor:pointer;line-height:1.4}
.corporate-mode:hover{border-color:var(--a-accent)}.corporate-mode:focus-visible{outline:3px solid var(--a-accent);outline-offset:4px}
@media(max-width:1180px){header nav{flex-wrap:wrap}.corporate-mode{margin-left:auto}}
@media(max-width:480px){.corporate-mode{font-size:11px;padding:9px 12px;margin-left:0}}
/* Warm ink, fired coral, parchment: a considered brand palette rather than primary red/white. */
:root[data-palette=brand]{--a-page:#f2ede4;--a-card:#fbf7ef;--a-ink:#29262b;--a-muted:#625b5b;--a-line:#c9beb4;--a-accent:#a83e31;--a-soft:#e6dcd0;--a-deep:#242126;--a-on-accent:#fff6e9;--r-forest:var(--a-accent);--r-sage:var(--a-soft)}
:root[data-palette=brand][data-theme=dark]{--a-page:#19171b;--a-card:#242126;--a-ink:#f4ebde;--a-muted:#c3b7af;--a-line:#5d5151;--a-accent:#ef8a70;--a-soft:#302629;--a-deep:#121114;--a-on-accent:#2a1c1b;--r-forest:var(--a-accent);--r-sage:var(--a-soft)}
html[data-palette=brand] body .brand img{filter:grayscale(1);background:#29262b}
html[data-palette=brand] body .contact{background:var(--a-soft)}

/* Surface contracts: text follows the surface it is actually on, in either mode. */
html[data-theme] body .extras-section{background:var(--a-card);color:var(--a-ink)}
html[data-theme] body .extras-section :is(h2,h3,label,.extra-kicker,.extra-price,.extras-note){color:var(--a-ink)}
html[data-theme] body .extras-section :is(.extras-heading p,.extra-card p,.extra-price small,.extras-note){color:var(--a-muted)}
html[data-theme] body .extras-summary{background:var(--a-page);color:var(--a-ink);border-color:var(--a-line)}
html[data-theme] body .extras-summary :is(h3,strong,small,p){color:var(--a-ink)}
html[data-theme] body .extras-summary .fine{color:var(--a-muted)}
html[data-theme] body .process-section{background:var(--a-card);color:var(--a-ink)}
html[data-theme] body .process-section :is(h2,summary,strong,em,.eyebrow,summary span){color:var(--a-ink)}
html[data-theme] body .process-section :is(p,.section-head p){color:var(--a-muted)}
html[data-theme] body .process-step summary:hover{background:var(--a-soft)}
html[data-theme] body .portal-preview{background:var(--a-card);color:var(--a-ink);border-color:var(--a-line)}
html[data-theme] body .portal-preview :is(h3,strong,p,small,a,span){color:var(--a-ink)}
html[data-theme] body .portal-preview :is(p,small){color:var(--a-muted)}
html[data-theme] body .preview-options a:hover{background:var(--a-soft)}
html[data-theme] body :is(.quick:hover,.upload-zone.dragging){background:var(--a-soft);color:var(--a-ink)}
html[data-theme] body .service-details-dialog :is(h2,h3,li){color:var(--a-ink)}
html[data-theme] body .service-details-dialog p{color:var(--a-muted)}
html[data-theme] body .btn{transition:transform 180ms}
html[data-theme] body :is(input[type=checkbox],input[type=radio]){accent-color:var(--a-accent)}
@media(max-width:640px){.extras-summary{position:static!important}.extras-grid{min-width:0}.extra-card{min-width:0}.extras-heading{gap:20px}.service-details-dialog{padding:24px 20px}.service-details-dialog h2{font-size:30px}.legal-footer nav{padding:0}}
html[data-theme] body .email-card a{color:var(--a-accent);text-decoration:underline;text-underline-offset:4px}
[hidden]{display:none!important}
html[data-theme] body.demo-site :is(.section-head>p,.fine,.dish p){color:var(--a-muted)}
html[data-theme] body.demo-site a.btn.outline{color:var(--a-ink)!important}

html[data-theme] body .portal-teaser .portal-preview :is(h3,strong,p,small,a,span){color:var(--a-ink)}
html[data-theme] body .portal-teaser .portal-preview :is(p,small){color:var(--a-muted)}
html[data-theme] body.demo-site :is(.section-head>p,.fine){color:var(--a-muted)!important}
