:root {
  color-scheme: dark;
  --ink: #edf2fc;
  --muted: #9aa8bf;
  --accent: #7ba6ff;
  --primary: #326be5;
  --paper: #0c1018;
  --surface: #131a26;
  --surface-raised: #192232;
  --line: #273246;
  --red: #ff9b9f;
  --sidebar-width: 244px;
}
* { box-sizing: border-box; }
html { min-width: 320px; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 14px/1.6 "Segoe UI Variable", "Segoe UI", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea, summary { touch-action: manipulation; }
button { cursor: pointer; }
button:disabled { opacity: .55; cursor: wait; }
:focus-visible { outline: 2px solid #95b7ff; outline-offset: 4px; }
::selection { background: #355ba9; color: white; }
h1, h2, h3, p { margin-top: 0; }
h1 { font-size: clamp(28px, 2.7vw, 36px); line-height: 1.25; letter-spacing: -1.2px; margin-bottom: 10px; font-weight: 650; }
h2 { font-size: 20px; letter-spacing: -.45px; line-height: 1.4; margin-bottom: 7px; font-weight: 600; }
h3 { font-size: 16px; line-height: 1.5; font-weight: 600; }
small { color: var(--muted); font-size: 12px; }
.icon { width: 20px; height: 20px; display: inline-block; flex: 0 0 auto; vertical-align: middle; }
.accent-text, .brand-period { color: var(--accent); }
.muted { color: var(--muted); }
.skip-link { position: fixed; top: -100px; left: 20px; z-index: 100; background: var(--primary); padding: 12px 20px; color: white; border-radius: 8px; }
.skip-link:focus { top: 15px; }
.sidebar { position: fixed; inset: 0 auto 0 0; width: var(--sidebar-width); background: #10151f; border-right: 1px solid #222c3d; padding: 30px 16px 18px; display: flex; flex-direction: column; z-index: 20; }
.brand { display: flex; gap: 12px; align-items: center; color: #a8b5cc; font-size: 11px; line-height: 1.4; padding: 0 12px; }
.brand:hover { text-decoration: none; }
.brand strong { display: block; color: #f4f7ff; font-size: 23px; font-weight: 650; letter-spacing: -.7px; }
.brand-icon { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 13px; background: #1c325d; color: #89b1ff; border: 1px solid #33558b; }
.brand-icon .icon { width: 28px; height: 28px; }
.nav-caption { font-size: 10px; font-weight: 600; letter-spacing: 1.9px; color: #7d8da8; margin: 43px 16px 16px; }
.sidebar nav { display: grid; gap: 6px; }
.sidebar nav a { display: flex; gap: 13px; align-items: center; color: #9eacc3; padding: 12px 15px; border: 1px solid transparent; border-radius: 9px; font-size: 13px; min-height: 46px; transition: background .18s, color .18s; }
.sidebar nav a:hover { background: #192231; color: #e4ecfc; text-decoration: none; }
.sidebar nav a.active { background: #1b2d4e; color: #a8c7ff; border-color: #2c4674; font-weight: 600; }
.sidebar nav a.active .icon { color: #83acff; }
.sidebar-bottom { margin-top: auto; padding-top: 30px; }
.privacy-note { display: flex; gap: 10px; padding: 16px 12px; border: 1px solid #273247; border-radius: 10px; background: #141e2d; margin-bottom: 20px; }
.privacy-note > .icon { width: 17px; margin-top: 3px; color: #7ca9f9; }
.privacy-note strong { font-size: 11px; font-weight: 550; color: #c2d1e8; display: block; }
.privacy-note small { display: block; font-size: 10px; color: #8b9ab4; margin-top: 3px; }
.account { display: flex; align-items: center; gap: 11px; border-top: 1px solid var(--line); padding: 19px 8px 12px; color: var(--ink); }
.account:hover { text-decoration: none; }
.account strong { display: block; font-size: 12px; font-weight: 550; overflow-wrap: anywhere; }
.account small { display: block; font-size: 10px; margin-top: 2px; }
.account > .icon { width: 14px; color: #8191ac; margin-left: auto; }
.avatar, .mini-avatar { display: inline-grid; place-items: center; border-radius: 12px; border: 1px solid #3b527e; background: #23365b; color: #b3cfff; width: 36px; height: 36px; font-weight: 600; flex: 0 0 auto; }
.logout-button { display: flex; gap: 10px; align-items: center; color: #9aa8bf !important; font-size: 11px !important; padding: 6px 10px !important; }
.logout-button .icon { width: 15px; height: 15px; }
.workspace { margin-left: var(--sidebar-width); min-height: 100vh; display: flex; flex-direction: column; }
.topbar { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 40px; border-bottom: 1px solid #202a3b; background: #0f141e; }
.topbar-path, .topbar-account { display: flex; gap: 16px; align-items: center; font-size: 12px; }
.topbar-path { color: #8b99b2; }
.topbar-path .icon { width: 12px; height: 12px; color: #596c8a; }
.topbar-path strong { color: #d1ddf0; font-weight: 500; }
.topbar-account { gap: 24px; }
.private-label { display: inline-flex; gap: 7px; align-items: center; font-size: 11px; color: #9aaac1; }
.status-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #6b9cff; flex: 0 0 auto; }
.private-label .status-dot { background: #67d8b0; }
.mini-avatar { width: 33px; height: 33px; font-size: 11px; border-radius: 10px; }
.mobile-logout { display: none; }
main { width: 100%; max-width: 1480px; margin: 0 auto; padding: 39px 40px 54px; flex: 1; }
main:focus { outline: none; }
.page-heading { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-bottom: 30px; }
.page-heading p, .section-heading p { color: var(--muted); margin-bottom: 0; font-size: 13px; }
.eyebrow { display: block; font-size: 10px; font-weight: 600; letter-spacing: 1.8px; color: #8b9bb8; margin-bottom: 12px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; background: var(--primary); color: #fff; border: 1px solid #477fee; border-radius: 9px; padding: 11px 17px; font-size: 12px; font-weight: 600; white-space: nowrap; min-height: 44px; box-shadow: 0 3px 8px #0002; transition: background .18s, border-color .18s; }
.button .icon { width: 17px; height: 17px; }
.button:hover { background: #417cf4; border-color: #7aa4ff; color: white; text-decoration: none; }
.button.secondary { background: #1a2434; border-color: #34425b; color: #d0def6; box-shadow: none; }
.button.secondary:hover { background: #24334a; border-color: #56719b; }
.button.small { padding: 7px 14px; min-height: 35px; font-size: 11px; }
.text-button { padding: 0; background: none; border: 0; color: var(--accent); font-size: 12px; }
.text-button:hover { text-decoration: underline; }
.section-line { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.filter-panel, .panel { background: var(--surface); border: 1px solid var(--line); border-radius: 13px; padding: 25px; }
.filter-panel { padding: 20px 23px 23px; margin-bottom: 22px; }
.filter-panel .section-line { margin-bottom: 20px; }
.filter-title { display: flex; align-items: center; gap: 9px; font-size: 12px; color: #ccd8ed; }
.filter-title .icon { width: 17px; color: #86a7dd; }
.filter-title strong { font-weight: 550; }
.filter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.field label { color: #c3cfe3; font-size: 12px; font-weight: 500; }
.field input, .field select, .field textarea, .auth-card input, .auth-card select, .auth-card textarea { width: 100%; min-height: 44px; border: 1px solid #344159; border-radius: 8px; padding: 10px 12px; background: #0e1521; color: var(--ink); transition: border-color .18s, box-shadow .18s; }
.field input::placeholder { color: #7c8ca6; }
.field select { padding-right: 12px; }
.field input:disabled { background: #192334; color: #a9b9d3; opacity: 1; }
.field input[type=checkbox] { width: 18px; min-height: 18px; accent-color: #6395fa; }
.field input[type=file] { font-size: 12px; padding: 8px; }
.field input::file-selector-button { border: 1px solid #425577; border-radius: 5px; background: #223452; color: #d6e5ff; padding: 5px 9px; margin-right: 10px; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: #709ff9; outline: none; box-shadow: 0 0 0 3px #326be52b; }
.field small { font-size: 11px; line-height: 1.6; }
.field small ul { padding-left: 17px; margin: 4px 0; }
.field > a { overflow-wrap: anywhere; }
.field[hidden] { display: none; }
.period-line { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; font-size: 12px; color: #b7c6de; margin: 24px 0 17px; }
.period-caption { font-size: 9px; letter-spacing: 1.4px; color: #8c9bb5; }
.metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 0 0 32px; }
.metrics article { padding: 23px 24px; border: 1px solid var(--line); border-radius: 13px; background: linear-gradient(115deg, #172132, #131a26 65%); display: flex; flex-direction: column; align-items: flex-start; }
.metric-heading { display: flex; align-items: center; justify-content: space-between; width: 100%; gap: 10px; font-size: 12px; color: #b7c4da; }
.metric-icon { display: inline-grid; place-items: center; width: 35px; height: 35px; border-radius: 10px; background: #1e345b; color: #91b7ff; }
.metric-icon .icon { width: 19px; height: 19px; }
.metric-icon.violet { background: #292e4a; color: #b4baff; }
.metric-icon.cyan { background: #193446; color: #8bcfe6; }
.metrics article > strong { font-size: 42px; font-weight: 650; line-height: 1.25; letter-spacing: -1.4px; font-variant-numeric: tabular-nums; margin: 15px 0 8px; }
.metrics small { font-size: 11px; color: #8c9cb7; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 28px 0 21px; }
.section-heading p { font-size: 12px; }
.badge { display: inline-block; padding: 5px 9px; border: 1px solid transparent; border-radius: 6px; font-size: 10px; line-height: 1.5; font-weight: 550; }
.badge.success { background: #16392e; border-color: #285745; color: #8ee2b7; }
.badge.warning { background: #3b301b; border-color: #69512c; color: #f1cb83; }
.badge.danger { background: #42252e; border-color: #713949; color: #ffadb6; }
.badge.neutral { background: #202c40; border-color: #34435e; color: #b8cbea; }
.group-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.group-card { background: var(--surface); border: 1px solid var(--line); padding: 24px; border-radius: 13px; }
.group-symbol { display: inline-grid; place-items: center; width: 43px; height: 43px; border-radius: 11px; background: #1c2c46; border: 1px solid #314666; color: #8fb4f5; font-size: 27px; }
.group-symbol .icon { width: 23px; height: 23px; }
.group-card h3 { margin: 19px 0 14px; font-size: 15px; max-width: 330px; }
.event-count { display: flex; align-items: baseline; gap: 10px; margin-bottom: 21px; }
.event-count strong { font-size: 37px; font-weight: 600; line-height: 1.4; font-variant-numeric: tabular-nums; letter-spacing: -1px; }
.event-count span { color: var(--muted); font-size: 11px; }
.progress-caption { display: flex; justify-content: space-between; gap: 10px; font-size: 10px; color: #93a4c0; }
progress { width: 100%; height: 5px; margin: 10px 0 22px; border: none; border-radius: 8px; background: #26334a; accent-color: #6597ff; overflow: hidden; }
progress::-webkit-progress-bar { background: #26334a; border-radius: 8px; }
progress::-webkit-progress-value { background: #6597ff; border-radius: 8px; }
progress::-moz-progress-bar { background: #6597ff; border-radius: 8px; }
.card-totals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; font-size: 10px; color: #92a2bd; border-top: 1px solid var(--line); padding-top: 17px; }
.card-totals b { display: block; color: #dbe7fb; font-size: 17px; font-weight: 550; margin-bottom: 3px; font-variant-numeric: tabular-nums; }
details { margin-top: 20px; font-size: 12px; color: var(--muted); }
summary { cursor: pointer; color: #afc9f8; font-size: 11px; }
details p { margin: 13px 0; }
.info-note { padding: 21px 24px; border: 1px solid #2b3c59; border-radius: 12px; background: #131f31; color: #a7b8d3; font-size: 12px; margin-top: 27px; }
.info-note strong { color: #c5d9fb; font-size: 12px; font-weight: 550; }
.info-note p { margin: 9px 0 0; line-height: 1.8; }
.rules-note { background: #111a29; }
.rules-note summary { display: flex; align-items: center; gap: 10px; font-size: 12px; list-style: none; }
.rules-note summary::-webkit-details-marker { display: none; }
.rules-note summary:after { content: "+"; color: #92acda; margin-left: auto; font-size: 20px; }
.rules-note[open] summary:after { content: "−"; }
.rules-note summary .icon { width: 17px; color: #789bd1; }
footer { margin-top: auto; border-top: 1px solid #202a3b; padding: 21px 40px; font-size: 10px; color: #8494af; display: flex; justify-content: space-between; gap: 15px; }
.catalog-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.catalog-card { display: block; background: var(--surface); border: 1px solid var(--line); border-radius: 13px; padding: 27px; transition: background .18s, border-color .18s, transform .18s; }
.catalog-card:hover { border-color: #5679b7; background: #192438; text-decoration: none; transform: translateY(-2px); }
.catalog-arrow { color: #7793bf; }
.catalog-arrow .icon { width: 18px; }
.catalog-card > strong { display: block; font-size: 21px; color: #e4ecfb; font-weight: 600; letter-spacing: -.5px; margin-top: 24px; }
.catalog-card p { color: #94a6c3; font-size: 12px; margin: 8px 0 25px; }
.catalog-card p b { color: #b7cbed; font-weight: 500; }
.catalog-card .inline-link { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #2a3851; padding-top: 17px; font-size: 11px; }
.catalog-card .inline-link .icon { width: 15px; }
.inline-link { font-size: 12px; font-weight: 500; }
.breadcrumb { display: block; font-size: 11px; color: #95aacb; margin-bottom: 13px; }
.table-scroll { overflow-x: auto; padding: 0; }
table { border-collapse: collapse; width: 100%; text-align: left; font-size: 12px; }
th { font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: #a1b2ce; background: #172031; font-weight: 600; padding: 18px 22px; border-bottom: 1px solid var(--line); }
td { padding: 21px 22px; border-bottom: 1px solid #263248; vertical-align: middle; color: #c8d5eb; }
tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #192335; }
td strong { color: #e3ecfb; font-weight: 550; }
td small { font-size: 11px; color: #93a6c4; }
td .badge { margin-top: 6px; }
.row-actions { display: flex; align-items: center; gap: 15px; }
.row-actions a { font-size: 12px; }
.row-actions form { margin: 0; }
.empty-state { text-align: center; padding: 44px 24px; grid-column: 1/-1; background: radial-gradient(ellipse at 50% 0%, #1c2e4e 0%, #131a26 60%); border: 1px solid #2c3e5e; border-radius: 13px; }
.empty-state > span:not(.eyebrow) { display: block; margin: 0 auto 20px; color: #8db5ff; font-size: 35px; }
.empty-icon { display: grid !important; place-items: center; width: 58px; height: 58px; border-radius: 16px; border: 1px solid #3b5686; background: #1d345b; }
.empty-icon .icon { width: 31px; height: 31px; }
.empty-state .eyebrow { font-size: 9px; margin-bottom: 12px; color: #8ea6cf; }
.empty-state h3 { margin: 10px 0; font-size: 22px; letter-spacing: -.6px; }
.empty-state p { color: #a2b1c9; font-size: 12px; max-width: 440px; margin: 0 auto 24px; line-height: 1.8; }
.form-panel { max-width: 960px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 26px; }
.field.full { grid-column: 1/-1; }
.field textarea { min-height: 120px; resize: vertical; }
.form-actions { display: flex; gap: 12px; border-top: 1px solid var(--line); padding-top: 24px; margin-top: 28px; }
.record-form h2 { margin: 13px 0 25px; }
.record-form > h2:not(:first-child) { margin-top: 34px; }
.inline-add { background: none; border: 0; padding: 3px 0; text-align: left; color: #98bcff; font-size: 11px; align-self: flex-start; min-height: 25px; }
.inline-add:hover { text-decoration: underline; }
.computed-preview { padding: 17px; background: #1c2941; border: 1px solid #344a70; border-radius: 8px; margin-top: 24px; font-size: 12px; color: #afc1dc; }
.computed-preview strong { color: #c7dcff; }
fieldset { border: 1px solid #34435c; padding: 25px; border-radius: 10px; margin: 25px 0; }
legend { padding: 0 9px; color: #b4c8e8; font-size: 12px; }
.errorlist { margin: 0; padding: 10px 13px; background: #3d232e; border: 1px solid #673244; color: #ffb5c0; list-style: none; font-size: 12px; border-radius: 7px; }
.messages { margin-bottom: 23px; }
.message { padding: 13px 18px; border: 1px solid #2c614c; border-radius: 9px; background: #18382e; color: #a4e1c4; }
.message.error { background: #3d232e; border-color: #673244; color: #ffb5c0; }
.message.warning { background: #3c301c; border-color: #69502c; color: #f1cb83; }
.message.info { background: #192d4c; border-color: #365382; color: #b6d2ff; }
.inventory-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 25px; }
.inventory-card { background: var(--surface); border: 1px solid var(--line); border-radius: 13px; overflow: hidden; }
.equipment-placeholder { height: 145px; display: grid; place-items: center; font-size: 65px; background: radial-gradient(ellipse at 50% 100%, #254067 0%, #172031 70%); color: #81a4dd; }
.equipment-photo { width: 100%; height: 200px; object-fit: contain; background: #0e1520; }
.inventory-body { padding: 25px; }
.inventory-body > p { font-size: 12px; color: var(--muted); }
.inventory-body .eyebrow { display: block; }
.inventory-body h2 a { color: #e4edff; }
.document-row { display: flex; justify-content: space-between; align-items: center; gap: 16px; border-top: 1px solid var(--line); padding: 17px 0; font-size: 12px; }
.document-row small { display: block; font-size: 11px; margin-top: 5px; }
.document-row .badge { max-width: 140px; flex-shrink: 0; }
.detail-layout { display: flex; gap: 40px; align-items: start; }
.detail-photo { max-width: 360px; width: 100%; border-radius: 10px; background: #0d1420; }
.detail-layout dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 15px 25px; font-size: 12px; }
.detail-layout dt { color: var(--muted); }
.detail-layout dd { margin: 0; overflow-wrap: anywhere; }
.guide-detail { margin: 17px 0; }
.profile-photo { height: 100px; width: 100px; object-fit: cover; border-radius: 24px; border: 2px solid #4c70a9; margin-bottom: 15px; }
.danger-text { color: #ff9b9f; }
.danger-button { background: #943546; border-color: #b95365; }
.danger-button:hover { background: #b63b51; border-color: #ed7d90; }
.narrow { max-width: 630px; }
.narrow .field { margin-bottom: 22px; }
.pagination { display: flex; justify-content: center; flex-wrap: wrap; gap: 24px; margin-top: 24px; font-size: 12px; color: #9caecb; }
.auth-workspace { min-height: 100vh; background: radial-gradient(ellipse at 50% 0%, #192b4c 0%, #0c1018 65%); }
.auth-workspace main { max-width: none; padding: 0; }
.auth-layout { min-height: 100vh; display: grid; grid-template-columns: 52% 48%; background: #0d121c; }
.auth-story { position: relative; isolation: isolate; overflow: hidden; padding: 42px 10%; background: radial-gradient(ellipse at 60% 80%, #1a3156 0%, #111b2b 60%, #101725 100%); border-right: 1px solid #2b3850; display: flex; flex-direction: column; justify-content: space-between; }
.auth-story:before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(#657ea00a 1px, transparent 1px), linear-gradient(90deg, #657ea00a 1px, transparent 1px); background-size: 48px 48px; mask-image: linear-gradient(to top, black, transparent); }
.auth-story .brand { padding: 0; }
.auth-story-content { max-width: 510px; padding-top: 60px; }
.auth-story .eyebrow { color: #a4bbdd; display: flex; gap: 8px; align-items: center; font-size: 9px; letter-spacing: 1.6px; }
.auth-story h1 { font-size: clamp(34px, 3.6vw, 54px); font-weight: 600; letter-spacing: -2px; line-height: 1.16; margin: 22px 0; }
.auth-story h1 > span { color: #85b0ff; }
.auth-story p { color: #9eafc9; font-size: 13px; line-height: 1.9; max-width: 350px; margin-bottom: 0; }
.auth-story-footer { display: flex; align-items: center; gap: 9px; color: #91a3be; font-size: 10px; padding: 20px 0 0; }
.auth-story-footer .icon { width: 15px; height: 15px; color: #7d9bc8; }
.auth-orbit { height: 245px; position: relative; width: 100%; margin-top: 17px; }
.orbit-ring { position: absolute; left: 50%; top: 54%; transform: translate(-50%, -50%); border: 1px solid #476ca04d; border-radius: 50%; }
.ring-outer { width: 300px; height: 220px; transform: translate(-50%, -50%) rotate(-25deg); }
.ring-middle { width: 220px; height: 220px; border-color: #527fbc3b; }
.ring-inner { width: 145px; height: 145px; background: #23437422; }
.orbit-center { position: absolute; left: 50%; top: 54%; transform: translate(-50%, -50%); display: grid; place-items: center; width: 80px; height: 80px; border: 1px solid #5c8ce2; border-radius: 25px; background: linear-gradient(145deg, #416dd7, #214887); box-shadow: 0 12px 45px #1c4d8e66; color: #cce1ff; }
.orbit-center .icon { width: 46px; height: 46px; stroke-width: 1.2; }
.orbit-tag { position: absolute; display: flex; align-items: center; gap: 10px; background: #1b2a42; border: 1px solid #3a547d; border-radius: 10px; padding: 12px 15px; font-size: 10px; color: #c9dafa; box-shadow: 0 8px 25px #0003; }
.orbit-tag .icon { width: 17px; height: 17px; color: #8fbaff; }
.tag-one { left: 0; top: 26px; transform: rotate(-4deg); }
.tag-two { right: 0; bottom: 12px; transform: rotate(3deg); }
.orbit-node { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: #689dfb; box-shadow: 0 0 0 5px #639eff14; }
.node-one { right: 10%; top: 48px; }
.node-two { left: 17%; bottom: 37px; }
.auth-form { align-self: center; width: 100%; max-width: 470px; margin: 0 auto; padding: 70px 42px; }
.auth-step { font-size: 9px; letter-spacing: 2px; color: #8eaddf; font-weight: 550; }
.auth-form h2 { font-size: 32px; letter-spacing: -1.2px; font-weight: 600; margin: 20px 0 13px; line-height: 1.25; }
.auth-form > p { font-size: 12px; color: #9eacc2; line-height: 1.8; margin-bottom: 30px; }
.auth-form .field { margin: 20px 0; gap: 9px; }
.auth-form .field input { min-height: 48px; background: #141c29; border-color: #34435d; }
.auth-form .field label { font-size: 12px; color: #d0dcf0; }
.forgot-password { text-align: right; margin: -5px 0 25px; }
.forgot-password a { font-size: 11px; }
.full-button { width: 100%; min-height: 46px; }
.auth-form .button.full-button { justify-content: space-between; padding: 13px 17px; }
.auth-form .button.secondary { justify-content: center; }
.auth-divider { display: flex; align-items: center; gap: 14px; color: #8b9bb6; font-size: 11px; margin: 26px 0 20px; }
.auth-divider:before, .auth-divider:after { content: ""; flex: 1; height: 1px; background: #28344a; }
.subtle-link { display: block; text-align: center; font-size: 11px; color: #9aaecf; margin-top: 23px; }
.auth-card { max-width: 540px; margin: 7vh auto; background: #121b2a; padding: 40px; border: 1px solid #31425f; border-radius: 16px; box-shadow: 0 20px 90px #0004; }
.auth-card.wide { max-width: 800px; }
.auth-card h1 { font-size: 29px; margin: 26px 0 17px; }
.auth-card > p { font-size: 13px; color: #a3b2cc; }
.auth-card .button { margin-top: 24px; }
.auth-card form > p { display: flex; flex-direction: column; gap: 9px; }
.auth-card .field { margin: 0; }
.auth-card form > .field { margin: 20px 0; }
.auth-card ul { color: #9faec7; padding-left: 19px; font-size: 11px; }
.auth-logo { font-size: 11px; letter-spacing: 1.6px; color: #9cbfff; }
.auth-workspace .messages { max-width: 700px; margin: 0 auto; padding: 18px 20px 0; }
.auth-workspace .messages .message { margin: 0; }
dialog { border: 1px solid #3d5274; border-radius: 16px; padding: 29px; width: 760px; max-width: calc(100vw - 30px); max-height: 90vh; background: #141e2d; color: var(--ink); box-shadow: 0 32px 100px #0009; }
dialog::backdrop { background: #050910c9; backdrop-filter: blur(7px); }
.dialog-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 25px; }
.dialog-heading h2 { margin: 0; }
.icon-button { display: inline-grid; place-items: center; background: #24324a; border: 1px solid #3d5070; border-radius: 8px; font-size: 24px; line-height: 1; width: 36px; height: 36px; color: #d0e0fc; }

@media (min-width: 1550px) {
  .group-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 761px) {
  .sidebar { overflow-y: auto; }
}
@media (max-width: 1150px) {
  :root { --sidebar-width: 220px; }
  .sidebar { padding-left: 12px; padding-right: 12px; }
  .brand { padding-left: 8px; padding-right: 8px; }
  .brand strong { font-size: 21px; }
  main { padding: 32px 26px 45px; }
  .topbar { padding: 0 26px; }
  .sidebar nav a { font-size: 12px; gap: 10px; padding: 12px; }
  .privacy-note { padding: 13px 9px; gap: 7px; }
  .privacy-note small { font-size: 9px; }
  .page-heading { gap: 20px; }
  .page-heading .button { font-size: 11px; padding: 11px 13px; }
  .dashboard-heading { align-items: flex-start; flex-direction: column; gap: 20px; }
  .filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metrics { gap: 13px; }
  .metrics article { padding: 19px 17px; }
  .metric-heading { font-size: 11px; }
  .metric-icon { width: 29px; height: 29px; border-radius: 8px; }
  .metric-icon .icon { width: 16px; height: 16px; }
  .metrics small { font-size: 10px; }
  .auth-story { padding-left: 9%; padding-right: 9%; }
  .auth-story h1 { letter-spacing: -1.5px; }
  .detail-layout { flex-direction: column; }
}
@media (max-width: 760px) {
  .sidebar { inset: 0 0 auto; width: 100%; height: 64px; display: flex; flex-direction: row; align-items: center; padding: 0 19px; border-right: 0; border-bottom: 1px solid #29344a; background: #101721; }
  .brand { padding: 0; gap: 9px; font-size: 9px; }
  .brand strong { font-size: 18px; line-height: 1.1; }
  .brand-icon { width: 34px; height: 34px; border-radius: 10px; }
  .brand-icon .icon { width: 23px; height: 23px; }
  .nav-caption, .sidebar-bottom { display: none; }
  .sidebar nav { position: fixed; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; padding: 7px 8px calc(7px + env(safe-area-inset-bottom)); background: #131c2bf5; backdrop-filter: blur(16px); border-top: 1px solid #34435c; box-shadow: 0 -8px 35px #0004; z-index: 30; }
  .sidebar nav a { display: flex; flex-direction: column; justify-content: center; padding: 7px 3px; gap: 5px; border-radius: 9px; min-height: 55px; font-size: 9px; line-height: 1.2; text-align: center; color: #98abc8; }
  .sidebar nav a .icon { width: 20px; height: 20px; }
  .sidebar nav a.active { background: #223657; border-color: transparent; color: #b6d2ff; }
  .nav-label { max-width: 92px; }
  .workspace { margin-left: 0; padding-top: 64px; padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  .topbar { min-height: 53px; padding: 0 20px; }
  .topbar-path { font-size: 11px; gap: 9px; }
  .topbar-path > span { display: none; }
  .topbar-path > .icon { display: none; }
  .private-label { display: none; }
  .topbar-account { gap: 12px; }
  .mini-avatar { width: 29px; height: 29px; font-size: 10px; border-radius: 9px; }
  .mobile-logout { display: block; }
  .mobile-logout .icon-button { background: none; border: none; width: 28px; height: 32px; color: #99adc9; }
  .mobile-logout .icon { width: 17px; }
  .workspace main { padding: 26px 18px 35px; }
  .page-heading { flex-direction: column; align-items: flex-start; gap: 20px; margin-bottom: 25px; }
  .page-heading h1 { font-size: 29px; letter-spacing: -1px; }
  .page-heading p { font-size: 12px; }
  .page-heading .button { font-size: 12px; min-height: 44px; }
  .eyebrow { font-size: 9px; }
  .filter-panel, .panel { padding: 19px; border-radius: 12px; }
  .filter-panel .section-line { gap: 10px; }
  .filter-title { font-size: 11px; gap: 7px; }
  .filter-title .icon { width: 15px; }
  .filter-panel .button.small { padding: 7px 10px; font-size: 10px; }
  .filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px 12px; }
  .filter-grid .field label { font-size: 10px; }
  .filter-grid .field select, .filter-grid .field input { font-size: 12px; padding: 10px 8px; }
  .period-line { gap: 8px; margin: 22px 0 15px; font-size: 11px; }
  .period-caption { width: 100%; font-size: 8px; }
  .metrics { gap: 8px; margin-bottom: 27px; }
  .metrics article { padding: 15px 11px; border-radius: 10px; }
  .metric-heading { font-size: 10px; align-items: flex-start; min-height: 32px; line-height: 1.5; }
  .metric-icon { display: none; }
  .metrics article > strong { font-size: 29px; margin: 8px 0 6px; letter-spacing: -.9px; }
  .metrics small { font-size: 9px; line-height: 1.5; }
  .group-grid, .inventory-grid { grid-template-columns: 1fr; gap: 17px; }
  .group-card { padding: 22px; }
  .section-heading { margin: 25px 0 18px; gap: 13px; }
  .section-heading h2 { font-size: 18px; }
  .section-heading p { font-size: 11px; }
  .catalog-grid { gap: 13px; }
  .catalog-card { padding: 19px; border-radius: 11px; }
  .catalog-card > strong { font-size: 17px; margin-top: 20px; }
  .catalog-card .group-symbol { width: 38px; height: 38px; border-radius: 10px; }
  .catalog-card .group-symbol .icon { width: 21px; }
  .catalog-card p { font-size: 11px; margin-bottom: 20px; }
  .catalog-card .inline-link { font-size: 10px; padding-top: 13px; }
  .catalog-arrow { display: none; }
  .form-grid { grid-template-columns: 1fr; gap: 21px; }
  .field input, .field select, .field textarea { font-size: 16px; }
  .table-scroll { padding: 0; }
  table { min-width: 680px; }
  th, td { padding: 16px; }
  .info-note { padding: 18px 19px; }
  .auth-layout { display: block; }
  .auth-story { padding: 25px 27px 28px; border-right: 0; border-bottom: 1px solid #2b3850; }
  .auth-story-content { padding-top: 35px; max-width: 520px; }
  .auth-story .eyebrow { font-size: 8px; letter-spacing: 1.2px; }
  .auth-story h1 { font-size: 31px; letter-spacing: -1.1px; line-height: 1.2; margin: 17px 0 0; }
  .auth-story h1 > span br { display: none; }
  .auth-story p, .auth-orbit, .auth-story-footer { display: none; }
  .auth-form { padding: 33px 27px 45px; max-width: 490px; }
  .auth-form h2 { font-size: 27px; margin-top: 15px; }
  .auth-form h2 br { display: none; }
  .auth-form > p { font-size: 12px; margin-bottom: 24px; }
  .auth-step { font-size: 8px; }
  .auth-card, .auth-card.wide { margin: 22px 16px; padding: 26px 23px; border-radius: 13px; }
  .auth-card h1 { font-size: 27px; }
  .auth-card .form-grid { grid-template-columns: 1fr; }
  footer { padding: 20px 18px; font-size: 9px; gap: 15px; }
  fieldset { padding: 17px; }
  .detail-layout dl { grid-template-columns: 1fr; gap: 4px; }
  .detail-layout dd { margin-bottom: 13px; }
  .form-actions { flex-wrap: wrap; }
  .empty-state { padding: 33px 19px; }
  .empty-state h3 { font-size: 20px; }
  .document-row { gap: 10px; }
  .document-row .badge { max-width: 110px; font-size: 9px; }
  dialog { padding: 23px 20px; }
}
@media (max-width: 380px) {
  .catalog-grid { grid-template-columns: 1fr; }
  .filter-grid { grid-template-columns: 1fr; }
  .metric-heading { font-size: 9px; }
  .metrics article > strong { font-size: 26px; }
  .card-totals { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}