.brand-watermark{background-image:url('../images/techeng-logo.png');background-size:contain;background-position:center;background-repeat:no-repeat;aspect-ratio:1/1}
.theme-toggle{font-size:18px}.theme-toggle .mode-label{font-size:10px;letter-spacing:.08em;text-transform:uppercase}.theme-toggle:focus-visible{outline:2px solid #d4af37;outline-offset:3px}
html[data-theme="light"]{color-scheme:light;--void:#f7f3eb;--panel:#fff;--panel2:#eee6d8;--steel:#181818;--muted:#696257;--line:rgba(77,52,0,.2);--shadow:0 10px 38px rgba(80,64,36,.12)}
html[data-theme="light"] body{background:#f7f3eb;color:#181818;background-image:radial-gradient(circle at 75% 10%,rgba(174,128,35,.09),transparent 24%),radial-gradient(circle at 10% 75%,rgba(212,175,55,.12),transparent 30%),linear-gradient(rgba(80,64,36,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(80,64,36,.035) 1px,transparent 1px);background-size:auto,auto,48px 48px,48px 48px}
html[data-theme="light"] .site-header{background:rgba(250,247,240,.88);border-bottom-color:rgba(80,64,36,.15)}html[data-theme="light"] .nav-links a{color:#49443c}html[data-theme="light"] .nav-links a:hover,html[data-theme="light"] .nav-links a.active{color:#916615}html[data-theme="light"] .title,html[data-theme="light"] .card h3,html[data-theme="light"] h2,html[data-theme="light"] h3,html[data-theme="light"] .price,html[data-theme="light"] .stat strong,html[data-theme="light"] .kpi strong{color:#24221e}html[data-theme="light"] .subtitle,html[data-theme="light"] .card p,html[data-theme="light"] .meta,html[data-theme="light"] .field label,html[data-theme="light"] .check{color:#696257}
html[data-theme="light"] .card{background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(244,237,224,.96));border-color:rgba(80,64,36,.12);box-shadow:0 14px 42px rgba(80,64,36,.08)}html[data-theme="light"] .input{background:#fff;color:#24221e;border-color:rgba(80,64,36,.2)}html[data-theme="light"] .btn{color:#24221e;background:rgba(255,255,255,.75);border-color:rgba(80,64,36,.2)}html[data-theme="light"] .btn-primary,html[data-theme="light"] .btn-orange{color:#0d0d0d}html[data-theme="light"] .product-visual,html[data-theme="light"] .mockup,html[data-theme="light"] .studio-canvas{background:radial-gradient(circle,rgba(174,128,35,.1),transparent 55%),linear-gradient(145deg,#f5efe4,#e9dfcd)}html[data-theme="light"] .footer{background:#eee6d8;border-top-color:rgba(80,64,36,.15)}html[data-theme="light"] .footer h4{color:#24221e}html[data-theme="light"] .footer a{color:#635c51}html[data-theme="light"] .chat-panel{background:#fff;color:#24221e}html[data-theme="light"] .pay-option,html[data-theme="light"] .delivery-card{border-color:rgba(80,64,36,.16)}html[data-theme="light"] .delivery-card strong{color:#24221e}html[data-theme="light"] .data-table th,html[data-theme="light"] .data-table td,html[data-theme="light"] .summary-row{border-bottom-color:rgba(80,64,36,.1)}html[data-theme="light"] .brand-watermark{opacity:.035;filter:contrast(1.05)}html[data-theme="light"] .nav-links.open{background:#f7f3eb}
@media(max-width:900px){.theme-toggle .mode-label{display:none}}

/* ============================================================
   Light mode, properly.

   The dark theme leans on glow and low-contrast greys, which
   turn to mush on a white background. Everything below gives
   light mode its own treatment rather than inheriting one that
   was designed for a dark screen.
   ============================================================ */

html[data-theme="light"]{
  --gold-ink:#8a6d1f;      /* gold is unreadable on white, this is the readable version */
  --violet-ink:#805b17;
  --ink:#181818;
  --ink-soft:#49443c;
  --hairline:rgba(80,64,36,.14);
}

/* ---- headings and eyebrows ---- */
html[data-theme="light"] .eyebrow{color:var(--gold-ink)}
html[data-theme="light"] .title,
html[data-theme="light"] h1,html[data-theme="light"] h2,
html[data-theme="light"] h3,html[data-theme="light"] h4{color:var(--ink)}
html[data-theme="light"] .title span{color:var(--violet-ink)}
html[data-theme="light"] .subtitle,
html[data-theme="light"] p{color:var(--ink-soft)}
html[data-theme="light"] small{color:#696257}

/* ---- cards and panels ---- */
html[data-theme="light"] .card,
html[data-theme="light"] .kpi-card,
html[data-theme="light"] .chart-card,
html[data-theme="light"] .attention-card,
html[data-theme="light"] .admin-table-card,
html[data-theme="light"] .co-step,
html[data-theme="light"] .co-summary,
html[data-theme="light"] .settings-card,
html[data-theme="light"] .discount-item,
html[data-theme="light"] .request-card{
  background:#fff;border-color:var(--hairline);
  box-shadow:0 2px 14px rgba(80,64,36,.07);
}
html[data-theme="light"] .product-card{background:#fff;border-color:var(--hairline)}
html[data-theme="light"] .product-card:hover{box-shadow:0 10px 34px rgba(80,64,36,.13)}

/* ---- buttons ---- */
html[data-theme="light"] .btn{
  color:var(--ink);border-color:rgba(80,64,36,.22);background:#fff;
}
html[data-theme="light"] .btn:hover{border-color:var(--gold-ink);color:var(--gold-ink)}
html[data-theme="light"] .btn-primary{
  background:linear-gradient(135deg,#d4af37,#c9a227);color:#1a1400;border-color:transparent;
  font-weight:700;
}
html[data-theme="light"] .btn-primary:hover{background:linear-gradient(135deg,#e0bd47,#d4af37)}

/* ---- form fields ---- */
html[data-theme="light"] .input,
html[data-theme="light"] select.input,
html[data-theme="light"] textarea.input{
  background:#fff;color:var(--ink);border-color:rgba(80,64,36,.2);
}
html[data-theme="light"] .input::placeholder{color:#777063}
html[data-theme="light"] .input:focus{border-color:var(--gold-ink);box-shadow:0 0 0 3px rgba(212,175,55,.18)}
html[data-theme="light"] label{color:var(--ink-soft)}

/* ---- tables ---- */
html[data-theme="light"] .data-table th{
  background:rgba(212,175,55,.1);color:var(--gold-ink);border-bottom-color:rgba(140,104,0,.3);
}
html[data-theme="light"] .data-table td{color:var(--ink);border-bottom-color:var(--hairline)}
html[data-theme="light"] .data-table tr:hover td{background:rgba(212,175,55,.06)}

/* ---- status pills: these were the worst offenders ---- */
html[data-theme="light"] .pill-new{background:rgba(174,128,35,.12);color:#4c1d95;border-color:rgba(174,128,35,.3)}
html[data-theme="light"] .pill-wait{background:rgba(180,120,0,.14);color:#8a5a00;border-color:rgba(180,120,0,.32)}
html[data-theme="light"] .pill-work{background:rgba(212,175,55,.16);color:#7a5c0f;border-color:rgba(140,104,0,.34)}
html[data-theme="light"] .pill-good{background:rgba(16,122,87,.12);color:#0f6b4a;border-color:rgba(16,122,87,.3)}
html[data-theme="light"] .pill-bad{background:rgba(185,28,58,.1);color:#a01633;border-color:rgba(185,28,58,.3)}
html[data-theme="light"] .status{background:rgba(212,175,55,.14);color:#7a5c0f}

/* ---- the gold gradient text goes invisible on white ---- */
html[data-theme="light"] .kpi-card.is-money strong,
html[data-theme="light"] .co-total b,
html[data-theme="light"] .modal-actions ~ * .total-row b,
html[data-theme="light"] .co-sticky-total b{
  background:none;-webkit-text-fill-color:initial;color:var(--gold-ink);
}
html[data-theme="light"] .nf-code{background:none;-webkit-text-fill-color:initial;color:var(--gold-ink)}

/* ---- header, footer, notes ---- */
html[data-theme="light"] .nav-links a{color:var(--ink-soft)}
html[data-theme="light"] .nav-links a:hover{color:var(--gold-ink)}
html[data-theme="light"] .footer{background:#f0e9dd;border-top-color:var(--hairline)}
html[data-theme="light"] .footer a{color:var(--ink-soft)}
html[data-theme="light"] .footer a:hover{color:var(--gold-ink)}
html[data-theme="light"] .footer h4{color:var(--gold-ink)}
html[data-theme="light"] .admin-note,
html[data-theme="light"] .legal-note{background:rgba(174,128,35,.07);border-left-color:var(--violet-ink);color:var(--ink-soft)}
html[data-theme="light"] .notice{color:#696257}
html[data-theme="light"] .summary-row{border-bottom-color:var(--hairline)}
html[data-theme="light"] .summary-row span{color:var(--ink-soft)}
html[data-theme="light"] .summary-row b{color:var(--ink)}

/* ---- choices on the checkout ---- */
html[data-theme="light"] .co-choice{border-color:rgba(80,64,36,.16);background:#fff}
html[data-theme="light"] .co-choice:has(input:checked){border-color:var(--gold-ink);background:rgba(212,175,55,.09)}
html[data-theme="light"] .co-choice small{color:#696257}
html[data-theme="light"] .co-cost{color:var(--gold-ink)}
html[data-theme="light"] .co-hint{color:#696257}
html[data-theme="light"] .co-note{background:rgba(174,128,35,.07);color:var(--ink-soft)}

/* ---- admin in daylight ---- */
html[data-theme="light"] .admin-bar{background:#fff;border-color:var(--hairline)}
html[data-theme="light"] .admin-bar .env-note{color:#696257}
html[data-theme="light"] .admin-tabs .tab{color:var(--ink-soft);border-color:rgba(80,64,36,.18)}
html[data-theme="light"] .admin-tabs .tab.active{
  background:rgba(212,175,55,.16);border-color:var(--gold-ink);color:#7a5c0f;
}
html[data-theme="light"] .ref-btn{color:var(--gold-ink);border-color:rgba(140,104,0,.35)}
html[data-theme="light"] .empty-row td{color:#696257}

/* ---- the glow effects simply do not work on white ---- */
html[data-theme="light"] .brand-scan,
html[data-theme="light"] .brand-watermark{opacity:.05}
html[data-theme="light"] .glow{text-shadow:none;color:var(--gold-ink)}