:root{
  --ms-red:#C8102E;
  --hk-green:#1F5A43;
  --gold:#D99A16;
  --cream:#FFF1D6;
  --row:#F3DDC4;
  --dark:#332617;
  --orange:#F47721;
  --milk:#B98755;
  --mango:#E8AD3D;
  --beige:#D9B98C;
  --burgundy:#8B3E46;
  --coffee:#6B4A3A;
  --line:#E6D5BF;
}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f7f1e8;color:var(--dark)}
.topbar{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid #eee;padding:14px 18px;display:flex;justify-content:space-between;align-items:center}
.brand-logo{display:block;width:190px;max-width:42vw;height:72px;object-fit:contain;object-position:left center}.season{font-weight:700;font-size:14px}
.app-shell{max-width:760px;margin:0 auto;padding:18px 14px 90px}.card{background:#fff;border-radius:14px;padding:18px;box-shadow:0 6px 18px rgba(50,38,23,.08);margin-bottom:16px}.login-card{margin-top:40px}
h1,h2,h3{margin:0 0 8px}.cn{margin:0 0 16px;font-weight:700}.muted{color:#746b61}.error{color:var(--ms-red);min-height:18px}.demo-note{font-size:12px;background:#fff7e7;border:1px solid #f0d7a0;padding:10px;border-radius:8px;margin-top:12px}
label{display:block;font-size:13px;font-weight:700;margin:14px 0 6px}input,select,textarea{width:100%;padding:12px;border:1px solid #d8c7b4;border-radius:9px;background:#fff;font-size:16px}.btn{border:none;border-radius:10px;padding:13px 16px;font-weight:800;cursor:pointer}.btn-primary{background:var(--ms-red);color:#fff;width:100%;margin-top:16px}.btn-green{background:var(--hk-green);color:#fff}.btn-light{background:#f1e6d8;color:var(--dark)}.btn[disabled]{opacity:.45;cursor:not-allowed}
.summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.summary-item{background:#f8f2e9;border-radius:10px;padding:12px}.summary-item strong{display:block;font-size:18px;margin-top:3px}.full{grid-column:1/-1}
.status-ok{color:var(--hk-green);font-weight:800}.status-warn{color:#a85d00;font-weight:800}.top-actions{display:flex;gap:8px;justify-content:flex-end;margin-bottom:12px}.category{border-radius:12px;overflow:hidden;margin-bottom:10px;box-shadow:0 2px 8px rgba(0,0,0,.05)}.category-head{padding:13px 14px;font-weight:800;display:flex;justify-content:space-between;align-items:center}.category-products{background:#fff}.product{display:grid;grid-template-columns:1fr auto;gap:10px;padding:14px;border-top:1px solid #f0e8df}.product:first-child{border-top:none}.product-name{font-weight:800}.product-cn{font-size:13px;color:#5b524a;margin-top:3px}.product-meta{font-size:12px;color:#7d7064;margin-top:6px}.qty{display:flex;align-items:center;gap:8px}.qty button{width:34px;height:34px;border:0;border-radius:8px;font-weight:900;font-size:18px}.qty .minus{background:#f1e6d8}.qty .plus{background:var(--hk-green);color:#fff}.qty input{width:54px;padding:8px;text-align:center}
.sticky-cart{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid #e3d4c2;box-shadow:0 -4px 15px rgba(0,0,0,.08)}.sticky-inner{max-width:760px;margin:auto;padding:10px 14px;display:flex;align-items:center;gap:12px}.cart-total{flex:1}.cart-total strong{font-size:18px}.progress{height:8px;background:#eee0cf;border-radius:99px;overflow:hidden;margin-top:5px}.progress > div{height:100%;background:var(--hk-green);width:0}.mini{font-size:12px;color:#6a5f55}
.order-table{width:100%;border-collapse:collapse}.order-table th,.order-table td{padding:9px 5px;border-bottom:1px solid #eee;text-align:left}.order-table td:last-child,.order-table th:last-child{text-align:right}.pill{display:inline-block;padding:5px 9px;border-radius:99px;background:#eee;font-size:12px;font-weight:700}.pill-green{background:#e5f2ed;color:var(--hk-green)}.pill-red{background:#fde7eb;color:var(--ms-red)}
.notice{padding:12px;border-radius:10px;background:#fff7e7;border:1px solid #efd9a7;margin:10px 0}.success{background:#e8f5ef;border-color:#badfce}.empty{padding:20px;text-align:center;color:#7a7068}
@media (max-width:520px){.summary-grid{grid-template-columns:1fr}.season{font-size:12px}.brand-logo{width:155px;height:60px;max-width:55vw}.product{grid-template-columns:1fr}.qty{justify-content:flex-end}}
.test-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.test-account{border:1px solid #d8c7b4;background:#fff;color:var(--dark);border-radius:8px;padding:9px;font-weight:700;cursor:pointer}.test-account:hover{border-color:var(--hk-green);background:#f4faf7}@media(max-width:420px){.test-grid{grid-template-columns:1fr}}

/* Announcement cards */
.announcement-section h2{margin-bottom:14px}.announcement-list{display:grid;gap:12px}.announcement-card{border-radius:12px;padding:16px 17px;border-left:5px solid var(--hk-green);background:#faf7f1}.announcement-card h3{margin:7px 0;color:#332617}.announcement-card p{margin:0;line-height:1.55;white-space:normal}.announcement-tag{display:inline-block;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;border-radius:999px;padding:5px 9px;background:#1F5A43;color:#FFF1D6}.announcement-card.season{border-left-color:#F47721;background:#fff8ef}.announcement-card.season .announcement-tag{background:#F47721;color:#C8102E}.announcement-card.product{border-left-color:#C8102E;background:#fff4f4}.announcement-card.product .announcement-tag{background:#C8102E;color:#F3C969}.announcement-card.info{border-left-color:#D99A16;background:#fffaf0}.announcement-card.info .announcement-tag{background:#D99A16;color:#332617}.announcement-card.important{border-left-color:#8B3E46;background:#fff5f6}.announcement-card.important .announcement-tag{background:#8B3E46;color:#FFF1D6}.announcement-date{margin-top:9px;font-size:12px;color:#77695d}

/* ============================================================
   Autumn 25/26 seasonal theme
   Visual-only layer: warm autumn accents without changing logic.
   ============================================================ */
:root{
  --autumn-rust:#B95322;
  --autumn-amber:#D88B1D;
  --autumn-leaf:#8A4B24;
  --autumn-cream:#FFF8EC;
  --autumn-sage:#6E7C55;
  --autumn-shadow:rgba(104,59,27,.12);
}
body{
  background:
    radial-gradient(circle at 8% 12%, rgba(216,139,29,.12) 0 110px, transparent 111px),
    radial-gradient(circle at 94% 24%, rgba(185,83,34,.09) 0 150px, transparent 151px),
    linear-gradient(180deg,#fbf4e9 0%,#f7efe3 48%,#f3eadc 100%);
  background-attachment:fixed;
}
body::before,
body::after{
  position:fixed;
  z-index:0;
  pointer-events:none;
  opacity:.14;
  font-size:86px;
  line-height:1;
  filter:saturate(.85);
}
body::before{content:'🍂';left:-12px;top:116px;transform:rotate(-18deg)}
body::after{content:'🍁';right:-14px;bottom:24px;transform:rotate(15deg)}
.topbar{
  background:linear-gradient(90deg,#fffdf9 0%,#fff8ec 55%,#f5e4c9 100%);
  border-bottom:3px solid rgba(216,139,29,.55);
  box-shadow:0 4px 16px rgba(92,55,28,.08);
}
.topbar::after{
  content:'🍂';
  font-size:18px;
  margin-left:8px;
  opacity:.72;
}
.season{
  background:linear-gradient(135deg,var(--autumn-rust),var(--autumn-amber));
  color:#fff8ec;
  border-radius:999px;
  padding:8px 13px;
  letter-spacing:.02em;
  box-shadow:0 3px 9px rgba(185,83,34,.18);
}
.app-shell{position:relative;z-index:1}
.card{
  border:1px solid rgba(183,132,77,.18);
  box-shadow:0 7px 22px var(--autumn-shadow);
}
.login-card{
  background:linear-gradient(180deg,#fff 0%,#fffaf2 100%);
  border-top:5px solid var(--autumn-amber);
}
.login-card::before{
  content:'AUTUMN / WINTER 25/26';
  display:inline-block;
  margin-bottom:12px;
  padding:5px 9px;
  border-radius:999px;
  background:#fff0d5;
  color:var(--autumn-rust);
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
}
.summary-item{
  background:linear-gradient(145deg,#fffaf2,#f7ead7);
  border:1px solid rgba(216,139,29,.12);
}
.btn-primary{
  background:linear-gradient(135deg,var(--ms-red) 0%,#d92b38 58%,var(--autumn-rust) 100%);
  box-shadow:0 5px 12px rgba(200,16,46,.16);
}
.btn-primary:hover{filter:brightness(1.03)}
.btn-green{
  background:linear-gradient(135deg,var(--hk-green),#356b55);
}
.notice{
  background:#fff7e8;
  border-color:#e9c886;
}
.announcement-section{
  position:relative;
  overflow:hidden;
}
.announcement-section::after{
  content:'🍁';
  position:absolute;
  right:12px;
  top:8px;
  font-size:42px;
  opacity:.10;
  transform:rotate(18deg);
}
.announcement-section h2::before{content:'🍂 ';font-size:.85em}
.announcement-card.season{
  background:linear-gradient(135deg,#fff7ea 0%,#fff1da 100%);
  border-left-color:var(--autumn-rust);
}
.announcement-card.season .announcement-tag{
  background:linear-gradient(135deg,var(--autumn-rust),var(--autumn-amber));
  color:#fff8ec;
}
.category{
  border:1px solid rgba(111,75,43,.08);
  box-shadow:0 3px 10px rgba(80,47,25,.07);
}
.category-head{letter-spacing:.01em}
.product:hover{background:#fffaf3}
.sticky-cart{
  background:linear-gradient(90deg,#fffdf9,#fff7e9);
  border-top:2px solid rgba(216,139,29,.4);
}
.progress{background:#eadcc8}
.progress > div{background:linear-gradient(90deg,var(--hk-green),var(--autumn-amber))}

@media (max-width:520px){
  body::before{font-size:58px;top:112px;opacity:.10}
  body::after{font-size:62px;opacity:.10}
  .topbar::after{display:none}
  .season{font-size:11px;padding:6px 9px}
}

/* ============================================================
   v11 Autumn dashboard presentation
   Reworks the authenticated welcome page into a seasonal portal
   dashboard while preserving all ordering and database logic.
   Optional future banner asset: static/autumn-banner.jpg
   ============================================================ */
.app-shell{max-width:1180px;padding:22px 18px 90px}
.dashboard-actions{display:flex;justify-content:flex-end;align-items:center;gap:14px;margin:4px 0 14px}.welcome-mini{font-size:14px;color:#6b503b}.btn-outline{background:#fffaf2;border:1px solid #b99372;color:#4e2c1d;padding:10px 16px}
.season-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(320px,.98fr);min-height:330px;overflow:hidden;border-radius:22px;margin-bottom:18px;background:linear-gradient(100deg,#fff8ec 0%,#f7dfbf 52%,#b85d28 100%);box-shadow:0 12px 34px rgba(104,59,27,.17);border:1px solid rgba(183,132,77,.22)}
.season-hero::before{content:'🍁';position:absolute;left:-18px;top:-22px;font-size:90px;opacity:.30;transform:rotate(-15deg)}.season-hero::after{content:'🍂';position:absolute;left:40%;bottom:-22px;font-size:72px;opacity:.18;transform:rotate(24deg)}
.hero-copy{position:relative;z-index:2;padding:40px 34px 34px 58px;align-self:center}.hero-kicker{font-family:Georgia,'Times New Roman',serif;font-style:italic;color:#c95520;font-size:28px}.hero-copy h1{font-family:Georgia,'Times New Roman',serif;font-size:46px;line-height:1.02;font-weight:600;color:#4c291a;margin:8px 0 14px}.hero-copy h1 span{font-size:.86em}.hero-copy p{font-size:17px;line-height:1.5;max-width:510px;color:#5e4739;margin-bottom:22px}.hero-button{display:inline-flex;align-items:center;gap:24px;border:0;border-radius:999px;background:linear-gradient(135deg,#bd5520,#df741f);color:#fff;padding:14px 24px;font-size:16px;font-weight:900;cursor:pointer;box-shadow:0 7px 18px rgba(185,83,34,.22)}.hero-button span{font-size:23px;line-height:1}
.hero-visual{position:relative;min-height:330px;background-image:linear-gradient(90deg,rgba(201,113,49,.05),rgba(75,34,16,.18)),url('autumn-banner.jpg');background-position:center;background-size:cover}.hero-visual::before{content:'🎃';position:absolute;font-size:165px;right:18%;bottom:31px;filter:drop-shadow(0 12px 10px rgba(75,34,16,.22));opacity:.92}.hero-visual::after{content:'🍂';position:absolute;font-size:74px;right:8%;top:24px;opacity:.72;transform:rotate(20deg)}.hero-photo-note{position:absolute;right:28px;bottom:25px;background:rgba(62,31,18,.72);backdrop-filter:blur(4px);color:#fff6ea;border:1px solid rgba(255,255,255,.25);padding:10px 13px;border-radius:12px;font-size:12px;font-weight:900;letter-spacing:.13em;text-align:center}
.dashboard-panel{background:rgba(255,252,247,.95);border:1px solid rgba(183,132,77,.22);border-radius:18px;padding:20px;box-shadow:0 7px 20px rgba(104,59,27,.10);margin-bottom:18px}.panel-title{display:flex;align-items:center;gap:12px}.panel-icon{display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;border-radius:12px;background:#fff0dc;color:#9e451e;font-weight:900;font-size:20px}.eyebrow{display:block;text-transform:uppercase;letter-spacing:.08em;font-size:10px;font-weight:900;color:#b35b2c;margin-bottom:3px}.panel-title h2{margin:0;color:#4b2a1c;font-size:23px}
.latest-announcement{position:relative;overflow:hidden;background:linear-gradient(135deg,#fffdf9 0%,#fff3e3 100%);border:2px solid rgba(220,137,66,.24)}.latest-announcement::after{content:'🍁';position:absolute;right:22px;bottom:-6px;font-size:72px;opacity:.12;transform:rotate(14deg)}.announcement-topline{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}.latest-announcement>p{margin:14px 0 0 56px;max-width:900px;line-height:1.6;color:#604b3e}.latest-announcement .announcement-tag{white-space:nowrap;background:#ffe3c3;color:#c4521e}.more-news{margin:12px 0 0 56px;font-size:12px;font-weight:800;color:#a45b34}.latest-announcement .announcement-date{margin-left:56px}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(330px,.8fr);gap:18px}.dashboard-grid .dashboard-panel{margin-bottom:0}.info-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:18px;border:1px solid #eadcc9;border-radius:14px;overflow:hidden;background:#fffaf3}.info-tile{padding:16px 14px;min-height:138px;border-right:1px solid #eadcc9;display:flex;flex-direction:column;gap:4px}.info-tile:last-child{border-right:0}.info-icon{width:32px;height:32px;border-radius:9px;background:#fff0db;color:#9e451e;display:grid;place-items:center;font-weight:900;margin-bottom:5px}.info-tile>span:not(.info-icon){font-size:12px;font-weight:800;color:#795b47}.info-tile strong{font-size:16px;color:#3d281d}.info-tile small{color:#77685e;line-height:1.35}.deadline-strip{display:flex;justify-content:space-between;gap:15px;align-items:center;background:#f7e7d1;border-radius:11px;margin-top:12px;padding:11px 14px;font-size:13px;color:#694633}.deadline-strip strong{color:#4a2a1b}
.quick-actions{display:flex;flex-direction:column}.quick-main{display:flex;justify-content:center;align-items:center;gap:20px;width:100%;margin-top:18px;border:0;border-radius:14px;background:linear-gradient(135deg,#c6531e,#df761d);color:#fff;padding:18px 20px;font-size:19px;font-weight:900;cursor:pointer;box-shadow:0 7px 18px rgba(185,83,34,.18)}.quick-main span:last-child{font-size:25px}.quick-secondary-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.quick-secondary{min-height:76px;border:1px solid #e8d5bf;border-radius:13px;background:#fffaf3;color:#4d3122;font-weight:800;padding:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:9px}.quick-secondary:hover{background:#fff1df;border-color:#daa46b}.quick-icon{color:#a84d24;font-size:20px}
@media(max-width:860px){.season-hero{grid-template-columns:1fr}.hero-copy{padding:34px 28px}.hero-visual{min-height:210px}.dashboard-grid{grid-template-columns:1fr}.info-grid{grid-template-columns:1fr 1fr}.info-tile:nth-child(2){border-right:0}.info-tile:nth-child(-n+2){border-bottom:1px solid #eadcc9}}
@media(max-width:560px){.app-shell{padding:14px 12px 86px}.dashboard-actions{justify-content:space-between}.welcome-mini{font-size:12px}.season-hero{min-height:auto;border-radius:17px}.hero-copy{padding:28px 20px 26px 30px}.hero-kicker{font-size:22px}.hero-copy h1{font-size:36px}.hero-copy p{font-size:15px}.hero-visual{min-height:160px}.hero-visual::before{font-size:110px}.hero-photo-note{right:14px;bottom:12px}.announcement-topline{display:block}.latest-announcement .announcement-tag{margin:12px 0 0 56px}.latest-announcement>p,.more-news,.latest-announcement .announcement-date{margin-left:0}.info-grid{grid-template-columns:1fr 1fr}.info-tile{min-height:125px}.quick-secondary-grid{grid-template-columns:1fr}.deadline-strip{display:block}.deadline-strip strong{display:block;margin-top:3px}}