:root{--bg:#f3f6fb;--card:#fff;--ink:#101828;--muted:#667085;--line:#e3e9f1;--blue:#1769ff;--blue2:#0f57df;--sidebar:#091425;--green:#2b7b5a;--amber:#9a6b16;--red:#c43d34}*{box-sizing:border-box}body,html{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}.appShell{min-height:100vh;display:grid;grid-template-columns:250px 1fr}.sidebar{position:-webkit-sticky;position:sticky;top:0;height:100vh;padding:22px 16px;background:linear-gradient(180deg,#091425,#0d1b30);color:#fff;display:flex;flex-direction:column}.brand{display:flex;gap:12px;align-items:center;padding:4px 8px 22px}.brandMark{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,#2d7cff,#0f56d8);color:#fff;font-weight:950;box-shadow:0 10px 24px rgba(23,105,255,.28)}.brand span,.brand strong{display:block}.brand strong{font-size:14px}.brand span{font-size:10px;color:#8fa0b8;margin-top:3px}.navLabel{padding:10px;color:#72839b;font-size:10px;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.sidebar nav{display:grid;grid-gap:5px;gap:5px}.sidebar nav button{border:0;background:transparent;color:#aab6c7;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:11px;text-align:left;font-size:12px;font-weight:800}.sidebar nav button.active,.sidebar nav button:hover{color:#fff;background:linear-gradient(135deg,rgba(37,112,255,.22),rgba(37,112,255,.1));box-shadow:inset 0 0 0 1px rgba(89,144,255,.17)}.navIcon{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:rgba(255,255,255,.05)}.sidebarBottom{margin-top:auto}.sidebarBottom>a{display:block;color:#8fa0b8;text-decoration:none;font-size:11px;padding:10px}.profileRow{display:flex;gap:10px;align-items:center;padding:12px 10px;border-top:1px solid rgba(255,255,255,.08)}.profileRow span,.profileRow strong{display:block}.profileRow strong{font-size:11px}.profileRow span{font-size:9px;color:#8090a6;margin-top:3px}.avatar{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:#1d3353;color:#eaf2ff;font-size:11px;font-weight:900}.mainArea{min-width:0}.topbar{height:68px;background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:-webkit-sticky;position:sticky;top:0;z-index:30}.topbar>div:first-child span,.topbar>div:first-child strong{display:block}.topbar>div:first-child strong{font-size:14px}.topbar>div:first-child span{font-size:10px;color:var(--muted);margin-top:3px}.topbarActions{display:flex;gap:9px}.iconButton{width:39px;height:39px;border:1px solid #dbe3ed;background:#fff;border-radius:11px;display:grid;place-items:center;color:#596579;position:relative}.notifyBadge{position:absolute;right:-5px;top:-5px;min-width:18px;height:18px;border-radius:999px;background:#e5484d;color:#fff;font-size:9px;display:grid;place-items:center;border:2px solid #fff}.content{padding:28px;max-width:1280px;margin:auto}.pageHeader{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:22px}.pageHeader h1{font-size:31px;letter-spacing:-.04em;margin:0 0 7px}.pageHeader p{margin:0;color:var(--muted);line-height:1.6;font-size:13px}.primary,.secondary{border-radius:10px;padding:11px 15px;font-weight:850}.primary{border:0;color:#fff;background:linear-gradient(135deg,var(--blue),var(--blue2));box-shadow:0 10px 22px rgba(23,105,255,.18)}.secondary{border:1px solid #d8e1ec;background:#fff;color:#344054}.statsGrid{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:16px;gap:16px;margin-bottom:18px}.announcementComposer,.chatPanel,.featuredAnnouncement,.memberOrderCard,.noticeCard,.orderAdminCard,.panel,.statCard{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 16px 40px rgba(20,44,82,.06)}.statCard{padding:20px}.statCard small,.statCard span,.statCard strong{display:block}.statCard span{font-size:11px;color:var(--muted);font-weight:800}.statCard strong{font-size:30px;margin:12px 0 8px}.statCard small{color:#7b8798}.twoCol{display:grid;grid-template-columns:1fr 1fr;grid-gap:18px;gap:18px}.panel{overflow:hidden}.panelHead{padding:18px 20px;border-bottom:1px solid var(--line);background:#fbfcfe}.panelHead h3{margin:0;font-size:15px}.activityRow,.announcementRow{padding:18px 20px;border-top:1px solid #edf1f5;display:flex;gap:13px;align-items:flex-start}.activityRow:first-of-type,.announcementRow:first-of-type{border-top:0}.activityDot{width:9px;height:9px;border-radius:50%;background:var(--blue);margin-top:5px}.activityRow small,.activityRow strong{display:block}.activityRow strong{font-size:12px}.activityRow small{font-size:10px;color:var(--muted);margin-top:5px}.statusList{padding:10px 20px}.statusList>div{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid #edf1f5;font-size:12px}.statusList>div:last-child{border:0}.statusPill{display:inline-flex;align-items:center;border-radius:999px;padding:7px 10px;font-size:9px;font-weight:900;text-transform:capitalize}.statusPill.blue{background:#eaf2ff;color:#1769ff}.statusPill.green{background:#eaf7f1;color:#277a58}.statusPill.amber{background:#fff8e8;color:#9a6b16}.statusPill.red{background:#ffefee;color:#c43d34}.tabs{display:flex;gap:8px;margin-bottom:16px}.tabs button{border:1px solid #dbe4ef;background:#fff;padding:9px 13px;border-radius:999px;font-size:11px;font-weight:850}.tabs button.active{background:#111827;color:#fff;border-color:#111827}.memberOrderList,.orderAdminList{display:grid;grid-gap:14px;gap:14px}.orderAdminCard{padding:19px;display:grid;grid-template-columns:1fr auto auto;grid-gap:20px;gap:20px;align-items:center}.eyebrow{font-size:9px;color:#1769ff;font-weight:900;letter-spacing:.1em}.orderAdminCard h3{margin:6px 0 5px}.orderAdminCard p{margin:0;color:var(--muted);font-size:11px}.orderMeta{text-align:right}.orderMeta strong{display:block;font-size:21px;margin-bottom:7px}.cardActions{display:flex;gap:8px}.featuredAnnouncement{position:relative;overflow:hidden;padding:30px;margin-bottom:18px}.featuredAnnouncement:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#1769ff,#6ba0ff)}.featuredAnnouncement>span{display:inline-flex;background:#111827;color:#fff;padding:7px 11px;border-radius:999px;font-size:9px;font-weight:900;letter-spacing:.12em}.featuredAnnouncement h2{font-size:28px;margin:17px 0 10px}.featuredAnnouncement p{color:var(--muted);max-width:800px;line-height:1.7}.featuredAnnouncement footer{margin-top:22px;color:#8a94a4;font-size:11px}.announcementRow{justify-content:space-between}.announcementRow strong{font-size:14px}.announcementRow p{font-size:12px;color:var(--muted);line-height:1.5}.announcementRow small{font-size:10px;color:#98a2b3}.noticeCard{padding:20px;margin-bottom:18px;background:#f7fbff;border-color:#dbe7f6}.noticeCard strong{font-size:16px}.noticeCard p{margin:7px 0 0;color:var(--muted);line-height:1.6}.codeRow{display:grid;grid-template-columns:1fr 1fr auto auto;align-items:center;grid-gap:16px;gap:16px;padding:16px 20px;border-top:1px solid #edf1f5}.codeRow code{font-weight:900;color:#1769ff}.codeRow span{font-size:11px;color:var(--muted)}.announcementComposer{display:grid;grid-template-columns:1fr 340px;overflow:hidden}.announcementComposer>aside,.announcementComposer>div{padding:24px}.announcementComposer>aside{background:#fbfcfe;border-left:1px solid var(--line)}.announcementComposer label{display:block;font-size:10px;font-weight:900;color:#475467;margin:0 0 7px}.announcementComposer input,.announcementComposer select,.announcementComposer textarea{width:100%;border:1px solid #dce4ee;border-radius:11px;padding:12px;margin-bottom:16px;background:#fff}.audienceLock{padding:14px;border-radius:13px;background:#eef4ff;border:1px solid #d9e8ff;margin-bottom:14px}.audienceLock strong{font-size:12px}.audienceLock p{font-size:10px;line-height:1.55;color:#5f6b7b}.fullWidth{width:100%}.emptyPanel{padding:40px;text-align:center}.emptyPanel p{color:var(--muted)}.memberChat{display:grid;grid-template-columns:minmax(0,1fr) 280px;grid-gap:18px;gap:18px}.chatPanel{overflow:hidden}.chatHead{padding:18px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}.chatHead span{font-size:10px;color:#2b7b5a;font-weight:850}.chatMessages{height:500px;overflow:auto;padding:22px;background:linear-gradient(180deg,#fdfefe,#f8fbff)}.chatBubble{max-width:68%;background:#fff;border:1px solid #e1e8f0;border-radius:15px;padding:11px 13px;margin-bottom:14px;box-shadow:0 8px 20px rgba(16,24,40,.05)}.chatBubble.mine{margin-left:auto;background:#1769ff;color:#fff}.chatBubble strong{display:block;font-size:10px}.chatBubble p{font-size:12px;line-height:1.5}.chatBubble small{font-size:9px;color:#98a2b3}.chatComposer{display:flex;gap:10px;padding:16px;border-top:1px solid var(--line)}.chatComposer input{flex:1 1;border:1px solid #dce4ee;border-radius:11px;padding:12px}.onlinePanel{padding:18px}.onlinePanel h3{font-size:14px}.onlineMember{display:flex;align-items:center;gap:10px;margin-top:13px}.onlineMember span,.onlineMember strong{display:block}.onlineMember strong{font-size:11px}.onlineMember span{font-size:9px;color:var(--muted)}.onlineMember i{margin-left:auto;width:8px;height:8px;border-radius:50%;background:#2fa36d}.memberOrderCard{overflow:hidden}.memberOrderCard>header{display:flex;justify-content:space-between;padding:17px 18px;border-bottom:1px solid var(--line);background:#fbfcfe}.memberOrderCard>header small,.memberOrderCard>header strong{display:block}.memberOrderCard>header small{font-size:10px;color:var(--muted);margin-top:4px}.orderStatusBody{display:grid;grid-template-columns:minmax(0,1fr) 270px;grid-gap:18px;gap:18px;padding:18px}.orderStatusBody>section{border:1px solid #dce7f5;border-radius:17px;padding:18px;background:#fbfdff}.orderStatusBody h2{font-size:21px}.orderStatusBody p{font-size:11px;color:var(--muted);line-height:1.6}.orderStatusBody>aside{border-left:1px solid var(--line);padding-left:18px}.timelineItem{position:relative;padding:0 0 16px 22px}.timelineItem:before{content:"";position:absolute;left:0;top:3px;width:10px;height:10px;border-radius:50%;background:#d8dee8}.timelineItem.done:before{background:#31a772}.timelineItem.current:before{background:#1769ff;box-shadow:0 0 0 4px #eaf2ff}.timelineItem span,.timelineItem strong{display:block}.timelineItem strong{font-size:10px}.timelineItem span{font-size:9px;color:var(--muted);margin-top:4px}.trackingBox{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;padding:12px;border:1px solid #cfe2d8;background:#fff;border-radius:12px}.trackingBox small,.trackingBox strong{display:block}.trackingBox small{font-size:9px;color:#6b7d73}.trackingBox strong{font-size:11px;color:#235c43}.memberOrderCard>footer{display:flex;gap:18px;flex-wrap:wrap;padding:13px 18px;border-top:1px solid #edf1f5;color:#667085;font-size:10px}.notificationWrap{position:relative}.notificationPanel{position:absolute;right:0;top:48px;width:390px;background:#fff;border:1px solid #dfe6ef;border-radius:18px;box-shadow:0 24px 70px rgba(9,20,37,.22);overflow:hidden;z-index:80}.notificationHead{padding:17px 18px;display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}.notificationHead span,.notificationHead strong{display:block}.notificationHead span{font-size:9px;color:var(--muted);margin-top:4px}.notificationHead button{border:0;background:transparent;color:#1769ff;font-size:9px;font-weight:850;display:flex;gap:5px;align-items:center}.notificationFilters{padding:10px 14px;display:flex;gap:6px;border-bottom:1px solid var(--line)}.notificationFilters button{border:0;background:transparent;padding:7px 9px;border-radius:8px;font-size:10px;font-weight:800;color:#667085}.notificationFilters button.active{background:#edf4ff;color:#175dcc}.notificationItem{width:100%;border:0;background:#fff;text-align:left;display:grid;grid-template-columns:8px 1fr;grid-gap:10px;gap:10px;padding:14px 17px;border-bottom:1px solid #edf1f5}.notificationItem:hover{background:#f8fbff}.notificationItem strong{font-size:11px}.notificationItem p{font-size:10px;line-height:1.45;color:var(--muted);margin:4px 0}.notificationItem small{font-size:9px;color:#98a2b3}.unreadDot{width:7px;height:7px;border-radius:50%;background:#1769ff;margin-top:4px}.emptyState{text-align:center;color:var(--muted);font-size:11px;padding:22px}.loginPage{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at top,#eaf2ff,#f3f6fb 48%)}.loginCard{width:min(100%,520px);background:#fff;border:1px solid var(--line);border-radius:28px;padding:38px;box-shadow:0 24px 80px rgba(20,44,82,.14);text-align:center}.loginCard .brandMark{margin:0 auto 18px}.loginCard h1{font-size:34px;margin:8px 0}.muted{color:var(--muted);line-height:1.6}.roleGrid{display:grid;grid-gap:10px;gap:10px;margin-top:24px}.roleGrid a{text-decoration:none;color:#fff;background:linear-gradient(135deg,#1769ff,#0f57df);padding:14px;border-radius:12px;font-weight:850}.loginNote{margin-top:18px;padding:12px;border-radius:12px;background:#f7f9fc;color:#667085;font-size:10px}.loginCard .eyebrow{color:#1769ff;font-weight:900;font-size:10px;letter-spacing:.15em}@media(max-width:1000px){.appShell{grid-template-columns:88px 1fr}.sidebar{padding:18px 10px}.brand>div:last-child,.navLabel,.sidebar nav button:not(.active){font-size:0}.sidebar nav button{justify-content:center}.sidebarBottom{display:none}.statsGrid{grid-template-columns:repeat(2,1fr)}.announcementComposer,.memberChat,.twoCol{grid-template-columns:1fr}.announcementComposer>aside{border-left:0;border-top:1px solid var(--line)}.orderAdminCard{grid-template-columns:1fr auto}.cardActions{grid-column:1/-1}}@media(max-width:720px){.appShell{display:block}.sidebar{display:none}.topbar{padding:0 15px}.content{padding:20px 14px}.statsGrid,.twoCol{grid-template-columns:1fr}.pageHeader{align-items:flex-start;flex-direction:column}.orderAdminCard{grid-template-columns:1fr}.orderMeta{text-align:left}.cardActions{flex-wrap:wrap}.orderStatusBody{grid-template-columns:1fr}.orderStatusBody>aside{border-left:0;border-top:1px solid var(--line);padding:18px 0 0}.notificationPanel{position:fixed;left:12px;right:12px;top:74px;width:auto}.chatMessages{height:420px}}