@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root { --bg:#08080a; --panel:#101012; --panel-2:#151519; --panel-3:#1b1b20; --line:#26262d; --line-soft:#1d1d22; --text:#f2f0f5; --muted:#8f909e; --dim:#686975; --violet:#a855f7; --violet-bright:#bc4dff; --violet-soft:rgba(168,85,247,.14); --green:#5ee1ab; --orange:#ffbf5b; --red:#f87171; --shadow:0 20px 40px rgba(0,0,0,.24); }
* { box-sizing:border-box; }
html, body { min-height:100%; margin:0; background:var(--bg); color:var(--text); font-family:Manrope,system-ui,sans-serif; }
button, input, textarea, select { font:inherit; }
button { border:0; cursor:pointer; color:inherit; }
button:disabled { cursor:not-allowed; opacity:.45; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline:2px solid var(--violet-bright); outline-offset:2px; }
.is-hidden { display:none !important; }
.eyebrow { color:var(--dim); font-size:10px; letter-spacing:.13em; font-weight:800; margin:0 0 7px; }
.muted { color:var(--muted); line-height:1.65; }
.logo-mark { background:linear-gradient(140deg,#cb78ff,#7530cc); width:28px; height:28px; border-radius:10px; display:inline-grid; place-items:center; font-weight:800; font-size:13px; color:white; box-shadow:0 8px 20px rgba(148,56,218,.32); }

/* Login */
.login-body { background:#09090b; }
.login-shell { min-height:100vh; display:grid; grid-template-columns:minmax(340px,1.1fr) minmax(450px,.9fr); }
.brand-panel { position:relative; overflow:hidden; min-height:700px; padding:43px clamp(40px,7vw,120px); display:flex; flex-direction:column; background:radial-gradient(circle at 20% 85%,rgba(139,48,230,.27),transparent 38%),linear-gradient(145deg,#131017,#0b0a0d 65%); border-right:1px solid var(--line); }
.brand-panel:after { content:""; position:absolute; width:600px; height:600px; border-radius:50%; border:1px solid rgba(192,93,255,.16); bottom:-330px; left:-110px; box-shadow:0 0 0 65px rgba(192,93,255,.03),0 0 0 130px rgba(192,93,255,.025); pointer-events:none; }
.wordmark,.mobile-wordmark { display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:-.03em; }
.brand-copy { position:relative; z-index:1; max-width:580px; margin:auto 0; padding:80px 0 64px; }
.brand-copy h1 { font-size:clamp(44px,5vw,78px); line-height:1.05; letter-spacing:-.07em; margin:0 0 24px; }
.brand-copy h1 em { color:#d6a9ff; font-style:normal; }
.brand-copy > p:last-child { color:#b5afbb; max-width:480px; font-size:16px; line-height:1.75; }
.login-card-wrap { display:grid; place-items:center; padding:40px; background:#0a0a0c; }
.login-card { width:min(100%,470px); padding:14px; }
.login-card h2 { font-size:34px; letter-spacing:-.055em; margin:0 0 14px; line-height:1.15; }
.login-card .muted { margin:0 0 30px; font-size:14px; }
.mobile-wordmark { display:none; margin-bottom:76px; }
.discord-button { display:flex; align-items:center; justify-content:center; gap:12px; background:#5865f2; color:#fff; text-decoration:none; padding:15px 18px; border-radius:11px; font-weight:800; font-size:14px; transition:transform .18s,background .18s; }
.discord-button:hover { transform:translateY(-1px); background:#6872f3; }
.discord-button svg { width:20px; height:20px; }
.fine-print { color:var(--dim); text-align:center; margin:17px 0 0; font-size:11px; line-height:1.6; }
.alert { border:1px solid rgba(248,113,113,.33); background:rgba(248,113,113,.1); color:#fecaca; border-radius:9px; padding:11px 12px; font-size:12px; margin:0 0 16px; line-height:1.5; }

/* App frame */
.app-shell { min-height:100vh; display:grid; grid-template-columns:258px 1fr; }
.sidebar { position:sticky; top:0; height:100vh; display:flex; flex-direction:column; padding:20px 14px 14px; border-right:1px solid var(--line-soft); background:#0c0c0e; z-index:10; }
.sidebar-brand { display:flex; align-items:center; gap:10px; padding:2px 8px 26px; font-weight:800; letter-spacing:-.03em; }
.shop-switcher { display:flex; width:100%; align-items:center; text-align:left; justify-content:space-between; padding:12px 12px; border-radius:9px; background:#17171b; border:1px solid #26262d; transition:border-color .2s,background .2s; }
.shop-switcher:hover { background:#1b1b20; border-color:#373740; }
.shop-switcher-label { display:grid; gap:3px; min-width:0; }
.shop-switcher small,.profile-link small { color:var(--dim); font-size:9px; letter-spacing:.09em; font-weight:800; }
.shop-switcher strong { font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.shop-popover { position:absolute; top:115px; left:14px; right:14px; padding:6px; background:#1a1a20; border:1px solid #33333c; border-radius:10px; box-shadow:var(--shadow); z-index:15; }
.shop-option { display:flex; gap:8px; width:100%; padding:10px; text-align:left; align-items:center; background:transparent; border-radius:7px; color:var(--ui-highlight); font-size:12px; }
.shop-option:hover,.shop-option.active { background:var(--ui-soft); color:var(--ui-highlight); }
.shop-option-name { flex:1; min-width:0; overflow-wrap:anywhere; line-height:1.4; }
.shop-option .shop-role { flex:0 0 auto; white-space:nowrap; color:var(--ui-accent-text); font-size:10px; margin-left:auto; }
.side-nav { display:grid; gap:4px; margin-top:27px; }
.nav-link { padding:11px 10px; display:flex; gap:11px; align-items:center; background:transparent; color:#92929e; border-radius:8px; text-align:left; font-size:12px; font-weight:700; transition:.15s; }
.nav-link span { width:15px; text-align:center; font-size:16px; font-weight:400; }
.nav-link:hover { color:#e5e3ea; background:#151519; }
.nav-link.active { background:var(--violet-soft); color:#e9caff; }
.sidebar-bottom { margin-top:auto; display:grid; gap:9px; }
.quiet-button { background:transparent; color:#a5a3ad; font-size:12px; padding:11px 9px; text-align:left; border-radius:8px; }
.quiet-button:hover { background:#17171b; color:white; }
.profile-link { color:inherit; text-decoration:none; display:flex; gap:9px; align-items:center; padding:9px; border-radius:8px; }
.profile-link:hover { background:#17171b; }
.profile-link > span:last-child { min-width:0; display:grid; gap:2px; }
.profile-link strong { font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.profile-link small { font-size:9px; letter-spacing:0; font-weight:600; }
.avatar { position:relative; overflow:hidden; flex:0 0 auto; display:grid; place-items:center; width:29px; height:29px; border-radius:50%; background:linear-gradient(135deg,#c073ff,#6130ab); color:#fff; font-size:11px; font-weight:800; }
.avatar-fallback { position:relative; z-index:0; }
.avatar img[data-avatar-image] { position:absolute; inset:0; z-index:1; width:100%; height:100%; display:block; object-fit:cover; }
.main-content { min-width:0; }
.topbar { height:70px; padding:0 28px; border-bottom:1px solid var(--line-soft); display:flex; align-items:center; justify-content:space-between; background:rgba(8,8,10,.92); backdrop-filter:blur(16px); position:sticky; top:0; z-index:8; }
.store-summary { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:11px; font-weight:600; }
.top-actions { display:flex; align-items:center; gap:13px; }
.clock-button { display:flex; gap:7px; align-items:center; padding:9px 12px; background:var(--violet-soft); border:1px solid rgba(187,83,255,.22); color:#dbb3ff; font-size:11px; font-weight:800; border-radius:7px; transition:.15s; }
.clock-button:hover { background:rgba(168,85,247,.24); }
.clock-button.clocked-in { color:#7af1bd; background:rgba(54,211,153,.1); border-color:rgba(54,211,153,.22); }
.stats-button { display:flex; align-items:center; gap:6px; color:#c4b5d0; background:#19171d; border:1px solid #302b37; border-radius:7px; padding:9px 11px; font-size:11px; font-weight:800; }
.stats-button:hover { background:#242029; color:#eed8ff; }
.top-avatar { border:1px solid #393941; background-color:#22222a; }
.mobile-header,.icon-button { display:none; }

/* Point of sale */
.portal-view { display:none; }
.portal-view.active { display:block; }
.pos-layout { min-height:calc(100vh - 70px); display:grid; grid-template-columns:minmax(400px,1fr) 320px; }
.catalog-panel { padding:26px 28px 42px; min-width:0; }
.catalog-tools { display:flex; gap:12px; }
.search-box { height:42px; min-width:0; flex:1; display:flex; align-items:center; gap:9px; padding:0 13px; border:1px solid #26262c; background:#111114; border-radius:8px; color:#6f707b; }
.search-box:focus-within { border-color:#6e3a99; box-shadow:0 0 0 3px rgba(168,85,247,.1); }
.search-box span { font-size:20px; transform:rotate(-20deg); }
.search-box input { min-width:0; width:100%; background:transparent; border:0; outline:0; color:#ededf1; font-size:12px; }
.search-box input::placeholder { color:#696a74; }
.primary-small,.primary-button { color:#fff; background:linear-gradient(135deg,#a23aec,#7923bd); border-radius:8px; font-weight:800; box-shadow:0 8px 20px rgba(130,31,208,.16); transition:transform .15s,filter .15s; }
.primary-small:hover,.primary-button:hover { transform:translateY(-1px); filter:brightness(1.1); }
.primary-small { padding:0 13px; white-space:nowrap; font-size:11px; }
.category-tabs { display:flex; gap:7px; overflow:auto; padding:18px 0 14px; scrollbar-width:none; }
.category-tabs::-webkit-scrollbar { display:none; }
.category-tab { flex:0 0 auto; color:#93929f; background:#151519; padding:7px 11px; border-radius:7px; font-size:10px; font-weight:800; }
.category-tab:hover { color:#ddd8e3; }
.category-tab.active { color:white; background:linear-gradient(135deg,#b441ff,#7821ba); box-shadow:0 5px 15px rgba(150,37,233,.24); }
.catalog-heading { padding:9px 0 15px; display:flex; justify-content:space-between; align-items:end; }
.catalog-heading h1,.page-header h1 { margin:0; letter-spacing:-.05em; font-size:22px; }
.daily-metric { display:grid; text-align:right; gap:1px; }
.daily-metric small { font-size:8px; color:var(--dim); letter-spacing:.08em; font-weight:800; }
.daily-metric strong { color:#efdbff; font-family:'DM Mono',monospace; font-size:12px; }
.daily-metric span { font-size:9px; color:var(--dim); }
.menu-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(172px,1fr)); gap:9px; }
.menu-card { min-height:91px; display:flex; flex-direction:column; justify-content:space-between; text-align:left; padding:13px; border:1px solid #222229; background:#121214; border-radius:10px; transition:transform .15s,border-color .15s,background .15s; }
.menu-card:hover { transform:translateY(-2px); border-color:#76409e; background:#17151b; }
.menu-card:active { transform:translateY(0); }
.menu-card strong { font-size:11px; line-height:1.4; }
.menu-card .menu-price { color:#c659ff; font-family:'DM Mono',monospace; font-size:11px; font-weight:600; }
.empty-state { border:1px dashed #34343d; min-height:310px; margin-top:3px; border-radius:12px; display:grid; place-content:center; text-align:center; padding:25px; }
.empty-state h2 { font-size:16px; margin:14px 0 3px; }
.empty-state p { color:var(--muted); font-size:12px; max-width:280px; line-height:1.6; margin:0 auto 16px; }
.empty-state .primary-button { margin:auto; padding:10px 13px; font-size:11px; }
.cart-panel { background:#0e0e10; border-left:1px solid var(--line-soft); display:flex; flex-direction:column; min-height:calc(100vh - 70px); }
.cart-top { display:flex; align-items:start; justify-content:space-between; padding:25px 20px 19px; border-bottom:1px solid var(--line-soft); }
.cart-top h2 { font-size:15px; margin:0; letter-spacing:-.03em; }
.cart-top h2 span { color:#7c7c87; font-family:'DM Mono',monospace; font-size:10px; }
.text-button { color:#95949e; background:transparent; font-size:10px; font-weight:700; padding:5px 0; }
.text-button:hover { color:#e3d4ed; }
.cart-items { flex:1; padding:13px 16px; overflow:auto; }
.empty-cart { height:100%; min-height:210px; display:grid; align-content:center; justify-items:center; color:#777782; text-align:center; }
.empty-cart p { margin:9px 0 2px; font-size:11px; color:#a4a2ac; font-weight:800; }
.empty-cart small { font-size:10px; color:#65656f; }
.cart-line { padding:11px 2px; display:grid; grid-template-columns:1fr auto; gap:6px 10px; border-bottom:1px solid #1d1d22; }
.cart-line strong { font-size:11px; }
.cart-line > span { color:#d197ff; font-family:'DM Mono',monospace; font-size:10px; }
.quantity-control { grid-column:1/-1; display:flex; align-items:center; gap:5px; }
.quantity-control button { width:20px; height:20px; background:#212127; border-radius:5px; color:#c4c2cb; font-size:14px; line-height:1; }
.quantity-control button:hover { background:#303039; }
.quantity-control span { font-family:'DM Mono',monospace; font-size:10px; width:17px; text-align:center; }
.quantity-control input { width:48px; height:28px; padding:3px 5px; border:1px solid #3a3340; border-radius:6px; outline:0; background:#17151b; color:#f0eaf3; font-family:'DM Mono',monospace; font-size:11px; font-weight:700; text-align:center; }
.quantity-control input:focus { border-color:var(--shop-accent); box-shadow:0 0 0 2px color-mix(in srgb,var(--shop-accent) 18%,transparent); }
.remove-line { margin-left:auto; background:transparent !important; color:#8d5966 !important; font-size:12px !important; }
.cart-footer { padding:15px 16px 16px; border-top:1px solid var(--line-soft); }
.notes-label { display:grid; gap:6px; color:#757580; font-size:9px; letter-spacing:.09em; font-weight:800; }
.notes-label-head { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.notes-label-head button { padding:3px 0; background:transparent; color:#c878f5; font-size:9px; font-weight:800; letter-spacing:0; }
.notes-label-head button:hover { color:#e2a9ff; }
.notes-label-head button:disabled { color:#55515a; cursor:not-allowed; }
.notes-label textarea { resize:vertical; min-height:47px; max-height:100px; border:1px solid #24242a; color:#eae8ee; background:#17171a; border-radius:7px; padding:9px; outline:0; font-size:10px; }
.notes-label textarea:focus { border-color:#754399; }
.discount-row { display:flex; justify-content:space-between; align-items:center; padding:13px 0; color:#898894; font-size:10px; border-bottom:1px solid #202026; }
.discount-picker { display:flex; align-items:center; gap:8px; background:#19171d; border:1px solid #302b37; border-radius:6px; color:#d8b0ff; padding:6px 8px; font-size:10px; font-weight:800; }
.discount-picker:hover { background:#242029; }.discount-picker span { font-size:13px; line-height:10px; }
.total-row { display:flex; justify-content:space-between; padding:9px 0 0; color:#83828c; font-size:10px; }
.total-row strong { color:#bfc0c8; font-family:'DM Mono',monospace; }
.grand-total { padding-top:12px; font-size:13px; color:#f1eff4; font-weight:800; }
.grand-total strong { color:#fff; font-size:15px; }
.checkout-button { margin-top:15px; width:100%; padding:12px; border-radius:8px; background:linear-gradient(135deg,#ae42f5,#731eb1); color:#fff; font-weight:800; font-size:11px; transition:.15s; }
.checkout-button:not(:disabled):hover { filter:brightness(1.11); transform:translateY(-1px); }
.checkout-button span { opacity:.7; font-family:'DM Mono',monospace; margin-left:4px; }

/* Team and admin */
.page-header { min-height:153px; padding:35px 34px 28px; display:flex; align-items:end; justify-content:space-between; border-bottom:1px solid var(--line-soft); gap:15px; }
.page-header h1 { font-size:30px; }
.page-header > div > p:last-child { margin:9px 0 0; color:var(--muted); font-size:12px; }
.page-header .primary-button { padding:11px 14px; font-size:11px; white-space:nowrap; }
.owner-summary { padding:22px 34px 0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }.owner-summary article { min-height:82px; padding:14px; display:flex; align-items:center; gap:11px; background:#111114; border:1px solid #24242a; border-radius:9px; }.owner-summary-icon { width:33px; height:33px; display:grid; place-items:center; border-radius:9px; background:var(--violet-soft); color:#ca7dff; font-size:16px; }.owner-summary article div { display:grid; gap:4px; }.owner-summary small { color:#777681; font-size:9px; letter-spacing:.08em; font-weight:800; }.owner-summary strong { font-family:'DM Mono',monospace; font-size:16px; color:#f0e9f7; }.owner-shop-grid { padding:22px 34px 34px; display:grid; grid-template-columns:repeat(auto-fill,minmax(265px,1fr)); gap:12px; }.owner-shop-card { min-height:188px; padding:17px; display:flex; flex-direction:column; background:#111114; border:1px solid #292930; border-radius:11px; transition:transform .15s,border-color .15s,background .15s; }.owner-shop-card:hover { transform:translateY(-2px); border-color:#7d42aa; background:#151419; }.owner-shop-card-top { display:flex; justify-content:space-between; gap:12px; }.owner-shop-card h2 { margin:0; font-size:16px; letter-spacing:-.04em; }.owner-shop-owner { display:grid; gap:3px; margin:16px 0; }.owner-shop-owner small { color:#74737e; font-size:9px; letter-spacing:.08em; font-weight:800; }.owner-shop-owner code { color:#b8b5c0; font-family:'DM Mono',monospace; font-size:10px; }.owner-shop-meta { display:flex; gap:8px; margin-top:auto; color:#898793; font-size:10px; }.owner-shop-meta span { padding:5px 7px; background:#1c1c21; border-radius:5px; }.owner-shop-actions { display:flex; gap:7px; margin-top:14px; }.owner-shop-actions .primary-button { flex:1; padding:9px; font-size:10px; }.owner-shop-actions .row-action { padding:9px; }.owner-empty { min-height:230px; grid-column:1/-1; border:1px dashed #35353e; border-radius:11px; display:grid; place-items:center; text-align:center; padding:20px; color:#898793; font-size:12px; }
.team-stats { padding:22px 34px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.team-stats article { min-height:86px; padding:15px; background:#111114; border:1px solid #24242a; border-radius:9px; display:grid; align-content:center; gap:6px; }
.team-stats small { color:#777681; font-size:9px; letter-spacing:.09em; font-weight:800; }
.team-stats strong { font-family:'DM Mono',monospace; font-size:18px; color:#ede5f4; text-transform:capitalize; }
.team-grid { padding:0 34px 34px; display:grid; grid-template-columns:minmax(300px,1.15fr) minmax(280px,.85fr); gap:14px; }
.staff-content { padding:0 34px 34px; display:grid; gap:14px; }
.staff-panel { overflow:visible; }
.staff-panel .panel-heading { border-bottom:0; }
.panel-heading > div { display:grid; gap:4px; }
.viewer-role { color:#d4acfa; background:var(--violet-soft); border-radius:20px; padding:5px 8px; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; }
.staff-card-grid { padding:0 12px 12px; display:grid; grid-template-columns:repeat(auto-fill,minmax(295px,1fr)); gap:9px; }
.staff-card { min-width:0; padding:14px; background:#151519; border:1px solid #28282f; border-radius:10px; transition:transform .15s,border-color .15s,background .15s; }
.staff-card:hover { transform:translateY(-1px); border-color:#494052; background:#19181d; }
.staff-card.is-clocked-in { border-color:rgba(94,225,171,.26); box-shadow:inset 0 1px 0 rgba(94,225,171,.08); }
.staff-card-head { display:flex; align-items:center; gap:9px; min-width:0; }
.staff-avatar { width:34px; height:34px; }
.member-labels { display:flex; align-items:flex-end; gap:4px; flex-direction:column; }
.rank-badge { max-width:125px; overflow:hidden; padding:4px 7px; border:1px solid rgba(194,105,255,.24); border-radius:20px; background:rgba(168,85,247,.08); color:#d99cff; font-size:8px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.self-label { display:inline-block; margin-left:4px; color:var(--ui-accent-text); font-size:7px; letter-spacing:.08em; vertical-align:middle; }
.staff-clock-status { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:13px 0 11px; padding:9px 10px; background:#101012; border-radius:7px; }
.staff-clock-status strong { color:#a8a5b0; font-family:'DM Mono',monospace; font-size:9px; font-weight:500; }
.off-clock-badge { color:#706f79; font-size:8px; font-weight:800; }
.staff-metrics { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.staff-metrics > div { min-width:0; padding:10px; display:grid; gap:5px; background:#1c1c21; border:1px solid #25252c; border-radius:7px; }
.staff-metrics small { color:#777681; font-size:8px; letter-spacing:.08em; font-weight:800; }
.staff-metrics strong { color:#e8e4ec; font-family:'DM Mono',monospace; font-size:11px; overflow:hidden; text-overflow:ellipsis; }
.staff-metrics .commission-value { color:var(--ui-accent-text); }
.staff-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:11px; }
.staff-actions .staff-profile { flex:1 1 120px; color:var(--ui-accent-text); border:1px solid var(--ui-line); background:var(--ui-soft); }
.staff-actions .staff-edit { flex:1; color:var(--ui-accent-text); background:var(--ui-raised); }
.staff-actions .staff-profile:hover,.staff-actions .staff-edit:hover { background:var(--ui-soft); color:var(--ui-highlight); border-color:var(--shop-accent); }
.staff-actions .clock-out-member { color:#9ee9c5; background:rgba(63,181,125,.1); }
.clock-panel .time-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(310px,1fr)); }
.clock-panel .time-row { min-height:62px; }
.recent-orders-panel { min-width:0; }
.recent-orders-header,.recent-order-row { display:grid; grid-template-columns:minmax(190px,1.05fr) minmax(260px,2.6fr) 125px minmax(155px,.9fr); gap:14px; align-items:center; }
.recent-orders-header { margin:12px 14px 5px; padding:9px 11px; border:1px solid #302938; border-radius:8px; background:#0f0c12; color:#77717e; font-size:8px; font-weight:800; letter-spacing:.08em; }
.recent-orders-list { padding:0 14px 14px; display:grid; gap:5px; }
.recent-order-row { min-height:52px; padding:8px 11px; border:1px solid #3b3042; border-radius:9px; background:#211a26; }
.recent-order-user { min-width:0; display:flex; align-items:center; gap:9px; }
.recent-order-user .avatar { width:29px; height:29px; flex:0 0 auto; }
.recent-order-user > span:last-child { min-width:0; display:grid; gap:2px; }
.recent-order-user strong { overflow:hidden; color:#eee9f1; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.recent-order-user small { overflow:hidden; color:#77717c; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.recent-order-items { overflow:hidden; color:#c4bdc8; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.recent-order-total { justify-self:end; color:#df9cff; font-family:'DM Mono',monospace; font-size:11px; }
.recent-order-row time { color:#817985; font-family:'DM Mono',monospace; font-size:8px; }
.commission-note { display:flex; align-items:start; gap:10px; padding:11px; background:rgba(168,85,247,.09); border:1px solid rgba(168,85,247,.18); border-radius:8px; }
.commission-note > span { color:#c16cff; font-size:17px; }
.commission-note p { margin:0; color:#8d8995; font-size:10px; line-height:1.55; }
.commission-note strong { color:#d8cee0; }
.rank-admin-row { padding:11px 14px; display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid #2b252e; }
.rank-admin-row:last-child { border-bottom:0; }
.rank-admin-row > div { min-width:0; display:grid; gap:3px; }
.rank-admin-row strong { overflow:hidden; color:#e8e1ec; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.rank-admin-row small { color:#77707d; font-size:8px; }
.panel-card { background:#111114; border:1px solid #24242a; border-radius:10px; overflow:hidden; }
.panel-heading { padding:16px; display:flex; justify-content:space-between; align-items:baseline; border-bottom:1px solid #24242a; }
.panel-heading h2 { font-size:13px; margin:0; letter-spacing:-.02em; }
.panel-subtitle { color:#777681; font-size:9px; }
.member-row,.time-row { padding:12px 16px; display:flex; align-items:center; gap:10px; border-bottom:1px solid #202026; }
.member-row:last-child,.time-row:last-child { border-bottom:0; }
.member-identity { min-width:0; flex:1; display:grid; gap:2px; }
.member-identity strong { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:11px; }
.member-identity small { color:#797883; font-family:'DM Mono',monospace; font-size:9px; }
.role-badge { padding:4px 7px; border-radius:20px; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; }
.role-badge.admin,.role-badge.website_owner { color:#e5c3ff; background:rgba(168,85,247,.15); }
.role-badge.employee { color:#b5b4bf; background:#222229; }
.clock-badge { color:#6fe2ae; font-size:9px; font-weight:800; }
.row-actions { display:flex; gap:5px; }
.row-action { padding:5px 7px; border-radius:5px; background:#202027; color:#bbb9c3; font-size:9px; font-weight:700; }
.row-action:hover { background:#30303a; color:white; }
.row-action.danger:hover { color:#ffb8b8; background:rgba(248,113,113,.14); }
.time-row { align-items:start; }
.time-row .time-content { min-width:0; flex:1; display:grid; gap:4px; }
.time-row strong { font-size:10px; }
.time-row span { color:#777681; font-size:9px; font-family:'DM Mono',monospace; }
.time-row .open-status { color:#71ddad; }
.time-row .discord-name { color:#77717c; font-size:8px; font-weight:500; }
.empty-list { padding:25px 16px; color:#777681; font-size:11px; text-align:center; }
.manager-grid { padding:26px 34px 34px; display:grid; gap:14px; grid-template-columns:minmax(0,1.7fr) minmax(255px,.7fr); align-items:start; }
.menu-table-card { margin:0; }
.menu-table-header,.admin-menu-row { display:grid; grid-template-columns:minmax(150px,2fr) minmax(110px,1fr) 100px 85px 80px; gap:12px; align-items:center; padding:12px 16px; }
.menu-table-header { color:#777681; font-size:9px; letter-spacing:.09em; font-weight:800; border-bottom:1px solid #24242a; }
.admin-menu-row { border-bottom:1px solid #202026; min-height:61px; }
.admin-menu-row:last-child { border-bottom:0; }
.admin-menu-row strong { font-size:11px; }
.admin-menu-row span { color:#9896a1; font-size:10px; }
.admin-menu-row .price { color:#d58aff; font-family:'DM Mono',monospace; }
.status-active { color:#71dfad !important; }.status-inactive { color:#8b8994 !important; }
.admin-menu-actions { display:flex; justify-content:flex-end; gap:5px; }
.discount-manager { min-height:150px; }.discount-manager .panel-heading > div { display:grid; gap:4px; }
.discount-admin-row { display:flex; gap:10px; align-items:center; padding:12px 16px; border-bottom:1px solid #202026; }.discount-admin-row:last-child { border-bottom:0; }.discount-admin-row strong { font-size:11px; flex:1; }.discount-admin-row span { color:#c65cff; font-family:'DM Mono',monospace; font-size:10px; font-weight:700; }
.stats-time-card { padding:13px 15px; border:1px solid #292932; border-radius:10px; background:#111114; margin-bottom:12px; }.stats-time-card > strong { display:block; font-size:11px; margin-bottom:11px; }.stats-time-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.stats-time-grid small { color:#9ca9bd; font-size:10px; }.stats-time-grid b { display:block; margin-top:5px; color:#d7d3df; font-family:'DM Mono',monospace; font-size:15px; }.personal-stat-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.personal-stat { padding:13px; border-radius:9px; background:#1a1a1d; }.personal-stat small { display:block; color:#a9b4c7; font-size:10px; margin-bottom:7px; }.personal-stat strong { font-family:'DM Mono',monospace; font-size:17px; }.personal-stat.purple strong { color:#c75cff; }.recent-sale-list { margin-top:20px; }.recent-sale-list h3 { font-size:12px; margin:0 0 8px; }.recent-sale { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 0; border-bottom:1px solid #28282e; }.recent-sale:last-child { border-bottom:0; }.recent-sale small { display:block; color:#85838e; font-size:9px; margin-top:3px; }.recent-sale strong { color:#d9b1ff; font-family:'DM Mono',monospace; font-size:11px; }

/* Modal + toast */
.modal-scrim { position:fixed; z-index:50; inset:0; padding:20px; display:grid; place-items:center; background:rgba(0,0,0,.66); backdrop-filter:blur(5px); }
.modal { width:min(100%,470px); background:#16161a; border:1px solid #34343c; border-radius:13px; padding:21px; box-shadow:0 25px 70px rgba(0,0,0,.5); }
.modal-head { display:flex; justify-content:space-between; gap:20px; align-items:start; margin-bottom:18px; }
.modal-head h2 { margin:0; letter-spacing:-.045em; font-size:20px; }.modal-head p { margin:6px 0 0; color:#8e8d98; font-size:11px; line-height:1.5; }
.close-modal { background:transparent; color:#a19fa9; font-size:18px; line-height:1; padding:1px; }.close-modal:hover { color:#fff; }
.form-grid { display:grid; gap:13px; }.form-grid.two { grid-template-columns:1fr 120px; }
.form-field { display:grid; gap:6px; color:#9897a2; font-size:10px; font-weight:800; letter-spacing:.06em; }
.form-field input,.form-field select { width:100%; background:#0e0e11; border:1px solid #2b2b32; border-radius:7px; color:#f0eef4; outline:0; padding:10px; font-size:12px; font-weight:600; letter-spacing:0; }
.form-field input:focus,.form-field select:focus { border-color:#8444b6; }
.form-field select { appearance:auto; }
.form-check { display:flex; gap:8px; align-items:center; color:#b1afba; font-size:11px; }
.form-check input { accent-color:#ad4af3; }
.modal-footer { display:flex; justify-content:flex-end; gap:8px; margin-top:20px; }.secondary-button { background:#27272e; color:#c8c6cf; border-radius:7px; padding:10px 13px; font-size:11px; font-weight:800; }.secondary-button:hover { background:#33333c; }.modal-footer .primary-button { padding:10px 13px; font-size:11px; }
.discount-choice-list { display:grid; gap:8px; }.discount-choice { display:flex; justify-content:space-between; align-items:center; width:100%; padding:13px; border-radius:9px; text-align:left; color:#f1edf4; background:#1b1b1e; font-size:12px; font-weight:800; }.discount-choice:hover { background:#26232a; }.discount-choice strong { color:#c15cff; font-family:'DM Mono',monospace; font-size:11px; }
.toast-root { position:fixed; z-index:70; right:18px; bottom:18px; display:grid; gap:8px; max-width:min(360px,calc(100vw - 36px)); }.toast { padding:11px 14px; background:#212127; color:#efecf2; border:1px solid #3b3a45; border-left:3px solid #b64bff; border-radius:8px; box-shadow:var(--shadow); font-size:11px; font-weight:700; animation:toast-in .2s ease-out; }.toast.error { border-left-color:#f87171; }
@keyframes toast-in { from { opacity:0; transform:translateY(8px) } to { opacity:1; transform:translateY(0) } }

@media (max-width: 1000px) { .app-shell { grid-template-columns:210px 1fr; }.sidebar { padding:17px 10px 10px; }.pos-layout { grid-template-columns:minmax(300px,1fr) 285px; }.catalog-panel { padding:22px; }.menu-grid { grid-template-columns:repeat(auto-fill,minmax(145px,1fr)); }.team-grid,.manager-grid { grid-template-columns:1fr; }.page-header,.team-stats,.team-grid,.staff-content,.manager-grid,.owner-summary,.owner-shop-grid { padding-left:23px; padding-right:23px; } }
@media (max-width: 760px) { .login-shell { grid-template-columns:1fr; }.brand-panel { display:none; }.login-card-wrap { min-height:100vh; padding:24px; }.mobile-wordmark { display:flex; }.app-shell { display:block; }.sidebar { position:fixed; transform:translateX(-101%); transition:transform .2s; width:260px; box-shadow:20px 0 50px rgba(0,0,0,.35); }.sidebar.open { transform:translateX(0); }.topbar { height:58px; padding:0 16px; }.mobile-header { display:flex; align-items:center; gap:11px; }.icon-button { display:block; background:transparent; font-size:18px; color:#c9c6d0; }.store-summary { display:none; }.top-avatar { display:none; }.pos-layout { display:flex; flex-direction:column; }.catalog-panel { padding:17px 15px 25px; }.cart-panel { min-height:0; border-left:0; border-top:1px solid var(--line-soft); }.cart-items { max-height:260px; min-height:130px; }.cart-footer { padding-bottom:23px; }.page-header { min-height:129px; padding:26px 16px 20px; }.page-header h1 { font-size:25px; }.team-stats,.owner-summary { padding:16px; gap:8px; }.team-stats { grid-template-columns:1fr 1fr; }.team-stats article { padding:11px; min-height:70px; }.team-stats strong { font-size:14px; }.team-grid,.staff-content,.manager-grid,.owner-shop-grid { padding:0 16px 25px; }.staff-card-grid { grid-template-columns:1fr; }.clock-panel .time-list { grid-template-columns:1fr; }.owner-summary { grid-template-columns:1fr; }.owner-summary article { min-height:65px; }.owner-shop-grid { grid-template-columns:1fr; }.menu-table-card { overflow:auto; }.menu-table-header,.admin-menu-row { min-width:650px; }.catalog-heading { padding-top:5px; }.menu-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.catalog-tools { gap:7px; }.primary-small { padding:0 9px; }.clock-button { padding:8px 10px; }.form-grid.two { grid-template-columns:1fr; }.stats-button { padding:8px 9px; } }
@media (max-width: 390px) { .menu-card { min-height:80px; padding:10px; }.menu-card strong { font-size:10px; }.top-actions { gap:5px; }.category-tab { padding:6px 9px; }.page-header .primary-button { padding:9px; } }

/* V8 — Lucid top navigation and rounded POS panels */
:root { --bg:#070609; --panel:#17131b; --panel-2:#1d1722; --panel-3:#251d2a; --line:#39303f; --line-soft:#2a232f; --text:#f8f5fa; --muted:#9c92a4; --dim:#746b7b; --violet:#a93fff; --violet-bright:#d05cff; --violet-soft:rgba(169,63,255,.14); --green:#64e4ae; --red:#ff5578; --shadow:0 22px 55px rgba(0,0,0,.34); }
body { background:radial-gradient(circle at 55% -20%,rgba(116,32,181,.16),transparent 36%),#070609; }
.app-shell { display:block; width:min(100%,1820px); min-height:100vh; margin:auto; padding:8px 18px 18px; }
.sidebar.app-header { position:sticky; top:8px; height:auto; width:auto; padding:11px 14px; display:grid; grid-template-columns:auto minmax(180px,225px) minmax(310px,1fr) auto; gap:13px; align-items:center; border:1px solid #403546; border-top-color:#6c3159; border-right:1px solid #403546; border-radius:18px; background:linear-gradient(180deg,rgba(32,25,37,.98),rgba(25,20,29,.98)); box-shadow:0 15px 40px rgba(0,0,0,.25); backdrop-filter:blur(18px); z-index:30; }
.sidebar-brand { min-width:165px; padding:0; display:flex; align-items:center; gap:10px; }
.brand-logo,.login-logo { width:46px; height:46px; flex:0 0 auto; object-fit:cover; border-radius:12px; background:#09070b; box-shadow:0 0 22px rgba(169,63,255,.25); }
.brand-lockup { min-width:0; display:grid; gap:3px; }
.brand-lockup strong { font-size:14px; letter-spacing:-.03em; }
.brand-lockup small { max-width:140px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#8f8497; font-size:9px; font-weight:500; }
.shop-switcher { width:100%; min-height:46px; padding:7px 10px; border-color:#3a303f; background:#130f16; border-radius:11px; gap:9px; }
.shop-switcher-label { flex:1; }
.shop-switcher:hover { background:#18131c; border-color:#70418a; }
.shop-popover { top:68px; left:192px; right:auto; width:260px; }
.side-nav { margin:0; display:flex; align-items:center; justify-content:center; gap:6px; }
.nav-link { width:auto; padding:10px 14px; gap:6px; border:1px solid transparent; border-radius:10px; color:#8f8497; white-space:nowrap; }
.nav-link span { display:none; }
.nav-link:hover { background:#241d29; color:#f4ecf7; }
.nav-link.active { color:#fff; border-color:rgba(205,69,255,.38); background:linear-gradient(180deg,rgba(165,43,214,.24),rgba(114,29,151,.17)); box-shadow:inset 0 1px 0 rgba(255,255,255,.05); }
.sidebar-bottom { margin:0; display:flex; justify-content:flex-end; align-items:center; gap:7px; }
.sidebar-bottom .quiet-button,.sidebar-bottom .stats-button,.sidebar-bottom .clock-button { min-height:38px; padding:9px 11px; border:1px solid #3d3043; border-radius:10px; background:#1b151f; white-space:nowrap; }
.sidebar-bottom .quiet-button:hover,.sidebar-bottom .stats-button:hover { color:white; background:#281d2e; border-color:#673677; }
.sidebar-bottom .clock-button { color:#e6c7f7; background:rgba(144,40,189,.13); }
.account-chip { min-height:48px; padding:5px 9px 5px 6px; display:flex; align-items:center; gap:5px; border:1px solid #403548; border-radius:13px; background:#241d29; }
.account-chip .profile-link { padding:2px 4px; }
.account-chip .profile-link:hover { background:transparent; }
.account-chip .top-avatar { width:36px; height:36px; }
.icon-button { display:none; }
.main-content { min-width:0; padding-top:16px; }
.portal-view { min-height:calc(100vh - 108px); }
.pos-layout { min-height:calc(100vh - 108px); display:grid; grid-template-columns:minmax(520px,1fr) minmax(340px,430px); gap:16px; }
.catalog-panel,.cart-panel { border:1px solid #3c3342; border-radius:18px; background:linear-gradient(145deg,#1b1620,#151118); box-shadow:var(--shadow); }
.catalog-panel { padding:20px; }
.cart-panel { min-height:calc(100vh - 108px); border-left:1px solid #3c3342; overflow:hidden; }
.catalog-tools { margin-bottom:14px; }
.search-box { background:#100d13; border-color:#372e3c; border-radius:11px; }
.category-tabs { gap:5px; margin:0 0 15px; padding:5px; border:1px solid #2d2632; border-radius:12px; background:#0f0c12; }
.category-tab { flex:1; padding:10px 12px; border:1px solid transparent; background:transparent; }
.category-tab.active { border-color:rgba(202,73,255,.35); background:linear-gradient(180deg,rgba(167,47,218,.25),rgba(103,25,140,.22)); }
.catalog-heading { padding:2px 1px 16px; }
.catalog-heading h1 { font-size:24px; }
.menu-grid { grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:10px; }
.menu-card { position:relative; min-height:112px; padding:15px; border-color:#3a2d40; border-radius:13px; background:#211a26; }
.menu-card:hover { border-color:#853aa0; background:#291e30; }
.menu-card strong { max-width:calc(100% - 90px); font-size:12px; }
.menu-card .menu-price { position:absolute; top:12px; right:12px; padding:5px 8px; border:1px solid rgba(193,72,255,.32); border-radius:20px; background:rgba(129,29,171,.14); color:#e47cff; }
.cart-top { padding:20px; background:rgba(255,255,255,.015); }
.cart-top h2 { font-size:18px; }
.cart-items { padding:15px 18px; }
.cart-footer { padding:17px 18px 18px; background:rgba(10,8,12,.28); }
.checkout-button { min-height:48px; border-radius:12px; background:linear-gradient(135deg,#b839f1,#7b22ad); font-size:12px; }
.page-header { min-height:124px; margin-bottom:16px; padding:25px 24px; align-items:center; border:1px solid #3c3342; border-radius:18px; background:linear-gradient(145deg,#1d1722,#17131b); box-shadow:var(--shadow); }
.page-actions { display:flex; align-items:center; gap:8px; }
.danger-button { padding:10px 13px; border:1px solid rgba(255,85,120,.3); border-radius:9px; background:rgba(255,85,120,.08); color:#ff9bad; font-size:10px; font-weight:800; }
.danger-button:hover { background:rgba(255,85,120,.16); color:#ffc3cd; }
.owner-summary,.team-stats { padding:0 0 16px; }
.owner-summary article,.team-stats article { border-color:#3a303f; border-radius:13px; background:#1a151e; }
.owner-shop-grid,.staff-content,.manager-grid { padding:0; }
.owner-shop-card,.panel-card { border-color:#3a303f; border-radius:14px; background:#1a151e; }
.staff-card { background:#221b27; border-color:#3b3041; }
.manager-grid { grid-template-columns:minmax(0,1.6fr) minmax(290px,.65fr); }
.login-logo { width:56px; height:56px; }
.wordmark,.mobile-wordmark { gap:12px; }
.brand-panel { background:radial-gradient(circle at 22% 78%,rgba(157,47,239,.3),transparent 39%),linear-gradient(145deg,#16101c,#09070c 68%); }

@media (max-width:1280px) {
  .sidebar.app-header { grid-template-columns:auto minmax(170px,210px) 1fr auto; }
  .nav-link { padding:10px; }
  .sidebar-bottom .stats-button span,.sidebar-bottom .quiet-button { display:none; }
  .menu-grid { grid-template-columns:repeat(auto-fill,minmax(205px,1fr)); }
}
@media (max-width:980px) {
  .app-shell { padding:0 12px 12px; }
  .sidebar.app-header,.sidebar.app-header.open { position:sticky; top:0; width:auto; height:auto; padding:9px 11px; grid-template-columns:auto minmax(150px,1fr) auto; transform:none; border-radius:0 0 15px 15px; }
  .sidebar-brand { min-width:0; }
  .brand-lockup { display:none; }
  .brand-logo { width:40px; height:40px; }
  .shop-switcher { min-height:40px; }
  .icon-button { display:block; grid-column:3; grid-row:1; width:40px; height:40px; border:1px solid #403548; border-radius:10px; background:#241d29; }
  .side-nav { display:none; grid-column:1/-1; padding:9px 0 1px; grid-template-columns:repeat(4,1fr); }
  .sidebar.open .side-nav { display:grid; }
  .sidebar-bottom { grid-column:1/-1; display:none; padding-top:8px; justify-content:center; }
  .sidebar.open .sidebar-bottom { display:flex; }
  .shop-popover { top:58px; left:62px; width:min(280px,calc(100vw - 84px)); }
  .pos-layout { grid-template-columns:minmax(400px,1fr) minmax(300px,360px); }
}
@media (max-width:760px) {
  .main-content { padding-top:10px; }
  .pos-layout { display:flex; min-height:0; gap:10px; }
  .catalog-panel,.cart-panel { border-radius:14px; }
  .cart-panel { min-height:0; }
  .menu-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .menu-card { min-height:102px; }
  .menu-card strong { max-width:100%; padding-top:28px; }
  .page-header { margin-bottom:10px; border-radius:14px; }
  .page-actions { align-items:stretch; flex-direction:column-reverse; }
  .manager-grid { grid-template-columns:1fr; }
}

/* Operations centre */
.shift-protection-card,.duty-diagnostics-card,.weekly-schedule-card,.pay-period-card { margin:0 23px 14px; }
.shift-protection-list,.duty-diagnostic-list,.pay-period-list { padding:0 14px 14px; display:grid; gap:8px; }
.shift-protection-row,.duty-diagnostic-row { min-width:0; padding:11px 12px; display:flex; align-items:center; justify-content:space-between; gap:12px; border:1px solid #382f3d; border-radius:9px; background:#1a151e; }
.shift-protection-row > div,.duty-diagnostic-row > div { min-width:0; display:grid; gap:4px; }
.shift-protection-row strong,.duty-diagnostic-row strong { color:#f3edf6; font-size:12px; }
.shift-protection-row small,.duty-diagnostic-row small,.duty-diagnostic-row em { color:#93879a; font-size:10px; font-style:normal; line-height:1.45; }
.shift-protection-row > span,.duty-diagnostic-row > span { display:flex; align-items:center; justify-content:flex-end; gap:6px; flex-wrap:wrap; }
.duty-diagnostic-row > span b { padding:5px 8px; border-radius:999px; background:#28202e; color:#cdbbd6; font-size:9px; text-transform:uppercase; letter-spacing:.04em; }
.duty-diagnostic-row.processed { border-left:3px solid #22c55e; }
.duty-diagnostic-row.conflict,.shift-protection-row.conflict { border-left:3px solid #f59e0b; }
.duty-diagnostic-row.failed,.duty-diagnostic-row.unmatched,.shift-protection-row.failed,.shift-protection-row.unmatched { border-left:3px solid #ef4444; }
.weekly-schedule-form { padding:0 14px 14px; display:grid; grid-template-columns:1.5fr .7fr .7fr 1.5fr auto; align-items:end; gap:10px; }
.weekly-schedule-form > label:not(.schedule-switch) { display:grid; gap:6px; color:var(--ui-muted); font-size:10px; font-weight:800; }
.weekly-schedule-form select,.weekly-schedule-form input[type="time"] { min-height:42px; padding:9px 11px; border:1px solid #3d3442; border-radius:8px; background:#100d12; color:#f5f0f7; font-size:13px; }
.schedule-switch { min-height:58px; padding:9px 11px; display:flex; align-items:center; justify-content:space-between; gap:10px; border:1px solid var(--ui-line); border-radius:9px; background:var(--ui-raised); }
.schedule-switch span { display:grid; gap:3px; }
.schedule-switch strong { color:var(--ui-highlight); font-size:11px; }
.schedule-switch small { color:var(--ui-muted); font-size:9px; line-height:1.35; }
.schedule-switch input { accent-color:var(--shop-accent); }
@media (max-width:1000px) { .weekly-schedule-form { grid-template-columns:1fr 1fr; } .weekly-schedule-form .schedule-switch { grid-column:1 / -1; } }
@media (max-width:760px) {
  .shift-protection-card,.duty-diagnostics-card,.weekly-schedule-card,.pay-period-card { margin:0 16px 14px; }
  .shift-protection-row,.duty-diagnostic-row { align-items:flex-start; flex-direction:column; }
  .shift-protection-row > span,.duty-diagnostic-row > span { width:100%; justify-content:flex-start; }
  .weekly-schedule-form { grid-template-columns:1fr; }
  .weekly-schedule-form .schedule-switch { grid-column:auto; }
  .weekly-schedule-form button { width:100%; min-height:46px; }
}

/* Shop-controlled menu presentation and colour system */
:root { --shop-accent:#a855f7; --shop-button:#8f3eb4; --shop-background:#08080a; --shop-panel:#111114; }
html,body,.app-shell,.main-content { background:var(--shop-background); }
.sidebar.app-header,.catalog-panel,.cart-panel,.page-header,.owner-summary article,.team-stats article,.owner-shop-card,.panel-card,.settings-card { background:var(--shop-panel); }
.primary-small,.primary-button,.checkout-button,.mechanic-add-button { background:var(--shop-button); }
.nav-link.active,.category-tab.active { border-color:color-mix(in srgb,var(--shop-accent) 48%,#29232e); background:color-mix(in srgb,var(--shop-accent) 20%,var(--shop-panel)); }
.menu-card .menu-price,.commission-value,.status-active,.correction-status { color:var(--shop-accent); }

.menu-card:hover,.menu-card .menu-price,.shop-logo { border-color:color-mix(in srgb,var(--shop-accent) 48%,#342d38); }
.menu-card .menu-price,.rank-badge,.request-count { background:color-mix(in srgb,var(--shop-accent) 16%,var(--shop-panel)); }
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible { outline-color:var(--shop-accent); }

.menu-grid.is-grouped { display:block; }
.menu-category-section + .menu-category-section { margin-top:24px; }
.menu-category-heading { margin:0 1px 10px; padding-bottom:9px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid color-mix(in srgb,var(--shop-accent) 22%,#2c2730); }
.menu-category-heading h2 { margin:0; font-size:15px; letter-spacing:-.025em; }
.menu-category-heading span { color:#827a88; font-size:9px; }
.category-item-grid { grid-template-columns:repeat(auto-fill,minmax(265px,1fr)); }

.appearance-form { padding:14px; display:grid; gap:14px; }
.appearance-toggle { min-height:54px; padding-bottom:13px; display:flex; align-items:center; justify-content:space-between; gap:14px; border-bottom:1px solid #302a33; }
.appearance-toggle > span { display:grid; gap:4px; }
.appearance-toggle strong { font-size:10px; }
.appearance-toggle small { color:#77717b; font-size:8px; line-height:1.4; }
.appearance-toggle input { position:relative; width:38px; height:22px; flex:0 0 auto; appearance:none; border:1px solid #46404a; border-radius:999px; background:#2a252d; cursor:pointer; }
.appearance-toggle input:after { content:""; position:absolute; top:3px; left:3px; width:14px; height:14px; border-radius:50%; background:#a49ea8; transition:transform .16s; }
.appearance-toggle input:checked { border-color:var(--shop-accent); background:var(--shop-accent); }
.appearance-toggle input:checked:after { transform:translateX(16px); background:#fff; }
.colour-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.colour-grid label { display:grid; gap:6px; color:#8e8593; font-size:8px; font-weight:800; letter-spacing:.06em; }
.colour-grid label > span { min-height:38px; padding:5px 8px 5px 5px; display:flex; align-items:center; gap:8px; border:1px solid #3b3340; border-radius:8px; background:#100d12; }
.colour-grid input[type="color"] { width:30px; height:26px; padding:0; overflow:hidden; border:0; border-radius:5px; background:transparent; cursor:pointer; }
.colour-grid code { color:#c6beca; font-family:'DM Mono',monospace; font-size:8px; }
.appearance-form .primary-button { padding:10px; font-size:10px; }
.rank-admin-row > span { display:flex; gap:5px; }
.profile-admin-actions { margin-bottom:12px; display:flex; gap:7px; }
.profile-admin-actions .secondary-button { padding:8px 10px; font-size:9px; }
.profile-summary { grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); }

@media (max-width:760px) {
  .category-item-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .colour-grid { grid-template-columns:1fr; }
  #manager-clock-button { width:100%; justify-content:center; }
}
@media (max-width:520px) {
  .app-shell { padding:0 7px 8px; }
  .sidebar.app-header,.sidebar.app-header.open { margin:0 -7px; }
  .side-nav { grid-template-columns:1fr 1fr; }
  .nav-link { justify-content:center; }
  .sidebar-bottom .stats-button { display:flex; }
  .account-chip .profile-link { display:none; }
  .catalog-panel { padding:13px; }
  .menu-grid { grid-template-columns:1fr 1fr; gap:7px; }
  .menu-card { min-height:94px; padding:11px; }
  .menu-card .menu-price { top:9px; right:9px; }
  .team-stats { grid-template-columns:1fr 1fr; }
}

/* Production UI cleanup */
body { background:#09070b; }
.sidebar.app-header { border-color:#352f39; border-top-color:#352f39; background:#17131a; box-shadow:0 8px 24px rgba(0,0,0,.2); backdrop-filter:none; }
.brand-logo,.login-logo { border:1px solid #352d3a; box-shadow:none; }
.nav-link.active { border-color:#553264; background:#2a1d31; box-shadow:none; }
.sidebar-bottom .quiet-button,.sidebar-bottom .stats-button,.sidebar-bottom .clock-button { background:#1c1720; box-shadow:none; }
.account-chip { background:#201923; }
.primary-small,.primary-button,.checkout-button { background:#8e32b8; box-shadow:none; }
.primary-small:hover,.primary-button:hover { transform:none; filter:brightness(1.08); }
.category-tab.active { border-color:#5d326d; background:#2b1b32; box-shadow:none; }
.catalog-panel,.cart-panel,.page-header { background:#17131a; box-shadow:0 10px 28px rgba(0,0,0,.22); }
.menu-card { background:#201923; }
.menu-card:hover { transform:none; border-color:#6f3b82; background:#241b28; }
.menu-card .menu-price { background:#2c1934; box-shadow:none; }
.owner-shop-card:hover,.staff-card:hover { transform:none; }
.owner-summary article,.team-stats article,.owner-shop-card,.panel-card { background:#19151d; }
.brand-panel { background:#111014; }
.brand-panel:after { display:none; }

/* Shop logos */
.shop-logo { position:relative; width:48px; height:48px; flex:0 0 auto; display:grid; place-items:center; overflow:hidden; border:1px solid #4b3457; border-radius:12px; background:#2a1d32; color:#e4c5f1; font-size:12px; font-weight:800; letter-spacing:.03em; }
.shop-logo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; background:#151119; }
.shop-logo-small { width:32px; height:32px; border-radius:8px; font-size:9px; }
.shop-logo-tiny { width:25px; height:25px; border-radius:7px; font-size:8px; }
.owner-shop-heading { display:flex; align-items:center; gap:12px; min-width:0; }
.owner-shop-heading > div { min-width:0; }
.owner-shop-heading h2 { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.optional-label { margin-left:5px; color:#736a79; font-size:8px; font-weight:700; }
.form-hint { display:block; margin-top:7px; color:#776f7d; font-size:9px; font-weight:500; letter-spacing:0; line-height:1.5; text-transform:none; }

/* Professional sign-in */
.login-shell { grid-template-columns:minmax(0,1fr) minmax(430px,.72fr); background:#0c0b0e; }
.brand-panel { min-height:100vh; padding:48px clamp(42px,7vw,108px); background:#111014; border-color:#2b2730; }
.wordmark { align-items:flex-start; font-size:15px; }
.wordmark > span { display:grid; gap:2px; }
.wordmark small { color:#79737e; font-size:9px; font-weight:600; letter-spacing:.03em; }
.brand-copy { max-width:650px; padding:72px 0; }
.brand-copy h1 { max-width:640px; margin:0 0 22px; font-size:clamp(40px,4.3vw,66px); line-height:1.03; letter-spacing:-.06em; }
.brand-copy h1 em { color:#cf8cff; font-style:normal; }
.brand-copy > p:last-of-type { max-width:510px; margin:0; color:#aba5b0; font-size:15px; line-height:1.7; }
.product-summary { display:flex; flex-wrap:wrap; gap:8px; margin-top:30px; }
.product-summary span { padding:8px 10px; border:1px solid rgba(168,85,247,.27); border-radius:7px; color:#c8bdcf; background:rgba(168,85,247,.07); font-size:10px; font-weight:800; }
.brand-footnote { position:relative; z-index:1; margin:0; color:#69646e; font-size:11px; }
.login-card-wrap { padding:48px; background:#0a090b; }
.login-card { position:relative; overflow:hidden; width:min(100%,430px); padding:30px; border:1px solid #2d2831; border-radius:16px; background:#121015; box-shadow:0 24px 70px rgba(0,0,0,.28); }
.login-card:before { content:""; position:absolute; top:0; left:30px; width:52px; height:2px; border-radius:0 0 2px 2px; background:#a855f7; box-shadow:0 0 18px rgba(168,85,247,.45); }
.login-kicker { color:#b86df2; }
.login-card h2 { margin-bottom:11px; font-size:27px; line-height:1.2; letter-spacing:-.045em; }
.login-card .muted { margin-bottom:26px; font-size:13px; line-height:1.65; }
.discord-button { border-radius:9px; box-shadow:none; }
.discord-button:hover { transform:none; }
.login-assurance { display:flex; justify-content:center; flex-wrap:wrap; gap:7px 16px; margin-top:16px; color:#7f7984; font-size:9px; font-weight:700; }
.login-assurance span { position:relative; }
.login-assurance span + span:before { content:""; position:absolute; top:50%; left:-9px; width:2px; height:2px; border-radius:50%; background:#514b56; }
.fine-print { margin-top:11px; }

/* Employee settings */
#settings-view { max-width:1180px; margin:0 auto; }
.settings-page-header { min-height:112px; margin-bottom:12px; align-items:center; }
.settings-header-actions { display:flex; align-items:center; gap:10px; }
.settings-account { min-height:43px; padding:7px 9px 7px 12px; display:flex; align-items:center; gap:13px; border:1px solid #38313c; border-radius:9px; background:#1c1720; }
.settings-account > span:first-child { min-width:120px; display:grid; gap:2px; }
.settings-account small { color:#746e78; font-size:8px; font-weight:800; letter-spacing:.08em; }
.settings-account strong { max-width:180px; overflow:hidden; color:#ddd8e0; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.settings-page-header .secondary-button { min-height:43px; padding:0 13px; border-radius:9px; }
.settings-grid { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(380px,1.2fr); gap:12px; align-items:start; padding-bottom:28px; }
.settings-card { padding:0 18px; border:1px solid #38313c; border-radius:13px; background:#18141b; }
.settings-card-head { padding:17px 0 14px; }
.settings-card-head h2 { margin:0 0 4px; font-size:14px; }
.settings-card-head p { margin:0; color:#7d7681; font-size:9px; }
.settings-card-ordering { grid-column:2; grid-row:1 / span 2; }
.settings-card-admin { grid-column:1; }
.settings-card-music { grid-column:1; }
.music-volume-row { padding:13px 0; display:grid; gap:9px; border-top:1px solid #302a33; }
.music-volume-row label { display:flex; justify-content:space-between; align-items:center; gap:12px; color:#e7e3e9; font-size:10px; }
.music-volume-row output { color:var(--shop-accent,#a855f7); font-family:'DM Mono',monospace; font-size:12px; font-weight:800; }
.music-volume-row input[type="range"] { width:100%; height:6px; margin:9px 0; appearance:none; border-radius:999px; outline:0; background:linear-gradient(to right,var(--shop-accent,#a855f7) 0 var(--music-fill,10%),#3b3341 var(--music-fill,10%) 100%); cursor:pointer; }
.music-volume-row input[type="range"]::-webkit-slider-thumb { width:18px; height:18px; appearance:none; border:2px solid #17131a; border-radius:50%; background:var(--shop-accent,#a855f7); box-shadow:0 0 0 1px #74607e; }
.music-volume-row input[type="range"]::-moz-range-thumb { width:14px; height:14px; border:2px solid #17131a; border-radius:50%; background:var(--shop-accent,#a855f7); box-shadow:0 0 0 1px #74607e; }
.music-playback-row { min-height:43px; padding:0 0 15px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.music-playback-row p { margin:0; color:#9c93a3; font-size:10px; line-height:1.5; }
.music-playback-row button { min-height:34px; padding:7px 10px; flex:0 0 auto; white-space:nowrap; }
.setting-row { min-height:64px; padding:13px 0; display:flex; align-items:center; justify-content:space-between; gap:18px; border:0; border-top:1px solid #302a33; border-radius:0; background:transparent; }
.setting-row > span { min-width:0; display:grid; gap:4px; }
.employee-dm-settings-form { padding:0 16px 16px; }
.employee-dm-settings-form .setting-row { display:grid; grid-template-columns:minmax(0,1fr) 38px; align-items:center; gap:16px; }
.employee-dm-settings-form .setting-row input[type="checkbox"] { align-self:center; margin-top:0; }
.employee-dm-settings-form .setting-row:first-child { border-top:0; }
.employee-dm-settings-form .setting-row strong { color:var(--ui-highlight); font-size:12px; }
.employee-dm-settings-form .setting-row small { color:var(--ui-muted); font-size:11px; line-height:1.5; }
.employee-dm-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:12px; }
.employee-dm-actions > small { color:var(--ui-muted); font-size:10px; line-height:1.5; }
.employee-dm-actions button { flex:0 0 auto; min-height:40px; }
@media (max-width:600px) { .employee-dm-actions { align-items:stretch; flex-direction:column; gap:10px; } .employee-dm-actions button { min-height:44px; width:100%; } }
.setting-row strong { color:#e7e3e9; font-size:10px; }
.setting-row small { color:#77717b; font-size:8px; line-height:1.45; }
.setting-row input[type="checkbox"] { position:relative; width:38px; height:22px; flex:0 0 auto; margin:0; appearance:none; border:1px solid #46404a; border-radius:999px; background:#2a252d; cursor:pointer; transition:border-color .16s,background .16s; }
.setting-row input[type="checkbox"]:after { content:""; position:absolute; top:3px; left:3px; width:14px; height:14px; border-radius:50%; background:#a49ea8; transition:transform .16s,background .16s; }
.setting-row input[type="checkbox"]:checked { border-color:#8e32b8; background:#8e32b8; }
.setting-row input[type="checkbox"]:checked:after { transform:translateX(16px); background:white; }
.setting-row select,.setting-row input[type="number"] { width:160px; min-height:37px; padding:8px 10px; border:1px solid #3b3540; border-radius:8px; outline:0; background:#0f0d11; color:#e9e5eb; font-size:10px; }
.setting-row input[type="number"] { width:72px; }
.setting-row select:focus,.setting-row input[type="number"]:focus { border-color:#744486; }

@media (max-width:900px) {
  .settings-page-header { align-items:flex-start; flex-direction:column; }
  .settings-header-actions { width:100%; justify-content:space-between; }
  .settings-grid { grid-template-columns:1fr; }
  .settings-card-ordering,.settings-card-admin,.settings-card-music { grid-column:auto; grid-row:auto; }
}

/* Dev announcements */
.site-announcement { width:100%; min-height:46px; padding:10px clamp(16px,4vw,54px); display:flex; align-items:center; justify-content:center; gap:13px; border-top:3px solid var(--shop-accent,#a855f7); border-bottom:1px solid color-mix(in srgb,var(--shop-accent,#a855f7) 42%,#312638); background:linear-gradient(90deg,#17111c,color-mix(in srgb,var(--shop-accent,#a855f7) 16%,#17111c),#17111c); color:#f6eff9; text-align:center; box-shadow:0 9px 26px rgba(0,0,0,.24); }
.site-announcement .announcement-label { flex:0 0 auto; color:color-mix(in srgb,var(--shop-accent,#a855f7) 72%,white); font-size:10px; font-weight:800; letter-spacing:.1em; }
.site-announcement p { margin:0; max-width:1100px; color:#eee5f2; font-size:13px; font-weight:700; line-height:1.45; white-space:pre-wrap; }
.site-maintenance-notice { border-top-color:#d99a3e; border-bottom-color:#684b29; background:linear-gradient(90deg,#1c1711,#2b2115,#1c1711); }
.site-maintenance-notice .announcement-label { color:#f5bf6d; }
.login-body.has-site-announcement .login-shell { min-height:calc(100vh - 46px); }
.announcement-manager { max-width:900px; margin:0 23px 18px; }
.announcement-form { padding:0 16px 16px; }
.announcement-form > label { display:grid; gap:7px; color:#95899b; font-size:10px; font-weight:800; letter-spacing:.06em; }
.announcement-form textarea { width:100%; min-height:112px; resize:vertical; padding:13px; border:1px solid #3c3241; border-radius:10px; background:#100d12; color:#f5eef8; outline:0; font-size:14px; line-height:1.55; }
.announcement-form textarea:focus { border-color:var(--shop-accent); box-shadow:0 0 0 3px color-mix(in srgb,var(--shop-accent) 14%,transparent); }
.announcement-form-meta { margin:7px 1px 12px; display:flex; justify-content:space-between; gap:12px; color:#837989; font-size:11px; }
.announcement-preview { min-height:66px; padding:12px 14px; display:grid; grid-template-columns:auto 1fr; align-items:start; gap:12px; border-top:3px solid var(--shop-accent); border-radius:9px; background:color-mix(in srgb,var(--shop-accent) 10%,#171219); }
.announcement-preview > span { color:var(--shop-accent); font-size:9px; font-weight:800; letter-spacing:.1em; }
.announcement-preview p { margin:0; color:#eee6f2; font-size:13px; font-weight:700; line-height:1.5; white-space:pre-wrap; }
.announcement-actions { margin-top:13px; display:flex; justify-content:flex-end; gap:8px; }
.announcement-actions .primary-button { padding:10px 14px; font-size:11px; }
.owner-discord-card,.website-activity-card { max-width:1100px; margin:0 23px 18px; }
.owner-discord-settings-form { padding:0 16px 16px; }
.owner-discord-settings-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); align-items:end; gap:14px; }
.owner-discord-settings-grid > div { min-height:72px; padding:12px; display:grid; align-content:center; gap:4px; border:1px solid #352d3a; border-radius:9px; background:#151218; }
.owner-discord-settings-grid > div small,.owner-discord-settings-grid label { color:#95899b; font-size:9px; font-weight:800; letter-spacing:.07em; }
.owner-discord-settings-grid > div strong { color:#eee8f1; font-size:12px; }
.owner-discord-settings-grid code { color:#877d8d; font-family:'DM Mono',monospace; font-size:9px; }
.owner-discord-settings-grid label { display:grid; gap:7px; }
.owner-discord-settings-grid select { width:100%; min-height:45px; padding:10px 12px; border:1px solid #3c3241; border-radius:9px; background:#100d12; color:#eee8f1; outline:0; font-size:11px; }
.owner-discord-settings-grid select:focus { border-color:var(--shop-accent); }
.owner-discord-delivery-status { margin:11px 1px 0; color:#817787; font-size:10px; line-height:1.5; }
.owner-discord-delivery-status.error { color:#f2a4ad; }
.owner-discord-actions { margin-top:12px; display:flex; justify-content:flex-end; gap:8px; }
.owner-discord-actions button { min-height:38px; padding:9px 13px; font-size:10px; }
.activity-heading-actions { display:flex; align-items:center; gap:8px; }
.website-activity-list { padding:0 14px 14px; display:grid; gap:7px; }
.website-activity-row { min-height:68px; padding:11px 12px; display:grid; grid-template-columns:minmax(190px,1.15fr) minmax(105px,.55fr) minmax(130px,.7fr) minmax(210px,1.35fr); align-items:center; gap:12px; border:1px solid #352d3a; border-radius:10px; background:#151218; }
.activity-person { min-width:0; display:flex; align-items:center; gap:10px; }
.activity-person .avatar { width:36px; height:36px; flex:0 0 auto; }
.activity-person > span:last-child,.activity-shop,.activity-detail { min-width:0; display:grid; gap:3px; }
.activity-person strong,.activity-shop strong,.activity-detail strong { overflow:hidden; color:#eee8f1; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.activity-person small,.activity-shop small,.activity-detail small { overflow:hidden; color:#817787; font-family:'DM Mono',monospace; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.activity-shop small { color:#9a709f; font-family:inherit; font-weight:800; letter-spacing:.08em; }
.activity-action { width:max-content; max-width:100%; padding:5px 8px; overflow:hidden; border:1px solid #51405a; border-radius:999px; background:#251b2a; color:#dcb7ed; font-size:9px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.activity-signed_in { border-color:#276249; background:#132c22; color:#83ddb6; }
.activity-signed_out { border-color:#5b4249; background:#2a1a20; color:#d7a7b5; }
.activity-shop_deleted { border-color:#71373f; background:#32181d; color:#ff9ca8; }

.application-manager { margin:0 23px 16px; }
.application-intro { margin:0 16px 16px; padding:13px 15px; display:flex; align-items:center; gap:12px; border:1px solid color-mix(in srgb,var(--shop-accent) 45%,#302638); border-radius:11px; background:color-mix(in srgb,var(--shop-accent) 10%,#171219); }
.application-intro-icon,.application-icon { display:grid; place-items:center; flex:0 0 auto; width:34px; height:34px; border-radius:10px; background:color-mix(in srgb,var(--shop-accent) 22%,#1b1420); color:var(--shop-accent); font-size:18px; }
.application-intro div,.application-title,.application-submission > span { display:grid; gap:3px; min-width:0; }
.application-intro strong { font-size:12px; }.application-intro small { color:#a69aaa; font-size:10px; line-height:1.45; }
.application-list { padding:0 16px 16px; display:grid; gap:10px; }
.application-group { border:1px solid #3b3041; border-radius:12px; background:#17131b; overflow:hidden; }
.application-group summary { display:flex; align-items:center; gap:12px; min-height:70px; padding:12px 14px; cursor:pointer; list-style:none; }
.application-group summary::-webkit-details-marker { display:none; }
.application-group[open] summary { border-bottom:1px solid #3b3041; }
.application-title { flex:1; }.application-title strong { color:#f5f0f8; font-size:13px; }.application-title small { color:#998ca0; font-size:10px; }
.application-count { padding:6px 9px; border-radius:999px; background:#2c1c35; color:#d8abea; font-size:10px; font-weight:800; white-space:nowrap; }
.application-group-body { padding:15px; }.application-group-body > p { margin:0 0 12px; color:#b6aabc; font-size:11px; line-height:1.5; white-space:pre-wrap; }.application-group-body h3 { margin:20px 0 10px; font-size:12px; }
.application-actions { display:flex; gap:7px; flex-wrap:wrap; }.application-actions .row-action { min-height:34px; }.application-actions .accept { border-color:#236e4a; color:#66dca0; }
.application-submission { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px; margin-top:7px; border:1px solid #372d3c; border-radius:9px; background:#1e1822; }
.application-submission strong { font-size:12px; }.application-submission small { overflow-wrap:anywhere; color:#918498; font-size:9px; }.application-submission .application-actions { justify-content:flex-end; }
.application-modal { width:min(100%,650px); max-height:88dvh; overflow:auto; }.application-questions-head,.application-question-heading { display:flex; justify-content:space-between; align-items:center; gap:10px; }.application-questions-head strong { font-size:12px; }
#application-question-editors { display:grid; gap:10px; }.application-question-editor { padding:13px; display:grid; gap:10px; border:1px solid #3f3247; border-radius:10px; background:#1d1722; }.application-question-heading strong { color:#d7b5e7; font-size:11px; }
.application-answer-list { display:grid; gap:10px; max-height:50vh; overflow:auto; }.application-answer-list article { padding:12px; display:grid; gap:6px; border:1px solid #3d3242; border-radius:9px; background:#1e1822; }.application-answer-list small { color:#a577b5; font-size:9px; font-weight:800; letter-spacing:.08em; }.application-answer-list strong { font-size:12px; }.application-answer-list p { margin:0; color:#c9bccd; font-size:12px; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; }
.application-profile-link { display:inline-block; margin:0 0 13px; color:#d9a4f1; font-size:11px; font-weight:800; text-decoration:none; }.application-profile-link:hover { text-decoration:underline; }
.application-decision-context { display:grid; gap:3px; }.application-decision-context small { color:#97899d; font-size:10px; }
.application-thread-toggle { display:flex; align-items:flex-start; gap:10px; color:var(--shop-text,#fff); font-size:12px; line-height:1.6; }
.application-thread-toggle input { flex-shrink:0; width:16px; height:16px; margin:3px 0 0; accent-color:var(--shop-accent); }
.application-thread-toggle .form-hint { display:block; margin-top:4px; }
.application-review-error { margin-top:12px; padding:12px; border:1px solid var(--ui-line); border-radius:9px; }
.application-review-error p { font-size:12px; line-height:1.6; overflow-wrap:anywhere; }
#discord-content > .panel-card { margin-left:23px; margin-right:23px; }

@media (max-width:900px) {
  .website-activity-row { grid-template-columns:minmax(180px,1fr) auto; }
  .activity-shop,.activity-detail { grid-column:1 / -1; }
  .activity-detail { padding-top:7px; border-top:1px solid #302834; }
}

@media (max-width:760px) {
  .application-manager,#discord-content > .panel-card { margin-left:16px; margin-right:16px; }
  .application-submission { align-items:flex-start; flex-direction:column; }.application-submission .application-actions { justify-content:flex-start; }
  .site-announcement { min-height:0; align-items:flex-start; flex-direction:column; gap:4px; padding:9px 14px 10px; text-align:left; }
  .site-announcement p { font-size:12px; }
  .login-body.has-site-announcement .login-shell { min-height:calc(100vh - 64px); }
  .login-body.has-site-announcement .login-card-wrap { min-height:calc(100vh - 64px); }
  .announcement-manager { margin:0 16px 14px; }
  .owner-discord-card,.website-activity-card { margin:0 16px 14px; }
  .owner-discord-settings-grid { grid-template-columns:1fr; }
  .owner-discord-actions { display:grid; grid-template-columns:1fr; }
  .owner-discord-actions button { width:100%; min-height:44px; }
  .website-activity-card .panel-heading,.security-events-card .panel-heading { align-items:flex-start; flex-direction:column; gap:10px; }
  .activity-heading-actions { width:100%; justify-content:flex-start; flex-wrap:wrap; }
  .activity-heading-actions .row-action { min-height:40px; }
  .website-activity-list { padding:0 9px 9px; }
  .website-activity-row { padding:12px; }
  .announcement-preview { grid-template-columns:1fr; gap:5px; }
  .announcement-actions { flex-direction:column-reverse; }
  .announcement-actions button { width:100%; }
}
@media (max-width:760px) {
  .login-shell { display:block; }
  .brand-panel { display:none; }
  .login-card-wrap { min-height:100vh; padding:22px; }
  .login-card { padding:24px; }
  .mobile-wordmark { display:flex; margin-bottom:64px; }
  #settings-view { padding:0 4px; }
  .settings-page-header { padding:20px; }
  .settings-header-actions { align-items:stretch; flex-direction:column; }
  .settings-account { justify-content:space-between; }
  .settings-grid { grid-template-columns:1fr; padding-bottom:20px; }
  .setting-row select { width:132px; }
}

/* Menu categories, descriptions, and mechanic shops */
.category-tab { display:flex; align-items:center; justify-content:center; gap:7px; }
.category-tab small { min-width:18px; padding:2px 5px; border-radius:999px; background:#27212b; color:#8f8795; font-family:'DM Mono',monospace; font-size:8px; }
.category-tab.active small { background:var(--ui-soft); color:var(--ui-accent-text); }
.menu-grid { grid-template-columns:repeat(auto-fill,minmax(265px,1fr)); }
.menu-card { min-height:146px; gap:8px; justify-content:flex-start; }
.menu-card-category { width:max-content; color:#986cab; font-size:8px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.menu-card strong { max-width:100%; padding:0; font-size:13px; }
.menu-description { color:#9b929f; font-size:10px; line-height:1.55; }
.menu-description.is-empty { color:#645d68; }
.menu-card-footer { width:100%; margin-top:auto; padding-top:12px; display:flex; align-items:center; justify-content:space-between; gap:10px; border-top:1px solid #342b39; }
.menu-card-footer > small { color:#706977; font-size:8px; }
.menu-card .menu-price { position:static; padding:5px 8px; white-space:nowrap; color:#d886ff; }
.custom-line-label { color:#8d758f; font-size:8px; }

.mechanic-services { margin:0 0 18px; padding:16px; border:1px solid color-mix(in srgb,var(--shop-accent) 26%,var(--ui-line,#34343d)); border-radius:14px; background:var(--ui-surface,var(--shop-panel)); }
.mechanic-services-head { margin-bottom:13px; display:flex; align-items:end; justify-content:space-between; gap:15px; }
.mechanic-services-head .eyebrow { color:color-mix(in srgb,var(--shop-accent) 72%,white); }
.mechanic-services-head h2 { margin:0; font-size:16px; letter-spacing:-.03em; }
.mechanic-services-head > span { color:var(--ui-muted,#a5a0ad); font-size:9px; }
.mechanic-service-grid { display:grid; grid-template-columns:1fr 1fr; gap:11px; }
.mechanic-service-card { padding:14px; border:1px solid var(--ui-line,color-mix(in srgb,var(--shop-accent) 26%,#33343c)); border-radius:11px; background:var(--ui-raised,color-mix(in srgb,var(--shop-accent) 7%,var(--shop-panel))); }
.mechanic-service-title { display:flex; align-items:center; gap:10px; padding-bottom:11px; border-bottom:1px solid var(--ui-line,color-mix(in srgb,var(--shop-accent) 22%,#33343c)); }
.mechanic-service-title > span { width:32px; height:32px; display:grid; place-items:center; border-radius:8px; background:#16271e; color:#59d793; font-size:17px; }
.mechanic-service-title.repair > span { background:color-mix(in srgb,var(--shop-accent) 18%,var(--ui-raised,var(--shop-panel))); color:color-mix(in srgb,var(--shop-accent) 74%,white); }
.mechanic-service-title > div { display:grid; gap:3px; }
.mechanic-service-title strong { font-size:11px; }
.mechanic-service-title small { color:var(--ui-muted,#a5a0ad); font-size:8px; }
.mechanic-service-card label { margin-top:12px; display:grid; gap:6px; color:var(--ui-muted,#a5a0ad); font-size:8px; font-weight:800; letter-spacing:.08em; }
.mechanic-service-card input { width:100%; padding:10px; border:1px solid color-mix(in srgb,var(--shop-accent) 29%,var(--ui-line,#34343d)); border-radius:8px; outline:0; background:color-mix(in srgb,var(--shop-accent) 6%,var(--ui-surface,var(--shop-panel))); color:#f1e9f4; font-size:11px; }
.mechanic-service-card input:focus { border-color:var(--shop-accent); box-shadow:0 0 0 3px color-mix(in srgb,var(--shop-accent) 16%,transparent); }
.mechanic-calculation { padding:10px 1px 8px; display:flex; justify-content:space-between; color:var(--ui-muted,#a5a0ad); font-size:9px; }
.mechanic-calculation strong { color:#e9dee1; font-family:'DM Mono',monospace; font-size:11px; }
.mechanic-add-button { width:100%; padding:9px; border-radius:8px; background:var(--shop-button); color:#fff; font-size:10px; font-weight:800; }
.mechanic-add-button:hover { background:color-mix(in srgb,var(--shop-button) 84%,white); }

.admin-side-stack { display:grid; gap:12px; }
.category-manager,.mechanic-settings-card,.free-repairs-card { overflow:visible; }
.category-admin-row { padding:11px 14px; display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid #2b252e; }
.category-admin-row:last-child { border-bottom:0; }
.category-admin-row > div { min-width:0; display:grid; gap:3px; }
.category-admin-row strong { overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.category-admin-row small { color:#77707d; font-size:8px; }
.category-admin-row > span { display:flex; gap:5px; }
.admin-item-name { min-width:0; display:grid; gap:4px; }
.admin-item-name small { overflow:hidden; color:#77707d; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.mechanic-settings-form { padding:14px; display:grid; gap:12px; }
.mechanic-settings-form label { display:grid; gap:6px; color:#8e8593; font-size:8px; font-weight:800; letter-spacing:.07em; }
.mechanic-settings-form input { width:100%; padding:9px; border:1px solid var(--ui-line,color-mix(in srgb,var(--shop-accent) 24%,#33343c)); border-radius:7px; outline:0; background:var(--ui-surface,var(--shop-panel)); color:#eee9f1; font-size:11px; }
.mechanic-settings-form input:focus { border-color:var(--shop-accent); }
.mechanic-settings-form .primary-button { padding:10px; font-size:10px; }
.free-repairs-form { padding:14px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:8px; border-bottom:1px solid #2b252e; }
.free-repairs-form label { display:grid; gap:6px; color:#8e8593; font-size:8px; font-weight:800; letter-spacing:.07em; }
.free-repairs-form input { width:100%; min-height:38px; padding:9px; border:1px solid #3b3340; border-radius:7px; outline:0; background:#100d12; color:#eee9f1; font-family:'DM Mono',monospace; font-size:11px; }
.free-repairs-form input:focus { border-color:#4e9f70; }
.free-repairs-form .secondary-button { min-height:38px; padding:9px 11px; font-size:9px; }
.free-repair-button { width:calc(100% - 28px); min-height:40px; margin:14px; padding:9px 13px; display:flex; align-items:center; justify-content:center; gap:9px; border:1px solid rgba(69,200,122,.36); border-radius:999px; background:rgba(37,110,66,.19); color:#55db8b; font-size:10px; }
.free-repair-button:hover:not(:disabled) { border-color:rgba(85,219,139,.65); background:rgba(41,132,75,.28); }
.free-repair-button:disabled { border-color:#343239; background:#19181d; color:#69666f; cursor:not-allowed; }
.free-repair-button strong,.free-repair-button b { font-size:10px; }
.free-repair-button b { font-family:'DM Mono',monospace; }
.free-repair-divider { opacity:.5; }
.menu-free-repair { width:100%; margin:0 0 12px; }
.staff-profile-modal { width:min(100%,1080px); }
.profile-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-bottom:13px; }
.profile-summary article { padding:12px; display:grid; gap:5px; border:1px solid #302838; border-radius:9px; background:#17131a; }
.profile-summary small { color:#7c7481; font-size:8px; font-weight:800; letter-spacing:.08em; }
.profile-summary strong { color:#eee7f2; font-family:'DM Mono',monospace; font-size:13px; }
.profile-clocked-in { margin-bottom:13px; padding:11px 12px; display:flex; align-items:center; justify-content:space-between; gap:12px; border:1px solid rgba(94,225,171,.24); border-radius:9px; background:rgba(35,139,91,.08); }
.profile-clocked-in span { display:grid; gap:3px; }
.profile-clocked-in strong { color:#9aebc4; font-size:10px; }
.profile-clocked-in small { color:#71897d; font-size:8px; }
.profile-clocked-in .secondary-button { padding:8px 10px; font-size:9px; }
.profile-history-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.profile-history-grid > section { min-width:0; overflow:hidden; border:1px solid #302a34; border-radius:10px; background:#121014; }
.profile-section-head { padding:11px 12px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #29232d; }
.profile-section-head h3 { margin:0; font-size:11px; }
.profile-section-head span { min-width:22px; padding:3px 6px; border-radius:999px; background:#251b2b; color:#d69afa; font-family:'DM Mono',monospace; font-size:8px; text-align:center; }
.profile-history-list { max-height:390px; overflow:auto; }
.profile-history-row { min-height:58px; padding:10px 12px; display:flex; align-items:center; justify-content:space-between; gap:9px; border-bottom:1px solid #252027; }
.profile-history-row:last-child { border-bottom:0; }
.profile-history-row > div { min-width:0; display:grid; gap:4px; }
.profile-history-row strong { overflow:hidden; color:#ddd7e1; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.profile-history-row small { color:#716b75; font-size:8px; line-height:1.35; }
.profile-history-row b { flex:0 0 auto; color:#d78cff; font-family:'DM Mono',monospace; font-size:9px; }
.form-grid.two.equal { grid-template-columns:1fr 1fr; }
.form-field textarea { width:100%; resize:vertical; min-height:76px; padding:10px; border:1px solid #2b2b32; border-radius:7px; outline:0; background:#0e0e11; color:#f0eef4; font-size:12px; font-weight:600; letter-spacing:0; }
.form-field textarea:focus { border-color:#8444b6; }
.shop-logo-upload { padding:12px; display:flex; align-items:center; gap:12px; border:1px solid #332c37; border-radius:10px; background:#141116; }
.shop-logo-preview { width:64px; height:64px; flex:0 0 auto; border:1px solid #4d3658; border-radius:12px; background:#0e0c10; object-fit:cover; }
.shop-logo-upload > div { min-width:0; display:grid; gap:5px; }
.shop-logo-upload strong { color:#e8e2eb; font-size:10px; text-transform:uppercase; letter-spacing:.06em; }
.shop-logo-upload small { color:#7e7782; font-size:9px; line-height:1.45; }
.shop-logo-upload-actions { display:flex; align-items:center; gap:7px; margin-top:5px; }
.file-picker-button { position:relative; overflow:hidden; padding:8px 10px; cursor:pointer; font-size:9px; }
.file-picker-button input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }

@media (max-width:900px) {
  .mechanic-service-grid { grid-template-columns:1fr; }
  .mechanic-services-head { align-items:start; flex-direction:column; }
  .profile-history-grid { grid-template-columns:1fr; }
  .profile-history-list { max-height:260px; }
}
@media (max-width:760px) {
  .menu-grid { grid-template-columns:1fr; }
  .menu-card { min-height:132px; }
  .form-grid.two.equal { grid-template-columns:1fr; }
  .profile-summary { grid-template-columns:1fr 1fr; }
}

/* Personal time adjustment */
.clock-menu { position:relative; }
.clock-caret { margin-left:2px; color:#9d7cb0; font-size:10px; transition:transform .16s; }
.clock-dropdown { position:absolute; top:100%; right:0; z-index:30; width:154px; padding-top:8px; opacity:0; visibility:hidden; transform:translateY(-4px); transition:opacity .14s,transform .14s,visibility .14s; pointer-events:none; }
.clock-dropdown button { width:100%; padding:10px 12px; border:1px solid #46384e; border-radius:9px; background:#211a26; color:#d8cddd; box-shadow:0 14px 32px rgba(0,0,0,.34); font-size:10px; font-weight:800; text-align:left; }
.clock-dropdown button:hover { border-color:#75488a; background:#2a2030; color:white; }
.clock-menu.is-open .clock-dropdown { opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto; }
.clock-menu.is-open .clock-caret { transform:rotate(180deg); }
/* Keep the pointer inside the menu when crossing its small visual gap. */
.clock-dropdown::before { content:""; position:absolute; left:0; right:0; top:-8px; height:8px; }

.time-adjust-form { display:grid; grid-template-columns:44px 1fr 1fr; gap:10px; }
.adjustment-type-field { margin-bottom:12px; }
.time-direction { display:grid; align-content:center; gap:9px; }
.time-direction button { width:42px; height:42px; border:1px solid #3e3543; border-radius:11px; background:#211a26; color:#aaa1af; font-size:18px; font-weight:800; }
.time-direction button.active.add { border-color:#287b63; background:rgba(43,139,108,.12); color:#6ee0b5; }
.time-direction button.active[data-time-direction="subtract"] { border-color:#8d3c4b; background:rgba(173,61,81,.12); color:#ff9cad; }
.time-unit { padding:12px; display:grid; gap:7px; border:1px solid #3a303f; border-radius:11px; background:#201923; text-align:center; }
.time-unit > span { color:#938b98; font-size:10px; font-weight:700; }
.time-unit button,.time-unit input { width:100%; height:32px; min-height:32px; margin:0; padding:0; display:block; box-sizing:border-box; border:1px solid #403746; border-radius:7px; background:#19151d; color:#e5dfe8; text-align:center; }
.time-unit button:hover { border-color:#714781; background:#261d2b; }
.time-unit input { outline:0; appearance:textfield; font-family:'DM Mono',monospace; font-size:12px; font-weight:700; line-height:30px; }
.time-unit input::-webkit-inner-spin-button,.time-unit input::-webkit-outer-spin-button { margin:0; appearance:none; }
.time-unit input:focus { border-color:#8e4ba6; }
.adjust-current-total { margin:14px 0 0; padding-top:13px; display:flex; justify-content:space-between; border-top:1px solid #302a34; color:#817a86; font-size:10px; }
.adjust-current-total strong { color:#e8e1eb; font-family:'DM Mono',monospace; }

.time-adjustment-manager { margin-bottom:12px; overflow:hidden; }
.adjustment-manager-actions { display:flex; align-items:center; gap:7px; }
.adjustment-manager-actions .row-action:disabled { opacity:.4; cursor:not-allowed; }
.request-count { padding:5px 8px; border:1px solid #493954; border-radius:999px; background:#251b2b; color:#c99be0; font-size:8px; font-weight:800; }
.adjustment-request-list { display:grid; }
.adjustment-request-row { min-height:70px; padding:11px 14px; display:grid; grid-template-columns:34px minmax(190px,1.35fr) minmax(145px,1fr) 105px 105px 142px; gap:11px; align-items:center; border-top:1px solid #302933; }
.adjustment-request-row:first-child { border-top:0; }
.adjustment-request-person,.adjustment-request-shift,.adjustment-request-change { min-width:0; display:grid; gap:4px; }
.adjustment-request-person strong,.adjustment-request-shift strong,.adjustment-request-change strong { overflow:hidden; color:#e8e3eb; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.adjustment-request-person small,.adjustment-request-shift small,.adjustment-request-change small { color:#77707d; font-size:8px; }
.adjustment-request-change strong { font-family:'DM Mono',monospace; }
.adjustment-request-change.add strong { color:#64dba8; }
.adjustment-request-change.subtract strong { color:#ff8c9d; }
.request-status { justify-self:start; padding:5px 7px; border:1px solid #4e414f; border-radius:999px; color:#9c929f; font-size:8px; font-weight:800; }
.request-status.pending { border-color:#6b4b2c; background:#291f16; color:#e5b16b; }
.request-status.approved { border-color:#2e624e; background:#15261f; color:#76d5ae; }
.request-status.rejected { border-color:#6a3540; background:#2b181d; color:#f08c9a; }
.adjustment-request-actions { display:flex; justify-content:flex-end; gap:6px; }
.row-action.approve { border-color:#2d6650; color:#73d5ad; }
.row-action.approve:hover { background:#183127; }
.correction-status { color:#c990e3; font-weight:700; }

@media (max-width:760px) {
  .clock-dropdown { right:auto; left:0; }
  .time-adjust-form { grid-template-columns:42px 1fr 1fr; }
  .adjustment-request-row { grid-template-columns:34px 1fr auto; }
  .adjustment-request-shift { grid-column:2; }
  .adjustment-request-change,.request-status { grid-column:3; }
  .adjustment-request-actions { grid-column:2 / span 2; justify-content:flex-start; }
  .recent-orders-header { display:none; }
  .recent-order-row { grid-template-columns:1fr auto; gap:7px 12px; }
  .recent-order-items { grid-column:1 / -1; grid-row:2; white-space:normal; line-height:1.45; }
  .recent-order-total { grid-column:2; grid-row:1; }
  .recent-order-row time { grid-column:1 / -1; grid-row:3; }
}

/* Keep saved shop colours authoritative over the legacy palette above. */
html,body,.app-shell,.main-content { background:var(--shop-background); }
.sidebar.app-header,.catalog-panel,.cart-panel,.page-header,.owner-summary article,.team-stats article,.owner-shop-card,.panel-card,.settings-card { background:var(--shop-panel); }
.primary-small,.primary-button,.checkout-button,.mechanic-add-button { background:var(--shop-button); }
.nav-link.active,.category-tab.active { border-color:color-mix(in srgb,var(--shop-accent) 48%,#29232e); background:color-mix(in srgb,var(--shop-accent) 20%,var(--shop-panel)); }
.menu-card .menu-price,.commission-value,.status-active,.correction-status { color:var(--shop-accent); }

/* Food-place clock and delivery controls */
.clock-dropdown { width:188px; padding:7px 6px 6px; top:calc(100% - 1px); border:1px solid #403546; border-radius:11px; background:#18131c; box-shadow:0 16px 34px rgba(0,0,0,.38); }
.clock-dropdown button { margin:0; border:0; border-radius:7px; background:transparent; box-shadow:none; }
.clock-dropdown button + button { margin-top:3px; }
.clock-dropdown button:hover { background:#2a2030; }
.clock-dropdown button.clocked-in { color:#7af1bd; background:rgba(54,211,153,.1); }
.stats-time-grid { grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); }
#post-deliveries { color:var(--ui-accent-text); border-color:var(--ui-line); background:var(--ui-soft); }
#post-deliveries:hover { border-color:var(--shop-accent); }

/* Discord reporting and audit controls */
.discord-manager { margin:0 23px 16px; }
.weekly-analysis { margin:0 14px 12px; padding:13px; border:1px solid #3a303f; border-radius:10px; background:linear-gradient(135deg,color-mix(in srgb,var(--shop-accent) 9%,#171219),#171219 58%); }
.weekly-analysis-head { margin-bottom:11px; display:flex; align-items:center; justify-content:space-between; gap:14px; }
.weekly-analysis-head .eyebrow { margin:0 0 4px; }
.weekly-analysis-head span { color:#8f8495; font-size:11px; }
.weekly-analysis-head .danger-button { min-height:34px; padding:7px 11px; }
.weekly-analysis-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.weekly-analysis-grid article { min-width:0; padding:12px; border:1px solid #382f3d; border-radius:9px; background:#1e1822; }
.weekly-analysis-grid small { display:block; margin-bottom:7px; color:#95899b; font-size:9px; font-weight:800; letter-spacing:.055em; }
.weekly-analysis-grid strong { color:#f4edf7; font-family:'DM Mono',monospace; font-size:18px; }
.discord-settings-form { padding:0 14px 14px; }
.time-review-channel-form { display:grid; gap:12px; padding:0 16px 16px; }
.time-review-channel-form p { margin:0; color:var(--ui-muted); font-size:12px; line-height:1.55; }
.time-review-channel-form select { width:100%; min-width:0; min-height:44px; }
.time-review-channel-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; }
.time-review-channel-actions > span { flex:1 1 240px; color:var(--ui-muted); font-size:12px; overflow-wrap:anywhere; }
.time-review-channel-actions button { min-height:44px; }
.discord-settings-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.discord-settings-grid fieldset { min-width:0; margin:0; padding:13px; border:1px solid #3a303f; border-radius:10px; background:#1d1721; }
.discord-settings-grid legend { padding:0 6px; color:#f4edf7; font-size:12px; font-weight:800; }
.discord-settings-grid fieldset > label { display:grid; gap:6px; margin-top:10px; color:#968a9c; font-size:10px; font-weight:800; letter-spacing:.04em; }
.discord-settings-grid fieldset > label:first-of-type { margin-top:2px; }
.discord-settings-grid input[type="text"],.discord-settings-grid select { width:100%; min-height:40px; padding:9px 11px; border:1px solid #3d3442; border-radius:8px; background:#100d12; color:#f5f0f7; font-size:13px; }
.discord-settings-grid fieldset > small { display:block; margin-top:8px; color:var(--ui-muted); font-size:11px; line-height:1.45; }
.report-checkboxes { margin-top:11px; display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.report-checkboxes label { min-height:36px; padding:8px 9px; display:flex; align-items:center; gap:8px; border:1px solid var(--ui-line); border-radius:8px; background:var(--ui-raised); color:var(--ui-highlight); font-size:11px; font-weight:700; }
.report-checkboxes input { accent-color:var(--shop-accent); }
.discord-settings-actions { margin-top:12px; display:flex; justify-content:flex-end; gap:8px; }
.discord-settings-actions button { min-height:40px; }
.discord-panel-status { display:flex; align-items:center; gap:7px; }
.discord-panel-status .viewer-role { max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.menu-card .menu-price { padding:7px 10px; font-size:14px; font-weight:800; }
.profile-order-actions { display:flex; align-items:center; justify-content:flex-end; gap:9px; }
.profile-order-actions .row-action { min-height:30px; padding:5px 8px; }

@media (max-width:1000px) {
  .discord-settings-grid { grid-template-columns:1fr; }
  .discord-settings-grid fieldset:last-child { grid-column:auto; }
}
@media (max-width:760px) {
  .discord-manager { margin:0 16px 14px; }
  .discord-settings-grid { grid-template-columns:1fr; }
  .discord-settings-grid fieldset:last-child { grid-column:auto; }
  .discord-settings-actions { flex-direction:column; }
  .discord-settings-actions button { width:100%; }
  .discord-panel-status { align-items:flex-end; flex-direction:column; }
  .weekly-analysis-head { align-items:flex-start; flex-direction:column; }
  .weekly-analysis-head .danger-button { width:100%; }
  .weekly-analysis-grid { grid-template-columns:1fr; }
}
@media (max-width:430px) { .report-checkboxes { grid-template-columns:1fr; } }

/* Inventory and ingredient calculator */
.ingredients-page-header { margin-bottom:14px; }
.ingredient-calculator { margin:0 23px 14px; padding-bottom:15px; }
.ingredient-calculator-controls { padding:0 14px 13px; display:grid; grid-template-columns:minmax(220px,1fr) 150px; gap:10px; border-bottom:1px solid var(--ui-line); }
.ingredient-calculator-controls label { display:grid; gap:6px; color:var(--ui-muted); font-size:9px; font-weight:800; letter-spacing:.06em; }
.ingredient-calculator-controls select,.ingredient-calculator-controls input { width:100%; min-height:42px; padding:9px 11px; border:1px solid #3b3240; border-radius:8px; background:#100d12; color:#f3edf6; outline:0; font-size:13px; font-weight:700; }
.ingredient-calculation { padding:13px 14px 0; }
.ingredient-empty { min-height:70px; display:grid; place-items:center; color:var(--ui-muted); font-size:11px; text-align:center; }
.calculation-summary { margin-bottom:9px; display:flex; align-items:center; justify-content:space-between; color:var(--ui-muted); font-size:11px; }
.calculation-summary strong { color:var(--ui-highlight); font-size:13px; }
.calculation-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:8px; }
.calculation-item { min-height:70px; padding:12px; display:flex; align-items:center; justify-content:space-between; gap:14px; border:1px solid var(--ui-line); border-radius:9px; background:var(--ui-raised); }
.calculation-item > div,.calculation-item > span { min-width:0; display:grid; gap:4px; }
.calculation-item > span { flex:0 0 auto; text-align:right; }
.calculation-item strong { color:var(--ui-highlight); font-size:11px; }
.calculation-item b { color:var(--ui-accent-text); font-family:'DM Mono',monospace; font-size:11px; }
.calculation-item small { color:var(--ui-muted); font-size:9px; }
.calculation-item.is-ready { border-color:rgba(94,225,171,.2); }
.calculation-item.is-ready > div small { color:#6fb798; }
.calculation-item.is-short { border-color:rgba(248,113,113,.28); }
.calculation-item.is-short > div small { color:#e7818e; }
.ingredients-grid { margin:0 23px 23px; display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:start; }
.ingredient-list-panel,.recipe-list-panel { min-width:0; overflow:hidden; }
.inventory-list,.recipe-list { max-height:570px; overflow:auto; }
.inventory-row,.recipe-row { min-height:68px; padding:12px 14px; display:grid; align-items:center; gap:12px; border-top:1px solid var(--ui-line); }
.inventory-row { grid-template-columns:minmax(130px,1fr) auto; }
.recipe-row { grid-template-columns:minmax(0,1fr) auto; }
.inventory-row:first-child,.recipe-row:first-child { border-top:0; }
.inventory-row > div,.recipe-row > div { min-width:0; display:grid; gap:4px; }
.inventory-row strong,.recipe-row strong { color:var(--ui-highlight); font-size:11px; }
.inventory-row small,.recipe-row small { color:var(--ui-muted); font-size:9px; line-height:1.5; }
.inventory-row > b { color:var(--ui-accent-text); font-family:'DM Mono',monospace; font-size:13px; }
.inventory-row > b small { color:#9c8da2; font-family:Manrope,system-ui,sans-serif; }
.inventory-row > span,.recipe-row > span { display:flex; gap:6px; }
.recipe-component-list { max-height:390px; overflow:auto; display:grid; gap:7px; padding-right:3px; }
.recipe-component-row { min-height:60px; padding:10px 11px; display:flex; align-items:center; justify-content:space-between; gap:14px; border:1px solid var(--ui-line); border-radius:9px; background:var(--ui-raised); }
.recipe-component-row > span { min-width:0; display:grid; gap:3px; }
.recipe-component-row strong { color:var(--ui-highlight); font-size:10px; }
.recipe-component-row small { color:var(--ui-muted); font-size:8px; }
.recipe-component-row input { flex:0 0 125px; min-height:38px; padding:8px 10px; border:1px solid #403646; border-radius:8px; background:#0f0c11; color:#f0e9f3; text-align:right; font-family:'DM Mono',monospace; }

@media (max-width:900px) {
  .ingredients-grid { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .ingredient-calculator,.ingredients-grid { margin-left:16px; margin-right:16px; }
  .ingredient-calculator-controls { grid-template-columns:1fr; }
  .inventory-row { grid-template-columns:1fr auto; }
  .inventory-row > span { grid-column:1 / -1; }
  .recipe-row { align-items:start; grid-template-columns:1fr; }
  .recipe-component-row { align-items:stretch; flex-direction:column; }
  .recipe-component-row input { flex-basis:auto; width:100%; text-align:left; }
}

/* V40 — phone-first navigation, ordering, forms, and admin layouts */
.cart-top-actions { display:flex; align-items:center; gap:9px; }
.mobile-cart-toggle,.mobile-cart-backdrop,.mobile-cart-close { display:none; }

@media (max-width:760px) {
  html { overflow-x:hidden; scroll-padding-top:78px; }
  body { min-width:0; overflow-x:hidden; }
  body.mobile-cart-open { overflow:hidden; }

  .app-shell { width:100%; padding:0 8px calc(12px + env(safe-area-inset-bottom)); }
  .sidebar.app-header,.sidebar.app-header.open {
    top:0;
    margin:0 -8px;
    padding:calc(8px + env(safe-area-inset-top)) 10px 9px;
    grid-template-columns:42px minmax(0,1fr) 44px;
    gap:8px;
    border-left:0;
    border-right:0;
    border-radius:0 0 14px 14px;
  }
  .brand-logo { width:40px; height:40px; border-radius:10px; }
  .shop-switcher { min-width:0; min-height:44px; padding:6px 9px; }
  .shop-switcher-label strong { font-size:11px; }
  .shop-popover { position:fixed; top:calc(62px + env(safe-area-inset-top)); left:10px; right:10px; width:auto; max-height:55vh; overflow:auto; }
  .icon-button { width:44px; height:44px; }
  .side-nav { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; padding:10px 0 2px; }
  .nav-link { min-height:44px; justify-content:center; padding:10px; font-size:12px; }
  .sidebar.open .sidebar-bottom { width:100%; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
  .sidebar-bottom > * { min-width:0; }
  .sidebar-bottom .quiet-button,.sidebar-bottom .stats-button,.sidebar-bottom .clock-button { width:100%; min-height:44px; justify-content:center; padding:9px; text-align:center; }
  .sidebar-bottom .account-chip { grid-column:1 / -1; width:100%; min-height:48px; justify-content:space-between; }
  .account-chip .profile-link { display:flex; flex:1; }
  .clock-dropdown { top:calc(100% + 5px); left:0; right:auto; width:min(260px,calc(100vw - 20px)); }
  .clock-dropdown button { min-height:44px; font-size:11px; }

  .main-content { min-width:0; padding-top:9px; }
  .portal-view { min-height:0; }
  .page-header { min-height:0; padding:19px 16px; align-items:stretch; flex-direction:column; gap:15px; }
  .page-header h1 { font-size:24px; line-height:1.15; }
  .page-header > div > p:last-child { max-width:48ch; font-size:12px; line-height:1.55; }
  .page-actions { width:100%; display:grid; grid-template-columns:1fr; }
  .page-actions button,.page-header > .primary-button { width:100%; min-height:44px; }

  .pos-layout { display:block; min-height:0; }
  .catalog-panel { min-width:0; padding:14px 12px 92px; border-radius:14px; }
  .catalog-tools { align-items:stretch; gap:8px; }
  .search-box { height:46px; padding:0 12px; }
  .primary-small { min-height:46px; padding:0 13px; }
  .category-tabs { margin:0 -3px 13px; padding:5px; overscroll-behavior-x:contain; scroll-snap-type:x proximity; }
  .category-tab { flex:0 0 auto; min-height:40px; padding:9px 12px; scroll-snap-align:start; font-size:11px; }
  .catalog-heading { align-items:flex-end; gap:12px; padding:8px 1px 14px; }
  .catalog-heading h1 { font-size:23px; }
  .daily-metric strong { font-size:15px; }
  .daily-metric span { font-size:10px; }
  .menu-grid,.category-item-grid { grid-template-columns:1fr; gap:9px; }
  .menu-card { min-height:126px; padding:14px; border-radius:12px; }
  .menu-card strong { font-size:14px; line-height:1.4; }
  .menu-card-category,.menu-card-footer > small { font-size:9px; }
  .menu-description { font-size:12px; line-height:1.5; }
  .menu-card .menu-price { padding:7px 10px; font-size:15px; }
  .menu-category-section + .menu-category-section { margin-top:21px; }
  .menu-category-heading h2 { font-size:17px; }
  .mechanic-services { padding:13px; }
  .mechanic-service-grid { grid-template-columns:1fr; }
  .mechanic-service-card input,.mechanic-add-button { min-height:44px; }
  .free-repair-button { min-height:46px; }

  .mobile-cart-backdrop { position:fixed; z-index:42; inset:0; display:block; border:0; background:rgba(0,0,0,.66); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .18s,visibility .18s; }
  .mobile-cart-open .mobile-cart-backdrop { opacity:1; visibility:visible; pointer-events:auto; }
  .cart-panel {
    position:fixed;
    z-index:43;
    left:8px;
    right:8px;
    bottom:0;
    width:auto;
    min-height:0;
    max-height:min(88dvh,760px);
    overflow:hidden;
    border:1px solid #44374a;
    border-radius:18px 18px 0 0;
    box-shadow:0 -24px 70px rgba(0,0,0,.58);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(calc(100% + 24px));
    transition:transform .22s ease,opacity .18s,visibility .18s;
  }
  .cart-panel.mobile-open { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); }
  .cart-top { flex:0 0 auto; padding:16px; }
  .cart-top-actions { align-items:center; }
  .cart-top .text-button { min-width:44px; min-height:44px; padding:0 8px; }
  .mobile-cart-close { width:44px; height:44px; display:grid; place-items:center; border:1px solid #3d3442; border-radius:10px; background:#241e28; color:#d8cfdc; font-size:24px; }
  .cart-items { flex:1 1 auto; min-height:0; max-height:none; padding:8px 16px; overscroll-behavior:contain; }
  .empty-cart { min-height:135px; }
  .cart-line { padding:12px 1px; }
  .cart-line strong { font-size:13px; }
  .cart-line > span { font-size:12px; }
  .quantity-control { gap:8px; }
  .quantity-control button { width:40px; height:40px; border-radius:9px; font-size:18px; }
  .quantity-control input { width:68px; height:40px; font-size:16px; }
  .cart-footer { flex:0 1 auto; min-height:0; max-height:55dvh; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; padding:14px 16px calc(18px + env(safe-area-inset-bottom)); }
  .notes-label-head button { min-height:38px; font-size:11px; }
  .notes-label textarea { min-height:58px; }
  .discount-picker { min-height:40px; }
  .total-row { font-size:12px; }
  .grand-total,.grand-total strong { font-size:17px; }
  .checkout-button { min-height:50px; font-size:13px; }
  .mobile-cart-toggle {
    position:fixed;
    z-index:40;
    left:12px;
    right:12px;
    bottom:calc(10px + env(safe-area-inset-bottom));
    min-height:62px;
    padding:9px 12px 9px 16px;
    display:grid;
    grid-template-columns:1fr auto auto;
    align-items:center;
    gap:10px;
    border:1px solid color-mix(in srgb,var(--shop-accent) 55%,#423449);
    border-radius:16px;
    background:color-mix(in srgb,var(--shop-button) 76%,#161119);
    color:#fff;
    box-shadow:0 15px 42px rgba(0,0,0,.5);
    text-align:left;
  }
  .mobile-cart-toggle > span:first-child { display:grid; gap:1px; }
  .mobile-cart-toggle small { color:rgba(255,255,255,.66); font-size:8px; font-weight:800; letter-spacing:.1em; }
  .mobile-cart-toggle strong { font-size:13px; }
  .mobile-cart-total { font-family:'DM Mono',monospace; font-size:14px; font-weight:700; }
  .mobile-cart-count { min-width:30px; height:30px; display:grid; place-items:center; border-radius:999px; background:rgba(0,0,0,.25); font-family:'DM Mono',monospace; font-size:11px; font-weight:800; }

  .team-stats,.owner-summary { padding:0 0 10px; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .team-stats article,.owner-summary article { min-height:78px; padding:12px; }
  .team-stats small,.owner-summary small { font-size:9px; line-height:1.35; }
  .team-stats strong,.owner-summary strong { font-size:15px; }
  .staff-content,.manager-grid,.owner-shop-grid { padding:0 0 20px; }
  .staff-card-grid { padding:0 9px 9px; }
  .staff-card { padding:13px; }
  .staff-card-head { align-items:flex-start; flex-wrap:wrap; }
  .member-labels { margin-left:auto; }
  .staff-clock-status { align-items:flex-start; flex-direction:column; }
  .staff-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .staff-metrics > div { min-height:66px; padding:10px; }
  .staff-metrics small { font-size:9px; line-height:1.35; }
  .staff-metrics strong { font-size:12px; }
  .staff-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .staff-actions .row-action { min-height:42px; padding:8px; }
  .recent-orders-list { padding:0 9px 9px; }
  .recent-order-row { padding:12px; gap:9px 12px; }
  .recent-order-user strong { font-size:11px; }
  .recent-order-items { font-size:11px; }
  .recent-order-total { font-size:13px; }
  .recent-order-row time { font-size:9px; }

  .panel-heading { align-items:flex-start; gap:10px; padding:14px; }
  .panel-heading h2 { font-size:14px; }
  .panel-subtitle { font-size:10px; line-height:1.45; }
  .manager-grid { grid-template-columns:1fr; gap:11px; }
  .menu-table-card { overflow:hidden; }
  .menu-table-header { display:none; }
  .admin-menu-row { min-width:0; min-height:0; padding:14px; grid-template-columns:1fr auto; gap:8px 12px; }
  .admin-menu-row .admin-item-name { grid-column:1 / -1; }
  .admin-menu-row .admin-item-name strong { font-size:13px; }
  .admin-menu-row .admin-item-name small { white-space:normal; font-size:10px; line-height:1.45; }
  .admin-menu-row > span:nth-child(2) { grid-column:1; }
  .admin-menu-row > .price { grid-column:2; grid-row:2; font-size:13px; }
  .admin-menu-row > span:nth-child(4) { grid-column:1; }
  .admin-menu-actions { grid-column:2; justify-content:flex-end; }
  .admin-menu-actions .row-action,.category-admin-row .row-action,.rank-admin-row .row-action,.discount-admin-row .row-action { min-height:38px; padding:8px 10px; }
  .adjustment-manager-actions { align-items:flex-end; flex-direction:column; }
  .adjustment-request-row { padding:13px; grid-template-columns:34px minmax(0,1fr) auto; gap:9px; }
  .adjustment-request-person strong,.adjustment-request-shift strong,.adjustment-request-change strong { font-size:11px; }
  .adjustment-request-actions .row-action { min-height:40px; padding:8px 11px; }
  .discord-manager,.ingredient-calculator,.ingredients-grid,.announcement-manager { margin-left:0; margin-right:0; }
  .weekly-analysis { margin:0 10px 10px; }
  .weekly-analysis-grid { grid-template-columns:1fr; }
  .report-checkboxes { grid-template-columns:1fr; }
  .report-checkboxes label { min-height:44px; }
  .discord-panel-status { max-width:48%; }
  .discord-panel-status .viewer-role { max-width:100%; white-space:normal; text-align:right; }
  .discord-settings-grid fieldset { padding:12px; }
  .ingredient-calculator-controls,.ingredient-calculation { padding-left:11px; padding-right:11px; }
  .calculation-grid { grid-template-columns:1fr; }
  .inventory-list,.recipe-list { max-height:none; }
  .inventory-row,.recipe-row { padding:12px; }
  .recipe-component-row input { min-height:44px; }

  .settings-page-header { padding:18px 16px; }
  .settings-header-actions { width:100%; }
  .settings-account { min-width:0; }
  .settings-account > span:first-child { min-width:0; }
  .settings-grid { gap:10px; }
  .settings-card { padding:0 14px; }
  .setting-row { min-height:72px; align-items:flex-start; flex-direction:column; gap:10px; }
  .setting-row select,.setting-row input[type="number"] { width:100%; min-height:44px; }
  .setting-row input[type="checkbox"] { align-self:flex-end; margin-top:-40px; }
  .colour-grid { grid-template-columns:1fr; }
  .appearance-toggle { min-height:68px; }
  .free-repairs-form { grid-template-columns:1fr; }
  .free-repairs-form .secondary-button { min-height:44px; }

  .modal-scrim { padding:0; place-items:end stretch; }
  .modal { width:100%; max-width:none; max-height:92dvh; overflow:auto; padding:18px 16px calc(16px + env(safe-area-inset-bottom)); border-left:0; border-right:0; border-bottom:0; border-radius:18px 18px 0 0; }
  .modal-head { margin-bottom:15px; }
  .modal-head h2 { font-size:21px; }
  .modal-head p { font-size:12px; }
  .close-modal { width:44px; height:44px; flex:0 0 auto; display:grid; place-items:center; margin:-8px -7px 0 0; border:1px solid #3c3441; border-radius:10px; background:#211b25; }
  .form-field { font-size:11px; }
  .form-field input,.form-field select,.form-field textarea,
  .search-box input,.notes-label textarea,.mechanic-service-card input,
  .mechanic-settings-form input,.free-repairs-form input,
  .ingredient-calculator-controls select,.ingredient-calculator-controls input,
  .discord-settings-grid select,.setting-row select,.setting-row input[type="number"],
  .time-unit input,.recipe-component-row input { font-size:16px; }
  .form-field input,.form-field select { min-height:46px; }
  .form-grid.two,.form-grid.two.equal { grid-template-columns:1fr; }
  .modal-footer { position:sticky; bottom:calc(-16px - env(safe-area-inset-bottom)); z-index:2; margin:18px -16px calc(-16px - env(safe-area-inset-bottom)); padding:12px 16px calc(12px + env(safe-area-inset-bottom)); background:#16161a; border-top:1px solid #302a34; }
  .modal-footer button { flex:1; min-height:46px; }
  .profile-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .profile-admin-actions { display:grid; grid-template-columns:1fr; }
  .profile-admin-actions .secondary-button { min-height:44px; }
  .profile-clocked-in { align-items:stretch; flex-direction:column; }
  .profile-clocked-in .secondary-button { min-height:44px; }
  .profile-history-grid { grid-template-columns:1fr; }
  .profile-history-list { max-height:260px; }
  .time-adjust-form { grid-template-columns:44px minmax(0,1fr) minmax(0,1fr); gap:8px; }
  .time-direction button { width:44px; height:44px; }
  .time-unit { min-width:0; padding:9px; }
  .time-unit button,.time-unit input { height:40px; min-height:40px; }
  .toast-root { left:10px; right:10px; bottom:calc(84px + env(safe-area-inset-bottom)); max-width:none; }
  .toast { font-size:12px; line-height:1.45; }

  .login-card-wrap { min-height:100dvh; padding:calc(20px + env(safe-area-inset-top)) 16px calc(20px + env(safe-area-inset-bottom)); }
  .login-card { padding:23px 19px; }
  .mobile-wordmark { margin-bottom:46px; }
  .discord-button { min-height:50px; }
}

@media (max-width:390px) {
  .sidebar.app-header,.sidebar.app-header.open { grid-template-columns:38px minmax(0,1fr) 42px; padding-left:8px; padding-right:8px; }
  .brand-logo { width:38px; height:38px; }
  .shop-switcher-label small { display:none; }
  .catalog-tools { display:grid; grid-template-columns:1fr; }
  .primary-small { width:100%; }
  .team-stats,.owner-summary { grid-template-columns:1fr; }
  .staff-actions { grid-template-columns:1fr; }
  .staff-metrics { grid-template-columns:1fr; }
  .panel-heading { flex-direction:column; }
  .discord-panel-status { max-width:100%; align-items:flex-start; }
  .discord-panel-status .viewer-role { text-align:left; }
  .time-adjust-form { grid-template-columns:42px minmax(0,1fr) minmax(0,1fr); gap:6px; }
  .time-unit { padding:7px; }
  .modal-footer { flex-direction:column-reverse; }
  .mobile-cart-toggle { left:8px; right:8px; }
}

/* V41 — invoice copy and Discord clock-role setup */
.invoice-copy-row { min-height:58px; margin-bottom:2px; padding:9px 0 12px; display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid #2c2630; }
.invoice-copy-row > span { min-width:0; display:grid; gap:3px; }
.invoice-copy-row strong { color:#ded7e2; font-size:10px; }
.invoice-copy-row small { color:#756d7a; font-size:8px; }
.invoice-copy-row button { flex:0 0 auto; min-height:36px; padding:8px 10px; border:1px solid color-mix(in srgb,var(--shop-accent) 30%,#39303f); border-radius:8px; background:color-mix(in srgb,var(--shop-accent) 10%,#17131a); color:color-mix(in srgb,var(--shop-accent) 75%,white); font-size:9px; font-weight:800; }
.invoice-copy-row button:hover:not(:disabled) { border-color:var(--shop-accent); color:white; }
.invoice-copy-row button:disabled { color:#5f5863; }
.discord-settings-grid .clock-role-fieldset,.discord-settings-grid .duty-log-fieldset { grid-column:1 / -1; }

@media (max-width:760px) {
  .invoice-copy-row { min-height:66px; }
  .invoice-copy-row strong { font-size:12px; }
  .invoice-copy-row small { font-size:10px; }
  .invoice-copy-row button { min-height:44px; font-size:11px; }
  .discord-settings-grid .clock-role-fieldset,.discord-settings-grid .duty-log-fieldset { grid-column:auto; }
}

/* V44 — admin safety, report history, exports, and Discord health */
.admin-alerts-card,.discord-health-card,.weekly-history-card,.data-safety-card { margin:0 24px 14px; }
.admin-alert-list,.discord-failed-list,.weekly-report-history { padding:0 14px 14px; display:grid; gap:8px; }
.admin-alert-row { min-height:56px; padding:10px 12px; display:flex; align-items:center; gap:11px; border:1px solid #3b3042; border-radius:10px; background:#1b1720; }
.admin-alert-row > span { width:28px; height:28px; flex:0 0 auto; display:grid; place-items:center; border-radius:8px; background:rgba(168,85,247,.14); color:var(--shop-accent); font-size:15px; font-weight:900; }
.admin-alert-row.clock > span,.admin-alert-row.discord > span,.admin-alert-row.backup > span { background:rgba(245,158,11,.12); color:#fbbf24; }
.admin-alert-row div { min-width:0; display:grid; gap:3px; }
.admin-alert-row strong { color:#eee8f1; font-size:12px; }
.admin-alert-row small { color:#958c9b; font-size:10px; line-height:1.45; }
.healthy-empty { color:#8fcfa6; }
.discord-health-grid { padding:0 14px 14px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; }
.discord-health-grid article,.backup-status > span { min-height:82px; padding:12px; display:flex; flex-direction:column; gap:5px; border:1px solid #352d3a; border-radius:10px; background:#17141a; }
.discord-health-grid small,.backup-status small { color:#847a8a; font-size:9px; font-weight:800; letter-spacing:.08em; }
.discord-health-grid strong,.backup-status strong { color:#eee8f1; font-size:12px; line-height:1.4; }
.discord-health-grid span { color:#7f7685; font-size:9px; line-height:1.4; }
.discord-health-grid button { align-self:flex-start; margin-top:auto; }
.discord-failed-row,.weekly-history-row { min-height:58px; padding:10px 12px; display:flex; align-items:center; justify-content:space-between; gap:12px; border:1px solid var(--ui-line); border-radius:9px; background:var(--ui-raised); }
.discord-failed-row > span,.weekly-history-row > div { min-width:0; display:grid; gap:3px; }
.discord-failed-row strong,.weekly-history-row strong { color:var(--ui-highlight); font-size:11px; }
.discord-failed-row small,.weekly-history-row small { color:var(--ui-muted); font-size:9px; line-height:1.45; }
.discord-failed-row b { color:var(--ui-accent-text); font-size:9px; white-space:nowrap; }
.weekly-history-row > span { display:flex; align-items:center; justify-content:flex-end; gap:7px; }
.weekly-history-row > span > b { margin-right:7px; color:var(--ui-accent-text); font-family:'DM Mono',monospace; font-size:9px; font-weight:600; }
.backup-status { padding:0 14px 10px; display:grid; grid-template-columns:2fr 1fr; gap:9px; }
.backup-status > span { min-height:68px; }
.export-actions { padding:0 14px 14px; display:flex; flex-wrap:wrap; gap:8px; }
.export-actions button { min-height:38px; }
.adjustment-request-person em,.profile-history-row em { color:#b9aabe; font-size:9px; font-style:normal; line-height:1.45; }
.saved-report-modal { width:min(820px,calc(100vw - 30px)); }
.saved-report-header,.saved-report-member { display:grid; grid-template-columns:minmax(170px,1.5fr) repeat(3,minmax(90px,.6fr)); gap:12px; align-items:center; }
.saved-report-header { padding:10px 12px; color:var(--ui-muted); font-size:8px; font-weight:800; letter-spacing:.08em; }
.saved-report-members { max-height:380px; overflow:auto; display:grid; gap:7px; }
.saved-report-member { min-height:54px; padding:10px 12px; border:1px solid var(--ui-line); border-radius:9px; background:var(--ui-raised); color:var(--ui-highlight); font-size:10px; }
.saved-report-member > span:first-child { display:grid; gap:3px; }
.saved-report-member strong { color:var(--ui-highlight); font-size:11px; }
.saved-report-member small { color:var(--ui-muted); font-size:8px; }

@media (max-width:760px) {
  .admin-alerts-card,.discord-health-card,.weekly-history-card,.data-safety-card { margin-left:0; margin-right:0; }
  .discord-health-grid { grid-template-columns:1fr; padding-left:10px; padding-right:10px; }
  .discord-health-grid article { min-height:72px; }
  .admin-alert-list,.discord-failed-list,.weekly-report-history { padding-left:10px; padding-right:10px; }
  .weekly-history-row { align-items:flex-start; flex-direction:column; }
  .weekly-history-row > span { width:100%; justify-content:flex-start; flex-wrap:wrap; }
  .weekly-history-row > span > b { width:100%; }
  .backup-status { grid-template-columns:1fr; padding-left:10px; padding-right:10px; }
  .export-actions { display:grid; grid-template-columns:1fr; padding-left:10px; padding-right:10px; }
  .export-actions button { min-height:44px; }
  .saved-report-header { display:none; }
  .saved-report-member { grid-template-columns:1fr 1fr; gap:8px; }
  .saved-report-member > span:first-child { grid-column:1 / -1; }
}

/* Installable app, maintenance mode, and security alerts */
.maintenance-manager,.security-events-card { max-width:1100px; margin:0 23px 18px; }
.maintenance-mode-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:0 0 15px; }
.maintenance-mode-card { min-height:88px; padding:14px; display:flex; align-items:flex-start; gap:11px; border:1px solid #413449; border-radius:12px; background:#17121c; color:#f2ebf5; cursor:pointer; transition:border-color .16s,background .16s,transform .16s; }
.maintenance-mode-card:hover { transform:translateY(-1px); border-color:#9e60bb; }
.maintenance-mode-card:has(input:checked) { border-color:var(--shop-accent,#a855f7); background:color-mix(in srgb,var(--shop-accent,#a855f7) 12%,#17121c); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--shop-accent,#a855f7) 32%,transparent); }
.maintenance-mode-card.lock:has(input:checked) { border-color:#e28a6b; background:#291916; box-shadow:inset 0 0 0 1px #7d3d32; }
.maintenance-mode-card input { width:17px; height:17px; margin:2px 0 0; flex:0 0 auto; accent-color:var(--shop-accent,#a855f7); }
.maintenance-mode-card span { display:grid; gap:5px; }
.maintenance-mode-card strong { font-size:13px; }
.maintenance-mode-card small { color:#aba0af; font-size:11px; line-height:1.5; }
.maintenance-check-status { margin-top:18px!important; color:#d7bbdd!important; font-size:12px!important; }
.maintenance-manager .viewer-role.status-active { border-color:#8a3544; background:#36171d; color:#ff9ca8; }
.owner-safety-list { padding:0 14px 14px; display:grid; gap:8px; }
.owner-safety-row { min-height:76px; padding:12px; display:flex; align-items:center; justify-content:space-between; gap:14px; border:1px solid #382f3d; border-radius:10px; background:#17141a; }
.owner-safety-row > div { min-width:0; display:grid; gap:4px; }
.owner-safety-row > div small { color:#8c818f; font-size:8px; font-weight:800; letter-spacing:.06em; }
.owner-safety-row > div strong { color:#eee7f1; font-size:12px; }
.owner-safety-row > div p { margin:0; color:#9d929f; font-size:10px; line-height:1.5; }
.owner-safety-row > span { flex:0 0 auto; display:flex; align-items:center; justify-content:flex-end; gap:7px; }
.owner-safety-row > span small { color:#877d8c; font-size:9px; }
.owner-safety-row > span b { color:#79c9a3; font-size:9px; }
.owner-safety-row.security-critical { border-color:#71343d; box-shadow:inset 3px 0 #ef4444; }
.owner-safety-row.security-warning { border-color:#664d2c; box-shadow:inset 3px 0 #f59e0b; }
.owner-safety-row.reviewed { opacity:.66; box-shadow:none; }
.install-app-status { min-height:38px; margin:0 0 12px; color:#9b909f; font-size:11px; line-height:1.55; }
.settings-card-install .primary-button { width:100%; min-height:43px; }
.connection-warning { position:sticky; z-index:1000; top:0; width:100%; padding:11px 18px; box-sizing:border-box; border-bottom:1px solid #8d3b46; background:#491c24; color:#ffdce1; text-align:center; font-size:12px; font-weight:800; }
.maintenance-body { min-height:100vh; margin:0; background:radial-gradient(circle at 50% 20%,rgba(168,85,247,.15),transparent 34%),#09070b; }
.maintenance-page { min-height:100vh; padding:24px; display:grid; place-items:center; box-sizing:border-box; }
.maintenance-card { width:min(500px,100%); padding:38px; border:1px solid #44364a; border-radius:20px; background:#17131a; box-shadow:0 30px 80px rgba(0,0,0,.45); text-align:center; }
.maintenance-card img { width:78px; height:78px; border-radius:18px; object-fit:cover; }
.maintenance-card .eyebrow { margin:20px 0 7px; }
.maintenance-card h1 { margin:0 0 10px; color:#f7f1f9; font-size:28px; }
.maintenance-card > p:not(.eyebrow) { margin:0; color:#aaa0ae; font-size:13px; line-height:1.7; white-space:pre-wrap; }
.maintenance-actions { margin-top:24px; display:flex; justify-content:center; gap:9px; }
.maintenance-actions a { display:inline-flex; align-items:center; text-decoration:none; }

@media (max-width:760px) {
  .maintenance-manager,.security-events-card { margin-left:0; margin-right:0; }
  .maintenance-mode-options { grid-template-columns:1fr; }
  .owner-safety-list { padding-left:10px; padding-right:10px; }
  .owner-safety-row { align-items:flex-start; flex-direction:column; }
  .owner-safety-row > span { width:100%; justify-content:flex-start; flex-wrap:wrap; }
  .owner-safety-row > span .row-action { min-height:40px; }
  .maintenance-card { padding:28px 20px; }
  .maintenance-actions { flex-direction:column; }
  .maintenance-actions > * { justify-content:center; }
}


/* Shop theme presets and a contained preview: nothing changes for staff until Save. */
.theme-preset-section > strong,.theme-preview-eyebrow { color:#bdb2c1; font-size:10px; letter-spacing:.1em; }
.theme-preset-section p { margin:5px 0 12px; color:#aaa2ae; font-size:11px; line-height:1.5; }
.theme-presets { display:grid; grid-template-columns:repeat(auto-fit,minmax(116px,1fr)); gap:8px; }
.theme-preset { min-height:66px; padding:9px; display:grid; gap:8px; justify-items:start; border:1px solid var(--surface-line); border-radius:10px; background:var(--surface-raised); color:#ddd5e0; font-size:10px; font-weight:800; text-align:left; transition:border-color var(--motion-fast),transform var(--motion-fast); }
.theme-preset:hover { transform:translateY(-2px); border-color:var(--shop-accent); }
.theme-preset.active { border-color:var(--shop-accent); box-shadow:inset 0 0 0 1px var(--shop-accent); }
.theme-preset-swatches { display:flex; }
.theme-preset-swatches i { width:18px; height:18px; border:1px solid rgba(255,255,255,.3); border-radius:50%; }
.theme-preset-swatches i + i { margin-left:-5px; }
.theme-preview { padding:13px; display:grid; gap:10px; border:1px solid color-mix(in srgb,var(--preview-accent) 30%,#3b3540); border-radius:12px; background:var(--preview-background); }
.theme-preview-card { padding:10px; display:flex; align-items:center; gap:9px; border:1px solid color-mix(in srgb,var(--preview-accent) 20%,#3b3540); border-radius:9px; background:var(--preview-panel); }
.theme-preview-card > span:nth-child(2) { flex:1; display:grid; gap:2px; }
.theme-preview-card strong { color:#f5f1f7; font-size:11px; }
.theme-preview-card small { color:#aca5b1; font-size:9px; }
.theme-preview-icon,.theme-preview-price { color:var(--preview-accent); }
.theme-preview-price { font-family:'DM Mono',monospace; font-size:12px; font-weight:800; }
.theme-preview-button { width:max-content; padding:7px 10px; border-radius:7px; background:var(--preview-button); color:#fff; font-size:10px; font-weight:800; }


@media (prefers-reduced-motion:reduce) {
  *,*:before,*:after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}
html.reduce-motion *,html.reduce-motion *:before,html.reduce-motion *:after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }

/* Shop overview uses the same totals already shown elsewhere in the portal. */
.overview-content { padding:24px 34px 36px; display:grid; gap:17px; }
.overview-metrics { display:grid; grid-template-columns:repeat(auto-fit,minmax(175px,1fr)); gap:11px; }
.overview-metrics article { min-height:130px; padding:17px; display:grid; align-content:space-between; gap:8px; border:1px solid var(--surface-line); border-radius:14px; background:linear-gradient(145deg,var(--surface-raised),var(--shop-panel)); box-shadow:0 10px 28px rgba(0,0,0,.14); }
.overview-metrics small { color:#aaa2ae; font-size:10px; font-weight:800; letter-spacing:.085em; }
.overview-metrics strong { overflow:hidden; color:#fff; font-family:'DM Mono',monospace; font-size:clamp(22px,2.5vw,30px); letter-spacing:-.05em; text-overflow:ellipsis; white-space:nowrap; }
.overview-metrics article:first-child strong,.overview-metrics article:last-child strong { color:color-mix(in srgb,var(--shop-accent) 62%,white); }
.overview-metrics article > span { color:#aaa2ae; font-size:10px; }
.overview-lower { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(260px,.6fr); gap:14px; }
.overview-activity-list { padding:8px 14px 14px; display:grid; gap:7px; }
.overview-activity-row { min-height:59px; padding:10px 12px; display:flex; align-items:center; justify-content:space-between; gap:12px; border:1px solid var(--surface-line); border-radius:9px; background:var(--surface-raised); }
.overview-activity-row > span { min-width:0; display:grid; gap:3px; }
.overview-activity-row strong { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.overview-activity-row small { color:#aaa2ae; font-size:10px; }
.overview-activity-row b { flex:0 0 auto; color:color-mix(in srgb,var(--shop-accent) 60%,white); font-family:'DM Mono',monospace; font-size:13px; }
.overview-shift { padding:17px; display:grid; justify-items:start; align-content:start; gap:11px; }
.overview-status { padding:7px 10px; border:1px solid var(--surface-line); border-radius:999px; background:var(--surface-soft); color:#b9b1bd; font-size:11px; font-weight:800; }
.overview-status.is-active { border-color:rgba(94,225,171,.35); background:rgba(94,225,171,.12); color:#81e6b7; }
.overview-shift p { margin:0; color:#aaa2ae; font-size:12px; line-height:1.6; }
.overview-shift button { min-height:39px; padding:9px 12px; }


@media (max-width:980px) { .overview-lower { grid-template-columns:1fr; } }
@media (max-width:760px) {
  .overview-content { padding:12px 0 24px; gap:11px; }
  .overview-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .overview-metrics article { min-height:105px; padding:13px; }
  .overview-metrics strong { font-size:21px; }
  .overview-metrics small { font-size:9px; }
  .overview-lower { gap:10px; }
  .login-card-wrap { padding:20px; }
  .login-card { padding:19px; }
}
@media (max-width:390px) { .overview-metrics { grid-template-columns:1fr; } }

.load-error { min-height:140px; padding:21px; display:grid; place-content:center; justify-items:center; gap:8px; border:1px dashed #8e4d5c; border-radius:13px; background:rgba(126,42,58,.08); text-align:center; }
.mobile-quick-nav { display:none; }
.load-error strong { color:#f5dce1; font-size:14px; }
.load-error span { color:#b7a3aa; font-size:11px; }
.load-error button { min-height:38px; margin-top:4px; padding:8px 14px; border:1px solid #9a6571; border-radius:8px; background:#4b2731; color:#fff; font-weight:800; }
.admin-menu-row,.category-admin-row,.rank-admin-row,.discount-admin-row,.owner-safety-row,.application-list > * { border-color:var(--surface-line); transition:background var(--motion-fast),border-color var(--motion-fast); }
.admin-menu-row:hover,.category-admin-row:hover,.rank-admin-row:hover,.discount-admin-row:hover,.owner-safety-row:hover { background:var(--surface-soft); }
.admin-menu-row .price { color:color-mix(in srgb,var(--shop-accent) 70%,white); font-size:13px; }
.discord-settings-grid fieldset,.weekly-analysis,.application-intro,.owner-discord-settings-grid > div { border-color:var(--surface-line); background:var(--surface-raised); }
.discord-settings-grid input[type="text"],.discord-settings-grid select,.owner-discord-settings-grid select { border-color:var(--surface-line); background:color-mix(in srgb,var(--shop-background) 55%,var(--shop-panel)); }
.discord-settings-grid fieldset > label,.owner-discord-settings-grid label { color:#b7acba; }
.application-list > * { border-radius:12px; }
@media (max-width:760px) {
  .load-error { min-height:130px; }
  .load-error button { min-height:44px; }
  .main-content { padding-bottom:calc(72px + env(safe-area-inset-bottom)); }
  .catalog-panel { padding-bottom:158px; }
  .mobile-quick-nav { position:fixed; z-index:39; left:8px; right:8px; bottom:calc(6px + env(safe-area-inset-bottom)); min-height:62px; padding:5px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; border:1px solid var(--surface-line); border-radius:16px; background:color-mix(in srgb,var(--shop-panel) 92%,var(--shop-background)); box-shadow:0 12px 32px rgba(0,0,0,.42); backdrop-filter:blur(16px); }
  .mobile-quick-nav button { min-width:0; min-height:50px; padding:5px; display:grid; place-content:center; justify-items:center; gap:2px; border-radius:11px; background:transparent; color:#aaa2ae; font-size:10px; font-weight:800; }
  .mobile-quick-nav button span { font-size:19px; line-height:1; }
  .mobile-quick-nav button.active { background:var(--surface-soft); color:#fff; box-shadow:inset 0 2px var(--shop-accent); }
  .mobile-cart-toggle { bottom:calc(78px + env(safe-area-inset-bottom)); }
  /* The fixed quick nav is outside the animated POS stacking context; hide it while the order drawer is open. */
  body.mobile-cart-open .mobile-quick-nav { display:none; }
}

.join-role-label{font-size:10px;font-weight:800;letter-spacing:.05em;color:var(--ui-muted);margin:0 0 10px}.join-role-list{display:grid;gap:8px;max-height:290px;overflow:auto;padding:3px}.join-role-choice{display:flex;gap:12px;align-items:center;padding:12px;border:1px solid var(--ui-line);border-radius:8px;background:var(--ui-field);cursor:pointer;min-width:0}.join-role-choice input{width:18px;height:18px;accent-color:var(--shop-accent);flex:none}.join-role-choice span{display:grid;gap:4px;min-width:0}.join-role-choice strong{font-size:12px;overflow-wrap:anywhere}.join-role-choice small{font-size:11px;color:var(--ui-muted);line-height:1.6}.join-role-choice:has(input:checked){border-color:var(--shop-accent)}.join-role-choice:has(input:disabled){opacity:.55}.join-role-choice input:focus-visible{outline:2px solid var(--shop-accent);outline-offset:3px}#join-role-count{font-size:11px;margin:10px 0 0}