/* Shared web appearance. Does not transform drawings, images or machine units. */
html[data-theme=dark]{color-scheme:dark;--fx-bg:#07101e;--fx-panel:#111c2d;--fx-soft:#19283e;--fx-line:#354760;--fx-text:#edf2ff;--fx-muted:#a4b5ce;--fx-accent:#4be0c9}
html[data-theme=light]{color-scheme:light;--fx-bg:#f3f6fa;--fx-panel:#fff;--fx-soft:#eaf0f7;--fx-line:#bfccdc;--fx-text:#172b43;--fx-muted:#52647c;--fx-accent:#006c68;--bg:var(--fx-bg);--panel:var(--fx-panel);--panel2:var(--fx-soft);--line:var(--fx-line);--text:var(--fx-text);--muted:var(--fx-muted);--teal:#00756b;--cyan:#007a89;--amber:#805500;--yellow:#805500;--rose:#a82247;--red:#b0273c}
.filmx-display-tools{display:flex!important;align-items:center;justify-content:flex-end;gap:8px;flex:0 0 auto;visibility:visible!important;z-index:10001;color:var(--fx-text);font:13px/1.3 Segoe UI,Arial,sans-serif}
.filmx-display-tools.floating{position:fixed;top:10px;right:12px;padding:5px 8px;background:var(--fx-panel);border:1px solid var(--fx-line);border-radius:10px;max-width:calc(100vw - 24px)}
.filmx-display-tools .filmx-theme-label{display:flex;align-items:center;gap:5px;margin:0;color:var(--fx-muted);font:12px Segoe UI,Arial,sans-serif;white-space:nowrap}
.filmx-display-tools #filmx-theme{width:auto!important;min-width:98px;margin:0;height:32px;padding:4px 7px!important;background:var(--fx-soft)!important;color:var(--fx-text)!important;border:1px solid var(--fx-line)!important;border-radius:7px;font:600 12px Segoe UI,Arial,sans-serif;cursor:pointer}
.filmx-display-tools .filmx-language-tools{position:static!important;display:flex;gap:4px;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
.filmx-display-tools .filmx-language{width:auto!important;min-width:0;background:var(--fx-soft)!important;color:var(--fx-text)!important}
.filmx-display-tools .filmx-language-flag{flex-shrink:0;background:var(--fx-soft)!important;border-color:var(--fx-line)!important}
.filmx-display-tools :focus-visible{outline:2px solid var(--fx-accent);outline-offset:3px}
/* A row stays horizontal while there is room. Never clip or shrink text to fit. */
:is(.head,header.header,.shell>header,.top){gap:12px;flex-wrap:wrap;height:auto;min-height:72px}
html[data-filmx-surface=admin] .head{padding:12px 20px}
html[data-filmx-surface=admin] .head h1{font-size:clamp(18px,1.6vw,24px);flex-shrink:0}
.head>h1+div,.head .links,.head nav,.nav{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.head :is(button,.link),.head>h1+div>a{white-space:nowrap;font-size:13px;padding:8px 10px}
.head .filmx-display-tools{margin-left:auto}
html[data-filmx-surface=admin] .wrap{max-width:1800px}
.tabs{flex-wrap:wrap;gap:6px}.tabs .tab{white-space:nowrap;padding:9px 11px;font-size:13px}
.filters{display:flex;flex-wrap:wrap;gap:8px}.filters>*{flex:1 1 145px;min-width:0;width:auto}.filters>input:first-child{flex:2 1 210px}.filters>button{flex:0 0 auto;white-space:nowrap}
html[data-filmx-surface=admin] .overview{grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px}
.actions,.row-actions,.links{flex-wrap:wrap}.actions>button,.row-actions>button,.links>a{white-space:nowrap}
html[data-filmx-surface=admin] .registration-table{min-width:1000px}
html[data-filmx-surface=admin] .registration-table .row-actions{gap:5px}
html[data-filmx-surface=admin] .registration-table .row-actions button{padding:7px 8px}
/* Login remains completely opaque in both themes. */
html[data-theme] .gate,html[data-theme] #gate{background:var(--fx-bg)!important;overflow-y:auto;padding:60px 16px 20px}
html[data-theme] .gate-card{max-width:100%}
/* Light surfaces and controls; preserve the colors of photographs and vectors. */
html[data-theme=light] body{background:var(--fx-bg)!important;color:var(--fx-text)!important}
html[data-theme=light] :is(.head,header.header,.top,.shell>header){background:var(--fx-panel);border-color:var(--fx-line)}
html[data-theme=light] :is(.panel,.card,.plan,.metric,.finance-card,.gate-card,.login,.table-wrap,.item,.ai-option,.ai-status,.advantage-card,.advantage-summary>div,.roadmap-card,.piece-row,.client-dialog,.kanban-column,.column,.task){background:var(--fx-panel)!important;color:var(--fx-text);border-color:var(--fx-line);box-shadow:none}
html[data-theme=light] :is(input,select,textarea):not([type=checkbox]):not([type=radio]){background:var(--fx-panel)!important;color:var(--fx-text)!important;border-color:var(--fx-line)!important}
html[data-theme=light] input::placeholder,html[data-theme=light] textarea::placeholder{color:#62748b;opacity:1}
html[data-theme=light] :is(.secondary,.back,.link,.tab,.button:not(.primary),.download-disabled){background:var(--fx-soft);color:var(--fx-text);border-color:var(--fx-line)}
html[data-theme=light] :is(.primary,.tab.active,.choose,.gate-card button,.button.primary){color:#061321}
html[data-theme=light] .tab.active{background:linear-gradient(90deg,#3278ee,#20e28a);border-color:#00756b;color:#061321}
html[data-filmx-surface=review] header{flex-wrap:wrap}
html[data-theme=light] :is(.meta,.hint,.subtle,.empty,.subtitle,.summary,.period,.cycle,.equivalent,.notice,.date,.source,.footer,footer,.legal,.intro,.piece-help,.field label,.card label,.card p,.card li,.advantage-card ul,.roadmap-item,.advantage-hero p,.gate-card p){color:var(--fx-muted)}
html[data-theme=light] :is(.head a,.price,.summary strong,.device-title,.advantage-summary strong,.metric strong,.piece-row strong,.tag,.contact a){color:var(--fx-accent)}
html[data-theme=light] :is(.id,.year,.category,.model small,.photo-missing,.foot){color:var(--fx-muted)}
html[data-theme=light] .photo-thumb{background:var(--fx-soft);color:var(--fx-text);border-color:var(--fx-line)}
html[data-theme=light] :is(label,.metric span,.muted,.brand small,.description,.priority){color:var(--fx-muted)}
html[data-theme=light] :is(.nav a,footer a,.footer a){color:var(--fx-text)}
html[data-theme=light] strong{color:inherit}
html[data-theme=light] a:not(.button):not(.link):not(.choose):not(.back){color:#006c68}
html[data-theme=light] :is(.overview,.step,.details-button,.filters button:not(.active),.bar){background:var(--fx-soft);color:var(--fx-text);border-color:var(--fx-line)}
html[data-theme=light] .saved{color:#176442}
html[data-theme=light][data-filmx-surface=review] .primary{color:#fff!important}
html[data-theme=light][data-filmx-surface=review] .status{color:var(--fx-muted)}
html[data-theme=light] :is(h1,h2,h3,h4,.name,.brand,.card strong,.plan strong){color:var(--fx-text)}
html[data-theme=light] th,html[data-theme=light] :is(.setup-result td,.client-devices td){background:var(--fx-soft)!important;color:var(--fx-muted)}
html[data-theme=light] :is(td,.client-main td,.client-dialog-head,.device-panel,.computer,.card section){border-color:var(--fx-line)}
html[data-theme=light] tr:hover:not(.client-devices):not(.setup-result){background:#f1f6fb}
html[data-theme=light] :is(.note,.scope-note,.setup-box.warning,.status.warn,.state.pending,.state.pending-download,.compat.probable){background:#fff3d8!important;color:#785000!important;border-color:#d9b55c!important}
html[data-theme=light] :is(.state.extracted,.brand-tag.priority,.feature-state.ready,.setup-box,.status.good,.toast,.compat.confirmed,.inventory.existing,.message:not(.error)){background:#e3f5ec!important;color:#176442!important;border-color:#86baa2!important}
html[data-theme=light] :is(.approved,.finance-paid,.saving,.ok){color:#176442!important}
html[data-theme=light] :is(.danger,.status.bad,.state.missing,.message.error){background:#fce9ee!important;color:#9f2341!important;border-color:#d899a8!important}
html[data-theme=light] :is(.error,.gate-error,.finance-overdue,.inventory.missing .inventory-state){color:#9f2341!important}
html[data-theme=light] :is(.finance-pending,.status,.gate-error:empty){color:#785000}
html[data-theme=light] :is(.state.none,.state.not-started,.brand-tag.other,.feature-state.progress,.compat.single,.badge:not(.featured .badge)){background:var(--fx-soft);color:#365477;border-color:var(--fx-line)}
html[data-theme=light] :is(.advantage-hero,.contact,.ai-option:has(input:checked)){background:#e8f5f3!important;border-color:#83bdb2}
html[data-theme=light] :is(.roadmap-number,.eyebrow){color:#006c68}
html[data-theme=light] .piece-preview{background:#f5f9fc}
html[data-theme=light] dialog::backdrop{background:#1b304b77}
html[data-theme=light] .download-disabled{color:#52647c;background:#eaf0f7}
/* RYF uses a light drawing sheet even in dark mode; geometry is never recolored. */
html[data-theme=dark][data-filmx-surface=review]{--bg:var(--fx-bg);--line:var(--fx-line);--text:var(--fx-text);--muted:var(--fx-muted);--cyan:#4be0c9}
html[data-theme=dark][data-filmx-surface=review] :is(header,.card,.library-item,.vehicle-candidate,.vehicle-reference,.piece-type-options label,.edit-toolbar){background:var(--fx-panel);color:var(--fx-text);border-color:var(--fx-line)}
html[data-theme=dark][data-filmx-surface=review] :is(input,select,textarea,.readonly,.button:not(.primary),#piece-list button,.library-tabs button){background:var(--fx-soft);color:var(--fx-text);border-color:var(--fx-line)}
html[data-theme=dark][data-filmx-surface=review] :is(label,.piece-type-group legend,.vehicle-reference>p){color:var(--fx-muted)}
html[data-theme=dark][data-filmx-surface=review] :is(.library-item[aria-current=true],.piece-type-options label:has(input:checked),.library-tabs button[aria-selected=true]){background:#12403d;color:#cbfff1}
html[data-theme=dark][data-filmx-surface=review] :is(.rule,.message){background:#123d31;color:#baffea;border-color:#267d61}
html[data-theme=dark][data-filmx-surface=review] .message.error{background:#4b2029;color:#ffd5da}
@media(min-width:1100px){html[data-filmx-surface=review] .preview-head{flex-direction:row;align-items:center}html[data-filmx-surface=review] .upload-card{grid-template-columns:minmax(0,1fr) auto}}
@media(max-width:1100px){.filmx-display-tools .filmx-language-flags{display:none}.head .filmx-display-tools{gap:5px}.head>h1+div{flex:1 1 500px}}
@media(max-width:650px){.head,header.header,.shell>header,.top{align-items:center;flex-direction:row}.head .filmx-display-tools{margin-left:auto}.filmx-display-tools .filmx-theme-label>span{display:none}.head>h1+div{flex-basis:100%}.head>div:first-child:not(.filmx-display-tools){min-width:0}.filters>*{flex-basis:150px}.gate-card{padding:20px!important}.panel,.client-form{min-width:0}.gate-card label{overflow-wrap:normal}.head{padding:12px!important}.wrap{padding:12px!important}}
