/* Shared website and management tokens. */
:root { --brand-primary:#0756e8; --brand-logo-size:44px; --brand-font:"Segoe UI",system-ui,sans-serif; --blue:#0756e8; --blue-dark:#0646bf; --ink:#15171c; --muted:#59616e; --line:#dce1e9; --wash:#f4f6f9; --surface:#fff; --tint:#eaf1ff; --shadow:0 5px 20px rgba(0,0,0,.05); }
html[data-color-mode="dark"] { --blue:#91b5ff; --blue-dark:#afcaff; --ink:#f4f5f7; --muted:#b2bac7; --line:#363c48; --wash:#0d0f13; --surface:#181b22; --tint:#1c2c48; --shadow:none; }
html[data-color-mode="dark"] body { --blue:#91b5ff!important; }
body { color:var(--ink); background:var(--surface); font-family:var(--brand-font); font-size:1rem; line-height:1.6; letter-spacing:0; }
button,input,select,textarea { font-family:inherit; letter-spacing:0; }
input,select,textarea { color:var(--ink); background:var(--surface); border-color:var(--line); font-size:1rem; }
input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="range"]),select { min-height:46px; }
input::placeholder,textarea::placeholder { color:var(--muted); opacity:1; }
input[type="checkbox"],input[type="radio"] { accent-color:var(--brand-primary); }
:where(a,button,input,select,textarea,summary):focus-visible { outline:3px solid var(--blue); outline-offset:3px; }
:where(h1,h2,h3,p,label,strong,button,a) { overflow-wrap:anywhere; }
:where(h1,h2,h3) { color:inherit; letter-spacing:0; }
.site-header,.main-nav,.admin-header,.admin-sidebar { background:var(--surface); border-color:var(--line); }
.nav-shell { min-height:80px; height:auto; padding-block:10px; }
.brand { min-width:0; flex-shrink:1; white-space:normal; color:var(--ink); font-size:1rem; line-height:1.25; }
.brand span { max-width:24ch; }
.brand img,.admin-brand img { width:var(--brand-logo-size); height:var(--brand-logo-size); flex:none; object-fit:contain; clip-path:none; margin:0; border-radius:4px; background:white; }
.footer-logo { object-fit:contain; background:white; border-radius:4px; padding:4px; }
.main-nav { gap:16px; }
.nav-shell > .main-nav { margin-left:auto; }
.nav-shell > .theme-toggle { order:3; }
.nav-shell > .menu-button { order:4; }
.main-nav > a:not(.button) { font-size:.875rem; color:var(--ink); min-height:44px; display:inline-flex; align-items:center; }
.main-nav a[aria-current="page"] { color:var(--blue); box-shadow:inset 0 -2px var(--blue); }
.theme-toggle { width:44px; height:44px; flex:none; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:6px; color:var(--ink); background:var(--surface); padding:0; cursor:pointer; }
.theme-toggle img { width:20px; height:20px; }
html[data-color-mode="dark"] .theme-toggle img,html[data-color-mode="dark"] .category-shortcuts img { filter:brightness(0) invert(1); }
.button,.primary-button,.secondary-button,.social-button { min-height:46px; border-radius:6px; gap:8px; line-height:1.35; padding-block:10px; text-align:center; }
.button-primary,.primary-button { background:var(--brand-primary); border-color:var(--brand-primary); color:white; box-shadow:none; }
.button-primary:hover,.primary-button:hover { background:var(--brand-primary); filter:brightness(.92); transform:none; box-shadow:none; }
.button-outline,.button-white,.secondary-button,.social-button { background:var(--surface); border-color:var(--line); color:var(--ink); }
.button-outline:hover,.secondary-button:hover,.social-button:hover { background:var(--tint); border-color:var(--blue); color:var(--blue); }
.social-actions { grid-template-columns:1fr; }
.social-button { padding-inline:12px; overflow-wrap:anywhere; }
.social-button img { flex-shrink:0; object-fit:contain; background:#fff; border-radius:3px; }
.text-link,.auth-links,.account-nav a.active { color:var(--blue); }
.page-band,.market-toolbar,.home-offer-band,.admin-body,.login-body { background:var(--wash); }
.page-band { padding-block:32px; }
.page-band h1,.account-head h1 { font-size:2rem; line-height:1.25; }
.content-section { padding-block:32px 56px; }
.search-home { background-position:center; }
.search-home::before { background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.60) 55%,rgba(0,0,0,.12)); }
.search-home h1 { font-size:2.75rem; color:white; }
.home-title-line { font-size:1.75rem; }
.search-home-copy { color:#eef2f8; font-size:1rem; line-height:1.6; }
.search-home .eyebrow { color:#c4d8ff; font-size:.8rem; }
.search-home .search-modes,.search-home .home-search-fields { background:var(--surface); border-color:var(--line); color:var(--ink); }
.search-home .search-modes button { color:var(--muted); font-size:.875rem; min-height:44px; }
.search-home .search-modes button.active { background:var(--tint); color:var(--blue); }
.search-home .home-search-fields label { color:var(--muted); font-size:.8125rem; }
.search-home .home-search-fields input { background:transparent; color:var(--ink); font-size:1rem; }
.category-band .eyebrow,.home-market .eyebrow,.home-offer-band .eyebrow { color:var(--blue); font-size:.8rem; }
.category-shortcuts a,.category-shortcuts a:nth-child(n),.home-offer-actions > a,.home-preview,.home-preview-result { background:var(--surface); color:var(--ink); border-color:var(--line); }
.category-shortcuts a:hover,.home-offer-actions > a:hover { border-color:var(--blue); background:var(--tint); }
.category-shortcuts strong { font-size:.9375rem; }
.category-band h2,.home-market-head h2,.home-offer-band h2 { font-size:1.5rem; }
.home-job-row { border-color:var(--line); }
.home-job-row:hover { background:var(--tint); }
.home-job-row>span,.home-offer-actions span,.home-preview-result p { color:var(--muted); }
.auth-panel,.market-job,.freelancer-card,.profile-main,.dashboard-row,.invoice-sheet,.thread-panel,.message-panel,.booking-panel,.content-form,.content-table,.appointment-card,.metric-card,.admin-queue-grid>a { background:var(--surface); color:var(--ink); border-color:var(--line); box-shadow:none; }
.stack-form label,.profile-form label,.post-form label,.reply-form label,.comment-form label,.content-form label { color:var(--ink); font-size:.875rem; }
.stack-form input,.stack-form textarea,.stack-form select,.profile-form input,.post-form input,.post-form textarea,.post-form select,.reply-form input,.reply-form textarea,.comment-form textarea { background:var(--surface); border-color:var(--line); color:var(--ink); font-size:1rem; }
.auth-panel p,.field-help,.body-preview,.booking-notes,.account-nav a,.admin-role-label,.admin-breadcrumb,.admin-subtabs>a,.market-side,.market-side p { color:var(--muted); }
.role-badge,.state-badge { background:var(--tint); color:var(--blue); border-radius:4px; font-size:.8rem; }
.market-job h2,.freelancer-card h2 { font-size:1.125rem; }
.market-job p,.freelancer-card p { line-height:1.6; }
.market-toolbar label { color:var(--ink); }
.thread-link,.message-composer,.agreement-panel,.booking-summary,.vault-entry { background:var(--surface); color:var(--ink); border-color:var(--line); }
.conversation-shell,.conversation-panel,.booking-workflow,.message-item { background:var(--surface); color:var(--ink); border-color:var(--line); }
.conversation-sidebar { background:var(--wash); }
.conversation-row:hover,.conversation-row.active,.message-item-own,.conversation-avatar { background:var(--tint); }
.conversation-row.active { box-shadow:inset 3px 0 0 var(--blue); }
.message-text,.message-item-head strong,.booking-form label,.thread-picker label,.message-composer>label,.voice-upload label { color:var(--ink); }
.conversation-copy span,.freelancer-rate-line { color:var(--muted); }
.booking-form input,.booking-form select,.booking-form textarea,.thread-picker select { background:var(--surface); color:var(--ink); border-color:var(--line); }
.message-bubble,.message-mine .message-bubble { background:var(--tint); color:var(--ink); }
.work-timeline { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; list-style:none; padding:0; margin:20px 0; }
.work-timeline li { border-top:3px solid var(--line); padding-top:9px; color:var(--muted); font-size:.8125rem; }
.work-timeline li[data-done="true"] { border-color:var(--blue); color:var(--ink); }
.work-timeline li[aria-current="step"] { color:var(--blue); font-weight:700; }
.work-timeline small { display:block; color:var(--muted); margin-top:4px; }
.work-progress { padding-top:24px; }
.work-progress p { font-size:.9375rem; }
.admin-header .header-inner { min-height:80px; height:auto; padding-block:10px; gap:16px; flex-wrap:wrap; }
.admin-brand { min-width:0; white-space:normal; line-height:1.3; }
.admin-brand strong { max-width:24ch; }
.admin-brand span { color:var(--muted); }
.admin-sidebar { top:var(--admin-header-height,80px); }
.login-panel,.metric-grid>div,.appointment-item,.settings-list,.empty-state,.admin-directory a { background:var(--surface); border-color:var(--line); color:var(--ink); box-shadow:none; }
.appointment-details { background:var(--wash); }
.request-details p,.icon-text-button,.back-link,.view-tabs a { color:var(--muted); }
.view-tabs a.active { color:var(--blue); }
.login-brand img { object-fit:contain; background:white; border-radius:4px; }
.admin-nav-group > summary:hover,.admin-subtabs>a:hover,.admin-directory a:hover { background:var(--tint); color:var(--blue); }
.admin-subtabs>a[aria-current],.admin-nav-group a[aria-current] { color:var(--blue); background:var(--tint); }
.admin-menu-tools button,.admin-monitor-filters input,.admin-monitor-filters select,.admin-menu-search input { background:var(--surface); color:var(--ink); border-color:var(--line); }
.content-table th { color:var(--muted); background:var(--wash); }
.content-form { border:0; border-radius:0; padding:0; max-width:none; }
.brand-settings-form fieldset { border:0; border-bottom:1px solid var(--line); margin:0; padding:0 0 28px; min-width:0; }
.brand-settings-form,.brand-settings-form fieldset { background:transparent; }
.brand-settings-form legend { font-size:1.125rem; font-weight:700; padding:0 0 20px; }
.brand-settings-form .settings-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; max-width:900px; }
.brand-settings-form .wide { grid-column:1/-1; }
.brand-preview { display:flex; align-items:center; gap:16px; margin-bottom:22px; min-width:0; }
.brand-preview img { width:64px; height:64px; object-fit:contain; background:white; border:1px solid var(--line); border-radius:6px; }
.brand-preview strong { font-size:1.25rem; }
.brand-settings-form small { font-weight:400; color:var(--muted); }
.brand-settings-form input[type="file"] { height:auto; min-height:46px; padding:8px; max-width:100%; }
.settings-save { border-top:1px solid var(--line); padding:16px 0; }
.admin-body .kicker { color:var(--blue); }
.site-footer { background:#101216; color:#f3f4f7; }
.site-footer p,.site-footer a,.site-footer .copyright { color:#c4cbd5; }
.site-footer h2 { color:#f3f4f7; }
.footer-logo { width:80px; height:80px; }
:root[data-color-mode] :is(.category-band,.home-market,.stats-band,.home-demo-band,.home-job-row,.service-card,.job-card,.job-apply-panel,.reply-panel,.reply-item,.messenger-layout,.vault-row,.blog-card,.comment,.quick-post-panel>div,.demo-card,.offer-listing,.offer-manage-row,.offer-inquiry-row,.offer-contact-panel,.sos-provider-card,.staff-row) { background:var(--surface); color:var(--ink); border-color:var(--line); }
:root[data-color-mode] :is(.listing-view-controls,.offer-tabs,.auth-tabs,.messenger-message-list) { background:var(--wash); color:var(--ink); }
:root[data-color-mode] :is(.listing-view-controls button,.offer-tabs a,.auth-tabs a,.blog-topic-filter a,.quick-budget button,.details-button) { background:var(--surface); color:var(--ink); border-color:var(--line); }
:root[data-color-mode] :is(.listing-view-controls button[aria-pressed="true"],.offer-tabs a[aria-current],.auth-tabs a.active,.blog-topic-filter a[aria-current],.quick-budget button.active,.account-nav a.active,.service-code,.form-icon,.profile-avatar,.market-category,.blog-card-topic,.article-topic) { background:var(--tint); color:var(--blue); border-color:var(--line); }
:root[data-color-mode] .home-job-row .role-badge { background:var(--tint); color:var(--blue); }
:root[data-color-mode] :is(input,select,textarea) { background-color:var(--surface); color:var(--ink); border-color:var(--line); }
:root[data-color-mode] :is(.article-body,.profile-bio,.reply-body,.job-description,.job-detail-body,.offer-description) { color:var(--ink); }
:root[data-color-mode] .content-table tr:hover td { background:var(--wash); }
:root[data-color-mode="dark"] :is(.offer-safety,.offer-trust-note,.demo-disclaimer,.demo-badge) { background:#352b1c; color:#f3d6a5; }
:root[data-color-mode="dark"] .sos-safety-note { background:#351b20; color:#ffc1bc; }
html[data-color-mode="dark"] :is(.alert-success,.notice-success,.notice-info,.verification-progress .complete) { color:#b2d1ff; background:#172941; border-color:#476d9f; }
html[data-color-mode="dark"] :is(.alert-error,.notice-error) { color:#ffc1bc; background:#351b20; border-color:#8e4b54; }
html[data-color-mode="dark"] :is(.state-open,.state-published,.state-approved,.state-active) { color:#c1d7ff; background:#1d304d; }
html[data-color-mode="dark"] :is(.state-pending,.state-draft) { color:#f3d6a5; background:#352b1c; }
@media(max-width:1120px) { .brand { margin-right:auto; } .theme-toggle { margin-left:auto; } .main-nav { top:100%; } .site-header { position:sticky; } }
@media(max-width:800px) { .admin-sidebar { top:auto; } .work-timeline { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:700px) {
  .nav-shell { gap:10px; min-height:72px; padding-block:8px; }
  .brand { flex:1; font-size:.9375rem; }
  .brand span { max-width:18ch; }
  .brand img { width:min(var(--brand-logo-size),52px); height:min(var(--brand-logo-size),52px); }
  .search-home h1 { font-size:2rem; }
  .home-title-line { font-size:1.375rem; }
  .search-home-copy { font-size:.9375rem; }
  .page-band h1,.account-head h1 { font-size:1.75rem; }
  .home-search-fields { gap:10px; }
  .page-actions .button { flex:1; }
  .brand-settings-form .settings-fields { grid-template-columns:minmax(0,1fr); }
  .admin-brand { flex:1; }
  .admin-brand img { width:44px; height:44px; }
  .admin-brand strong { font-size:.9375rem; }
  .admin-header .management-links { margin-left:auto; gap:8px; }
  .content-form input,.content-form textarea,.content-form select { min-width:0; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }
