:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #09100e;
  color: #eef5f1;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at top left, #17352b 0, #09100e 42%); }
.shell { width: min(1080px, calc(100% - 32px)); margin: 0 auto; padding: 34px 0; }
.brand { display: flex; align-items: center; gap: 12px; color: #fff; text-decoration: none; font-weight: 750; letter-spacing: .04em; }
.brand img { display: block; width: 165px; max-width: 55vw; height: auto; }
.auth { width: min(460px, 100%); margin: 8vh auto 0; padding: 32px; background: rgba(18, 29, 25, .92); border: 1px solid #284b3e; border-radius: 22px; box-shadow: 0 24px 70px #0008; }
h1 { margin: 22px 0 8px; font-size: clamp(1.8rem, 5vw, 2.7rem); line-height: 1.05; }
p { color: #b8c8c0; line-height: 1.55; }
label { display: grid; gap: 8px; margin: 20px 0; color: #d9e6df; font-size: .94rem; }
input { width: 100%; padding: 14px 15px; border: 1px solid #3a5a4d; border-radius: 12px; background: #0d1713; color: #fff; font: inherit; outline: none; }
select { width: 100%; padding: 14px 15px; border: 1px solid #3a5a4d; border-radius: 12px; background: #0d1713; color: #fff; font: inherit; }
input:focus { border-color: #62d39a; box-shadow: 0 0 0 3px #62d39a22; }
button { width: 100%; padding: 14px 18px; border: 0; border-radius: 12px; background: #62d39a; color: #07100c; font: inherit; font-weight: 750; cursor: pointer; }
button:hover { background: #7ce1ad; }
button:disabled { opacity: .55; cursor: wait; }
.message { min-height: 24px; margin-top: 16px; color: #ffb4a8; }
.message.ok { color: #8de7b9; }
.dashboard { margin-top: 52px; display: grid; gap: 24px; }
.topline { display: flex; justify-content: space-between; align-items: center; gap: 18px; }
.topline button { width: auto; background: transparent; color: #d7e5de; border: 1px solid #3a5a4d; }
.card { padding: 26px; border: 1px solid #284b3e; border-radius: 18px; background: #101d18; }
.eyebrow { margin: 0; color: #62d39a; font-size: .78rem; font-weight: 750; letter-spacing: .14em; text-transform: uppercase; }
.muted { color: #8da098; }
.customer-row { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 16px 0; border-bottom: 1px solid #284b3e; }
.customer-row button { width: auto; }
.order-row { display: grid; grid-template-columns: 1fr auto; gap: 10px 18px; padding: 18px 0; border-bottom: 1px solid #284b3e; }
.order-row > p, .order-actions { grid-column: 1 / -1; margin: 0; }
.order-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.order-actions button { width: auto; padding: 9px 12px; }
.order-items { grid-column: 1 / -1; display: grid; gap: 8px; padding: 12px; border-radius: 10px; background: #09100e; }
.item-row, .item-total { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.item-row button { width: auto; padding: 6px 9px; }
.item-row .danger { background: transparent; color: #ffb4a8; border: 1px solid #6a4038; }
.item-total { margin-top: 6px; padding-top: 10px; border-top: 1px solid #284b3e; }
.status { align-self: start; padding: 5px 9px; border: 1px solid #3a5a4d; border-radius: 999px; color: #d9e6df; font-size: .78rem; font-weight: 700; }
.status-completed { border-color: #62d39a; color: #8de7b9; }
.status-cancelled { color: #c0c0c0; opacity: .75; }
.linkbox { overflow-wrap: anywhere; padding: 12px; border-radius: 10px; background: #09100e; }
.linkbox a { color: #8de7b9; }
@media (max-width: 560px) { .auth { padding: 24px; margin-top: 4vh; } .shell { padding-top: 20px; } }