:root {
  --bg: #f3f1e9;
  --surface: #ebe9df;
  --surface-2: #fffefa;
  --line: rgba(15, 15, 13, .16);
  --line-strong: rgba(15, 15, 13, .48);
  --text: #11110f;
  --muted: #686860;
  --acid: #d8ff3e;
  --danger: #b93821;
}

html { max-width: 100%; background: var(--bg); color: var(--text); }
body {
  max-width: 100%;
  background:
    linear-gradient(rgba(17, 17, 15, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(17, 17, 15, .025) 1px, transparent 1px),
    var(--bg);
  background-size: 72px 72px;
}
::selection { background: var(--acid); color: #0b0b09; }
.noise { opacity: .018; mix-blend-mode: multiply; }

.systembar {
  position: sticky;
  top: 0;
  background: rgba(243, 241, 233, .92);
  border-color: var(--line-strong);
  backdrop-filter: blur(16px);
}
.wordmark { color: var(--text); }
.system-state, .clock, .eyebrow { color: var(--muted); }
.system-state i { box-shadow: none; outline: 1px solid rgba(17, 17, 15, .4); }

.auth-shell { background: var(--bg); }
.auth-intro {
  background: linear-gradient(135deg, #eeece3 0%, #f7f5ed 65%, #e8e6dc 100%);
  border-color: var(--line-strong);
}
.auth-intro:before {
  content: "OUROBOR / PRIVATE SYSTEM";
  position: absolute;
  top: 32px;
  right: 32px;
  color: var(--muted);
  font: 8px var(--mono);
  letter-spacing: .16em;
  writing-mode: vertical-rl;
}
.auth-intro:after {
  color: transparent;
  -webkit-text-stroke: 1px rgba(17, 17, 15, .11);
}
.auth-intro h1 { color: var(--text); }
.lead { color: #4f4f49; }
.auth-index { color: #78786f; }
.auth-index span:before { content: "●"; margin-right: 10px; color: var(--text); font-size: 5px; }

.auth-panel {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--surface-2);
  border-left: 0;
}
.auth-switch { border-color: var(--line-strong); background: var(--bg); }
.auth-switch button { color: var(--muted); border-color: var(--line-strong); }
.auth-switch button:hover { color: var(--text); background: #e9e7dd; }
.auth-switch button.active { background: var(--text); color: #fffefa; }
.form-head, .section-index { color: var(--muted); border-color: var(--line-strong); }
.form-head b { color: var(--text); }
.auth-form label > span, .profile-form label > span { color: #4d4d47; }
.auth-form em { color: #898980; }
.auth-form input, .profile-form input {
  background: #fffefa;
  color: var(--text);
  border-color: var(--line);
}
.auth-form input:focus, .profile-form input:focus {
  background: #fff;
  border-color: var(--text);
  box-shadow: inset 0 -3px 0 var(--acid);
}
.auth-form input::placeholder, .profile-form input::placeholder { color: #aaa99f; }
.primary { background: var(--text); border-color: var(--text); color: #fffefa; }
.primary:hover { background: var(--acid); border-color: var(--text); color: var(--text); }
.privacy-note { color: #85857c; }
.form-success { color: #3a5a00; }
.maintenance { background: #fff8f4; border-color: rgba(185, 56, 33, .35); }
.maintenance p { color: #4e342f; }

.account-shell { min-width: 0; background: #f7f5ee; }
.sidebar {
  top: 54px;
  background: rgba(235, 233, 223, .96);
  border-color: var(--line-strong);
  backdrop-filter: blur(18px);
}
.sidebar h1 { color: var(--text); }
.account-id { color: #7d7d74; }
.account-nav { border-color: var(--line-strong); }
.account-nav button {
  color: #55554f;
  border-color: var(--line);
  transition: background .18s, color .18s, padding .18s;
}
.account-nav button:hover { padding-left: 8px; background: rgba(255, 255, 255, .55); color: var(--text); }
.account-nav button.active { background: var(--text); color: #fffefa; padding: 0 12px; }
.account-nav small { color: #898980; }
.account-nav button.active small { color: #aaa99f; }
.account-nav button.active b, .account-nav button:hover b { color: var(--acid); }
.logout { color: #5d5d56; border-color: var(--line-strong); background: rgba(255, 255, 255, .35); }
.logout:hover { color: #fff; background: var(--text); border-color: var(--text); }

.workspace, .account-page, .returns-list, .return-card, .return-chat { min-width: 0; }
.workspace { width: 100%; background: rgba(255, 254, 250, .65); }
.workspace-head { border-color: var(--line-strong); }
.workspace-head h2 { color: var(--text); }
.shop-link { color: var(--text); border-color: var(--text); }
.shop-link:hover { background: var(--acid); padding-left: 8px; padding-right: 8px; }
.shop-link span { color: var(--text); }

.metrics { border-color: var(--line-strong); background: #fffefa; }
.metric {
  border-color: var(--line-strong);
  background: linear-gradient(145deg, #fffefa, #f0eee5);
}
.metric span { color: var(--muted); }
.metric b { color: var(--text); }
.metric small { color: #85857b; }
.metric:before { content: ""; width: 18px; height: 3px; background: var(--acid); border: 1px solid rgba(17, 17, 15, .3); }

.latest { background: #fffefa; border-color: var(--line-strong); }
.latest-head { border-color: var(--line-strong); background: #eeece3; }
.latest-head p { color: var(--muted); }
.latest-head b, .order-status { color: var(--text); }
.latest-head b { padding: 6px 8px; background: var(--acid); border: 1px solid var(--text); }
.latest-empty p { color: var(--muted); }
.latest-empty a { color: var(--text); border-bottom: 1px solid var(--text); }
.latest-total { border-color: var(--line-strong); background: #eeece3; }
.route-step { color: #9a998f; }
.route-step:before { background: #d1cfc5; }
.route-step.done { color: #42423d; }
.route-step.done:before { background: var(--acid); border: 1px solid rgba(17, 17, 15, .25); }
.transmission { background: var(--acid); color: var(--text); border-color: var(--text); }
.transmission .eyebrow, .transmission > p:nth-child(2) { color: #22221e; }
.transmission a { color: var(--text); border-color: var(--text); font-weight: 700; }

.orders-list { background: #fffefa; border-color: var(--line-strong); }
.order-card { border-color: var(--line-strong); }
.order-summary { color: var(--text); }
.order-summary:hover { background: #eeece3; }
.order-summary small { color: #77776f; }
.order-summary i { color: var(--text); }
.order-status { display: inline-block; padding: 5px 7px; background: var(--acid); border: 1px solid var(--text); }
.order-detail { background: #eeece3; border-color: var(--line-strong); }
.order-item { border-color: var(--line); }
.order-meta { color: #686860; }
.order-meta b { color: var(--text); }
.empty-orders { color: var(--muted); }

.profile-form {
  width: 100%;
  max-width: none;
  background: #fffefa;
  border-color: var(--line-strong);
}
#view-profile { padding-top: 0; }
.profile-form .section-index { border-color: var(--line-strong); }

@media (min-width: 901px) {
  .profile-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .profile-grid > label { min-width: 0; grid-column: span 3; }
  .profile-grid > .profile-third { grid-column: span 2; }
  .profile-grid > .wide { grid-column: 1 / -1; }
}

.returns-index button, .return-documents button {
  color: var(--text);
  background: #fffefa;
  border-color: var(--text);
}
.returns-index button:hover, .return-documents button:hover { background: var(--text); color: #fffefa; }
.return-card { background: #fffefa; border-color: var(--line-strong); }
.return-card > header { background: #eeece3; border-color: var(--line-strong); }
.return-card > header small, .return-meta span, .return-shipment span { color: #77776f; }
.return-card > header > span { color: var(--text); background: var(--acid); border: 1px solid var(--text); padding: 6px 8px; }
.return-meta { border-color: var(--line-strong); }
.return-meta p { border-color: var(--line); }
.return-meta b { color: var(--text); }
.return-items > div { border-color: var(--line); }
.return-shipment, .return-payment { background: #f3f1e9; border-color: var(--line-strong); }
.return-documents button { background: transparent; }
.return-instruction { color: #51514b; border-color: var(--line-strong); background: #eeece3; }
.return-refund { color: #77776f; border-color: var(--line-strong); }
.return-refund b, .return-refund-total b { color: var(--text); }
.return-payment > div { border-color: var(--line-strong); }
.return-payment a { background: var(--text); color: #fffefa; }
.return-payment-paid { color: #344d00; background: #eef8c8; border-color: #617b13; }
.return-chat { background: #f8f7f1; border-color: var(--line-strong); }
.return-messages { min-width: 0; overflow-x: hidden; }
.return-message { min-width: 0; overflow-wrap: anywhere; }
.return-chat form, .return-chat form > * { min-width: 0; }
.return-chat-head, .return-chat-empty { color: var(--muted); }
.return-message { background: #e7e5db; }
.return-message.customer { background: #ecf8bd; border-color: #5a7410; }
.return-message.staff, .return-message.system { border-color: #77776f; }
.return-message span { color: #77776f; }
.return-message p { color: #2f2f2b; }
.return-chat input, .return-chat button {
  background: #fffefa;
  color: var(--text);
  border-color: var(--line-strong);
}
.return-chat button:hover { background: var(--text); color: #fffefa; }
.return-chat-file, .return-chat-attachment img, .return-chat-attachment i { border-color: var(--line-strong); }

.return-dialog { background: #f7f5ee; color: var(--text); border-color: var(--text); }
.return-dialog::backdrop { background: rgba(17, 17, 15, .66); backdrop-filter: blur(4px); }
.return-dialog header { border-color: var(--line-strong); }
.return-dialog header button { color: var(--text); }
.return-dialog label > span { color: #66665f; }
.return-dialog select, .return-dialog input, .return-dialog textarea {
  background: #fffefa;
  color: var(--text);
  border-color: var(--line-strong);
}
.return-dialog select:focus, .return-dialog input:focus, .return-dialog textarea:focus {
  border-color: var(--text);
  box-shadow: inset 0 -3px 0 var(--acid);
}
.return-form-item { background: #fffefa; border-color: var(--line-strong); }
.return-policy { color: #686860; }
.legal-check a, .profile-privacy a { color: #343430; }
.profile-privacy { color: #686860; }

.loading { background: var(--bg); }
.loading span { background: var(--text); }
.loading p { color: var(--muted); }

:focus-visible { outline: 2px solid var(--text); outline-offset: 3px; }

@media (max-width: 900px) {
  .auth-intro:before { display: none; }
  .auth-panel { background: #fffefa; }
  .sidebar { top: auto; background: #ebe9df; }
  .account-nav button:hover { padding: 0 10px; }
  .account-nav button.active { padding: 0 10px; }
  .workspace { background: #f7f5ee; }
}

@media (max-width: 560px) {
  body { background-size: 48px 48px; }
  .systembar { background: rgba(243, 241, 233, .96); }
  .auth-intro { background: #eeece3; }
  .auth-intro h1 { color: var(--text); }
  .auth-panel { box-shadow: 0 -1px 0 var(--line-strong); }
  .workspace-head { height: 108px; }
  .metric { min-height: 112px; }
  .transmission { background: var(--acid); }
}