:root {
  --green: #98712b;
  --green2: #b38b45;
  --mint: #f7eedb;
  --cream: #faf7f0;
  --ink: #292319;
  --muted: #807664;
  --line: #e9dfca;
  --orange: #d3a847;
}

body { background: var(--cream); }
.topbar { background: #98712b; }
.brand small, .top-actions { color: #fff1d1; }
.nav.active { color: #765317; background: #f5ead0; }
.nav { color: #746c5b; }
.btn-primary { background: #96702b; }
.btn-primary:hover { background: #b18a42; }
.chip.on { background: #96702b; border-color: #96702b; }
.table-card.selected { outline-color: #c29b4f; }
.table-card:hover, .product:hover { border-color: #c8a65c; }
.product:hover { background: #fffaf0; }
.side-foot { background: #f5ecd9; color: #71664f; }
.side-foot b { color: #87641f; }
.toast { background: #72541e; }
.order-total-pill, .report-choice-icon { background: #f5ead0; color: #765317; }
.method.selected { border-color: #a98135; background: #f7eedb; color: #765317; }
.restock button { background: #f5ead0; color: #765317; }
.inventory > .demo-panel > .report-head {
  padding: 18px 20px 14px;
  margin: 0;
}

.auth-glow {
  width: min(360px, 82vw);
  height: 190px;
  margin: 0 auto 12px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  animation: none;
  overflow: visible;
}
.auth-glow img { width: 100%; height: 100%; object-fit: contain; }
.auth-welcome { animation: none; opacity: 1; transform: none; }

.startup-splash {
  position: fixed;
  inset: 0;
  z-index: 30;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: radial-gradient(ellipse at center, #fffaf0 0%, #f4ead5 72%, #e8d7b5 100%);
  animation: splashFade 0.45s ease 3s forwards;
}
.splash-glow {
  position: absolute;
  width: min(62vw, 580px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, #f4d88690 0%, #d4aa4e40 38%, #d4aa4e00 72%);
  filter: blur(18px);
  animation: glowGrow 3s ease-out both;
}
.splash-glint {
  position: absolute;
  z-index: 1;
  width: min(100vw, 1050px);
  height: 8px;
  left: -110%;
  top: 50%;
  transform: rotate(-22deg);
  background: linear-gradient(90deg, transparent, #f8df91 48%, #fff9df 50%, #c28d28 53%, transparent);
  filter: blur(3px) drop-shadow(0 0 18px #c28d28);
  animation: glintSweep 2.1s ease-in-out 0.5s both;
}
.splash-logo {
  position: relative;
  z-index: 2;
  width: min(74vw, 780px);
  max-height: 78vh;
  object-fit: contain;
  opacity: 0;
  filter: drop-shadow(0 12px 35px #9c762d45);
  animation: logoApproach 3s cubic-bezier(.18,.72,.18,1) both;
}
@keyframes logoApproach {
  0% { opacity: 0; transform: scale(.12); }
  12% { opacity: 1; }
  100% { opacity: 1; transform: scale(1); }
}
@keyframes glowGrow {
  0% { opacity: .15; transform: scale(.12); }
  100% { opacity: 1; transform: scale(1.12); }
}
@keyframes glintSweep {
  0% { left: -110%; opacity: 0; }
  18% { opacity: .95; }
  82% { opacity: .8; }
  100% { left: 120%; opacity: 0; }
}
@keyframes splashFade { to { opacity: 0; visibility: hidden; pointer-events: none; } }
@media (max-width: 720px) {
  .splash-logo { width: 88vw; }
  .auth-glow { width: min(340px, 86vw); height: 160px; }
  .inventory > .demo-panel > .report-head { padding: 15px 16px 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .splash-logo, .splash-glow, .splash-glint, .startup-splash { animation-duration: .01ms; }
}

/* Brand palette and app-shell alignment overrides */
:root { --green:#98712b; --green2:#b38b45; --mint:#f7eedb; --cream:#faf7f0; --ink:#292319; --muted:#807664; --line:#e9dfca; --orange:#d3a847; }
body { background:var(--cream); }
.topbar { background:#98712b; }
.side { display:flex; flex-direction:column; }
.side-foot { position:static; margin-top:auto; }
.side-foot span { display:block; margin-bottom:12px; }
.update-button { background:#98712b; border:1px solid #b38b45; }
.update-button:hover { background:#b38b45; }
.inventory > .demo-panel > .report-head { padding:18px 20px 14px; margin:0; }
.auth-glow { width:min(360px,82vw)!important; height:190px!important; margin:0 auto 12px!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; animation:none!important; overflow:visible!important; }
.auth-glow img { width:100%!important; height:100%!important; object-fit:contain!important; }
.auth-welcome { animation:none!important; opacity:1!important; transform:none!important; }
.startup-splash { position:fixed; inset:0; z-index:30; display:grid; place-items:center; overflow:hidden; background:radial-gradient(ellipse at center,#fffaf0 0%,#f4ead5 72%,#e8d7b5 100%); animation:splashFade .45s ease 3s forwards; }
.splash-glow { position:absolute; width:min(62vw,580px); aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,#f4d88690 0%,#d4aa4e40 38%,#d4aa4e00 72%); filter:blur(18px); animation:glowGrow 3s ease-out both; }
.splash-glint { position:absolute; z-index:1; width:min(100vw,1050px); height:8px; left:-110%; top:50%; transform:rotate(-22deg); background:linear-gradient(90deg,transparent,#f8df91 48%,#fff9df 50%,#c28d28 53%,transparent); filter:blur(3px) drop-shadow(0 0 18px #c28d28); animation:glintSweep 2.1s ease-in-out .5s both; }
.splash-logo { position:relative; z-index:2; width:min(74vw,780px); max-height:78vh; object-fit:contain; opacity:0; filter:drop-shadow(0 12px 35px #9c762d45); animation:logoApproach 3s cubic-bezier(.18,.72,.18,1) both; }
@keyframes logoApproach { 0%{opacity:0;transform:scale(.12)} 12%{opacity:1} 100%{opacity:1;transform:scale(1)} }
@keyframes glowGrow { 0%{opacity:.15;transform:scale(.12)} 100%{opacity:1;transform:scale(1.12)} }
@keyframes glintSweep { 0%{left:-110%;opacity:0} 18%{opacity:.95} 82%{opacity:.8} 100%{left:120%;opacity:0} }
@keyframes splashFade { to{opacity:0;visibility:hidden;pointer-events:none} }
@media(max-width:720px) { .splash-logo{width:88vw}.auth-glow{width:min(340px,86vw)!important;height:160px!important}.inventory>.demo-panel>.report-head{padding:15px 16px 12px} }
@media(prefers-reduced-motion:reduce) { .splash-logo,.splash-glow,.splash-glint,.startup-splash{animation-duration:.01ms} }
@media (min-width:721px) and (max-width:1050px) {
  .side-foot { display:block; margin-top:auto; padding:8px 4px; }
  .side-foot b,.side-foot span { display:none; }
  .update-button { padding:10px 0; font-size:0; }
  .update-button::before { content:'↻'; font-size:18px; }
}
.pair-device-button { border:1px solid #f1dfbd; border-radius:9px; padding:9px 12px; color:#4a391d; background:#f7eedb; font-size:12px; font-weight:650; }
.pair-device-button:hover { background:#fff8e9; }
.pair-code-value { margin:18px 0 8px; padding:15px; border:1px dashed #c6a355; border-radius:12px; background:#fffaf0; color:#705117; font-size:28px; font-weight:800; letter-spacing:.22em; text-align:center; }
.auth-screen { overflow:auto; }
.android-download-button { display:flex; width:100%; min-height:48px; align-items:center; justify-content:center; gap:10px; margin:18px auto 0; padding:11px 16px; border:1px solid #303030; border-radius:15px; background:#111; color:#fff; font-size:13px; font-weight:700; text-decoration:none; transition:background .15s ease, transform .15s ease; }
.android-download-button:hover { background:#252525; transform:translateY(-1px); }
.android-download-button:focus-visible { outline:3px solid #c6a355; outline-offset:3px; }
.android-download-button svg { width:22px; height:22px; flex:none; fill:#3ddc84; }
@media(max-width:720px) { .topbar { padding:0 14px; }.top-actions { gap:8px; }.pair-device-button { padding:8px; font-size:10px; } }