:root{--brand-primary:#c9192e;--brand-ink:#202024;--brand-background:#f6f5f3;--brand-surface:#fff;--brand-muted:#66636b;--brand-font:Arial,sans-serif;--brand-radius:14px;--bg:var(--brand-background);--white:var(--brand-surface);--ink:var(--brand-ink);--muted:var(--brand-muted);--green:var(--brand-primary);--green-light:#f9e9ec;--lime:#f0c9cf;--border:#dedbdf;--radius:var(--brand-radius)}
html,body{font-family:var(--brand-font)!important;background:var(--brand-background);color:var(--brand-ink)}
body{padding-bottom:25px}header,.topbar{background:var(--brand-surface)}
.brand .trademar-logo,.trademar-logo{display:block;width:175px;height:94px;object-fit:cover;max-width:100%;letter-spacing:normal}
.trademar-logo.dark-logo{background:#111;padding:8px;border-radius:8px;object-fit:contain}
.brand{color:var(--brand-ink)}
.button-primary,.primary,.tabs .active{background:var(--brand-primary);border-color:var(--brand-primary);color:#fff}
h1 em,h1 span,.eyebrow,.big,.profit{color:var(--brand-primary)}
.panel,section{background:var(--brand-surface);border-radius:var(--brand-radius)}
.summary,.transport-panel{background:var(--brand-surface);border-color:#dedbdf;color:var(--brand-ink)}
.summary h2,h2 span{color:var(--brand-ink)}
label,.unit-picker label,.variant-name label,.small-label,.note,.muted,.intro-copy,.intro-aside,.intro-aside-line,.catalog-model-name>small,.catalog-line-name>small,.catalog-summary>span,.catalog-summary>div>span,.compare-stat,.photo-controls p,.model-select small,.transport-stats span,.transport-stats small,.editor-note,.comparison-note{color:var(--brand-muted)}
.button-soft,.button-outline{background:var(--brand-background);color:var(--brand-ink);border-color:var(--border)}
.button-soft:hover,.button-outline:hover,.button-primary:hover{background:var(--brand-ink);color:var(--brand-surface)}
.catalog-model-head,.product-photo-editor,.order-row,.step,.privacy,.note,.compare-card.current,.summary input{background:var(--brand-background);border-color:var(--border)}
.catalog-panel .model-card,.catalog-panel .model-card.active,.compare-card{background:var(--brand-surface);border-color:var(--border)}
.catalog-panel .model-card.active,.compare-card.best{border-color:var(--brand-primary)}
.catalog-line.ordered{background:color-mix(in srgb,var(--brand-primary) 5%,var(--brand-surface))}
.catalog-line-name>strong>span,.catalog-line-volume,.catalog-summary strong,.compare-stat strong,.euro,.packing-actions strong{color:var(--brand-primary)}
.catalog-copy,.catalog-photo,.photo-preview>span{color:var(--brand-muted);border-color:var(--border)}
.catalog-copy:hover{background:var(--brand-background);color:var(--brand-primary)}
.results-panel{background:var(--brand-primary);color:#fff}
.results-panel .result-label,.results-panel .metric-label,.results-panel .results-meta,.results-panel .results-footnote{color:#fff}
.results-panel .results-meta strong{color:#fff}
.results-divider{background:#ffffff50}.order-tag{background:#ffffff20;color:#fff;border-color:#ffffff60}
input,select,.variant-name input,.model-name-row input,.unit-picker select{background:var(--brand-surface);color:var(--brand-ink);border-color:var(--border)}
a{color:var(--brand-primary)}
button,input,select{font-family:var(--brand-font)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--brand-primary);outline-offset:3px}
.app-switcher{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:4px;padding:12px 8px 5px;margin:20px auto 0;max-width:420px;border-top:1px solid #ddd9df}
.app-switcher a{font-family:Arial,sans-serif;font-size:11px;line-height:1.4;letter-spacing:.1px;color:var(--brand-muted);text-decoration:none;padding:6px 11px;border-radius:20px}
.app-switcher a:hover{background:#eae6ea;color:var(--brand-ink)}.app-switcher a[aria-current=page]{background:var(--brand-surface);color:var(--brand-primary);box-shadow:0 1px 5px #0000000c}
@media(max-width:560px){.brand .trademar-logo{width:135px;height:75px}.app-switcher{margin:12px 16px 0}}
@media print{.app-switcher{display:none}}

/* Shared modern interface — all apps use the live brand settings. */
.server-storage{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:11px 14px;margin:0 0 20px;border:1px solid var(--border);border-radius:10px;background:var(--brand-surface);font-size:11px;color:var(--brand-muted)}.server-storage span{flex:1;min-width:200px}.server-storage[data-state=error]{border-color:#d9a3a3}.server-storage[data-state=saved] span:before{content:'●';color:#3e8155;margin-right:7px}.server-storage a,.server-storage button{font-size:11px;padding:6px 9px}.server-storage [hidden]{display:none}
:root{--border:color-mix(in srgb,var(--brand-ink) 10%,var(--brand-surface));--shadow:0 3px 18px #17121c04,0 1px 2px #17121c03}
body{padding-top:42px;padding-bottom:24px;-webkit-font-smoothing:antialiased}
header,.topbar{max-width:none;padding:14px max(28px,calc((100vw - 1380px)/2));border-bottom:1px solid var(--border);min-height:88px}
.brand .trademar-logo{width:135px;height:70px}.brand .trademar-logo.dark-logo{width:135px;height:70px}
main{max-width:1420px;padding:38px 32px;margin:auto}
.intro{padding:16px 0 10px;margin-bottom:30px;gap:32px;align-items:center}
.intro .eyebrow{font-size:10px;letter-spacing:2.1px;margin-bottom:15px}
h1{font-size:clamp(32px,3.6vw,52px);line-height:1.08;letter-spacing:-1.9px;font-weight:650;margin:12px 0 18px;text-wrap:balance}
.intro p,.intro-copy{font-size:13px;line-height:1.7;max-width:590px}
.intro h1 em,.intro h1 span{color:var(--brand-muted);font-weight:450}
.badge,.privacy,.edition{font-size:10px;letter-spacing:.3px;border:1px solid var(--border);background:var(--brand-surface);color:var(--brand-muted);padding:8px 12px;border-radius:20px}
.layout{grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start}
.workspace{gap:24px}
section,.panel,.catalog-panel,.compare-card{border:1px solid var(--border);box-shadow:var(--shadow);border-radius:var(--brand-radius)}
section,.packing-panel{padding:26px}.heading{align-items:center;margin-bottom:6px}
h2{font-size:13px;font-weight:650;letter-spacing:-.2px;color:var(--brand-muted)}h2 span{font-size:18px;font-weight:600;letter-spacing:-.4px}
.section-header h2,.section-title h2{font-size:18px;font-weight:600;letter-spacing:-.45px}
button,.button{border:1px solid var(--border);border-radius:9px;font-weight:550;padding:10px 14px;line-height:1.3;transition:background .16s,box-shadow .16s,border-color .16s;box-shadow:0 1px 2px #17121c05}
button:hover,.button:hover{filter:none;border-color:color-mix(in srgb,var(--brand-primary) 30%,var(--border));box-shadow:0 2px 8px #17121c0a}
.actions button,.actions .button{background:var(--brand-surface);color:var(--brand-ink)}
.primary,.button-primary,.save,.tabs .active{background:var(--brand-primary);color:#fff;border-color:var(--brand-primary)}
.tabs{gap:6px;padding:5px;background:var(--brand-background);border-radius:11px;width:fit-content;max-width:100%}
.tabs button{box-shadow:none;border-color:transparent;background:transparent}.tabs .active{background:var(--brand-surface);color:var(--brand-ink);box-shadow:0 1px 5px #17121c12;border-color:var(--border)}
.fields{gap:16px;margin:22px 0}label{font-size:11px;font-weight:550;line-height:1.5}
input,select{border-radius:8px;border-color:var(--border);min-height:41px;background:color-mix(in srgb,var(--brand-background) 35%,var(--brand-surface));font-size:13px;font-variant-numeric:tabular-nums;box-shadow:inset 0 1px 2px #17121c02}
input:hover,select:hover{border-color:color-mix(in srgb,var(--brand-ink) 23%,var(--brand-surface))}input:focus,select:focus{border-color:var(--brand-primary);outline:2px solid color-mix(in srgb,var(--brand-primary) 15%,transparent);outline-offset:1px}
.scroll{border:1px solid var(--border);border-radius:10px;margin-top:20px}
th{font-size:10px;font-weight:650;letter-spacing:.15px;background:var(--brand-background);padding:12px 9px;color:var(--brand-muted);white-space:nowrap}
td{padding:7px 6px;border-bottom:1px solid var(--border)}tr:last-child td{border-bottom:0}td input,td select{min-height:35px;padding:8px 7px;font-size:12px;margin-top:0}td:first-child{min-width:190px}td:first-child input:last-child{margin-top:4px;background:transparent;min-height:26px}
.note{font-size:11px;line-height:1.65;background:var(--brand-background);padding:12px 14px;border-radius:9px;border-left:2px solid var(--border)}
.summary,.results-panel{background:var(--brand-ink);color:var(--brand-surface);border-color:var(--brand-ink);box-shadow:0 10px 35px #17121c0c}
.summary{top:62px;padding:27px}.summary h2,.summary h3,.summary .big,.summary .profit,.summary .line b{color:var(--brand-surface)}
.summary .eyebrow{color:color-mix(in srgb,var(--brand-surface) 65%,var(--brand-ink));letter-spacing:1.6px}.summary h2{font-size:23px;font-weight:500;letter-spacing:-.7px}
.big{font-size:42px;font-weight:550;letter-spacing:-1.8px;font-variant-numeric:tabular-nums}.summary .euro{color:color-mix(in srgb,var(--brand-surface) 65%,var(--brand-ink));font-size:16px}
.summary label,.summary .muted,.summary .line span{color:color-mix(in srgb,var(--brand-surface) 70%,var(--brand-ink))}.summary .note{background:#ffffff0a;color:color-mix(in srgb,var(--brand-surface) 80%,var(--brand-ink));border-left-color:#ffffff30}
.summary input,.summary select{background:var(--brand-surface);color:var(--brand-ink);border-color:transparent}.summary .rule{background:#ffffff20}.summary .danger{color:#ff9b9b}
.results-panel .order-tag{background:#ffffff12}.results-panel .results-footnote{opacity:.75}.results-panel .result-label{opacity:.75}
.catalog-model-head{background:var(--brand-surface);padding:17px}.catalog-panel .model-card{box-shadow:none}.catalog-panel .model-card.active{border-color:color-mix(in srgb,var(--brand-primary) 35%,var(--border))}
.catalog-line.ordered{background:color-mix(in srgb,var(--brand-primary) 3%,var(--brand-surface))}.catalog-summary strong{color:var(--brand-ink);font-weight:550;letter-spacing:-.6px}.product-photo-editor{background:var(--brand-background);border:1px dashed var(--border)}
.app-switcher{position:fixed;z-index:100;top:0;bottom:auto;left:0;right:0;max-width:none;min-height:42px;margin:0;padding:6px 16px;gap:5px;border:0;border-bottom:1px solid var(--border);border-radius:0;background:color-mix(in srgb,var(--brand-surface) 96%,transparent);backdrop-filter:blur(14px)}
.app-switcher a{font-family:var(--brand-font);font-size:11px;font-weight:550;padding:5px 13px;border-radius:6px;line-height:1.5;color:var(--brand-muted)}
.app-switcher a:hover{background:var(--brand-background)}.app-switcher a[aria-current=page]{background:var(--brand-background);color:var(--brand-ink);box-shadow:inset 0 0 0 1px var(--border)}
.logo-stage{border-radius:12px}.save-actions{gap:10px}.preview{top:60px}.preview .sample-result{border-color:var(--border)}
@media(min-width:1101px){.layout>aside{position:sticky;top:62px;align-self:start}.layout>aside .summary{position:static}}
@media(max-width:1100px){.layout{grid-template-columns:1fr}.summary{position:static}.layout>aside{max-width:none}.intro{display:block}.intro>.actions{margin-top:20px}}
@media(max-width:760px){main{padding:24px 18px}.workspace{gap:18px}header,.topbar{padding:10px 22px}.intro{margin-bottom:24px}.intro h1{letter-spacing:-1.2px}section,.packing-panel{padding:20px}.preview{position:static}}
@media(max-width:560px){body{padding-top:42px}.app-switcher{margin:0;padding:6px;gap:3px}.app-switcher a{font-size:10px;padding:5px 10px}.brand .trademar-logo{width:114px;height:60px}.fields{gap:12px}.heading{flex-wrap:wrap}.summary{padding:23px}.big{font-size:38px}.badge,.privacy{font-size:9px;max-width:145px}.catalog-panel .model-card{min-width:0}.colors{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){button,.button{transition:none}}
@media print{body{padding-top:0}.app-switcher{display:none}.layout>aside{position:static}.summary,.results-panel{background:white!important;color:#111!important;box-shadow:none}.summary h2,.summary h3,.summary .big,.summary .profit,.summary .line b,.summary .line span,.summary label,.summary .muted,.summary .euro,.summary .note{color:#111!important}}
