:root {
  --ink: #262626;
  --muted: #6b7280;
  --line: #dfe2e6;
  --surface: #ffffff;
  --canvas: #f4f4f4;
  --orange: #fd3702;
  --orange-soft: #fd7645;
  --orange-dark: #d82e00;
  --brand-background: #262626;
  --green: #12805c;
  --amber: #a85d05;
  --red: #b42318;
}

* { box-sizing: border-box; }
html { font-family: Inter, Arial, Helvetica, sans-serif; color: var(--ink); background: var(--canvas); letter-spacing: 0; }
body { margin: 0; min-width: 320px; font-size: 16px; }
button, input, select, textarea { font: inherit; letter-spacing: 0; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
svg { width: 19px; height: 19px; flex: 0 0 auto; }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 248px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; background: var(--brand-background); color: #fff; z-index: 40; }
.brand { height: 76px; padding: 0 18px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid rgba(255,255,255,.12); }
.brand-logo { display: block; width: 184px; height: 58px; object-fit: contain; object-position: left center; }
.user-block strong, .user-block small { display: block; }
.user-block small { margin-top: 2px; color: #bdbdbd; font-size: 12px; }
.brand .icon-button { margin-left: auto; }
nav { display: grid; gap: 4px; padding: 18px 14px; }
.nav-link { min-height: 44px; display: flex; align-items: center; gap: 12px; padding: 0 12px; border-left: 2px solid transparent; color: #c8c8c8; font-size: 14px; font-weight: 650; }
.nav-link:hover { background: rgba(255,255,255,.06); color: #fff; }
.nav-link.active { border-left-color: var(--orange); background: rgba(253,55,2,.14); color: #fff; }
.beta { margin-left: auto; color: var(--orange-soft); font-size: 10px; }
.user-block { margin: auto 14px 16px; display: flex; align-items: center; gap: 11px; padding: 12px; background: rgba(255,255,255,.05); font-size: 13px; }
.user-block form { margin-left: auto; }
.avatar { width: 36px; height: 36px; display: grid; place-items: center; background: var(--orange); color: var(--brand-background); font-weight: 850; }
.workspace { min-width: 0; }
.topbar { position: sticky; top: 0; z-index: 25; height: 76px; display: flex; align-items: center; gap: 12px; padding: 0 28px; border-bottom: 1px solid #3a3a3a; background: rgba(38,38,38,.98); color: #fff; backdrop-filter: blur(12px); }
.global-search { position: relative; flex: 1; max-width: 480px; }
.global-search svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: #adadad; }
.global-search input { width: 100%; height: 40px; padding: 0 14px 0 40px; border: 1px solid #4d4d4d; border-radius: 4px; background: #303030; color: #fff; outline: none; }
.global-search input::placeholder { color: #b7b7b7; }
.global-search input:focus { border-color: var(--orange-soft); box-shadow: 0 0 0 3px rgba(253,55,2,.22); }
.system-state { margin-left: auto; display: inline-flex; align-items: center; gap: 7px; padding: 6px 9px; border: 1px solid #b8e0d1; background: #edf9f4; color: #146b50; font-size: 12px; font-weight: 700; }
.system-state > span { width: 7px; height: 7px; border-radius: 50%; background: #15956c; }
.icon-button { width: 36px; height: 36px; display: grid; place-items: center; border: 0; background: transparent; color: inherit; cursor: pointer; }
.icon-button:hover { background: rgba(255,255,255,.08); }
.topbar .icon-button { color: #fff; }
.topbar .icon-button:hover { background: rgba(255,255,255,.1); }
.brand-card .icon-button.dark:hover { background: #eceef0; }
.main-content { padding: 30px 36px 42px; }
.page-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.page-heading p { margin: 0 0 5px; color: var(--orange-dark); font-size: 14px; font-weight: 750; }
.page-heading h1 { margin: 0; font-size: clamp(25px, 3vw, 34px); line-height: 1.15; letter-spacing: 0; }
.lead { display: block; max-width: 680px; margin-top: 8px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.actions { display: flex; gap: 9px; }
.button { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 15px; border: 1px solid transparent; border-radius: 4px; cursor: pointer; font-size: 14px; font-weight: 750; }
.button.primary { background: var(--orange); color: var(--brand-background); }
.button.primary:hover { background: var(--orange-soft); color: var(--brand-background); }
.button.secondary { border-color: #cfd3d8; background: #fff; color: var(--ink); }
.button.secondary:hover { background: #f7f7f7; }
.button.compact { min-height: 32px; padding: 0 10px; font-size: 12px; }
.button.large { width: 100%; min-height: 48px; }
.text-link { display: inline-flex; align-items: center; gap: 6px; color: var(--orange-dark); font-size: 13px; font-weight: 750; }
.text-link svg { width: 15px; }
.metrics { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; margin-top: 22px; }
.metric { min-height: 150px; padding: 18px; border: 1px solid var(--line); background: #fff; }
.metric > div { display: flex; justify-content: space-between; color: var(--muted); font-size: 14px; }
.metric svg { color: var(--orange); }
.metric strong { display: block; margin-top: 28px; font-size: 29px; line-height: 1; }
.metric small { display: block; margin-top: 7px; color: var(--muted); font-size: 13px; }
.overview-grid { display: grid; grid-template-columns: minmax(0,1.7fr) minmax(290px,.8fr); gap: 16px; margin-top: 16px; }
.overview-grid > * { min-width: 0; }
.panel { border: 1px solid var(--line); background: #fff; }
.table-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 20px; border-bottom: 1px solid var(--line); }
.table-panel h2, .health-panel h2, .brand-card h2, .control-grid h2 { margin: 0; font-size: 16px; }
.table-panel header p, .health-panel header p { margin: 4px 0 0; color: var(--muted); font-size: 13px; }
.counter { display: inline-flex; align-items: center; padding: 5px 8px; background: #fff0eb; color: #bd2a00; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.table-scroll { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th { height: 44px; padding: 0 14px; border-bottom: 1px solid var(--line); background: #fafafa; text-align: left; white-space: nowrap; color: #555b65; font-weight: 700; }
td { min-height: 52px; padding: 13px 14px; border-bottom: 1px solid #eceef0; white-space: nowrap; }
tbody tr:hover { background: #fafafa; }
tbody tr:last-child td { border-bottom: 0; }
.mono { color: #68707c; font: 12px ui-monospace, SFMono-Regular, Menlo, monospace; }
.block { display: block; margin-top: 4px; }
.muted { color: var(--muted); }
.status { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border: 1px solid; border-radius: 3px; font-size: 12px; font-weight: 750; white-space: nowrap; }
.status.success { border-color: #b8e0d1; background: #edf9f4; color: #146b50; }
.status.warning { border-color: #f0d39a; background: #fff8e7; color: #815006; }
.status.danger { border-color: #f2b8b5; background: #fff0ef; color: #9d2017; }
.status.info { border-color: #b9d8ee; background: #eff8fe; color: #1d648e; }
.nav-count { min-width: 20px; height: 20px; display: grid; place-items: center; margin-left: auto; padding: 0 5px; background: var(--orange); color: #fff; font-size: 10px; }
.filter-strip { min-height: 48px; display: flex; align-items: center; gap: 24px; margin: 20px 0 12px; padding: 0 16px; border: 1px solid var(--line); background: #fff; color: var(--muted); font-size: 13px; }
.filter-strip strong { color: var(--ink); }
.progress-inline { width: 88px; height: 5px; display: inline-block; margin-right: 7px; vertical-align: middle; background: #eceef0; }
.progress-inline span { display: block; height: 100%; background: var(--orange); }
.table-action { border: 1px solid var(--line); color: var(--ink); }
.table-action:hover { background: #f4f4f4; }
.health-panel { padding: 20px; background: var(--brand-background); color: #fff; }
.health-panel header { display: flex; justify-content: space-between; }
.health-panel header p { color: #a1a1aa; }
.health-panel header svg { color: var(--orange-soft); }
.health-row { margin-top: 27px; }
.health-row > div:first-child { display: flex; justify-content: space-between; margin-bottom: 9px; font-size: 13px; }
.health-row span { color: #d4d4d8; }
.track { height: 6px; background: rgba(255,255,255,.1); }
.track span { display: block; height: 100%; }
.track .green { background: #2bb989; }.track .amber { background: #e6a23a; }.track .red { background: #db5247; }
.health-panel footer { display: grid; gap: 4px; margin-top: 30px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.1); }
.health-panel footer small { color: #71717a; text-transform: uppercase; }
.mini-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 22px 0 16px; }
.mini-metrics article { display: flex; align-items: center; gap: 13px; min-height: 82px; padding: 15px; border: 1px solid var(--line); background: #fff; }
.mini-metrics article > svg { width: 38px; height: 38px; padding: 9px; background: #fff0eb; color: var(--orange); }
.mini-metrics strong, .mini-metrics span { display: block; }
.mini-metrics strong { font-size: 22px; }
.mini-metrics span { margin-top: 2px; color: var(--muted); font-size: 13px; }
.empty-state { min-height: 440px; display: grid; place-items: center; align-content: center; margin-top: 22px; padding: 30px; border: 1px dashed #bfc4ca; background: #fff; text-align: center; }
.feature-icon { width: 56px; height: 56px; display: grid; place-items: center; margin-bottom: 17px; background: var(--brand-background); color: var(--orange-soft); }
.feature-icon svg { width: 25px; height: 25px; }
.empty-state h2 { margin: 13px 0 0; font-size: 25px; }
.empty-state p { max-width: 520px; margin: 12px 0 22px; color: var(--muted); line-height: 1.65; }
.brand-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; margin-top: 22px; }
.brand-card { padding: 19px; border: 1px solid var(--line); background: #fff; }
.brand-card > div { display: flex; align-items: start; justify-content: space-between; }
.brand-monogram { width: 44px; height: 44px; display: grid; place-items: center; background: #eef0f2; font-weight: 850; }
.brand-card h2 { margin-top: 25px; font-size: 18px; }
.brand-card p { min-height: 40px; margin: 6px 0 0; color: var(--muted); font-size: 14px; }
.brand-card footer { display: flex; align-items: center; justify-content: space-between; margin-top: 20px; padding-top: 14px; border-top: 1px solid #eceef0; font-size: 13px; }
.brand-card dl { display: grid; gap: 10px; margin: 16px 0 0; }
.brand-card dl div { display: grid; gap: 3px; }
.brand-card dt { color: var(--muted); font-size: 11px; text-transform: uppercase; }
.brand-card dd { margin: 0; font-size: 13px; font-weight: 700; }
.tender-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-top: 22px; }
.tender-card { border: 1px solid var(--line); background: #fff; }
.tender-card header { padding: 20px; }
.tender-card header > div, .tender-card footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.tender-card h2 { margin: 18px 0 0; font-size: 19px; }
.tender-card p { min-height: 44px; margin: 7px 0 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.tender-card dl { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.tender-card dl div { padding: 13px; border-right: 1px solid var(--line); }
.tender-card dl div:last-child { border-right: 0; }
.tender-card dt { color: var(--muted); font-size: 10px; text-transform: uppercase; }
.tender-card dd { margin: 5px 0 0; font-size: 13px; font-weight: 750; }
.tender-card footer { padding: 13px 20px; color: var(--muted); font-size: 12px; }
.tender-card footer strong { color: var(--ink); }
.section-gap { margin-top: 16px; }
.approval-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1px; margin-top: 22px; border: 1px solid var(--line); background: var(--line); }
.approval-grid article { min-height: 240px; padding: 20px; background: #fff; }
.approval-grid header { display: flex; align-items: center; justify-content: space-between; color: var(--orange-dark); font-size: 13px; font-weight: 750; }
.approval-grid header strong { width: 28px; height: 28px; display: grid; place-items: center; background: var(--brand-background); color: var(--orange-soft); }
.approval-grid h2 { margin: 30px 0 0; font-size: 17px; line-height: 1.4; }
.approval-grid p { margin: 9px 0 0; color: var(--muted); font-size: 14px; }
.approval-grid footer { margin-top: 30px; padding-top: 14px; border-top: 1px solid #eceef0; color: var(--muted); font-size: 12px; }
.control-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 15px; }
.control-grid article { display: flex; gap: 13px; padding: 19px; border: 1px solid var(--line); background: #fff; }
.control-grid svg { color: var(--orange); }
.control-grid p { margin: 5px 0 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.demo-banner, .toast { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; padding: 11px 13px; border: 1px solid; font-size: 13px; }
.demo-banner { border-color: #b9d8ee; background: #eff8fe; color: #1d648e; }
.success-toast { border-color: #b8e0d1; background: #edf9f4; color: #146b50; }
.error-toast { border-color: #f2b8b5; background: #fff0ef; color: #9d2017; }
dialog { width: min(610px, calc(100% - 28px)); max-height: calc(100vh - 28px); padding: 0; border: 1px solid var(--line); border-radius: 6px; background: #fff; box-shadow: 0 24px 80px rgba(0,0,0,.25); }
dialog::backdrop { background: rgba(10,10,12,.62); }
.dialog-form > header { display: flex; align-items: start; justify-content: space-between; gap: 16px; padding: 22px; border-bottom: 1px solid var(--line); }
.dialog-form h2 { margin: 0; font-size: 21px; }
.dialog-form header p { margin: 6px 0 0; color: var(--muted); font-size: 13px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; padding: 22px; }
.form-grid label { display: grid; gap: 7px; color: #3f454d; font-size: 13px; font-weight: 750; }
.form-grid .full { grid-column: 1 / -1; }
.form-grid input, .form-grid select, .form-grid textarea { width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid #cfd3d8; border-radius: 4px; background: #fff; outline: none; resize: vertical; }
.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(253,55,2,.16); }
.form-grid input[type=file] { padding: 7px 9px; }
.form-grid label small { color: var(--muted); font-weight: 400; }
.dialog-form > footer { display: flex; justify-content: end; padding: 16px 22px; border-top: 1px solid var(--line); background: #fafafa; }
.snackbar { position: fixed; right: 22px; bottom: 22px; z-index: 80; max-width: min(380px, calc(100% - 44px)); padding: 13px 16px; border-left: 3px solid var(--orange); border-radius: 4px; background: var(--brand-background); color: #fff; font-size: 14px; opacity: 0; transform: translateY(12px); pointer-events: none; transition: .2s ease; }
.snackbar.show { opacity: 1; transform: translateY(0); }
.mobile-only { display: none; }
.registration-link { margin-top: 18px; color: #fd7645; font-size: 13px; text-align: center; }
.registration-page { max-width: 920px; margin: auto; padding: 24px; }
.registration-header { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 20px; background: #262626; color: white; }
.registration-header img { width: 220px; max-width: 65%; }
.admin-section { margin-top: 28px; }
.admin-section h2 { font-size: 19px; }
.admin-form { border-top: 1px solid var(--line); background: #fff; }
.admin-form > p { padding: 18px; }
.admin-form > footer { display: flex; justify-content: end; padding: 16px 22px; border-top: 1px solid var(--line); }
.narrow-form { max-width: 600px; }
.inline-form { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0; }
.inline-form input, .inline-form select, .rules-table input, .rules-table select, .filter-strip select { min-height: 38px; padding: 6px 8px; border: 1px solid #bfc4ca; border-radius: 4px; background: #fff; max-width: 100%; }
.rules-table input { width: 140px; }
.rules-table select { width: 190px; }
.form-grid .checkbox-field { display: flex; align-items: center; gap: 10px; }
.checkbox-field input { width: 20px; min-height: 20px; }
.supplier-summary { display: grid; grid-template-columns: repeat(auto-fit,minmax(200px,1fr)); gap: 18px; padding: 20px 0; }
.supplier-summary dt { color: var(--muted); font-size: 12px; }
.supplier-summary dd { margin: 5px 0; overflow-wrap: anywhere; }
.history-entry { padding: 15px 0; border-bottom: 1px solid var(--line); }
.history-entry span { display: block; margin-top: 5px; color: var(--muted); font-size: 12px; }
.history-entry p { margin-bottom: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.sidebar nav { overflow-y: auto; min-height: 0; }

.report-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-top: 22px; }
.report-panel { min-height: 280px; padding: 20px; border: 1px solid var(--line); background: #fff; }
.report-panel > header { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 22px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.report-panel h2 { margin: 0; font-size: 17px; }
.report-panel header span { color: var(--muted); font-size: 13px; }
.bar-row { margin-top: 16px; }
.bar-row > div:first-child, .report-line { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 13px; }
.bar-row > div:last-child { height: 7px; margin-top: 7px; background: #eceef0; }
.bar-row > div:last-child span { display: block; height: 100%; background: var(--orange); }
.report-line { min-height: 43px; border-bottom: 1px solid #eceef0; }
.report-line > span { display: flex; align-items: center; gap: 8px; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: #89909a; }
.status-dot.paid, .status-dot.ready-for-payment { background: var(--green); }
.status-dot.query, .status-dot.rejected { background: var(--red); }
.status-dot.awaiting-approval, .status-dot.awaiting-validation { background: #d58a1f; }

.auth-body { min-width: 320px; min-height: 100vh; margin: 0; overflow-x: hidden; background: #0b0c0f; color: #f7f7f8; font-family: Inter, Arial, Helvetica, sans-serif; }
.auth-mesh { position: fixed; inset: 0; z-index: 0; width: 100%; height: 100%; pointer-events: none; }
.auth-page { position: relative; z-index: 1; width: min(100%, 1680px); min-height: 100svh; display: grid; grid-template-rows: auto 1fr auto; margin: 0 auto; padding: 0 56px; }
.auth-topbar { min-height: 116px; display: flex; align-items: center; justify-content: space-between; gap: 28px; border-bottom: 1px solid rgba(255,255,255,.1); }
.auth-logo { width: 275px; height: 83.6px; object-fit: contain; object-position: left center; }
.auth-motion-toggle { width: 32px; height: 32px; flex: none; display: grid; place-items: center; padding: 0; border: 1px solid #555; border-radius: 4px; background: #262626; color: #fd7645; cursor: pointer; }
.auth-motion-toggle[hidden] { display: none; }
.auth-motion-toggle:hover { color: #fff; border-color: #fd7645; }
.auth-motion-toggle:focus-visible { outline: 2px solid #fd7645; outline-offset: 3px; }
.auth-statuses { display: flex; align-items: center; gap: 22px; color: #adb0b7; font-size: 11px; font-weight: 700; text-transform: uppercase; }
.auth-system-state, .auth-phase { min-height: 28px; display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.auth-system-state > span, .auth-gateway > span { width: 7px; height: 7px; border-radius: 50%; background: #2ecb81; box-shadow: 0 0 12px rgba(46,203,129,.75); }
.auth-phase { padding: 0 11px; border: 1px solid rgba(253,118,69,.38); border-radius: 3px; color: #fd9a77; }
.auth-content { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(390px,.75fr); align-items: center; gap: 84px; padding: 70px 0; }
.auth-copy { align-self: center; max-width: 740px; }
.auth-eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 24px; color: #fd7645; font-size: 12px; font-weight: 800; text-transform: uppercase; }
.auth-eyebrow > span { width: 30px; height: 2px; background: #fd3702; }
.auth-copy h1 { max-width: 720px; margin: 0; font-size: 60px; line-height: 1.08; letter-spacing: 0; }
.auth-intro { max-width: 620px; margin: 27px 0 0; color: #aeb1b8; font-size: 17px; line-height: 1.75; }
.auth-login-card { position: relative; width: 100%; max-width: 460px; justify-self: end; padding: 31px 34px 34px; border: 1px solid rgba(255,255,255,.12); border-top: 2px solid #fd3702; border-radius: 8px; background: rgba(18,19,23,.94); box-shadow: 0 30px 80px rgba(0,0,0,.42), 0 -8px 30px rgba(253,55,2,.1); }
.auth-card-meta { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 29px; color: #777b84; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.auth-card-meta span { display: inline-flex; align-items: center; gap: 7px; }
.auth-card-meta span:first-child { color: #fd7645; }
.auth-card-meta svg { width: 14px; height: 14px; }
.auth-login-card > header h2 { margin: 0; font-size: 25px; line-height: 1.25; }
.auth-login-card > header p { margin: 9px 0 0; color: #8f939c; font-size: 13px; line-height: 1.6; }
.auth-form { display: grid; margin-top: 25px; }
.auth-form > label, .auth-password-label label { margin-bottom: 8px; color: #c9cbd0; font-size: 12px; font-weight: 700; }
.auth-password-label { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; }
.auth-password-label button { padding: 0; border: 0; background: transparent; color: #fd7645; cursor: pointer; font: inherit; font-size: 11px; font-weight: 700; }
.auth-password-label button:hover { color: #fff; }
.auth-field { position: relative; }
.auth-field > svg { position: absolute; top: 50%; left: 14px; width: 17px; height: 17px; color: #6f737c; transform: translateY(-50%); pointer-events: none; }
.auth-field input { width: 100%; height: 48px; padding: 0 45px; border: 1px solid #34363d; border-radius: 5px; outline: 0; background: #0e0f12; color: #fff; font: inherit; font-size: 13px; }
.auth-field input::placeholder { color: #5e626b; }
.auth-field input:focus { border-color: #fd3702; box-shadow: 0 0 0 3px rgba(253,55,2,.13); }
.auth-password-toggle { position: absolute; top: 50%; right: 7px; width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 4px; background: transparent; color: #747880; cursor: pointer; transform: translateY(-50%); }
.auth-password-toggle:hover { background: #24262c; color: #fff; }
.auth-password-toggle svg { width: 17px; height: 17px; }
.auth-submit { width: 100%; min-height: 49px; display: flex; align-items: center; justify-content: space-between; margin-top: 24px; padding: 0 18px; border: 1px solid #fd3702; border-radius: 5px; background: #fd3702; color: #fff; cursor: pointer; font: inherit; font-size: 13px; font-weight: 800; }
.auth-submit:hover { border-color: #fd7645; background: #fd7645; color: #171719; }
.auth-submit:focus-visible, .auth-password-toggle:focus-visible, .auth-password-label button:focus-visible { outline: 2px solid #fd7645; outline-offset: 3px; }
.auth-submit svg { width: 17px; height: 17px; }
.auth-error { display: flex; align-items: flex-start; gap: 9px; margin-bottom: 18px; padding: 11px 12px; border: 1px solid rgba(253,118,69,.45); border-radius: 4px; background: rgba(253,55,2,.1); color: #ffc2ad; font-size: 12px; line-height: 1.5; }
.auth-error svg { width: 16px; height: 16px; flex: none; margin-top: 1px; }
.auth-footer { min-height: 88px; display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 28px; border-top: 1px solid rgba(255,255,255,.1); color: #70747c; font-size: 10px; text-transform: uppercase; }
.auth-footer > div { display: flex; align-items: center; gap: 22px; }
.auth-footer > div span + span { padding-left: 22px; border-left: 1px solid rgba(255,255,255,.1); }
.auth-gateway { display: flex; align-items: center; gap: 8px; color: #9ca0a8; font-weight: 700; }
.auth-footer small { color: #5e6269; font-size: 10px; }

@media (max-width: 1050px) {
  .metrics, .approval-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .overview-grid { grid-template-columns: 1fr; }
  .tender-grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .app-shell { display: block; }
  .sidebar { position: fixed; inset: 0 auto 0 0; width: min(290px, 88vw); transform: translateX(-105%); transition: transform .2s ease; box-shadow: 20px 0 60px rgba(0,0,0,.3); }
  .sidebar.open { transform: translateX(0); }
  .mobile-only { display: grid; }
  .topbar { height: 66px; padding: 0 14px; }
  .global-search { display: none; }
  .system-state { margin-left: auto; font-size: 0; }
  .main-content { padding: 22px 16px 34px; }
  .page-heading { align-items: start; flex-direction: column; }
  .actions { width: 100%; }
  .actions .button { flex: 1; }
  .metrics, .mini-metrics, .brand-grid, .approval-grid, .control-grid, .report-grid { grid-template-columns: 1fr; }
  .metric { min-height: 130px; }
  .form-grid { grid-template-columns: 1fr; padding: 18px; }
  .form-grid .full { grid-column: auto; }
  .dialog-form > header { padding: 18px; }
  .dialog-form > footer { padding: 14px 18px; }
  .filter-strip { align-items: start; flex-direction: column; gap: 7px; padding: 12px; }
  .auth-page { padding: 0 26px; }
  .auth-topbar { min-height: 92px; }
  .auth-logo { width: 231px; }
  .auth-statuses { gap: 12px; }
  .auth-system-state { display: none; }
  .auth-content { grid-template-columns: 1fr; gap: 46px; padding: 54px 0; }
  .auth-copy { max-width: 640px; }
  .auth-copy h1 { font-size: 48px; }
  .auth-login-card { max-width: 540px; justify-self: start; }
  .auth-footer { grid-template-columns: 1fr auto; }
  .auth-footer > div span:not(:first-child) { display: none; }
  .auth-footer small { display: none; }
}

@media (max-width: 460px) {
  .actions { flex-direction: column; }
  .page-heading > .button, .actions .button { width: 100%; }
  .metrics { grid-template-columns: 1fr; }
  .auth-page { padding: 0 18px; }
  .auth-topbar { min-height: 78px; }
  .auth-topbar { flex-wrap: wrap; gap: 8px 12px; padding: 10px 0; }
  .auth-statuses { margin-left: auto; }
  .auth-logo { width: 195.8px; max-width: 50%; height: 66px; flex-shrink: 0; }
  .auth-phase { min-height: 25px; max-width: 132px; padding: 4px 7px; white-space: normal; font-size: 8px; line-height: 1.3; text-align: center; }
  .auth-content { gap: 34px; padding: 42px 0; }
  .auth-eyebrow { margin-bottom: 18px; font-size: 10px; }
  .auth-copy h1 { font-size: 38px; }
  .auth-intro { margin-top: 20px; font-size: 14px; line-height: 1.65; }
  .auth-login-card { padding: 25px 20px 22px; }
  .auth-card-meta { margin-bottom: 23px; }
  .auth-login-card > header h2 { font-size: 22px; }
  .auth-footer { min-height: 78px; grid-template-columns: 1fr; gap: 8px; padding: 16px 0; }
  .auth-gateway { justify-self: start; }
}

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

@media print {
  .sidebar, .topbar, .demo-banner, .page-heading .button { display: none !important; }
  .app-shell { display: block; }
  .main-content { padding: 0; }
  .report-panel { break-inside: avoid; }
}