:root {
  --ink: #050508;
  --ink-soft: #090a10;
  --panel: #0e0f16;
  --panel-soft: #12131c;
  --cloud: #f5f7ff;
  --muted: #9295a3;
  --violet: #8b5cff;
  --violet-bright: #ad8aff;
  --blue: #4aa8ff;
  --green: #68e0a0;
  --amber: #ffc66d;
  --red: #ff7b88;
  --glass: rgba(16, 17, 25, 0.72);
  --line: rgba(255, 255, 255, 0.09);
  --line-strong: rgba(255, 255, 255, 0.15);
  --shadow: 0 28px 90px rgba(0, 0, 0, 0.42);
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --ease-out-quint: cubic-bezier(.16, 1, .3, 1);
  --ease-out-cubic: cubic-bezier(.22, 1, .36, 1);
  --ease-spring: cubic-bezier(.2, .86, .25, 1.18);
  --motion-fast: 180ms;
  --motion-base: 360ms;
  --motion-slow: 620ms;
}

* { box-sizing: border-box; }
html { min-width: 320px; color-scheme: dark; background: var(--ink); }
body { min-height: 100vh; margin: 0; overflow-x: hidden; color: var(--cloud); background: var(--ink); font-family: var(--font); -webkit-font-smoothing: antialiased; }
body.modal-open { overflow: hidden; }
button,input,select,textarea { color: inherit; font: inherit; }
button { border: 0; cursor: pointer; }
a { color: inherit; text-decoration: none; }
svg { width: 20px; display: block; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
:focus-visible { outline: 2px solid var(--violet-bright); outline-offset: 3px; }
::selection { color: white; background: rgba(139,92,255,.68); }

.skip-link { position: fixed; z-index: 1000; top: 10px; left: 10px; padding: 9px 13px; border-radius: 9px; color: var(--ink); background: white; transform: translateY(-160%); transition: transform .18s ease; }
.skip-link:focus { transform: translateY(0); }

.app-ambient { position: fixed; z-index: 0; inset: 0; overflow: hidden; pointer-events: none; }
.app-ambient i { position: absolute; border-radius: 50%; filter: blur(140px); opacity: .12; }
.app-ambient i:first-child { top: -18vw; left: -15vw; width: 60vw; height: 60vw; background: var(--violet); }
.app-ambient i:nth-child(2) { right: -22vw; bottom: -22vw; width: 58vw; height: 58vw; background: var(--blue); opacity: .07; }
.app-ambient span { position: absolute; inset: 0; opacity: .016; background-image: linear-gradient(rgba(255,255,255,.9) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.9) 1px,transparent 1px); background-size: 70px 70px; mask-image: linear-gradient(to bottom,transparent,black 25%,black 75%,transparent); }
#app,#modal-root,.toast-region { position: relative; z-index: 1; }

.glass-card { border: 1px solid var(--line); background: var(--glass); box-shadow: var(--shadow),inset 0 1px 0 rgba(255,255,255,.055); backdrop-filter: blur(26px) saturate(135%); }
.cangix-mark { width: 38px; height: 38px; display: inline-grid; place-items: center; border: 1px solid rgba(255,255,255,.24); border-radius: 12px; color: white; background: linear-gradient(145deg,#b191ff,#6d3be0); box-shadow: 0 9px 24px rgba(101,53,211,.32),inset 0 1px 1px rgba(255,255,255,.4); font-size: 14px; font-weight: 760; }
.app-wordmark,.mobile-wordmark,.sidebar-wordmark { display: inline-flex; align-items: center; gap: 10px; font-size: 17px; letter-spacing: -.035em; }
.app-wordmark strong,.mobile-wordmark strong,.sidebar-wordmark strong { font-weight: 690; }

.boot-screen { min-height: 100vh; display: grid; place-items: center; align-content: center; gap: 10px; background: radial-gradient(circle at 50% 44%,rgba(139,92,255,.1),transparent 25%); }
.boot-screen strong { margin-top: 4px; font-size: 22px; letter-spacing: -.04em; }
.boot-screen > span:last-child { color: rgba(255,255,255,.32); font-family: var(--mono); font-size: 8px; letter-spacing: .12em; text-transform: uppercase; }
.boot-loader { margin: 18px 0 5px; display: flex; gap: 5px; }
.boot-loader i { width: 5px; height: 5px; border-radius: 50%; background: var(--violet-bright); animation: loaderPulse 1.2s ease-in-out infinite; }
.boot-loader i:nth-child(2) { animation-delay: .13s; }.boot-loader i:nth-child(3) { animation-delay: .26s; }
@keyframes loaderPulse { 0%,100% { opacity:.2; transform:translateY(0) } 50% { opacity:1; transform:translateY(-5px) } }

.fatal-screen { min-height: 100vh; padding: 28px; display: flex; flex-direction: column; }
.fatal-card { width: min(100%,560px); margin: auto; padding: 46px; border-radius: 30px; }
.fatal-code,.card-kicker { color: #b79cf7; font-family: var(--mono); font-size: 8px; font-weight: 650; letter-spacing: .12em; text-transform: uppercase; }
.fatal-card h1 { margin: 18px 0 12px; font-size: 37px; letter-spacing: -.055em; }
.fatal-card p { margin: 0 0 28px; color: rgba(255,255,255,.48); line-height: 1.6; }

.auth-layout { min-height: 100vh; display: grid; grid-template-columns: minmax(540px,1.1fr) minmax(440px,.9fr); }
.auth-story-panel { position: relative; min-height: 100vh; padding: 38px clamp(34px,5vw,78px); display: flex; flex-direction: column; overflow: hidden; border-right: 1px solid rgba(255,255,255,.06); background: radial-gradient(circle at 26% 24%,rgba(73,69,135,.18),transparent 33%),linear-gradient(145deg,#08080d,#050508); }
.auth-story-panel::after { position: absolute; right: -12%; bottom: -25%; width: 85%; height: 55%; border-radius: 50%; content:""; background: radial-gradient(ellipse,rgba(139,92,255,.22),rgba(34,18,69,.55) 36%,transparent 70%); filter: blur(25px); transform: rotate(-10deg); }
.auth-story-copy { position: relative; z-index: 2; max-width: 630px; margin-top: 8vh; }
.eyebrow { display: flex; align-items: center; gap: 9px; color: rgba(219,211,239,.62); font-family: var(--mono); font-size: 9px; font-weight: 650; letter-spacing: .12em; text-transform: uppercase; }
.eyebrow i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 14px rgba(104,224,160,.8); }
.auth-story-copy h1 { margin: 23px 0 19px; font-size: clamp(52px,5.2vw,82px); font-weight: 630; line-height: .93; letter-spacing: -.07em; }
.auth-story-copy h1 span,.onboarding-copy h1 span { color: transparent; background: linear-gradient(90deg,#bca0ff,#7b59ef 55%,#60b1ff); background-clip: text; -webkit-background-clip: text; }
.auth-story-copy > p { max-width: 530px; margin: 0; color: rgba(224,225,234,.5); font-size: 15px; line-height: 1.62; }
.auth-order-flow { position: relative; z-index: 3; width: min(100%,650px); margin-top: 6vh; padding: 20px; border: 1px solid rgba(255,255,255,.095); border-radius: 25px; background: rgba(18,19,28,.58); box-shadow: 0 28px 70px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.055); backdrop-filter: blur(24px); }
.flow-head { display: flex; align-items: center; justify-content: space-between; color: rgba(255,255,255,.4); font-family: var(--mono); font-size: 8px; letter-spacing: .07em; text-transform: uppercase; }
.flow-head em { display:flex;align-items:center;gap:7px;color:#9de9bf;font-style:normal; }.flow-head em i { width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 10px rgba(104,224,160,.75); }
.flow-order-card { margin-top: 16px; padding: 13px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; border: 1px solid rgba(255,255,255,.07); border-radius: 15px; background: rgba(255,255,255,.025); }
.flow-product,.item-visual { width: 43px; height: 43px; display: grid; place-items: center; border: 1px solid rgba(172,140,255,.18); border-radius: 12px; color: #c6afff; background: linear-gradient(145deg,rgba(139,92,255,.19),rgba(255,255,255,.025)); font-family:var(--mono);font-size:9px;font-weight:700; }
.flow-order-card div { display:flex;flex-direction:column;gap:3px; }.flow-order-card small { color:#a587ec;font-family:var(--mono);font-size:7px; }.flow-order-card strong { font-size:12px;font-weight:580; }.flow-order-card p { margin:0;color:rgba(255,255,255,.32);font-size:8px; }.flow-order-card > b { padding:6px 8px;border-radius:999px;color:#d8caff;background:rgba(139,92,255,.13);font-size:7px;font-weight:550; }
.flow-track { position:relative;height:1px;margin:27px 34px 19px;background:rgba(255,255,255,.08); }.flow-track span { display:block;width:50%;height:100%;background:linear-gradient(90deg,var(--violet),var(--blue));box-shadow:0 0 10px rgba(139,92,255,.7); }.flow-pulse { position:absolute;top:50%;left:50%;width:8px;height:8px;border-radius:50%;background:var(--violet-bright);box-shadow:0 0 0 7px rgba(139,92,255,.08),0 0 17px rgba(139,92,255,.9);transform:translate(-50%,-50%);animation:flowPulse 2.2s ease-in-out infinite; }
@keyframes flowPulse { 50% { box-shadow:0 0 0 13px rgba(139,92,255,0),0 0 22px rgba(139,92,255,1) } }
.flow-stages { display:grid;grid-template-columns:repeat(3,1fr); }.flow-stages > div { display:grid;grid-template-columns:26px 1fr;align-items:center;column-gap:8px; }.flow-stages i { grid-row:1/3;width:26px;height:26px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.1);border-radius:50%;background:#171821; }.flow-stages i svg { width:13px; }.flow-stages .done i { color:#06100a;border-color:transparent;background:var(--green); }.flow-stages .active i::after { width:6px;height:6px;border-radius:50%;content:"";background:var(--violet-bright);box-shadow:0 0 9px rgba(139,92,255,.9); }.flow-stages strong { font-size:9px;font-weight:560; }.flow-stages small { color:rgba(255,255,255,.3);font-size:7px; }.flow-stages > div:not(.done):not(.active) { opacity:.4; }
.flow-status-note { margin-top:20px;padding:11px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;border:1px solid rgba(104,224,160,.1);border-radius:13px;background:rgba(104,224,160,.035); }.flow-status-note > span { width:33px;height:33px;display:grid;place-items:center;border-radius:10px;color:#a6ebc4;background:rgba(104,224,160,.09); }.flow-status-note > span svg { width:17px; }.flow-status-note div { display:flex;flex-direction:column;gap:3px; }.flow-status-note small { color:rgba(255,255,255,.32);font-size:7px; }.flow-status-note strong { font-size:9px;font-weight:570; }.flow-status-note > b { padding:5px 7px;border-radius:999px;color:#9ce7bd;background:rgba(104,224,160,.09);font-size:6px;font-weight:600; }
.auth-story-foot { position:relative;z-index:3;margin-top:auto;padding-top:22px;display:flex;gap:20px;border-top:1px solid rgba(255,255,255,.06);color:rgba(255,255,255,.35);font-size:9px; }.auth-story-foot span { display:flex;align-items:center;gap:6px; }.auth-story-foot svg { width:14px;color:var(--violet-bright); }

.auth-access-panel { position:relative;min-height:100vh;padding:32px;display:flex;align-items:center;justify-content:center;background:rgba(7,7,11,.72); }
.auth-back { position:absolute;top:38px;left:38px;color:rgba(255,255,255,.4);font-size:11px;transition:color .18s ease; }.auth-back:hover { color:white; }
.auth-shell { width:min(100%,440px); }.mobile-wordmark { display:none; }.auth-heading > span { color:#ac8dec;font-family:var(--mono);font-size:8px;font-weight:650;letter-spacing:.12em;text-transform:uppercase; }.auth-heading h2 { margin:15px 0 10px;font-size:42px;font-weight:620;letter-spacing:-.06em; }.auth-heading p { margin:0;color:rgba(225,226,235,.45);font-size:13px;line-height:1.55; }
.auth-tabs { margin-top:32px;padding:4px;display:grid;grid-template-columns:1fr 1fr;border:1px solid rgba(255,255,255,.075);border-radius:13px;background:rgba(255,255,255,.025); }.auth-tabs button { min-height:40px;border-radius:10px;color:rgba(255,255,255,.38);background:transparent;font-size:11px; }.auth-tabs button[aria-selected="true"] { color:white;background:rgba(255,255,255,.075);box-shadow:0 6px 16px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.06); }
.auth-form,.stack-form,.modal-form { margin-top:26px;display:flex;flex-direction:column;gap:17px; }.auth-form label,.stack-form label,.modal-form label,.invite-form label,.invite-result label { display:flex;flex-direction:column;gap:8px; }.auth-form label > span,.stack-form label > span,.modal-form label > span,.invite-form label > span,.invite-result label > span { color:rgba(255,255,255,.55);font-size:10px;font-weight:540; }
.input-shell,.select-shell,.modal-form input,.modal-form select,.modal-form textarea,.suffix-input { min-height:50px;border:1px solid rgba(255,255,255,.085);border-radius:13px;background:rgba(255,255,255,.032);transition:border-color .18s ease,background .18s ease; }
.input-shell { padding:0 14px;display:flex;align-items:center;gap:10px; }.input-shell:focus-within,.select-shell:focus-within,.modal-form input:focus,.modal-form select:focus,.modal-form textarea:focus { border-color:rgba(158,121,255,.5);background:rgba(139,92,255,.04); }.input-shell svg { width:16px;color:rgba(255,255,255,.28); }.input-shell input { width:100%;height:47px;border:0;outline:0;background:transparent;font-size:12px; }.input-shell input::placeholder,.modal-form input::placeholder,.modal-form textarea::placeholder { color:rgba(255,255,255,.2); }
.auth-submit,.primary-button,.secondary-button { min-height:49px;padding:0 17px;display:inline-flex;align-items:center;justify-content:center;gap:11px;border-radius:13px;font-size:11px;font-weight:620;transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease; }.auth-submit,.primary-button { color:white;background:linear-gradient(135deg,#9e73ff,#7040e0);box-shadow:0 14px 32px rgba(103,54,217,.28),inset 0 1px 0 rgba(255,255,255,.24); }.auth-submit { width:100%;margin-top:4px;justify-content:space-between; }.auth-submit:hover,.primary-button:hover { transform:translateY(-2px);box-shadow:0 18px 38px rgba(103,54,217,.36),inset 0 1px 0 rgba(255,255,255,.24); }.auth-submit svg,.primary-button svg,.secondary-button svg { width:16px; }.auth-submit:disabled,.primary-button:disabled,.secondary-button:disabled { cursor:wait;opacity:.58;transform:none; }.auth-assurance { margin:16px 0 0;display:flex;align-items:center;justify-content:center;gap:6px;color:rgba(255,255,255,.28);font-size:8px; }.auth-assurance svg { width:13px;color:var(--green); }
.form-message { padding:11px 13px;border:1px solid rgba(255,123,136,.18);border-radius:11px;color:#ffb0b8;background:rgba(255,123,136,.065);font-size:10px;line-height:1.45; }

.onboarding-layout { min-height:100vh;padding:0 38px 38px;display:flex;flex-direction:column;background:radial-gradient(circle at 18% 35%,rgba(139,92,255,.1),transparent 28%),linear-gradient(145deg,#07070b,#050508); }
.onboarding-header { min-height:92px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid rgba(255,255,255,.06); }.onboarding-header .quiet-button { justify-self:end; }
.onboarding-steps { display:flex;align-items:center;gap:10px; }.onboarding-steps > div { display:flex;align-items:center;gap:7px;color:rgba(255,255,255,.28);font-family:var(--mono);font-size:7px;letter-spacing:.06em;text-transform:uppercase; }.onboarding-steps i { width:25px;height:25px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.09);border-radius:50%;font-style:normal; }.onboarding-steps i svg { width:13px; }.onboarding-steps div.active { color:white; }.onboarding-steps div.active i { border-color:rgba(139,92,255,.5);color:#d9caff;background:rgba(139,92,255,.12);box-shadow:0 0 0 5px rgba(139,92,255,.04); }.onboarding-steps div.done { color:rgba(255,255,255,.5); }.onboarding-steps div.done i { color:#06100a;border-color:transparent;background:var(--green); }.onboarding-steps > b { width:55px;height:1px;background:rgba(255,255,255,.08); }
.quiet-button { min-height:40px;padding:0 12px;border-radius:10px;color:rgba(255,255,255,.42);background:transparent;font-size:10px; }.quiet-button:hover { color:white;background:rgba(255,255,255,.04); }
.onboarding-main { width:min(100%,1130px);margin:auto;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:9%; }.onboarding-copy h1 { margin:24px 0 18px;font-size:clamp(54px,5.5vw,82px);font-weight:620;line-height:.94;letter-spacing:-.07em; }.onboarding-copy > p { max-width:530px;margin:0;color:rgba(224,225,234,.47);font-size:14px;line-height:1.62; }
.workspace-preview { margin-top:40px;padding:18px;border-radius:21px; }.preview-top { display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px; }.preview-top .cangix-mark { width:34px;height:34px;border-radius:10px;font-size:11px; }.preview-top > div { display:flex;flex-direction:column;gap:3px; }.preview-top small { color:rgba(255,255,255,.31);font-size:7px; }.preview-top strong { font-size:11px;font-weight:570; }.preview-top em { padding:5px 7px;border-radius:999px;color:#d9caff;background:rgba(139,92,255,.12);font-size:6px;font-style:normal; }.preview-modules { margin-top:17px;padding-top:15px;display:grid;grid-template-columns:repeat(4,1fr);gap:7px;border-top:1px solid rgba(255,255,255,.06); }.preview-modules span { min-height:43px;display:flex;align-items:center;justify-content:center;gap:6px;border:1px solid rgba(255,255,255,.055);border-radius:10px;color:rgba(255,255,255,.42);background:rgba(255,255,255,.02);font-size:7px; }.preview-modules svg { width:13px;color:#a889f2; }
.onboarding-card { padding:40px;border-radius:28px; }.onboarding-card h2,.invite-card h2 { margin:14px 0 9px;font-size:34px;font-weight:610;letter-spacing:-.055em; }.onboarding-card > p,.invite-card > p { margin:0;color:rgba(255,255,255,.42);font-size:12px;line-height:1.5; }.form-footnote { display:block;margin-top:17px;color:rgba(255,255,255,.25);font-size:8px;text-align:center; }

.invite-onboarding { padding-bottom:32px; }.invite-main { width:min(100%,1120px);margin:auto; }.invite-heading { max-width:730px;margin:48px auto 38px;text-align:center; }.invite-heading .eyebrow { justify-content:center; }.invite-heading h1 { margin:20px 0 13px;font-size:58px;font-weight:620;letter-spacing:-.065em; }.invite-heading p { margin:0;color:rgba(255,255,255,.44);font-size:13px;line-height:1.58; }
.invite-grid { display:grid;grid-template-columns:1.1fr .9fr;gap:16px; }.invite-card,.invite-list-card { padding:30px;border-radius:25px; }.invite-form { margin-top:25px;display:grid;grid-template-columns:1.45fr 1fr auto;align-items:end;gap:10px; }.invite-form.compact { grid-template-columns:1.4fr 1fr auto; }.select-shell { position:relative;overflow:hidden; }.select-shell select,.invite-form select { width:100%;height:48px;padding:0 35px 0 13px;border:0;outline:0;background:transparent;font-size:11px; }.invite-form .secondary-button { height:50px; }
.secondary-button { border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.78);background:rgba(255,255,255,.05); }.secondary-button:hover { border-color:rgba(255,255,255,.17);background:rgba(255,255,255,.08);transform:translateY(-1px); }
.invite-result { margin-top:20px;padding:16px;border:1px solid rgba(104,224,160,.13);border-radius:16px;background:rgba(104,224,160,.035); }.invite-result > div:first-child { display:flex;align-items:center;gap:10px; }.invite-result > div:first-child > span { width:31px;height:31px;display:grid;place-items:center;border-radius:10px;color:#07100b;background:var(--green); }.invite-result > div:first-child svg { width:15px; }.invite-result p { margin:0;display:flex;flex-direction:column;gap:3px; }.invite-result strong { font-size:10px;font-weight:580; }.invite-result small { color:rgba(255,255,255,.33);font-size:7px; }.invite-result label { margin-top:14px; }.invite-result label > div { display:flex; }.invite-result input { min-width:0;flex:1;height:39px;padding:0 10px;border:1px solid rgba(255,255,255,.07);border-radius:9px 0 0 9px;outline:0;color:rgba(255,255,255,.45);background:rgba(0,0,0,.18);font-family:var(--mono);font-size:7px; }.invite-result label button { padding:0 10px;display:flex;align-items:center;gap:5px;border-radius:0 9px 9px 0;color:#d9caff;background:rgba(139,92,255,.13);font-size:7px; }.invite-result label button svg { width:12px; }.invite-result > a { margin-top:12px;display:inline-flex;align-items:center;gap:7px;color:#ad91f2;font-size:8px; }.invite-result > a svg { width:13px; }
.invite-list-head { padding-bottom:19px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.06); }.invite-list-head > div { display:flex;flex-direction:column;gap:4px; }.invite-list-head small { color:#a78be9;font-family:var(--mono);font-size:7px;text-transform:uppercase; }.invite-list-head strong { font-size:15px;font-weight:580; }.invite-list-head > span { width:31px;height:31px;display:grid;place-items:center;border-radius:10px;color:#d9caff;background:rgba(139,92,255,.12);font-size:10px;font-weight:650; }
.pending-list > div,.member-list > div { min-height:64px;padding:11px 3px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;border-bottom:1px solid rgba(255,255,255,.055); }.member-avatar,.topbar-avatar { width:35px;height:35px;display:grid;place-items:center;border-radius:11px;color:#ddcfff;background:linear-gradient(145deg,rgba(139,92,255,.22),rgba(255,255,255,.035));font-size:8px;font-weight:700; }.pending-list p,.member-list p { margin:0;display:flex;flex-direction:column;gap:4px; }.pending-list strong,.member-list strong { font-size:9px;font-weight:560; }.pending-list small,.member-list small { color:rgba(255,255,255,.3);font-size:7px; }.pending-list em { padding:5px 7px;border-radius:999px;color:#ffdca5;background:rgba(255,198,109,.09);font-size:6px;font-style:normal; }.small-empty { padding:35px 12px;color:rgba(255,255,255,.3);font-size:10px;text-align:center; }
.invite-footer { margin-top:20px;display:flex;align-items:center;justify-content:flex-end;gap:12px; }

.workspace-shell { min-height:100vh;display:grid;grid-template-columns:236px 1fr;background:#07070b; }
.workspace-sidebar { position:fixed;z-index:30;top:0;bottom:0;left:0;width:236px;padding:19px 14px 14px;display:flex;flex-direction:column;border-right:1px solid rgba(255,255,255,.065);background:rgba(8,8,13,.92);backdrop-filter:blur(24px); }
.sidebar-wordmark { padding:0 8px 19px;border-bottom:1px solid rgba(255,255,255,.06); }.sidebar-wordmark .cangix-mark { width:31px;height:31px;border-radius:10px;font-size:11px; }.sidebar-wordmark > button { margin-left:auto;display:none;background:transparent;color:rgba(255,255,255,.4); }.sidebar-wordmark > button svg { width:18px; }
.workspace-switcher { margin-top:14px;padding:10px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.065);border-radius:12px;background:rgba(255,255,255,.025); }.workspace-switcher > span { width:31px;height:31px;display:grid;place-items:center;border-radius:9px;color:#d9caff;background:rgba(139,92,255,.13);font-size:8px;font-weight:700; }.workspace-switcher > div { min-width:0;display:flex;flex-direction:column;gap:3px; }.workspace-switcher small { color:rgba(255,255,255,.28);font-size:6px; }.workspace-switcher strong { overflow:hidden;font-size:9px;font-weight:560;text-overflow:ellipsis;white-space:nowrap; }.workspace-switcher > i { width:5px;height:5px;border-radius:50%;background:var(--green);box-shadow:0 0 8px rgba(104,224,160,.7); }
.workspace-sidebar nav { position:relative;isolation:isolate;margin-top:22px;display:flex;flex-direction:column;gap:3px; }.workspace-sidebar nav button { position:relative;z-index:1;min-height:41px;padding:0 10px;display:grid;grid-template-columns:19px 1fr auto;align-items:center;gap:9px;border-radius:10px;color:rgba(255,255,255,.38);background:transparent;font-size:9px;text-align:left;transition:color .18s ease,background .18s ease; }.workspace-sidebar nav button:hover { color:rgba(255,255,255,.75);background:rgba(255,255,255,.035); }.workspace-sidebar nav button.active { color:white;background:transparent;box-shadow:none; }.workspace-sidebar nav svg { width:16px; }.workspace-sidebar nav b { min-width:20px;padding:3px 5px;border-radius:6px;color:#ddcfff;background:rgba(139,92,255,.16);font-size:6px;text-align:center; }
.sidebar-glider { position:absolute;z-index:0;top:0;right:0;left:0;height:41px;border:1px solid rgba(173,138,255,.12);border-radius:10px;background:linear-gradient(90deg,rgba(139,92,255,.17),rgba(139,92,255,.055));box-shadow:inset 2px 0 0 var(--violet-bright),0 9px 24px rgba(76,43,153,.11),inset 0 1px 0 rgba(255,255,255,.035);opacity:0;transform:translate3d(0,var(--glider-y,0),0);pointer-events:none;will-change:transform,height;view-transition-name:sidebar-glider; }
.sidebar-glider::before { position:absolute;top:8px;bottom:8px;left:-1px;width:2px;border-radius:2px;content:"";background:linear-gradient(180deg,rgba(255,255,255,.72),var(--violet-bright),rgba(139,92,255,.22));box-shadow:0 0 12px rgba(173,138,255,.55); }
.sidebar-glider.is-visible { opacity:1; }
.sidebar-glider.is-moving { transition:height 420ms var(--ease-out-quint),transform 520ms var(--ease-out-quint); }
.sidebar-nav-label { position:relative;z-index:1; }
.sidebar-flow { margin-top:auto;padding:12px;border:1px solid rgba(104,224,160,.08);border-radius:12px;background:rgba(104,224,160,.025); }.sidebar-flow > div { display:flex;align-items:center;gap:7px;color:#9be5ba;font-size:7px;text-transform:uppercase;letter-spacing:.06em; }.sidebar-flow > div i { width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 9px rgba(104,224,160,.7); }.sidebar-flow p { margin:7px 0 0;color:rgba(255,255,255,.34);font-size:7px; }
.sidebar-user { margin-top:10px;padding:11px 5px 2px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;border-top:1px solid rgba(255,255,255,.06); }.sidebar-user .member-avatar { width:31px;height:31px;border-radius:9px; }.sidebar-user > div { min-width:0;display:flex;flex-direction:column;gap:3px; }.sidebar-user strong { overflow:hidden;font-size:8px;font-weight:560;text-overflow:ellipsis;white-space:nowrap; }.sidebar-user small { color:rgba(255,255,255,.3);font-size:6px; }.sidebar-user button { padding:6px;color:rgba(255,255,255,.28);background:transparent; }.sidebar-user button:hover { color:white; }.sidebar-user button svg { width:15px; }

.workspace-main { min-width:0;grid-column:2; }.workspace-topbar { position:sticky;z-index:20;top:0;height:68px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.06);background:rgba(7,7,11,.78);backdrop-filter:blur(22px); }.workspace-topbar > div:first-of-type { display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.3);font-size:8px; }.workspace-topbar > div:first-of-type span { font-family:var(--mono);text-transform:uppercase; }.workspace-topbar > div:first-of-type strong { color:rgba(255,255,255,.68);font-weight:530; }.workspace-topbar i { color:rgba(255,255,255,.14);font-style:normal; }.topbar-actions { display:flex;align-items:center;gap:10px; }.icon-button { position:relative;width:35px;height:35px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.065);border-radius:10px;color:rgba(255,255,255,.45);background:rgba(255,255,255,.025); }.icon-button svg { width:16px; }.icon-button i { position:absolute;top:8px;right:8px;width:5px;height:5px;border-radius:50%;background:var(--violet-bright);box-shadow:0 0 7px rgba(139,92,255,.8); }.topbar-avatar { width:35px;height:35px;border-radius:10px; }.mobile-menu { display:none;background:transparent; }
.workspace-content { min-height:calc(100vh - 68px);padding:36px clamp(24px,3vw,48px) 60px;background:radial-gradient(circle at 78% 10%,rgba(80,58,140,.06),transparent 22%); }
.view-heading { max-width:1400px;margin:0 auto 30px;display:flex;align-items:flex-end;justify-content:space-between;gap:30px; }.view-heading > div > span { color:#a88be9;font-family:var(--mono);font-size:7px;font-weight:650;letter-spacing:.12em;text-transform:uppercase; }.view-heading h1 { margin:10px 0 7px;font-size:35px;font-weight:610;letter-spacing:-.055em; }.view-heading p { margin:0;color:rgba(255,255,255,.38);font-size:11px; }.view-heading .primary-button { min-height:42px;font-size:9px; }
.metrics-grid { max-width:1400px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:11px; }.metrics-grid article { min-height:148px;padding:17px;display:grid;grid-template-columns:auto 1fr;align-content:space-between;column-gap:12px;border:1px solid var(--line);border-radius:17px;background:rgba(16,17,25,.62);box-shadow:inset 0 1px 0 rgba(255,255,255,.035); }.metric-icon { width:37px;height:37px;display:grid;place-items:center;border-radius:11px; }.metric-icon svg { width:17px; }.metric-violet { color:#d9caff;background:rgba(139,92,255,.12); }.metric-blue { color:#b9ddff;background:rgba(74,168,255,.11); }.metric-green { color:#acf0ca;background:rgba(104,224,160,.1); }.metric-amber { color:#ffe0ae;background:rgba(255,198,109,.1); }.metrics-grid article > div { display:grid;grid-template-columns:1fr auto;align-items:start; }.metrics-grid small { color:rgba(255,255,255,.33);font-size:7px; }.metrics-grid strong { grid-row:2;margin-top:5px;font-size:29px;font-weight:520;letter-spacing:-.06em; }.metrics-grid p { grid-column:1/3;margin:8px 0 0;color:rgba(255,255,255,.3);font-size:7px; }.metrics-grid em { grid-column:2;align-self:end;color:rgba(255,255,255,.25);font-size:6px;font-style:normal;text-transform:uppercase; }
.overview-grid { max-width:1400px;margin:12px auto 0;display:grid;grid-template-columns:1.55fr .7fr;gap:11px; }.dashboard-card { border:1px solid var(--line);border-radius:18px;background:rgba(16,17,25,.58);box-shadow:inset 0 1px 0 rgba(255,255,255,.035); }.order-overview-card,.quick-card,.full-card,.team-card,.invitation-card { padding:19px; }.card-head { padding-bottom:15px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.055); }.card-head > div { display:flex;flex-direction:column;gap:5px; }.card-head span { color:#9e82df;font-family:var(--mono);font-size:6px;letter-spacing:.1em; }.card-head h2 { margin:0;font-size:15px;font-weight:580;letter-spacing:-.03em; }.card-head button { display:flex;align-items:center;gap:5px;color:rgba(255,255,255,.35);background:transparent;font-size:7px; }.card-head button:hover { color:white; }.card-head svg { width:13px; }
.data-list { display:flex;flex-direction:column; }.data-row { min-height:65px;padding:9px 4px;display:grid;grid-template-columns:auto 1.3fr .8fr .75fr auto auto;align-items:center;gap:12px;border-bottom:1px solid rgba(255,255,255,.05); }.data-row:last-child { border-bottom:0; }.item-visual { width:39px;height:39px;border-radius:10px;font-size:7px; }.item-visual.large { width:52px;height:52px;border-radius:14px;font-size:9px; }.row-main,.row-project,.row-date { display:flex;flex-direction:column;gap:4px;min-width:0; }.row-main strong { overflow:hidden;font-size:9px;font-weight:560;text-overflow:ellipsis;white-space:nowrap; }.data-row small { color:rgba(255,255,255,.28);font-size:6px; }.row-project span,.row-date span { color:rgba(255,255,255,.5);font-size:7px; }.status-chip { width:max-content;padding:5px 7px;display:inline-flex;align-items:center;gap:5px;border-radius:999px;font-size:6px;white-space:nowrap; }.status-chip i { width:5px;height:5px;border-radius:50%;background:currentColor;box-shadow:0 0 7px currentColor; }.status-violet { color:#d6c6ff;background:rgba(139,92,255,.11); }.status-blue { color:#acd7ff;background:rgba(74,168,255,.1); }.status-amber { color:#ffe0ad;background:rgba(255,198,109,.09); }.status-green { color:#a9edc7;background:rgba(104,224,160,.09); }.status-red { color:#ffb2ba;background:rgba(255,123,136,.09); }.row-action { width:29px;height:29px;display:grid;place-items:center;border-radius:9px;color:#d6c6ff;background:rgba(139,92,255,.1); }.row-action svg { width:13px; }
.quick-actions { padding-top:8px; }.quick-actions button { width:100%;min-height:61px;padding:8px 5px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;border-bottom:1px solid rgba(255,255,255,.05);color:rgba(255,255,255,.52);background:transparent;text-align:left; }.quick-actions button:hover { color:white; }.quick-actions button > span { width:34px;height:34px;display:grid;place-items:center;border-radius:10px; }.quick-actions button > span svg { width:15px; }.quick-actions button > div { display:flex;flex-direction:column;gap:4px; }.quick-actions strong { font-size:8px;font-weight:560; }.quick-actions small { color:rgba(255,255,255,.25);font-size:6px; }.quick-actions button > svg { width:13px; }
.empty-state { min-height:280px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center; }.empty-state > span { width:47px;height:47px;display:grid;place-items:center;border:1px solid rgba(139,92,255,.15);border-radius:15px;color:#b296f4;background:rgba(139,92,255,.07); }.empty-state > span svg { width:20px; }.empty-state h3 { margin:17px 0 7px;font-size:16px;letter-spacing:-.03em; }.empty-state p { max-width:330px;margin:0;color:rgba(255,255,255,.32);font-size:9px;line-height:1.5; }.empty-state .secondary-button { min-height:37px;margin-top:17px;font-size:8px; }

.table-toolbar { padding-bottom:16px;display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid rgba(255,255,255,.055); }.search-mock { width:min(100%,360px);height:39px;padding:0 11px;display:flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.07);border-radius:11px;background:rgba(255,255,255,.025); }.search-mock svg { width:14px;color:rgba(255,255,255,.25); }.search-mock input { width:100%;height:37px;border:0;outline:0;background:transparent;font-size:9px; }.filter-pills { padding:3px;display:flex;border:1px solid rgba(255,255,255,.06);border-radius:10px;background:rgba(0,0,0,.14); }.filter-pills button { min-height:30px;padding:0 10px;border-radius:7px;color:rgba(255,255,255,.3);background:transparent;font-size:7px; }.filter-pills button.active { color:white;background:rgba(255,255,255,.07); }
.catalog-grid,.supplier-grid { max-width:1400px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:11px; }.product-card,.supplier-card { padding:18px; }.product-card-top { display:flex;align-items:flex-start;justify-content:space-between; }.product-card-top em { padding:5px 7px;border-radius:999px;color:#d7c8ff;background:rgba(139,92,255,.1);font-size:6px;font-style:normal; }.product-card h2,.supplier-card h2 { margin:20px 0 5px;font-size:15px;font-weight:580;letter-spacing:-.035em; }.product-card > p,.supplier-card > p { margin:0;color:#987adc;font-family:var(--mono);font-size:7px; }.product-card dl,.supplier-card dl { margin:20px 0 0;padding-top:15px;display:grid;grid-template-columns:1fr 1fr;gap:13px;border-top:1px solid rgba(255,255,255,.055); }.product-card dl div,.supplier-card dl div { display:flex;flex-direction:column;gap:5px; }.product-card dt,.supplier-card dt { color:rgba(255,255,255,.27);font-size:6px;text-transform:uppercase; }.product-card dd,.supplier-card dd { margin:0;color:rgba(255,255,255,.6);font-size:8px; }.product-card > button { width:100%;min-height:37px;margin-top:17px;padding:0 10px;display:flex;align-items:center;justify-content:space-between;border:1px solid rgba(255,255,255,.065);border-radius:10px;color:rgba(255,255,255,.49);background:rgba(255,255,255,.025);font-size:8px; }.product-card > button:hover { color:white;background:rgba(255,255,255,.05); }.product-card > button svg { width:13px; }
.supplier-grid { grid-template-columns:repeat(3,1fr); }.supplier-logo { width:49px;height:49px;display:grid;place-items:center;border-radius:14px;color:#d8c9ff;background:linear-gradient(145deg,rgba(139,92,255,.2),rgba(74,168,255,.06));font-size:10px;font-weight:700; }.supplier-title { margin-top:16px;display:flex;align-items:center;justify-content:space-between; }.supplier-title h2 { margin:0; }.supplier-title span { padding:5px 7px;border-radius:999px;color:#a8ecc5;background:rgba(104,224,160,.09);font-size:6px; }.supplier-card > p { margin-top:7px;color:rgba(255,255,255,.32);font-family:var(--font); }.supplier-card dl { grid-template-columns:1fr 1fr; }.supplier-card dl div:last-child { grid-column:1/3; }
.team-layout { max-width:1400px;margin:auto;display:grid;grid-template-columns:1.3fr .7fr;gap:11px; }.member-list > div { min-height:68px;grid-template-columns:auto 1fr auto auto; }.member-list em { padding:6px 8px;border-radius:999px;color:#d7c8ff;background:rgba(139,92,255,.1);font-size:7px;font-style:normal; }.member-list b { color:rgba(255,255,255,.25);font-size:6px; }

.modal-backdrop { position:fixed;z-index:80;inset:0;background:rgba(2,2,5,.72);backdrop-filter:blur(9px);animation:fadeIn .18s ease both; }.app-modal { position:fixed;z-index:81;top:50%;left:50%;width:min(calc(100% - 30px),610px);max-height:calc(100vh - 40px);padding:25px;overflow-y:auto;border-radius:24px;background:rgba(17,18,27,.94);transform:translate(-50%,-50%);animation:modalIn .25s ease both; }.app-modal.wide { width:min(calc(100% - 30px),720px); }
@keyframes fadeIn { from { opacity:0 } }@keyframes modalIn { from { opacity:0;transform:translate(-50%,-47%) scale(.98) } }
.modal-head { padding-bottom:18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.06); }.modal-head > div { display:flex;flex-direction:column;gap:6px; }.modal-head span { color:#a889ec;font-family:var(--mono);font-size:7px;letter-spacing:.11em; }.modal-head h2 { margin:0;font-size:24px;font-weight:610;letter-spacing:-.045em; }.modal-head > button { width:34px;height:34px;display:grid;place-items:center;border-radius:10px;color:rgba(255,255,255,.4);background:rgba(255,255,255,.045); }.modal-head > button:hover { color:white; }.modal-head svg { width:16px; }
.modal-form { margin-top:21px; }.form-grid { display:grid;grid-template-columns:1fr 1fr;gap:12px; }.form-grid.single { grid-template-columns:1fr; }.modal-form input,.modal-form select,.modal-form textarea { width:100%;padding:0 12px;outline:0;font-size:10px; }.modal-form input,.modal-form select { height:48px; }.modal-form textarea { padding-top:12px;resize:vertical; }.modal-form select { appearance:none; }.suffix-input { padding:0 10px;display:flex;align-items:center; }.suffix-input input { min-width:0;border:0;background:transparent; }.suffix-input b { color:rgba(255,255,255,.3);font-size:8px;font-weight:500; }.check-label { min-height:50px;padding:0 12px;display:flex!important;flex-direction:row!important;align-items:center;gap:10px!important;border:1px solid rgba(255,255,255,.075);border-radius:13px;background:rgba(255,255,255,.025); }.check-label input { width:16px;height:16px;accent-color:var(--violet); }.check-label > span { display:flex;flex-direction:column;gap:3px; }.check-label strong { font-size:9px;font-weight:560; }.check-label small { color:rgba(255,255,255,.28);font-size:7px; }.modal-actions { margin-top:8px;padding-top:18px;display:flex;justify-content:flex-end;gap:10px;border-top:1px solid rgba(255,255,255,.06); }.modal-actions .primary-button { min-height:42px;font-size:9px; }
.process-summary { padding:13px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;border:1px solid rgba(255,255,255,.07);border-radius:15px;background:rgba(255,255,255,.025); }.process-summary > div { display:flex;flex-direction:column;gap:4px; }.process-summary strong { font-size:11px;font-weight:580; }.process-summary p { margin:0;color:rgba(255,255,255,.38);font-size:8px; }.process-summary small { color:rgba(255,255,255,.25);font-size:7px; }.request-note { padding:13px;border-left:2px solid var(--violet);border-radius:0 10px 10px 0;background:rgba(139,92,255,.045); }.request-note span { color:#a88be9;font-family:var(--mono);font-size:7px;text-transform:uppercase; }.request-note p { margin:7px 0 0;color:rgba(255,255,255,.52);font-size:9px;line-height:1.5; }
.invite-modal-body > p { margin:20px 0 0;color:rgba(255,255,255,.42);font-size:10px; }.modal-pending { margin-top:18px;padding-top:10px;border-top:1px solid rgba(255,255,255,.06); }

.toast-region { position:fixed;z-index:120;right:18px;bottom:18px;display:flex;flex-direction:column;gap:8px;pointer-events:none; }.toast { min-width:270px;max-width:380px;padding:11px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:9px;border:1px solid rgba(255,255,255,.1);border-radius:13px;background:rgba(18,19,28,.94);box-shadow:0 18px 45px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.055);backdrop-filter:blur(18px);opacity:0;transform:translateY(10px);transition:opacity .2s ease,transform .2s ease; }.toast.is-visible { opacity:1;transform:translateY(0); }.toast > span { width:28px;height:28px;display:grid;place-items:center;border-radius:9px;color:#06100a;background:var(--green);font-size:10px;font-weight:700; }.toast-error > span { color:white;background:var(--red); }.toast svg { width:14px; }.toast p { margin:0;color:rgba(255,255,255,.72);font-size:9px;line-height:1.4; }

@media (max-width:1100px) {
  .auth-layout { grid-template-columns:1fr 440px; }.auth-story-panel { padding-right:35px;padding-left:35px; }.auth-story-copy { margin-top:7vh; }.auth-order-flow { margin-top:4vh; }
  .metrics-grid { grid-template-columns:1fr 1fr; }.catalog-grid,.supplier-grid { grid-template-columns:1fr 1fr; }
  .overview-grid { grid-template-columns:1fr; }.quick-actions { display:grid;grid-template-columns:1fr 1fr; }.quick-actions button { border-right:1px solid rgba(255,255,255,.05); }
  .data-row { grid-template-columns:auto 1.2fr .7fr .7fr auto auto; }.row-project { display:none; }
}

@media (max-width:860px) {
  .auth-layout { grid-template-columns:1fr; }.auth-story-panel { display:none; }.auth-access-panel { padding:80px 24px 35px; }.auth-back { top:25px;left:24px; }.mobile-wordmark { margin-bottom:48px;display:flex; }
  .onboarding-header { grid-template-columns:1fr auto; }.onboarding-header .onboarding-steps { grid-column:1/3;grid-row:2;margin:auto;padding-bottom:20px; }.onboarding-header .quiet-button { grid-column:2;grid-row:1; }.onboarding-main { padding:55px 0;grid-template-columns:1fr;gap:50px; }.workspace-preview { max-width:600px; }.onboarding-card { max-width:600px; }
  .invite-main { padding:30px 0; }.invite-heading { margin-top:25px; }.invite-grid { grid-template-columns:1fr; }.invite-list-card { min-height:220px; }
  .workspace-shell { grid-template-columns:1fr; }.workspace-main { grid-column:1; }.workspace-sidebar { width:260px;transform:translateX(-105%);transition:transform .22s ease;box-shadow:20px 0 55px rgba(0,0,0,.45); }.workspace-sidebar.is-open { transform:translateX(0); }.sidebar-wordmark > button,.mobile-menu { display:grid; }.workspace-topbar { padding:0 20px;justify-content:flex-start;gap:13px; }.workspace-topbar > div:first-of-type { flex:1; }.metrics-grid { grid-template-columns:1fr 1fr; }
  .team-layout { grid-template-columns:1fr; }.catalog-grid,.supplier-grid { grid-template-columns:1fr 1fr; }
}

@media (max-width:600px) {
  .auth-access-panel { align-items:flex-start; }.auth-shell { margin-top:40px; }.mobile-wordmark { margin-bottom:40px; }.auth-heading h2 { font-size:37px; }
  .onboarding-layout { padding:0 16px 20px; }.onboarding-header { min-height:78px; }.onboarding-steps { gap:5px; }.onboarding-steps > b { width:18px; }.onboarding-steps div span { display:none; }.onboarding-copy h1 { font-size:49px; }.preview-modules { grid-template-columns:1fr 1fr; }.onboarding-card { padding:25px; }
  .invite-heading h1 { font-size:44px; }.invite-form,.invite-form.compact { grid-template-columns:1fr; }.invite-footer { align-items:stretch;flex-direction:column-reverse; }.invite-footer button { width:100%; }
  .workspace-content { padding:25px 14px 45px; }.workspace-topbar { height:60px;padding:0 14px; }.workspace-topbar > div:first-of-type span,.workspace-topbar > div:first-of-type i { display:none; }.view-heading { align-items:flex-start;flex-direction:column;gap:18px; }.view-heading h1 { font-size:31px; }.view-heading .primary-button { width:100%; }
  .metrics-grid { grid-template-columns:1fr; }.metrics-grid article { min-height:125px; }.overview-grid { margin-top:10px; }.quick-actions { grid-template-columns:1fr; }.order-overview-card,.quick-card,.full-card,.team-card,.invitation-card { padding:14px; }
  .data-row { grid-template-columns:auto 1fr auto auto;gap:8px; }.row-date,.row-project { display:none; }.status-chip { grid-column:3; }.row-action { grid-column:4; }.data-row:not(:has(.row-action)) .status-chip { grid-column:3/5;justify-self:end; }
  .table-toolbar { align-items:stretch;flex-direction:column; }.search-mock { width:100%; }.filter-pills button { flex:1; }
  .catalog-grid,.supplier-grid { grid-template-columns:1fr; }.team-layout { grid-template-columns:1fr; }.member-list > div { grid-template-columns:auto 1fr auto; }.member-list b { display:none; }.member-list em { font-size:6px; }
  .form-grid { grid-template-columns:1fr; }.app-modal { padding:19px; }.modal-actions { align-items:stretch;flex-direction:column-reverse; }.modal-actions button { width:100%; }.process-summary { grid-template-columns:auto 1fr; }.process-summary .status-chip { grid-column:1/3; }
  .toast-region { right:10px;bottom:10px;left:10px; }.toast { min-width:0;max-width:none; }
}

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

/* Theme setting */
.theme-toggle { min-height:36px;padding:0 11px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid rgba(255,255,255,.08);border-radius:11px;color:rgba(255,255,255,.58);background:rgba(255,255,255,.035);font-size:8px;font-weight:590;white-space:nowrap;transition:color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease; }
.theme-toggle:hover { color:white;border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.07);transform:translateY(-1px); }
.theme-toggle svg { width:15px;flex:0 0 auto; }
.auth-theme-control { position:absolute;z-index:3;top:32px;right:32px; }
.fatal-topbar { display:flex;align-items:center;justify-content:space-between; }
.onboarding-actions { justify-self:end;display:flex;align-items:center;gap:7px; }
.input-shell input:-webkit-autofill { -webkit-text-fill-color:#f5f7ff;-webkit-box-shadow:0 0 0 1000px #12131c inset;caret-color:#f5f7ff;border-radius:0 11px 11px 0; }

/* Daylight theme: cool blueprint paper, not warm SaaS cream. */
html[data-theme="light"] {
  --ink:#f5f7fb;
  --ink-soft:#eef2f7;
  --panel:#ffffff;
  --panel-soft:#f8faff;
  --cloud:#162033;
  --muted:#5d6779;
  --violet:#6942d4;
  --violet-bright:#6f46dc;
  --blue:#176ca8;
  --green:#1b7f52;
  --amber:#a35c00;
  --red:#b42335;
  --glass:rgba(255,255,255,.88);
  --line:rgba(29,44,70,.12);
  --line-strong:rgba(29,44,70,.2);
  --shadow:0 24px 64px rgba(36,49,75,.12);
  color-scheme:light;
  background:var(--ink);
}
html[data-theme="light"] body { color:var(--cloud);background:var(--ink); }
html[data-theme="light"] ::selection { color:white;background:rgba(105,66,212,.82); }
html[data-theme="light"] .skip-link { color:white;background:#5732bd; }
html[data-theme="light"] .app-ambient i { opacity:.09; }
html[data-theme="light"] .app-ambient i:nth-child(2) { opacity:.07; }
html[data-theme="light"] .app-ambient span { opacity:.075;background-image:linear-gradient(rgba(63,83,118,.3) 1px,transparent 1px),linear-gradient(90deg,rgba(63,83,118,.3) 1px,transparent 1px); }
html[data-theme="light"] .glass-card { box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.9); }
html[data-theme="light"] .boot-screen { background:radial-gradient(circle at 50% 44%,rgba(105,66,212,.1),transparent 28%); }
html[data-theme="light"] .boot-screen > span:last-child { color:#687386; }
html[data-theme="light"] .fatal-card p { color:#536075; }
html[data-theme="light"] .fatal-code,
html[data-theme="light"] .card-kicker { color:#633bc8; }

html[data-theme="light"] .theme-toggle { color:#435069;border-color:rgba(32,47,73,.14);background:rgba(255,255,255,.72);box-shadow:0 4px 14px rgba(36,49,75,.06); }
html[data-theme="light"] .theme-toggle:hover { color:#18243a;border-color:rgba(105,66,212,.28);background:white; }

html[data-theme="light"] .auth-story-panel { border-color:rgba(29,44,70,.1);background:radial-gradient(circle at 26% 24%,rgba(105,66,212,.12),transparent 34%),linear-gradient(145deg,#f0f3fa,#f8faff); }
html[data-theme="light"] .auth-story-panel::after { background:radial-gradient(ellipse,rgba(105,66,212,.15),rgba(112,83,188,.13) 38%,transparent 70%); }
html[data-theme="light"] .eyebrow { color:#536075; }
html[data-theme="light"] .auth-story-copy h1 span,
html[data-theme="light"] .onboarding-copy h1 span { background:linear-gradient(90deg,#5732bd,#6942d4 55%,#176ca8);background-clip:text;-webkit-background-clip:text; }
html[data-theme="light"] .auth-story-copy > p,
html[data-theme="light"] .onboarding-copy > p { color:#536075; }
html[data-theme="light"] .auth-order-flow { border-color:rgba(29,44,70,.13);background:rgba(255,255,255,.75);box-shadow:0 26px 60px rgba(41,55,82,.12),inset 0 1px 0 white; }
html[data-theme="light"] .flow-head { color:#667187; }
html[data-theme="light"] .flow-head em { color:#176a46; }
html[data-theme="light"] .flow-order-card { border-color:rgba(29,44,70,.1);background:rgba(238,242,248,.7); }
html[data-theme="light"] .flow-product,
html[data-theme="light"] .item-visual { border-color:rgba(105,66,212,.2);color:#5732bd;background:linear-gradient(145deg,rgba(105,66,212,.12),rgba(255,255,255,.8)); }
html[data-theme="light"] .flow-order-card small { color:#633bc8; }
html[data-theme="light"] .flow-order-card p { color:#5c687c; }
html[data-theme="light"] .flow-order-card > b { color:#5732bd;background:#eee8ff; }
html[data-theme="light"] .flow-track { background:rgba(29,44,70,.12); }
html[data-theme="light"] .flow-stages i { border-color:rgba(29,44,70,.14);background:#f3f5f9; }
html[data-theme="light"] .flow-stages small { color:#687386; }
html[data-theme="light"] .flow-stages > div:not(.done):not(.active) { opacity:.62; }
html[data-theme="light"] .flow-status-note { border-color:rgba(27,127,82,.18);background:rgba(27,127,82,.06); }
html[data-theme="light"] .flow-status-note > span { color:#176a46;background:rgba(27,127,82,.1); }
html[data-theme="light"] .flow-status-note small { color:#667187; }
html[data-theme="light"] .flow-status-note > b { color:#176a46;background:rgba(27,127,82,.1); }
html[data-theme="light"] .auth-story-foot { border-color:rgba(29,44,70,.1);color:#5d687b; }

html[data-theme="light"] .auth-access-panel { background:rgba(245,247,251,.82); }
html[data-theme="light"] .auth-back { color:#59667a; }
html[data-theme="light"] .auth-back:hover { color:#18243a; }
html[data-theme="light"] .auth-heading > span { color:#633bc8; }
html[data-theme="light"] .auth-heading p { color:#536075; }
html[data-theme="light"] .auth-tabs { border-color:rgba(29,44,70,.13);background:rgba(228,233,242,.62); }
html[data-theme="light"] .auth-tabs button { color:#667187; }
html[data-theme="light"] .auth-tabs button[aria-selected="true"] { color:#172238;background:white;box-shadow:0 6px 16px rgba(36,49,75,.1),inset 0 1px 0 white; }
html[data-theme="light"] .auth-form label > span,
html[data-theme="light"] .stack-form label > span,
html[data-theme="light"] .modal-form label > span,
html[data-theme="light"] .invite-form label > span,
html[data-theme="light"] .invite-result label > span { color:#46536a; }
html[data-theme="light"] .input-shell,
html[data-theme="light"] .select-shell,
html[data-theme="light"] .modal-form input,
html[data-theme="light"] .modal-form select,
html[data-theme="light"] .modal-form textarea,
html[data-theme="light"] .suffix-input { border-color:rgba(29,44,70,.16);background:rgba(255,255,255,.82); }
html[data-theme="light"] .input-shell:focus-within,
html[data-theme="light"] .select-shell:focus-within,
html[data-theme="light"] .modal-form input:focus,
html[data-theme="light"] .modal-form select:focus,
html[data-theme="light"] .modal-form textarea:focus { border-color:rgba(105,66,212,.52);background:white; }
html[data-theme="light"] .input-shell svg { color:#687386; }
html[data-theme="light"] .input-shell input:-webkit-autofill { -webkit-text-fill-color:#162033;-webkit-box-shadow:0 0 0 1000px #fff inset;caret-color:#162033; }
html[data-theme="light"] .input-shell input::placeholder,
html[data-theme="light"] .modal-form input::placeholder,
html[data-theme="light"] .modal-form textarea::placeholder { color:#8a94a6; }
html[data-theme="light"] .auth-assurance,
html[data-theme="light"] .form-footnote { color:#667187; }
html[data-theme="light"] .form-message { border-color:rgba(180,35,53,.2);color:#982335;background:#fff0f2; }

html[data-theme="light"] .onboarding-layout { background:radial-gradient(circle at 18% 35%,rgba(105,66,212,.1),transparent 29%),linear-gradient(145deg,#f3f6fb,#f8faff); }
html[data-theme="light"] .onboarding-header { border-color:rgba(29,44,70,.1); }
html[data-theme="light"] .onboarding-steps > div { color:#718096; }
html[data-theme="light"] .onboarding-steps i { border-color:rgba(29,44,70,.15); }
html[data-theme="light"] .onboarding-steps div.active { color:#18243a; }
html[data-theme="light"] .onboarding-steps div.active i { color:#5732bd;border-color:rgba(105,66,212,.4);background:#eee8ff; }
html[data-theme="light"] .onboarding-steps div.done { color:#536075; }
html[data-theme="light"] .onboarding-steps > b { background:rgba(29,44,70,.12); }
html[data-theme="light"] .quiet-button { color:#536075; }
html[data-theme="light"] .quiet-button:hover { color:#18243a;background:rgba(29,44,70,.06); }
html[data-theme="light"] .preview-top small { color:#667187; }
html[data-theme="light"] .preview-top em { color:#5732bd;background:#eee8ff; }
html[data-theme="light"] .preview-modules { border-color:rgba(29,44,70,.1); }
html[data-theme="light"] .preview-modules span { border-color:rgba(29,44,70,.1);color:#536075;background:rgba(238,242,248,.72); }
html[data-theme="light"] .preview-modules svg { color:#633bc8; }
html[data-theme="light"] .onboarding-card > p,
html[data-theme="light"] .invite-card > p,
html[data-theme="light"] .invite-heading p { color:#536075; }
html[data-theme="light"] .secondary-button { border-color:rgba(29,44,70,.16);color:#344258;background:rgba(255,255,255,.72); }
html[data-theme="light"] .secondary-button:hover { border-color:rgba(105,66,212,.28);color:#18243a;background:white; }
html[data-theme="light"] .invite-result { border-color:rgba(27,127,82,.2);background:rgba(27,127,82,.06); }
html[data-theme="light"] .invite-result small,
html[data-theme="light"] .pending-list small,
html[data-theme="light"] .member-list small { color:#667187; }
html[data-theme="light"] .invite-result input { border-color:rgba(29,44,70,.14);color:#46536a;background:rgba(255,255,255,.76); }
html[data-theme="light"] .invite-result label button { color:#5732bd;background:#eae3fb; }
html[data-theme="light"] .invite-result > a,
html[data-theme="light"] .invite-list-head small { color:#633bc8; }
html[data-theme="light"] .invite-list-head,
html[data-theme="light"] .pending-list > div,
html[data-theme="light"] .member-list > div { border-color:rgba(29,44,70,.1); }
html[data-theme="light"] .invite-list-head > span,
html[data-theme="light"] .member-avatar,
html[data-theme="light"] .topbar-avatar { color:#5732bd;background:linear-gradient(145deg,rgba(105,66,212,.13),rgba(255,255,255,.8)); }
html[data-theme="light"] .pending-list em { color:#8a4d00;background:#fff0d7; }
html[data-theme="light"] .small-empty { color:#667187; }

html[data-theme="light"] .workspace-shell { background:#f5f7fb; }
html[data-theme="light"] .workspace-sidebar { border-color:rgba(29,44,70,.1);background:rgba(255,255,255,.94);box-shadow:8px 0 28px rgba(38,52,78,.04); }
html[data-theme="light"] .sidebar-wordmark { border-color:rgba(29,44,70,.1); }
html[data-theme="light"] .sidebar-wordmark > button { color:#536075; }
html[data-theme="light"] .workspace-switcher { border-color:rgba(29,44,70,.12);background:#f4f6fa; }
html[data-theme="light"] .workspace-switcher > span { color:#5732bd;background:#eae3fb; }
html[data-theme="light"] .workspace-switcher small { color:#667187; }
html[data-theme="light"] .workspace-sidebar nav button { color:#5a667a; }
html[data-theme="light"] .workspace-sidebar nav button:hover { color:#18243a;background:#f1f3f8; }
html[data-theme="light"] .workspace-sidebar nav button.active { color:#5732bd;background:transparent;box-shadow:none; }
html[data-theme="light"] .sidebar-glider { border-color:rgba(105,66,212,.14);background:linear-gradient(90deg,rgba(105,66,212,.13),rgba(105,66,212,.035));box-shadow:inset 2px 0 0 #6942d4,0 9px 22px rgba(73,48,138,.08),inset 0 1px 0 rgba(255,255,255,.7); }
html[data-theme="light"] .sidebar-glider::before { background:linear-gradient(180deg,#9b7be8,#6942d4,rgba(105,66,212,.3));box-shadow:0 0 10px rgba(105,66,212,.28); }
html[data-theme="light"] .workspace-sidebar nav b { color:#5732bd;background:#eae3fb; }
html[data-theme="light"] .sidebar-flow { border-color:rgba(27,127,82,.14);background:rgba(27,127,82,.055); }
html[data-theme="light"] .sidebar-flow > div { color:#176a46; }
html[data-theme="light"] .sidebar-flow p { color:#5d687b; }
html[data-theme="light"] .sidebar-user { border-color:rgba(29,44,70,.1); }
html[data-theme="light"] .sidebar-user small,
html[data-theme="light"] .sidebar-user button { color:#667187; }
html[data-theme="light"] .sidebar-user button:hover { color:#18243a; }
html[data-theme="light"] .workspace-topbar { border-color:rgba(29,44,70,.1);background:rgba(248,250,253,.9); }
html[data-theme="light"] .workspace-topbar > div:first-of-type { color:#718096; }
html[data-theme="light"] .workspace-topbar > div:first-of-type strong { color:#344258; }
html[data-theme="light"] .workspace-topbar i { color:#a0a9b8; }
html[data-theme="light"] .icon-button { border-color:rgba(29,44,70,.12);color:#536075;background:rgba(255,255,255,.74); }
html[data-theme="light"] .mobile-menu { color:#46536a; }
html[data-theme="light"] .workspace-content { background:radial-gradient(circle at 78% 10%,rgba(105,66,212,.07),transparent 24%),#f5f7fb; }
html[data-theme="light"] .view-heading > div > span,
html[data-theme="light"] .card-head span { color:#633bc8; }
html[data-theme="light"] .view-heading p { color:#536075; }
html[data-theme="light"] .metrics-grid article,
html[data-theme="light"] .dashboard-card { border-color:rgba(29,44,70,.11);background:rgba(255,255,255,.9);box-shadow:0 9px 28px rgba(36,49,75,.055),inset 0 1px 0 white; }
html[data-theme="light"] .metric-violet { color:#5732bd;background:#eee8ff; }
html[data-theme="light"] .metric-blue { color:#176ca8;background:#e4f1fb; }
html[data-theme="light"] .metric-green { color:#176a46;background:#e3f4eb; }
html[data-theme="light"] .metric-amber { color:#8a4d00;background:#fff0d7; }
html[data-theme="light"] .metrics-grid small,
html[data-theme="light"] .metrics-grid p,
html[data-theme="light"] .metrics-grid em { color:#667187; }
html[data-theme="light"] .card-head,
html[data-theme="light"] .data-row,
html[data-theme="light"] .quick-actions button,
html[data-theme="light"] .table-toolbar,
html[data-theme="light"] .product-card dl,
html[data-theme="light"] .supplier-card dl { border-color:rgba(29,44,70,.09); }
html[data-theme="light"] .card-head button { color:#5d687b; }
html[data-theme="light"] .card-head button:hover { color:#18243a; }
html[data-theme="light"] .data-row small,
html[data-theme="light"] .quick-actions small,
html[data-theme="light"] .product-card dt,
html[data-theme="light"] .supplier-card dt { color:#718096; }
html[data-theme="light"] .row-project span,
html[data-theme="light"] .row-date span,
html[data-theme="light"] .quick-actions button,
html[data-theme="light"] .product-card dd,
html[data-theme="light"] .supplier-card dd { color:#46536a; }
html[data-theme="light"] .quick-actions button:hover { color:#18243a; }
html[data-theme="light"] .status-violet { color:#5732bd;background:#eee8ff; }
html[data-theme="light"] .status-blue { color:#176ca8;background:#e4f1fb; }
html[data-theme="light"] .status-amber { color:#8a4d00;background:#fff0d7; }
html[data-theme="light"] .status-green { color:#176a46;background:#e3f4eb; }
html[data-theme="light"] .status-red { color:#982335;background:#fff0f2; }
html[data-theme="light"] .row-action { color:#5732bd;background:#eee8ff; }
html[data-theme="light"] .empty-state > span { border-color:rgba(105,66,212,.2);color:#633bc8;background:#eee8ff; }
html[data-theme="light"] .empty-state p { color:#5d687b; }
html[data-theme="light"] .search-mock { border-color:rgba(29,44,70,.13);background:#f7f9fc; }
html[data-theme="light"] .search-mock svg { color:#718096; }
html[data-theme="light"] .filter-pills { border-color:rgba(29,44,70,.11);background:#eef1f6; }
html[data-theme="light"] .filter-pills button { color:#667187; }
html[data-theme="light"] .filter-pills button.active { color:#18243a;background:white;box-shadow:0 2px 8px rgba(36,49,75,.08); }
html[data-theme="light"] .product-card-top em,
html[data-theme="light"] .member-list em { color:#5732bd;background:#eee8ff; }
html[data-theme="light"] .product-card > p,
html[data-theme="light"] .supplier-card > p { color:#633bc8; }
html[data-theme="light"] .product-card > button { border-color:rgba(29,44,70,.13);color:#46536a;background:#f7f9fc; }
html[data-theme="light"] .product-card > button:hover { color:#18243a;background:white; }
html[data-theme="light"] .supplier-logo { color:#5732bd;background:linear-gradient(145deg,rgba(105,66,212,.14),rgba(23,108,168,.06)); }
html[data-theme="light"] .supplier-title span { color:#176a46;background:#e3f4eb; }
html[data-theme="light"] .supplier-card > p { color:#5d687b; }
html[data-theme="light"] .member-list b { color:#718096; }

html[data-theme="light"] .modal-backdrop { background:rgba(45,55,72,.42); }
html[data-theme="light"] .app-modal { border-color:rgba(29,44,70,.14);background:rgba(255,255,255,.97);box-shadow:0 30px 80px rgba(31,42,65,.22); }
html[data-theme="light"] .modal-head,
html[data-theme="light"] .modal-actions,
html[data-theme="light"] .modal-pending { border-color:rgba(29,44,70,.1); }
html[data-theme="light"] .modal-head span,
html[data-theme="light"] .request-note span { color:#633bc8; }
html[data-theme="light"] .modal-head > button { color:#536075;background:#f0f3f7; }
html[data-theme="light"] .modal-head > button:hover { color:#18243a;background:#e7ebf2; }
html[data-theme="light"] .suffix-input b,
html[data-theme="light"] .check-label small { color:#667187; }
html[data-theme="light"] .check-label { border-color:rgba(29,44,70,.14);background:#f7f9fc; }
html[data-theme="light"] .process-summary { border-color:rgba(29,44,70,.11);background:#f7f9fc; }
html[data-theme="light"] .process-summary p,
html[data-theme="light"] .process-summary small { color:#5d687b; }
html[data-theme="light"] .request-note { background:#f2edff; }
html[data-theme="light"] .request-note p,
html[data-theme="light"] .invite-modal-body > p { color:#46536a; }
html[data-theme="light"] .toast { border-color:rgba(29,44,70,.14);background:rgba(255,255,255,.96);box-shadow:0 18px 45px rgba(36,49,75,.18),inset 0 1px 0 white; }
html[data-theme="light"] .toast p { color:#26344b; }

@media (max-width:860px) {
  .onboarding-actions { grid-column:2;grid-row:1; }
}

@media (max-width:600px) {
  .theme-toggle { width:36px;padding:0; }
  .theme-toggle span { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
  .auth-theme-control { top:21px;right:20px; }
  .onboarding-actions { gap:2px; }
  .topbar-actions { gap:7px; }
}

/* Order street */
.workspace-sidebar nav { min-height:0;overflow-y:auto;scrollbar-width:none; }
.workspace-sidebar nav::-webkit-scrollbar { display:none; }
.sidebar-nav-label { margin:15px 10px 4px;color:rgba(255,255,255,.21);font-family:var(--mono);font-size:6px;font-weight:650;letter-spacing:.11em;text-transform:uppercase; }
.order-street { width:min(100%,1400px);margin:0 auto 16px;padding:13px 17px;display:flex;align-items:center;border:1px solid rgba(255,255,255,.06);border-radius:14px;background:rgba(255,255,255,.018); }
.order-street > div { min-width:0;display:flex;align-items:center;gap:9px;color:rgba(255,255,255,.27); }
.order-street > div > span { width:27px;height:27px;display:grid;flex:0 0 auto;place-items:center;border:1px solid rgba(255,255,255,.09);border-radius:9px;font-family:var(--mono);font-size:7px; }
.order-street > div > span svg { width:13px; }
.order-street p { margin:0;display:flex;flex-direction:column;gap:3px; }
.order-street strong { font-size:8px;font-weight:570;white-space:nowrap; }
.order-street small { color:rgba(255,255,255,.2);font-size:6px;white-space:nowrap; }
.order-street > i { min-width:22px;height:1px;margin:0 14px;flex:1;background:rgba(255,255,255,.07); }
.order-street > div.active { color:white; }
.order-street > div.active > span { border-color:rgba(139,92,255,.38);color:#dccfff;background:rgba(139,92,255,.14);box-shadow:0 0 0 5px rgba(139,92,255,.035); }
.order-street > div.done { color:rgba(104,224,160,.72); }
.order-street > div.done > span { border-color:rgba(104,224,160,.18);background:rgba(104,224,160,.08); }

.order-shop-layout { width:min(100%,1400px);margin:auto;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(290px,.62fr);align-items:start;gap:13px; }
.shop-catalog { min-width:0; }
.shop-toolbar { min-height:58px;margin-bottom:10px;padding:0 4px;display:flex;align-items:center;justify-content:space-between;gap:16px; }
.shop-toolbar > div { display:flex;flex-direction:column;gap:4px; }
.shop-toolbar > div span { color:#a889f2;font-family:var(--mono);font-size:6px;letter-spacing:.08em; }
.shop-toolbar > div strong { font-size:14px;font-weight:590; }
.shop-toolbar .search-mock { width:min(310px,50%); }
.shop-product-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px; }
.shop-product-card { padding:16px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px; }
.shop-product-card .product-card-top { display:contents; }
.shop-product-card .product-card-top em { position:absolute;top:14px;right:14px;padding:4px 7px;border-radius:999px;color:#d7c8ff;background:rgba(139,92,255,.1);font-size:6px;font-style:normal; }
.shop-product-card { position:relative; }
.shop-product-copy { min-width:0;padding-right:56px; }
.shop-product-copy h2 { margin:0 0 5px;overflow:hidden;font-size:12px;font-weight:580;letter-spacing:-.025em;text-overflow:ellipsis;white-space:nowrap; }
.shop-product-copy p { margin:0;color:#987adc;font-family:var(--mono);font-size:6px; }
.shop-product-foot { grid-column:1/3;margin-top:2px;padding-top:12px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,.055); }
.shop-product-foot > span { color:rgba(255,255,255,.3);font-size:7px; }
.shop-product-foot button { min-height:32px;padding:0 10px;display:flex;align-items:center;gap:6px;border-radius:9px;color:#dacdff;background:rgba(139,92,255,.12);font-size:7px;font-weight:590; }
.shop-product-foot button:hover { color:white;background:rgba(139,92,255,.2); }
.shop-product-foot svg { width:12px; }
.cart-panel { position:sticky;top:82px;padding:18px; }
.cart-head { padding-bottom:14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.06); }
.cart-head > div { display:flex;align-items:center;gap:10px; }
.cart-head > div > span { width:36px;height:36px;display:grid;place-items:center;border-radius:11px;color:#d9caff;background:rgba(139,92,255,.13); }
.cart-head svg { width:17px; }
.cart-head p { margin:0;display:flex;flex-direction:column;gap:4px; }
.cart-head small { color:#a889f2;font-family:var(--mono);font-size:6px; }
.cart-head strong { font-size:10px;font-weight:580; }
.cart-head > b { min-width:25px;height:25px;padding:0 6px;display:grid;place-items:center;border-radius:8px;color:#0a0b0e;background:var(--green);font-size:8px; }
.cart-items { display:flex;flex-direction:column; }
.cart-line { min-height:68px;padding:10px 0;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:8px;border-bottom:1px solid rgba(255,255,255,.05); }
.cart-line > div:nth-of-type(1) { min-width:0;display:flex;flex-direction:column;gap:4px; }
.cart-line > div > strong { overflow:hidden;font-size:8px;font-weight:560;text-overflow:ellipsis;white-space:nowrap; }
.cart-line > div > small { color:rgba(255,255,255,.27);font-size:6px; }
.quantity-control { height:28px;display:flex;align-items:center;border:1px solid rgba(255,255,255,.07);border-radius:8px;background:rgba(255,255,255,.025); }
.quantity-control button { width:25px;height:100%;color:rgba(255,255,255,.48);background:transparent;font-size:12px; }
.quantity-control b { min-width:20px;font-size:7px;text-align:center; }
.cart-remove { width:24px;height:24px;display:grid;place-items:center;color:rgba(255,255,255,.24);background:transparent; }
.cart-remove:hover { color:#ff9ca7; }
.cart-remove svg { width:12px; }
.cart-order-details { padding-top:14px;display:flex;flex-direction:column;gap:11px; }
.cart-order-details label { display:flex;flex-direction:column;gap:6px; }
.cart-order-details label > span { color:rgba(255,255,255,.38);font-size:7px; }
.cart-order-details input,.cart-order-details textarea { width:100%;padding:0 10px;border:1px solid rgba(255,255,255,.075);border-radius:10px;outline:0;background:rgba(255,255,255,.025);font-size:8px; }
.cart-order-details input { height:40px; }
.cart-order-details textarea { padding-top:10px;resize:vertical; }
.cart-order-details input:focus,.cart-order-details textarea:focus { border-color:rgba(139,92,255,.42); }
.cart-total { margin-top:14px;padding:12px 0;display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,.06);color:rgba(255,255,255,.35);font-size:7px; }
.cart-total strong { color:rgba(255,255,255,.68);font-size:8px;font-weight:560; }
.cart-submit { width:100%;justify-content:center; }
.cart-empty { min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center; }
.cart-empty > span { width:50px;height:50px;display:grid;place-items:center;border:1px dashed rgba(139,92,255,.24);border-radius:16px;color:#a98ef0;background:rgba(139,92,255,.055); }
.cart-empty svg { width:21px; }
.cart-empty h3 { margin:16px 0 7px;font-size:11px;font-weight:580; }
.cart-empty p { max-width:220px;margin:0;color:rgba(255,255,255,.3);font-size:8px;line-height:1.55; }

.processing-grid,.delivery-grid { width:min(100%,1400px);margin:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px; }
.processing-card,.delivery-card { padding:18px; }
.processing-head { display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px; }
.processing-head > div { min-width:0; }
.processing-head small { color:#a889f2;font-family:var(--mono);font-size:6px;text-transform:uppercase; }
.processing-head h2 { margin:4px 0;font-size:14px;font-weight:590;letter-spacing:-.035em; }
.processing-head p { margin:0;color:rgba(255,255,255,.3);font-family:var(--mono);font-size:6px; }
.processing-head > b { padding:7px 9px;border-radius:9px;color:#d9caff;background:rgba(139,92,255,.11);font-size:8px;font-weight:600; }
.processing-summary { margin:15px 0 0;padding:13px 0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.055);border-bottom:1px solid rgba(255,255,255,.055); }
.processing-summary > span { padding:0 10px;display:flex;flex-direction:column;gap:5px;border-right:1px solid rgba(255,255,255,.05); }
.processing-summary > span:first-child { padding-left:0; }
.processing-summary > span:last-child { border-right:0; }
.processing-summary small { color:rgba(255,255,255,.26);font-size:6px; }
.processing-summary strong { font-size:8px;font-weight:560; }
.request-mini-list { max-height:170px;overflow:auto; }
.request-mini-list > div { min-height:54px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;border-bottom:1px solid rgba(255,255,255,.045); }
.request-mini-list .member-avatar { width:29px;height:29px;border-radius:8px;font-size:6px; }
.request-mini-list p { margin:0;display:flex;flex-direction:column;gap:3px; }
.request-mini-list strong { font-size:8px;font-weight:550; }
.request-mini-list small { color:rgba(255,255,255,.27);font-size:6px; }
.request-mini-list > div > b { font-size:7px;font-weight:570; }
.processing-button { width:100%;margin-top:13px;justify-content:center; }
.process-order-lines { max-height:190px;overflow:auto;border-top:1px solid rgba(255,255,255,.06); }
.process-order-lines > div { min-height:50px;padding:8px 2px;display:grid;grid-template-columns:1fr auto;gap:4px 10px;border-bottom:1px solid rgba(255,255,255,.05); }
.process-order-lines span { color:#a98ef0;font-family:var(--mono);font-size:7px; }
.process-order-lines strong { font-size:8px;font-weight:570; }
.process-order-lines small { grid-column:1/3;color:rgba(255,255,255,.3);font-size:7px; }

.delivery-card-head { display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px; }
.delivery-card-head > div { min-width:0; }
.delivery-card-head small { color:#a889f2;font-family:var(--mono);font-size:6px; }
.delivery-card-head h2 { margin:5px 0;font-size:14px;font-weight:590;letter-spacing:-.035em; }
.delivery-card-head p { margin:0;color:rgba(255,255,255,.34);font-size:7px; }
.delivery-details { margin-top:15px;padding:13px 0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.055);border-bottom:1px solid rgba(255,255,255,.055); }
.delivery-details > div { min-width:0;padding:0 9px;display:flex;align-items:center;gap:7px;border-right:1px solid rgba(255,255,255,.05); }
.delivery-details > div:first-child { padding-left:0; }
.delivery-details > div:last-child { border-right:0; }
.delivery-details > div > span { width:29px;height:29px;display:grid;flex:0 0 auto;place-items:center;border-radius:9px;color:#ad91f2;background:rgba(139,92,255,.08); }
.delivery-details svg { width:14px; }
.delivery-details p { min-width:0;margin:0;display:flex;flex-direction:column;gap:4px; }
.delivery-details small { color:rgba(255,255,255,.25);font-size:6px; }
.delivery-details strong { overflow:hidden;font-size:7px;font-weight:550;text-overflow:ellipsis;white-space:nowrap; }
.delivery-actions { padding-top:14px;display:flex;justify-content:flex-end;gap:8px; }
.delivery-actions button { min-height:37px;padding:0 11px;font-size:7px; }
.workflow-empty { width:min(100%,1400px);margin:auto; }
.received-grid .delivery-card { opacity:.91; }
.receive-confirmation { margin-top:20px;padding:14px;display:flex;align-items:center;gap:12px;border:1px solid rgba(255,255,255,.06);border-radius:14px;background:rgba(255,255,255,.025); }
.receive-confirmation h3 { margin:0 0 5px;font-size:13px;font-weight:590; }
.receive-confirmation p { margin:0 0 5px;color:rgba(255,255,255,.45);font-size:8px; }
.receive-confirmation small { color:#a98ef0;font-family:var(--mono);font-size:6px; }
.receive-question { margin:16px 2px 0;color:rgba(255,255,255,.42);font-size:9px;line-height:1.55; }
.receive-question strong { color:rgba(255,255,255,.8); }

html[data-theme="light"] .sidebar-nav-label { color:#98a2b2; }
html[data-theme="light"] .order-street { border-color:rgba(29,44,70,.1);background:rgba(255,255,255,.7); }
html[data-theme="light"] .order-street > div { color:#718096; }
html[data-theme="light"] .order-street > div > span { border-color:rgba(29,44,70,.13); }
html[data-theme="light"] .order-street small { color:#8a94a6; }
html[data-theme="light"] .order-street > i { background:rgba(29,44,70,.11); }
html[data-theme="light"] .order-street > div.active { color:#18243a; }
html[data-theme="light"] .order-street > div.active > span { border-color:rgba(105,66,212,.35);color:#5732bd;background:#eee8ff; }
html[data-theme="light"] .order-street > div.done { color:#176a46; }
html[data-theme="light"] .order-street > div.done > span { border-color:rgba(27,127,82,.18);background:#e3f4eb; }
html[data-theme="light"] .shop-toolbar > div span,.shop-product-copy p,.cart-head small,.processing-head small,.delivery-card-head small,.process-order-lines span,.receive-confirmation small { color:#633bc8; }
html[data-theme="light"] .shop-product-card .product-card-top em { color:#5732bd;background:#eee8ff; }
html[data-theme="light"] .shop-product-foot,.cart-head,.cart-line,.cart-total,.processing-summary,.request-mini-list > div,.process-order-lines,.process-order-lines > div,.delivery-details { border-color:rgba(29,44,70,.09); }
html[data-theme="light"] .shop-product-foot > span,.cart-line > div > small,.processing-head p,.processing-summary small,.request-mini-list small,.process-order-lines small,.delivery-card-head p,.delivery-details small { color:#718096; }
html[data-theme="light"] .shop-product-foot button { color:#5732bd;background:#eee8ff; }
html[data-theme="light"] .shop-product-foot button:hover { color:#4827a7;background:#e4dafd; }
html[data-theme="light"] .cart-head > div > span { color:#5732bd;background:#eee8ff; }
html[data-theme="light"] .cart-head > b { color:white;background:#1b7f52; }
html[data-theme="light"] .quantity-control { border-color:rgba(29,44,70,.12);background:#f4f6fa; }
html[data-theme="light"] .quantity-control button { color:#536075; }
html[data-theme="light"] .cart-remove { color:#8a94a6; }
html[data-theme="light"] .cart-order-details label > span { color:#46536a; }
html[data-theme="light"] .cart-order-details input,html[data-theme="light"] .cart-order-details textarea { border-color:rgba(29,44,70,.14);background:#f8faff; }
html[data-theme="light"] .cart-total { color:#667187; }
html[data-theme="light"] .cart-total strong { color:#344258; }
html[data-theme="light"] .cart-empty > span { border-color:rgba(105,66,212,.24);color:#633bc8;background:#f2edff; }
html[data-theme="light"] .cart-empty p { color:#667187; }
html[data-theme="light"] .processing-head > b { color:#5732bd;background:#eee8ff; }
html[data-theme="light"] .processing-summary > span,.delivery-details > div { border-color:rgba(29,44,70,.09); }
html[data-theme="light"] .delivery-details > div > span { color:#5732bd;background:#eee8ff; }
html[data-theme="light"] .receive-confirmation { border-color:rgba(29,44,70,.11);background:#f7f9fc; }
html[data-theme="light"] .receive-confirmation p,html[data-theme="light"] .receive-question { color:#536075; }
html[data-theme="light"] .receive-question strong { color:#18243a; }

@media (max-width:1100px) {
  .order-shop-layout { grid-template-columns:1fr; }
  .cart-panel { position:static; }
}

@media (max-width:860px) {
  .order-street { overflow-x:auto; }
  .order-street > div { flex:0 0 auto; }
  .order-street > i { min-width:32px;flex:0 0 32px; }
  .processing-grid,.delivery-grid { grid-template-columns:1fr; }
}

@media (max-width:600px) {
  .shop-toolbar { align-items:stretch;flex-direction:column; }
  .shop-toolbar .search-mock { width:100%; }
  .shop-product-grid { grid-template-columns:1fr; }
  .order-street { padding:11px 12px; }
  .order-street small { display:none; }
  .order-street > i { min-width:16px;margin:0 8px;flex-basis:16px; }
  .processing-card,.delivery-card,.cart-panel { padding:14px; }
  .processing-summary,.delivery-details { grid-template-columns:1fr;gap:10px; }
  .processing-summary > span,.delivery-details > div { padding:0!important;border-right:0; }
  .delivery-actions { align-items:stretch;flex-direction:column; }
  .delivery-actions button { width:100%;justify-content:center; }
  .delivery-card-head { grid-template-columns:auto 1fr; }
  .delivery-card-head .status-chip { grid-column:1/3; }
}

/* Premium motion system */
::view-transition-old(root),
::view-transition-new(root) { animation:none;mix-blend-mode:normal; }

html[data-app-transition="view"] .workspace-content,
html[data-app-transition="refresh"] .workspace-content,
html[data-app-transition="cart"] .workspace-content { view-transition-name:workspace-view; }
html[data-app-transition="view"] .workspace-sidebar,
html[data-app-transition="refresh"] .workspace-sidebar,
html[data-app-transition="cart"] .workspace-sidebar { view-transition-name:workspace-sidebar; }
html[data-app-transition="view"] .workspace-topbar,
html[data-app-transition="refresh"] .workspace-topbar,
html[data-app-transition="cart"] .workspace-topbar { view-transition-name:workspace-topbar; }

::view-transition-old(workspace-sidebar),::view-transition-new(workspace-sidebar),
::view-transition-old(workspace-topbar),::view-transition-new(workspace-topbar) { animation:none; }
::view-transition-group(sidebar-glider) { animation-duration:520ms;animation-timing-function:var(--ease-out-quint); }
::view-transition-old(sidebar-glider),::view-transition-new(sidebar-glider) { animation:none;mix-blend-mode:normal; }
html[data-app-transition="view"]::view-transition-old(workspace-view) { animation:workspaceViewOut 170ms cubic-bezier(.55,0,1,.45) both; }
html[data-app-transition="view"]::view-transition-new(workspace-view) { animation:workspaceViewIn 500ms var(--ease-out-quint) both; }
html[data-app-transition="refresh"]::view-transition-old(workspace-view) { animation:workspaceRefreshOut 150ms ease both; }
html[data-app-transition="refresh"]::view-transition-new(workspace-view) { animation:workspaceRefreshIn 380ms var(--ease-out-quint) both; }
html[data-app-transition="cart"]::view-transition-old(workspace-view) { animation:workspaceCartOut 130ms ease both; }
html[data-app-transition="cart"]::view-transition-new(workspace-view) { animation:workspaceCartIn 360ms var(--ease-out-quint) both; }
html[data-app-transition="auth"]::view-transition-old(root) { animation:authPageOut 240ms ease both; }
html[data-app-transition="auth"]::view-transition-new(root),
html[data-app-transition="onboarding"]::view-transition-new(root) { animation:authPageIn 620ms var(--ease-out-quint) both; }
@keyframes workspaceViewOut { to { opacity:0;transform:translate3d(-12px,0,0) scale(.995);filter:blur(4px); } }
@keyframes workspaceViewIn { from { opacity:0;transform:translate3d(20px,0,0) scale(.992);filter:blur(6px); } }
@keyframes workspaceRefreshOut { to { opacity:.22;transform:scale(.996);filter:blur(2px); } }
@keyframes workspaceRefreshIn { from { opacity:.25;transform:translateY(5px) scale(.997);filter:blur(2px); } }
@keyframes workspaceCartOut { to { opacity:.55;transform:scale(.998); } }
@keyframes workspaceCartIn { from { opacity:.55;transform:translateY(3px) scale(.998); } }
@keyframes authPageOut { to { opacity:0;transform:scale(.992);filter:blur(5px); } }
@keyframes authPageIn { from { opacity:0;transform:translateY(12px) scale(.993);filter:blur(7px); } }

.app-motion-ready .auth-story-copy > *,
.app-motion-ready .auth-order-flow,
.app-motion-ready .auth-story-foot,
.app-motion-ready .auth-shell > * { will-change:opacity,transform; }
.app-motion-loaded .auth-story-copy > *,
.app-motion-loaded .auth-order-flow,
.app-motion-loaded .auth-story-foot,
.app-motion-loaded .auth-shell > * { animation:appElementIn 660ms var(--ease-out-quint) both; }
.app-motion-loaded .auth-story-copy > *:nth-child(1) { animation-delay:40ms; }
.app-motion-loaded .auth-story-copy > *:nth-child(2) { animation-delay:100ms; }
.app-motion-loaded .auth-story-copy > *:nth-child(3) { animation-delay:170ms; }
.app-motion-loaded .auth-order-flow { animation-delay:230ms; }
.app-motion-loaded .auth-story-foot { animation-delay:320ms; }
.app-motion-loaded .auth-shell > *:nth-child(1) { animation-delay:70ms; }
.app-motion-loaded .auth-shell > *:nth-child(2) { animation-delay:120ms; }
.app-motion-loaded .auth-shell > *:nth-child(3) { animation-delay:180ms; }
.app-motion-loaded .auth-shell > *:nth-child(4) { animation-delay:240ms; }
.app-motion-loaded .auth-shell > *:nth-child(5) { animation-delay:300ms; }
@keyframes appElementIn { from { opacity:0;transform:translateY(16px); } }

.workspace-shell.is-entering .workspace-sidebar { animation:sidebarEnter 680ms var(--ease-out-quint) both; }
.workspace-shell.is-entering .workspace-topbar { animation:topbarEnter 620ms var(--ease-out-quint) 80ms both; }
.workspace-shell.is-entering .view-heading { animation:viewHeadingEnter 620ms var(--ease-out-quint) 120ms both; }
.workspace-shell.is-entering .metrics-grid > *,
.workspace-shell.is-entering .overview-grid > *,
.workspace-shell.is-entering .order-shop-layout > *,
.workspace-shell.is-entering .processing-grid > *,
.workspace-shell.is-entering .delivery-grid > *,
.workspace-shell.is-entering .catalog-grid > *,
.workspace-shell.is-entering .supplier-grid > *,
.workspace-shell.is-entering .team-layout > * { animation:dashboardCardEnter 640ms var(--ease-out-quint) both; }
.workspace-shell.is-entering .metrics-grid > *:nth-child(1),.workspace-shell.is-entering .overview-grid > *:nth-child(1) { animation-delay:180ms; }
.workspace-shell.is-entering .metrics-grid > *:nth-child(2),.workspace-shell.is-entering .overview-grid > *:nth-child(2) { animation-delay:230ms; }
.workspace-shell.is-entering .metrics-grid > *:nth-child(3) { animation-delay:280ms; }
.workspace-shell.is-entering .metrics-grid > *:nth-child(4) { animation-delay:330ms; }
@keyframes sidebarEnter { from { opacity:0;transform:translateX(-18px); } }
@keyframes topbarEnter { from { opacity:0;transform:translateY(-12px); } }
@keyframes viewHeadingEnter { from { opacity:0;transform:translateY(16px);filter:blur(5px); } }
@keyframes dashboardCardEnter { from { opacity:0;transform:translateY(16px) scale(.99);filter:blur(4px); } }

.app-ambient i { animation:appAmbientDrift 16s ease-in-out infinite alternate; }
.app-ambient i:nth-child(2) { animation-direction:alternate-reverse;animation-duration:20s; }
@keyframes appAmbientDrift { to { transform:translate3d(2.5vw,-1.5vh,0) scale(1.05); } }

.dashboard-card,.metrics-grid article,.workspace-switcher,.order-street,.search-mock,.input-shell,.modal-form input,.modal-form select,.modal-form textarea,.cart-order-details input,.cart-order-details textarea { transition:border-color var(--motion-base) ease,background var(--motion-base) ease,box-shadow var(--motion-base) var(--ease-out-quint),transform var(--motion-base) var(--ease-out-quint); }
.dashboard-card,.metrics-grid article { position:relative; }
.dashboard-card::after,.metrics-grid article::after {
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  opacity:0;
  pointer-events:none;
  content:"";
  background:radial-gradient(320px circle at var(--glow-x,50%) var(--glow-y,0%),rgba(173,138,255,.09),transparent 48%);
  transition:opacity var(--motion-base) ease;
}
.primary-button,.secondary-button,.quiet-button,.row-action,.quantity-control button,.shop-product-foot button,.theme-toggle,.workspace-sidebar nav button,.quick-actions button,.product-card > button,.card-head button,.delivery-actions button { transition:color var(--motion-fast) ease,background var(--motion-fast) ease,border-color var(--motion-fast) ease,box-shadow var(--motion-base) var(--ease-out-quint),transform var(--motion-base) var(--ease-out-quint),opacity var(--motion-fast) ease; }
.primary-button svg,.secondary-button svg,.row-action svg,.shop-product-foot button svg,.product-card > button svg,.card-head button svg,.quick-actions button > svg { transition:transform var(--motion-base) var(--ease-out-quint); }
.primary-button:hover svg,.secondary-button:hover svg,.row-action:hover svg,.product-card > button:hover svg,.card-head button:hover svg,.quick-actions button:hover > svg { transform:translateX(3px); }
.primary-button:active,.secondary-button:active,.quiet-button:active,.row-action:active,.quantity-control button:active,.shop-product-foot button:active,.theme-toggle:active { transform:scale(.965);transition-duration:90ms; }

.workspace-sidebar nav button svg { transition:transform var(--motion-base) var(--ease-spring),color var(--motion-fast) ease; }
.workspace-sidebar nav button:hover svg { transform:translateX(2px) scale(1.04); }
.workspace-sidebar nav button.active svg { transform:scale(1.08); }
.workspace-sidebar nav button.active::after { position:absolute;right:10px;width:4px;height:4px;border-radius:50%;content:"";background:var(--violet-bright);box-shadow:0 0 9px rgba(173,138,255,.8); }
.workspace-sidebar nav button { position:relative; }

.status-violet i,.status-blue i,.status-amber i { animation:statusBreath 2.2s ease-in-out infinite; }
@keyframes statusBreath { 50% { opacity:.55;box-shadow:0 0 0 5px transparent,0 0 10px currentColor; } }
.order-street > i { position:relative;overflow:hidden; }
.order-street > div.active + i::after { position:absolute;inset:0;content:"";background:linear-gradient(90deg,transparent,var(--violet-bright),transparent);transform:translateX(-100%);animation:orderRoute 1.8s var(--ease-out-cubic) infinite; }
@keyframes orderRoute { 70%,100% { transform:translateX(100%); } }

.input-shell:focus-within,.search-mock:focus-within,.modal-form input:focus,.modal-form select:focus,.modal-form textarea:focus,.cart-order-details input:focus,.cart-order-details textarea:focus { box-shadow:0 0 0 4px rgba(139,92,255,.07),0 12px 28px rgba(0,0,0,.12);transform:translateY(-1px); }
.input-shell:focus-within svg,.search-mock:focus-within svg { color:var(--violet-bright);transform:scale(1.06); }
.input-shell svg,.search-mock svg { transition:color var(--motion-fast) ease,transform var(--motion-base) var(--ease-spring); }

.cart-flight { position:fixed;z-index:200;width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.24);border-radius:11px;color:white;background:linear-gradient(145deg,#b191ff,#6d3be0);box-shadow:0 12px 28px rgba(104,55,213,.45);font-size:7px;font-weight:720;pointer-events:none; }
.shop-product-card { transition:opacity 220ms ease,filter 220ms ease,transform 360ms var(--ease-out-quint),border-color var(--motion-base) ease,box-shadow var(--motion-base) var(--ease-out-quint); }
.shop-product-card.is-filtered { opacity:0;filter:blur(3px);transform:scale(.965)!important;pointer-events:none; }
.cart-head > b { transition:transform var(--motion-base) var(--ease-spring),box-shadow var(--motion-base) ease; }
.cart-line { animation:cartLineIn 420ms var(--ease-out-quint) both; }
.cart-line:nth-child(2) { animation-delay:35ms; }.cart-line:nth-child(3) { animation-delay:70ms; }.cart-line:nth-child(4) { animation-delay:105ms; }
@keyframes cartLineIn { from { opacity:0;transform:translateX(10px); } }

.modal-backdrop { animation:modalBackdropIn 260ms ease both; }
.app-modal { animation:modalEnter 460ms var(--ease-spring) both;transform-origin:50% 50%; }
#modal-root.is-closing .modal-backdrop { animation:modalBackdropOut 240ms ease both; }
#modal-root.is-closing .app-modal { animation:modalExit 240ms cubic-bezier(.55,0,1,.45) both;pointer-events:none; }
@keyframes modalBackdropIn { from { opacity:0;backdrop-filter:blur(0); } }
@keyframes modalBackdropOut { to { opacity:0;backdrop-filter:blur(0); } }
@keyframes modalEnter { from { opacity:0;transform:translate(-50%,-46%) scale(.95);filter:blur(7px); } }
@keyframes modalExit { to { opacity:0;transform:translate(-50%,-48%) scale(.965);filter:blur(4px); } }
.modal-head,.modal-form > *,.receive-confirmation,.receive-question,.invite-modal-body > * { animation:modalContentIn 480ms var(--ease-out-quint) both; }
.modal-form > *:nth-child(1),.receive-confirmation { animation-delay:80ms; }.modal-form > *:nth-child(2),.receive-question { animation-delay:120ms; }.modal-form > *:nth-child(3) { animation-delay:160ms; }.modal-form > *:nth-child(4) { animation-delay:200ms; }.modal-form > *:nth-child(5) { animation-delay:240ms; }
@keyframes modalContentIn { from { opacity:0;transform:translateY(8px); } }

.toast { overflow:hidden;transform:translate3d(18px,12px,0) scale(.96);transition:opacity 300ms ease,transform 460ms var(--ease-spring),filter 300ms ease; }
.toast.is-visible { opacity:1;transform:translate3d(0,0,0) scale(1); }
.toast.is-leaving { opacity:0;transform:translate3d(18px,4px,0) scale(.98);filter:blur(3px); }
.toast-progress { position:absolute;right:0;bottom:0;left:0;height:2px;background:linear-gradient(90deg,var(--green),var(--blue));transform:scaleX(1);transform-origin:left; }
.toast-error .toast-progress { background:linear-gradient(90deg,var(--red),var(--amber)); }
.toast.is-visible .toast-progress { animation:toastProgress 3.6s linear both; }
@keyframes toastProgress { to { transform:scaleX(0); } }

button.is-busy { position:relative;color:transparent!important;pointer-events:none; }
button.is-busy svg { opacity:0; }
button.is-busy::after { position:absolute;top:50%;left:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border:2px solid rgba(255,255,255,.32);border-top-color:white;border-radius:50%;content:"";animation:buttonSpin .75s linear infinite; }
@keyframes buttonSpin { to { transform:rotate(360deg); } }

.sidebar-scrim { display:none; }

@media (hover:hover) and (pointer:fine) {
  .dashboard-card:hover,.metrics-grid article:hover { border-color:rgba(173,138,255,.16);box-shadow:0 24px 58px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.06);transform:translateY(-3px); }
  .dashboard-card:hover::after,.metrics-grid article:hover::after { opacity:1; }
  .data-row { transition:background var(--motion-fast) ease,transform var(--motion-base) var(--ease-out-quint); }
  .data-row:hover { background:rgba(255,255,255,.018);transform:translateX(3px); }
  html[data-theme="light"] .data-row:hover { background:rgba(105,66,212,.025); }
}

@media (max-width:860px) {
  .workspace-sidebar { transition:transform 460ms var(--ease-out-quint),box-shadow 460ms ease; }
  .workspace-shell.sidebar-open .workspace-sidebar { transform:translateX(0); }
  .sidebar-scrim { position:fixed;z-index:29;inset:0;display:block;visibility:hidden;opacity:0;background:rgba(2,3,8,.48);backdrop-filter:blur(0);transition:opacity 300ms ease,backdrop-filter 400ms ease,visibility 0s linear 400ms; }
  .workspace-shell.sidebar-open .sidebar-scrim { visibility:visible;opacity:1;backdrop-filter:blur(5px);transition-delay:0s; }
}

@media (prefers-reduced-motion:reduce) {
  .app-motion-ready .auth-story-copy > *,
  .app-motion-ready .auth-order-flow,
  .app-motion-ready .auth-story-foot,
  .app-motion-ready .auth-shell > * { opacity:1;transform:none; }
  .app-ambient i,.status-chip i,.order-street > div.active + i::after,.toast-progress { animation:none!important; }
  .workspace-shell.is-entering * { animation:none!important; }
  .dashboard-card:hover,.metrics-grid article:hover,.data-row:hover { transform:none!important; }
  .sidebar-glider { transition:none!important; }
}

/* Readability scale: larger operational UI for daily workspace use. */
.boot-screen > span:last-child,.fatal-code,.card-kicker { font-size:10px; }
.fatal-card { width:min(100%,620px);padding:52px; }
.fatal-card p { font-size:15px; }

.eyebrow { font-size:11px; }
.auth-order-flow { width:min(100%,720px);padding:24px; }
.flow-head { font-size:10px; }
.flow-order-card { padding:17px;gap:15px; }
.flow-product { width:50px;height:50px;font-size:11px; }
.flow-order-card small { font-size:10px; }
.flow-order-card strong { font-size:15px; }
.flow-order-card p { font-size:11px; }
.flow-order-card > b { padding:7px 10px;font-size:10px; }
.flow-stages > div { grid-template-columns:32px 1fr;column-gap:10px; }
.flow-stages i { width:32px;height:32px; }
.flow-stages strong { font-size:11px; }
.flow-stages small { font-size:9px; }
.flow-status-note { padding:14px; }
.flow-status-note small { font-size:10px; }
.flow-status-note strong { font-size:12px; }
.flow-status-note > b { font-size:9px; }
.auth-story-foot { font-size:11px; }
.auth-back { font-size:13px; }
.auth-shell { width:min(100%,480px); }
.auth-heading > span { font-size:10px; }
.auth-heading p { font-size:15px; }
.auth-tabs button { min-height:46px;font-size:13px; }
.auth-form label > span,.stack-form label > span,.modal-form label > span,.invite-form label > span,.invite-result label > span { font-size:12px; }
.input-shell,.select-shell,.modal-form input,.modal-form select,.modal-form textarea,.suffix-input { min-height:56px; }
.input-shell input { height:54px;font-size:14px; }
.auth-submit,.primary-button,.secondary-button { min-height:52px;padding:0 20px;font-size:13px; }
.auth-assurance { font-size:10px; }
.form-message { padding:13px 15px;font-size:12px; }
.workspace-url-input { min-height:56px;display:flex;align-items:center;overflow:hidden;border:1px solid rgba(255,255,255,.085);border-radius:13px;background:rgba(255,255,255,.032);transition:border-color .18s ease,background .18s ease,box-shadow .18s ease; }
.workspace-url-input:focus-within { border-color:rgba(158,121,255,.5);background:rgba(139,92,255,.04);box-shadow:0 0 0 4px rgba(139,92,255,.07); }
.workspace-url-input > span { height:54px;padding:0 0 0 15px;display:flex;align-items:center;color:rgba(255,255,255,.42);font-family:var(--mono);font-size:12px;white-space:nowrap; }
.workspace-url-input input { min-width:0;height:54px;padding:0 15px 0 2px;flex:1;border:0;outline:0;color:inherit;background:transparent;font-family:var(--mono);font-size:12px; }
.workspace-url-input input::placeholder { color:rgba(255,255,255,.18); }
.workspace-url-feedback { min-height:18px;display:flex;align-items:center;gap:7px;color:rgba(255,255,255,.34);font-size:10px;line-height:1.45; }
.workspace-url-feedback::before { width:6px;height:6px;flex:0 0 auto;border-radius:50%;content:"";background:currentColor;box-shadow:0 0 8px currentColor;opacity:.72; }
.workspace-url-feedback[data-status="checking"] { color:#b89fff; }
.workspace-url-feedback[data-status="available"] { color:#8de6b5; }
.workspace-url-feedback[data-status="invalid"],.workspace-url-feedback[data-status="unavailable"] { color:#ff9da7; }
html[data-theme="light"] .workspace-url-input { border-color:rgba(29,44,70,.14);background:#f8faff; }
html[data-theme="light"] .workspace-url-input:focus-within { border-color:rgba(105,66,212,.45);background:white; }
html[data-theme="light"] .workspace-url-input > span { color:#667187; }
html[data-theme="light"] .workspace-url-input input { color:#18243a; }
html[data-theme="light"] .workspace-url-input input::placeholder { color:#9aa4b4; }
html[data-theme="light"] .workspace-url-feedback { color:#718096; }
html[data-theme="light"] .workspace-url-feedback[data-status="checking"] { color:#633bc8; }
html[data-theme="light"] .workspace-url-feedback[data-status="available"] { color:#176a46; }
html[data-theme="light"] .workspace-url-feedback[data-status="invalid"],html[data-theme="light"] .workspace-url-feedback[data-status="unavailable"] { color:#b42335; }

.onboarding-steps > div { font-size:9px; }
.onboarding-steps i { width:31px;height:31px; }
.quiet-button { min-height:44px;padding:0 15px;font-size:12px; }
.workspace-preview { padding:23px; }
.preview-top small { font-size:10px; }
.preview-top strong { font-size:13px; }
.preview-top em { font-size:9px; }
.preview-modules span { min-height:50px;font-size:10px; }
.preview-workspace-url { margin-top:3px;color:#a98ef0;font-family:var(--mono);font-size:10px;letter-spacing:-.015em; }
html[data-theme="light"] .preview-workspace-url { color:#633bc8; }
.onboarding-card { padding:46px; }
.onboarding-card > p,.invite-card > p { font-size:14px; }
.form-footnote { font-size:10px; }
.invite-heading p { font-size:15px; }
.invite-card,.invite-list-card { padding:36px; }
.select-shell select,.invite-form select { height:54px;font-size:13px; }
.invite-form .secondary-button { height:56px; }
.invite-result { padding:20px; }
.invite-result strong { font-size:13px; }
.invite-result small { font-size:10px; }
.invite-result input { height:44px;font-size:10px; }
.invite-result label button { padding:0 13px;font-size:10px; }
.invite-result > a { font-size:11px; }
.invite-list-head small { font-size:10px; }
.invite-list-head strong { font-size:18px; }
.pending-list > div,.member-list > div { min-height:78px;padding:14px 4px; }
.member-avatar,.topbar-avatar { width:42px;height:42px;font-size:11px; }
.pending-list strong,.member-list strong { font-size:12px; }
.pending-list small,.member-list small { font-size:10px; }
.pending-list em { font-size:9px; }
.small-empty { font-size:12px; }

.workspace-shell { grid-template-columns:274px 1fr; }
.workspace-sidebar { width:274px;padding:22px 17px 16px; }
.sidebar-wordmark { padding:0 9px 22px; }
.sidebar-wordmark .cangix-mark { width:38px;height:38px;font-size:13px; }
.workspace-switcher { margin-top:17px;padding:13px;gap:11px;border-radius:14px; }
.workspace-switcher > span { width:39px;height:39px;font-size:11px; }
.workspace-switcher small { font-size:9px; }
.workspace-switcher strong { font-size:12px; }
.workspace-sidebar nav { margin-top:25px;gap:4px; }
.workspace-sidebar nav button { min-height:49px;padding:0 13px;grid-template-columns:21px 1fr auto;gap:11px;border-radius:12px;font-size:12px; }
.workspace-sidebar nav svg { width:18px; }
.workspace-sidebar nav b { min-width:25px;padding:4px 7px;font-size:9px; }
.sidebar-glider { border-radius:12px; }
.sidebar-nav-label { margin:18px 12px 6px;font-size:9px; }
.sidebar-flow { padding:15px;border-radius:14px; }
.sidebar-flow > div { font-size:10px; }
.sidebar-flow p { margin-top:9px;font-size:10px; }
.sidebar-user { margin-top:13px;padding:14px 5px 3px;gap:10px; }
.sidebar-user .member-avatar { width:39px;height:39px;font-size:10px; }
.sidebar-user strong { font-size:11px; }
.sidebar-user small { font-size:9px; }
.sidebar-user button { width:42px;height:42px;display:grid;place-items:center; }

.workspace-topbar { height:76px;padding:0 34px; }
.workspace-topbar > div:first-of-type { gap:10px;font-size:11px; }
.icon-button { width:42px;height:42px; }
.topbar-avatar { width:42px;height:42px; }
.theme-toggle { min-height:42px;padding:0 14px;font-size:11px; }
.workspace-content { min-height:calc(100vh - 76px);padding:43px clamp(28px,3.4vw,58px) 72px; }
.view-heading { margin-bottom:36px;gap:36px; }
.view-heading > div > span { font-size:10px; }
.view-heading h1 { margin:12px 0 9px;font-size:42px; }
.view-heading p { font-size:14px;line-height:1.55; }
.view-heading .primary-button { min-height:48px;font-size:12px; }

.metrics-grid,.overview-grid,.processing-grid,.delivery-grid,.catalog-grid,.supplier-grid,.team-layout { gap:16px; }
.metrics-grid article { min-height:182px;padding:23px;column-gap:15px;border-radius:20px; }
.metric-icon { width:45px;height:45px;border-radius:13px; }
.metric-icon svg { width:20px; }
.metrics-grid small { font-size:11px; }
.metrics-grid strong { margin-top:7px;font-size:37px; }
.metrics-grid p { margin-top:10px;font-size:10px; }
.metrics-grid em { font-size:9px; }
.overview-grid { margin-top:16px; }
.dashboard-card { border-radius:21px; }
.order-overview-card,.quick-card,.full-card,.team-card,.invitation-card { padding:25px; }
.card-head { padding-bottom:19px; }
.card-head span { font-size:9px; }
.card-head h2 { font-size:20px; }
.card-head button { min-height:38px;padding:0 6px;font-size:10px; }
.card-head svg { width:16px; }
.data-row { min-height:82px;padding:12px 5px;gap:15px; }
.item-visual,.data-row .item-visual { width:48px;height:48px;font-size:10px; }
.item-visual.large { width:60px;height:60px;font-size:12px; }
.row-main strong { font-size:12px; }
.data-row small { font-size:10px; }
.row-project span,.row-date span { font-size:11px; }
.status-chip { padding:7px 10px;gap:6px;font-size:10px; }
.row-action { width:38px;height:38px; }
.row-action svg { width:16px; }
.quick-actions button { min-height:78px;padding:10px 7px;gap:13px; }
.quick-actions button > span { width:43px;height:43px; }
.quick-actions button > span svg { width:18px; }
.quick-actions strong { font-size:12px; }
.quick-actions small { font-size:10px; }
.empty-state { min-height:330px; }
.empty-state h3 { font-size:20px; }
.empty-state p { max-width:390px;font-size:12px; }
.empty-state .secondary-button { min-height:46px;font-size:11px; }

.table-toolbar { padding-bottom:20px; }
.search-mock { width:min(100%,410px);height:47px;padding:0 14px; }
.search-mock input { height:45px;font-size:12px; }
.filter-pills button { min-height:38px;padding:0 13px;font-size:10px; }
.catalog-grid,.supplier-grid { gap:16px; }
.product-card,.supplier-card { padding:24px; }
.product-card-top em { padding:7px 10px;font-size:9px; }
.product-card h2,.supplier-card h2 { margin-top:24px;font-size:19px; }
.product-card > p,.supplier-card > p { font-size:10px; }
.product-card dl,.supplier-card dl { margin-top:24px;padding-top:19px;gap:17px; }
.product-card dt,.supplier-card dt { font-size:9px; }
.product-card dd,.supplier-card dd { font-size:12px; }
.product-card > button { min-height:45px;margin-top:21px;padding:0 13px;font-size:11px; }
.supplier-logo { width:58px;height:58px;font-size:13px; }
.supplier-title span { padding:7px 10px;font-size:9px; }
.member-list > div { min-height:82px; }
.member-list em { padding:7px 10px;font-size:10px; }
.member-list b { font-size:9px; }

.order-street { margin-bottom:21px;padding:17px 21px;border-radius:17px; }
.order-street > div { gap:11px; }
.order-street > div > span { width:35px;height:35px;font-size:10px; }
.order-street > div > span svg { width:16px; }
.order-street strong { font-size:11px; }
.order-street small { font-size:9px; }
.shop-toolbar { min-height:68px;margin-bottom:13px; }
.shop-toolbar > div span { font-size:9px; }
.shop-toolbar > div strong { font-size:19px; }
.shop-product-grid { gap:14px; }
.shop-product-card { padding:21px;gap:15px; }
.shop-product-card .product-card-top em { top:18px;right:18px;font-size:9px; }
.shop-product-copy { padding-right:68px; }
.shop-product-copy h2 { font-size:16px; }
.shop-product-copy p { font-size:10px; }
.shop-product-foot { padding-top:16px; }
.shop-product-foot > span { font-size:10px; }
.shop-product-foot button { min-height:42px;padding:0 13px;font-size:10px; }
.cart-panel { top:92px;padding:24px; }
.cart-head { padding-bottom:18px; }
.cart-head > div > span { width:44px;height:44px; }
.cart-head small { font-size:9px; }
.cart-head strong { font-size:14px; }
.cart-head > b { min-width:31px;height:31px;font-size:11px; }
.cart-line { min-height:82px;padding:13px 0;gap:10px; }
.cart-line > div > strong { font-size:11px; }
.cart-line > div > small { font-size:9px; }
.quantity-control { height:36px; }
.quantity-control button { width:31px;font-size:15px; }
.quantity-control b { min-width:25px;font-size:10px; }
.cart-remove { width:34px;height:34px; }
.cart-order-details { padding-top:18px;gap:14px; }
.cart-order-details label > span { font-size:10px; }
.cart-order-details input,.cart-order-details textarea { padding-right:13px;padding-left:13px;font-size:11px; }
.cart-order-details input { height:48px; }
.cart-total { margin-top:18px;padding:16px 0;font-size:10px; }
.cart-total strong { font-size:12px; }
.cart-empty h3 { font-size:16px; }
.cart-empty p { max-width:260px;font-size:11px; }

.processing-card,.delivery-card { padding:24px; }
.processing-head,.delivery-card-head { gap:15px; }
.processing-head small,.delivery-card-head small { font-size:9px; }
.processing-head h2,.delivery-card-head h2 { font-size:19px; }
.processing-head p,.delivery-card-head p { font-size:10px; }
.processing-head > b { padding:8px 11px;font-size:11px; }
.processing-summary { margin-top:19px;padding:17px 0; }
.processing-summary small { font-size:9px; }
.processing-summary strong { font-size:11px; }
.request-mini-list { max-height:220px; }
.request-mini-list > div { min-height:67px;gap:11px; }
.request-mini-list .member-avatar { width:36px;height:36px;font-size:9px; }
.request-mini-list strong { font-size:11px; }
.request-mini-list small { font-size:9px; }
.request-mini-list > div > b { font-size:10px; }
.processing-button { margin-top:17px; }
.process-order-lines { max-height:240px; }
.process-order-lines > div { min-height:63px;padding:11px 3px; }
.process-order-lines span,.process-order-lines strong,.process-order-lines small { font-size:10px; }
.delivery-details { margin-top:19px;padding:17px 0; }
.delivery-details > div { gap:9px; }
.delivery-details > div > span { width:37px;height:37px; }
.delivery-details small { font-size:9px; }
.delivery-details strong { font-size:10px; }
.delivery-actions { padding-top:18px;gap:10px; }
.delivery-actions button { min-height:45px;padding:0 14px;font-size:10px; }
.receive-confirmation { padding:18px; }
.receive-confirmation h3 { font-size:17px; }
.receive-confirmation p { font-size:11px; }
.receive-confirmation small { font-size:9px; }
.receive-question { font-size:12px; }

.app-modal { width:min(calc(100% - 32px),680px);padding:31px; }
.app-modal.wide { width:min(calc(100% - 32px),790px); }
.modal-head { padding-bottom:22px; }
.modal-head span { font-size:10px; }
.modal-head h2 { font-size:30px; }
.modal-head > button { width:42px;height:42px; }
.modal-form { margin-top:25px;gap:20px; }
.modal-form input,.modal-form select,.modal-form textarea { padding-right:15px;padding-left:15px;font-size:12px; }
.modal-form input,.modal-form select { height:54px; }
.suffix-input b { font-size:11px; }
.check-label { min-height:58px;padding:0 15px; }
.check-label strong { font-size:12px; }
.check-label small { font-size:10px; }
.modal-actions { padding-top:22px; }
.modal-actions .primary-button { min-height:48px;font-size:12px; }
.process-summary { padding:17px;gap:15px; }
.process-summary strong { font-size:14px; }
.process-summary p { font-size:11px; }
.process-summary small { font-size:10px; }
.request-note { padding:16px; }
.request-note span { font-size:10px; }
.request-note p { font-size:12px; }
.invite-modal-body > p { font-size:12px; }
.toast { min-width:320px;padding:14px; }
.toast p { font-size:12px; }

@media (max-width:860px) {
  .workspace-shell { grid-template-columns:1fr; }
  .workspace-sidebar { width:min(86vw,300px); }
  .workspace-main { grid-column:1; }
  .workspace-topbar { padding:0 22px; }
}

@media (max-width:600px) {
  .fatal-card { padding:30px 24px; }
  .onboarding-card,.invite-card,.invite-list-card { padding:27px; }
  .workspace-content { min-height:calc(100vh - 64px);padding:29px 16px 52px; }
  .workspace-topbar { height:64px;padding:0 16px; }
  .theme-toggle { width:42px;padding:0; }
  .mobile-menu { width:42px;height:42px;place-items:center; }
  .view-heading { margin-bottom:28px; }
  .view-heading h1 { font-size:35px; }
  .view-heading p { font-size:13px; }
  .metrics-grid article { min-height:158px;padding:20px; }
  .order-overview-card,.quick-card,.full-card,.team-card,.invitation-card { padding:19px; }
  .card-head h2 { font-size:18px; }
  .data-row { min-height:76px;gap:10px; }
  .data-row .item-visual { width:43px;height:43px; }
  .row-main strong { font-size:11px; }
  .status-chip { font-size:9px; }
  .product-card,.supplier-card,.processing-card,.delivery-card,.cart-panel { padding:19px; }
  .app-modal { padding:23px; }
  .modal-head h2 { font-size:25px; }
  .toast { min-width:0; }
}

/* Private receipt proof */
.receipt-uploader { margin-top:20px;padding:18px;border:1px solid rgba(139,92,255,.18);border-radius:18px;background:linear-gradient(145deg,rgba(139,92,255,.055),rgba(74,168,255,.018)); }
.receipt-uploader-heading { display:flex;align-items:flex-start;justify-content:space-between;gap:18px; }
.receipt-uploader-heading > div { display:flex;flex-direction:column;gap:5px; }
.receipt-uploader-heading span { color:#a889ec;font-family:var(--mono);font-size:9px;letter-spacing:.08em; }
.receipt-uploader-heading strong { color:rgba(255,255,255,.85);font-size:14px;font-weight:590; }
.receipt-uploader-heading > small { color:rgba(255,255,255,.32);font-size:10px;white-space:nowrap; }
.receipt-dropzone { min-height:104px;margin-top:15px;padding:18px;display:flex!important;align-items:center;justify-content:center;gap:14px;border:1px dashed rgba(168,137,236,.4);border-radius:15px;background:rgba(7,7,11,.25);cursor:pointer;transition:border-color .2s ease,background .2s ease,transform .2s ease; }
.receipt-dropzone:hover,.receipt-dropzone.is-dragging { border-color:#a889ec;background:rgba(139,92,255,.095);transform:translateY(-1px); }
.receipt-dropzone:focus-within { outline:2px solid rgba(168,137,236,.75);outline-offset:3px; }
.receipt-dropzone input { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap; }
.receipt-dropzone > span { width:46px;height:46px;display:grid;flex:0 0 auto;place-items:center;border-radius:14px;color:#c7b2ff;background:rgba(139,92,255,.14); }
.receipt-dropzone svg { width:21px; }
.receipt-dropzone > div { display:flex;flex-direction:column;gap:5px; }
.receipt-dropzone strong { color:rgba(255,255,255,.78);font-size:12px;font-weight:570; }
.receipt-dropzone small { color:rgba(255,255,255,.34);font-size:10px; }
.receipt-previews { margin-top:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px; }
.receipt-preview-empty { grid-column:1/-1;margin:2px 0;color:rgba(255,255,255,.3);font-size:10px; }
.receipt-preview { min-width:0;padding:8px;display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:rgba(255,255,255,.025); }
.receipt-preview img { width:48px;height:48px;display:block;border-radius:9px;object-fit:cover;background:rgba(255,255,255,.04); }
.receipt-preview > div { min-width:0;display:flex;flex-direction:column;gap:4px; }
.receipt-preview strong { overflow:hidden;color:rgba(255,255,255,.7);font-size:10px;font-weight:550;text-overflow:ellipsis;white-space:nowrap; }
.receipt-preview small { color:rgba(255,255,255,.3);font-size:9px; }
.receipt-preview button { width:30px;height:30px;display:grid;place-items:center;border-radius:9px;color:rgba(255,255,255,.38);background:rgba(255,255,255,.045); }
.receipt-preview button:hover { color:white;background:rgba(255,99,115,.12); }
.receipt-preview button:focus-visible,.receipt-photo-strip button:focus-visible { outline:2px solid #a889ec;outline-offset:2px; }
.receipt-preview button svg { width:13px; }
.receipt-upload-status { margin:11px 0 0;color:rgba(255,255,255,.34);font-size:10px;line-height:1.45; }

.receipt-proof { margin-top:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,.06); }
.receipt-proof-head { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.receipt-proof-title { display:flex;align-items:center;gap:10px; }
.receipt-proof-title > span { width:39px;height:39px;display:grid;flex:0 0 auto;place-items:center;border:1px solid rgba(104,224,160,.16);border-radius:12px;color:#8ee5b5;background:rgba(104,224,160,.07); }
.receipt-proof-title svg { width:18px; }
.receipt-proof-title > div { display:flex;flex-direction:column;gap:4px; }
.receipt-proof-title small { color:#8ee5b5;font-family:var(--mono);font-size:8px;letter-spacing:.08em; }
.receipt-proof-title strong { color:rgba(255,255,255,.78);font-size:11px;font-weight:570; }
.receipt-proof-head > em { padding:7px 9px;display:flex;align-items:center;gap:6px;border:1px solid rgba(104,224,160,.14);border-radius:999px;color:#8ee5b5;background:rgba(104,224,160,.06);font-size:8px;font-style:normal;font-weight:620;letter-spacing:.02em; }
.receipt-proof-head > em svg { width:12px; }
.receipt-photo-strip { margin-top:12px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px; }
.receipt-photo-strip button,.receipt-photo-unavailable { min-width:0;aspect-ratio:1.3/1;display:grid;place-items:center;overflow:hidden;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:rgba(255,255,255,.03); }
.receipt-photo-strip button { padding:0;cursor:zoom-in; }
.receipt-photo-strip button:hover img { transform:scale(1.055);filter:saturate(1.08); }
.receipt-photo-strip img { width:100%;height:100%;display:block;object-fit:cover;transition:transform .28s ease,filter .28s ease; }
.receipt-photo-unavailable { color:rgba(255,255,255,.25); }
.receipt-photo-unavailable svg { width:18px; }
.receipt-proof > p { margin:10px 0 0;color:rgba(255,255,255,.32);font-size:9px; }
.receipt-proof > p strong { color:rgba(255,255,255,.56);font-weight:570; }
.receipt-proof-empty { display:flex;align-items:center;justify-content:space-between;gap:15px; }
.receipt-proof-empty > p { margin:0;text-align:right; }

.receipt-lightbox { margin-top:20px; }
.receipt-lightbox > img { width:100%;max-height:min(62vh,620px);display:block;border:1px solid rgba(255,255,255,.08);border-radius:17px;object-fit:contain;background:#08090e; }
.receipt-lightbox > div { margin-top:13px;padding:13px 3px 0;display:flex;align-items:center;justify-content:space-between;gap:18px; }
.receipt-lightbox > div > span { display:flex;align-items:center;gap:7px;color:#8ee5b5;font-size:10px;font-weight:620;white-space:nowrap; }
.receipt-lightbox > div > span svg { width:15px; }
.receipt-lightbox p { min-width:0;margin:0;display:flex;align-items:flex-end;flex-direction:column;gap:5px;text-align:right; }
.receipt-lightbox p strong { max-width:320px;overflow:hidden;color:rgba(255,255,255,.72);font-size:11px;font-weight:570;text-overflow:ellipsis;white-space:nowrap; }
.receipt-lightbox p small { color:rgba(255,255,255,.32);font-size:9px; }

html[data-theme="light"] .receipt-uploader { border-color:rgba(105,66,212,.16);background:linear-gradient(145deg,#f7f3ff,#f8fbff); }
html[data-theme="light"] .receipt-uploader-heading span { color:#633bc8; }
html[data-theme="light"] .receipt-uploader-heading strong,html[data-theme="light"] .receipt-dropzone strong { color:#26344b; }
html[data-theme="light"] .receipt-uploader-heading > small,html[data-theme="light"] .receipt-dropzone small,html[data-theme="light"] .receipt-upload-status,html[data-theme="light"] .receipt-preview-empty { color:#718096; }
html[data-theme="light"] .receipt-dropzone { border-color:rgba(105,66,212,.34);background:rgba(255,255,255,.66); }
html[data-theme="light"] .receipt-dropzone:hover,html[data-theme="light"] .receipt-dropzone.is-dragging { border-color:#633bc8;background:#f2edff; }
html[data-theme="light"] .receipt-preview { border-color:rgba(29,44,70,.1);background:rgba(255,255,255,.72); }
html[data-theme="light"] .receipt-preview strong { color:#344258; }
html[data-theme="light"] .receipt-preview small { color:#718096; }
html[data-theme="light"] .receipt-preview button { color:#718096;background:#eef1f6; }
html[data-theme="light"] .receipt-proof { border-color:rgba(29,44,70,.09); }
html[data-theme="light"] .receipt-proof-title > span { border-color:rgba(27,127,82,.15);color:#1b7f52;background:#e3f4eb; }
html[data-theme="light"] .receipt-proof-title small,html[data-theme="light"] .receipt-proof-head > em { color:#1b7f52; }
html[data-theme="light"] .receipt-proof-title strong { color:#344258; }
html[data-theme="light"] .receipt-proof-head > em { border-color:rgba(27,127,82,.15);background:#e3f4eb; }
html[data-theme="light"] .receipt-photo-strip button,html[data-theme="light"] .receipt-photo-unavailable { border-color:rgba(29,44,70,.11);background:#f2f4f8; }
html[data-theme="light"] .receipt-proof > p { color:#718096; }
html[data-theme="light"] .receipt-proof > p strong { color:#344258; }
html[data-theme="light"] .receipt-lightbox > img { border-color:rgba(29,44,70,.12);background:#edf0f5; }
html[data-theme="light"] .receipt-lightbox > div > span { color:#1b7f52; }
html[data-theme="light"] .receipt-lightbox p strong { color:#344258; }
html[data-theme="light"] .receipt-lightbox p small { color:#718096; }

@media (max-width:600px) {
  .receipt-uploader { padding:14px; }
  .receipt-uploader-heading { align-items:flex-start;flex-direction:column;gap:6px; }
  .receipt-dropzone { min-height:118px;align-items:center;flex-direction:column;text-align:center; }
  .receipt-previews { grid-template-columns:1fr; }
  .receipt-photo-strip { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .receipt-proof-empty,.receipt-lightbox > div { align-items:flex-start;flex-direction:column; }
  .receipt-proof-empty > p,.receipt-lightbox p { text-align:left; }
  .receipt-lightbox p { align-items:flex-start; }
}