:root {
  color-scheme: light;
  --bg: #f5f8ff;
  --surface: #ffffff;
  --surface-soft: #f3f7ff;
  --text: #10182f;
  --muted: #63708a;
  --line: #dfe7f5;
  --primary: #1464f6;
  --primary-dark: #0b4ed1;
  --primary-soft: #eaf2ff;
  --danger: #d92d20;
  --warning: #c66a09;
  --ok: #079669;
  --radius: 14px;
  --shadow: 0 18px 55px rgba(30, 81, 163, 0.09);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Microsoft YaHei UI", "PingFang SC", "Segoe UI", Arial, sans-serif;
  font-size: 15px;
  line-height: 1.55;
}
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }

.topbar {
  position: sticky;
  z-index: 30;
  top: 0;
  display: grid;
  grid-template-columns: minmax(300px, 1.05fr) minmax(500px, 1.35fr) auto;
  align-items: center;
  min-height: 68px;
  padding: 0 24px;
  border-bottom: 1px solid rgba(214, 225, 243, .9);
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 4px 18px rgba(33, 73, 140, .04);
  backdrop-filter: blur(14px);
}
.brand { display: inline-flex; align-items: center; gap: 12px; font-size: 18px; font-weight: 800; white-space: nowrap; }
.brand b { color: #9ba9c2; }
.brand-mark { display: inline-grid; width: 36px; height: 40px; place-items: center; color: var(--primary); }
.brand-mark svg { width: 100%; height: 100%; }
.main-nav { display: flex; align-self: stretch; justify-content: center; gap: 24px; }
.main-nav a, .main-nav span { position: relative; display: inline-flex; align-items: center; padding: 0 3px; color: #263149; font-weight: 600; white-space: nowrap; }
.main-nav a:hover { color: var(--primary); }
.main-nav .nav-active { color: var(--primary); }
.main-nav .nav-active::after { position: absolute; right: 0; bottom: 0; left: 0; height: 3px; border-radius: 4px 4px 0 0; background: var(--primary); content: ""; }
.main-nav .nav-disabled { color: #8994a8; cursor: not-allowed; }

.account-cluster { display: flex; align-items: center; justify-self: end; gap: 10px; }
.quota-pill { display: inline-flex; min-height: 42px; padding: 6px 12px; border: 1px solid #c9dbfb; border-radius: 11px; align-items: center; gap: 7px; background: linear-gradient(145deg,#f8fbff,#edf4ff); color: #2f5eaa; white-space: nowrap; }
.quota-pill small { color: #6e7e99; font-size: 10px; font-weight: 700; }
.quota-pill strong { color: var(--primary); font-size: 16px; }
.quota-pill.is-exhausted { border-color: #f0cfa5; background: #fff8ed; }.quota-pill.is-exhausted strong { color: #b85b08; }
.quota-pill.quota-error { border-color: #efc3be; background: #fff3f1; }.quota-pill.quota-error strong { color: var(--danger); font-size: 13px; }
.account-menu { position: relative; justify-self: end; }
.account-menu summary { display: flex; align-items: center; min-width: 172px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 11px; background: white; cursor: pointer; list-style: none; }
.account-menu summary::-webkit-details-marker { display: none; }
.account-menu summary > span:nth-child(2) { display: grid; margin-left: 9px; }
.account-menu strong { font-size: 13px; }
.account-menu small { color: var(--muted); font-size: 11px; }
.account-avatar { display: inline-grid; width: 32px; height: 32px; border-radius: 50%; place-items: center; background: var(--primary); color: white; font-weight: 800; }
.chevron { margin-left: auto; color: var(--muted); }
.account-popover { position: absolute; top: calc(100% + 8px); right: 0; width: 190px; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: white; box-shadow: var(--shadow); }
.account-note { padding: 8px 9px 11px; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.logout-button { width: 100%; padding: 9px 12px; border: 0; border-radius: 8px; background: #f3f6fb; color: #33405a; cursor: pointer; }
.logout-button:hover { background: #e8eef8; color: var(--primary); }

.dashboard-page { min-height: calc(100vh - 68px); overflow: hidden; padding: 0 0 48px; background: linear-gradient(180deg,#f8faff 0%,#f4f7fd 100%); }
.dashboard-hero { position: relative; display: grid; grid-template-columns: minmax(470px,.9fr) minmax(570px,1.1fr); min-height: 360px; padding: 28px max(4vw,calc((100vw - 1480px) / 2)); overflow: hidden; background: radial-gradient(circle at 10% 10%,#fff 0,rgba(255,255,255,.82) 30%,transparent 58%),linear-gradient(135deg,#f9fbff 0%,#eaf2ff 62%,#f5f9ff 100%); }
.dashboard-hero::after { position: absolute; right: -8%; bottom: -86px; left: -8%; height: 175px; background: repeating-radial-gradient(ellipse at center,transparent 0 12px,rgba(71,132,242,.08) 13px 14px); content: ""; transform: scaleY(.36); }
.dashboard-hero-copy { position: relative; z-index: 2; align-self: center; padding-left: 50px; }
.dashboard-eyebrow { color: var(--primary); font-size: 17px; font-weight: 800; letter-spacing: .17em; }
.dashboard-hero h1 { margin: 13px 0 14px; color: #0c1221; font-size: clamp(48px,5vw,74px); line-height: 1.1; letter-spacing: -.055em; }
.dashboard-hero-copy > p { max-width: 610px; margin: 0; color: #394761; font-size: 16px; line-height: 1.85; }
.dashboard-hero-actions { display: flex; align-items: center; gap: 24px; margin-top: 30px; }
.dashboard-button { display: inline-flex; min-width: 207px; min-height: 56px; padding: 0 24px; border: 1px solid var(--primary); border-radius: 8px; align-items: center; justify-content: center; gap: 11px; color: var(--primary); font-size: 17px; font-weight: 800; transition: transform .2s ease,box-shadow .2s ease,background .2s ease; }
.dashboard-button svg { width: 24px; height: 24px; flex: 0 0 auto; }
.dashboard-button.primary { color: white; background: linear-gradient(135deg,#1c73ff,#0a57df); box-shadow: 0 12px 25px rgba(20,100,246,.2); }
.dashboard-button.secondary { background: rgba(255,255,255,.72); }
.dashboard-button:hover:not(.is-disabled) { transform: translateY(-2px); box-shadow: 0 14px 28px rgba(20,100,246,.16); }
.dashboard-button.is-disabled { border-color: #b8c7dc; color: #8492a8; background: #f3f6fb; cursor: not-allowed; }
.dashboard-trust-list { display: flex; flex-wrap: wrap; gap: 28px; margin-top: 37px; color: #33425e; font-size: 14px; }
.dashboard-trust-list span { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.dashboard-trust-list i { display: inline-grid; width: 18px; height: 18px; border-radius: 50%; place-items: center; color: white; background: var(--primary); font-size: 12px; font-style: normal; font-weight: 800; }
.dashboard-hero-art { position: relative; z-index: 1; display: grid; min-height: 320px; place-items: center; }
.dashboard-hero-art svg { display: block; width: 100%; height: 320px; object-fit: contain; overflow: visible; }
.dashboard-stat-grid { position: relative; z-index: 4; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 18px; width: min(1540px,calc(100vw - 136px)); margin: 32px auto 0; }
.dashboard-stat-card { position: relative; display: flex; min-height: 108px; padding: 17px 18px; border: 1px solid #e2e9f5; border-radius: 13px; align-items: center; gap: 14px; background: rgba(255,255,255,.96); box-shadow: 0 9px 24px rgba(42,84,153,.055); transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.dashboard-stat-card:hover { border-color: #b8cff5; box-shadow: 0 12px 27px rgba(42,84,153,.1); transform: translateY(-2px); }
.dashboard-stat-card.attention { border-color: #e8e4f8; }
.dashboard-stat-icon { display: inline-grid; flex: 0 0 auto; width: 62px; height: 62px; border-radius: 50%; place-items: center; }
.dashboard-stat-icon svg { width: 34px; height: 34px; }
.dashboard-stat-icon.blue { color: #1266ec; background: #edf4ff; }.dashboard-stat-icon.orange { color: #f2690c; background: #fff1e7; }.dashboard-stat-icon.green { color: #0bb574; background: #e9faf2; }.dashboard-stat-icon.purple { color: #7859df; background: #f2efff; }
.dashboard-stat-copy { display: grid; min-width: 0; gap: 2px; }.dashboard-stat-copy small { color: #202a3e; font-size: 16px; font-weight: 700; white-space: nowrap; }.dashboard-stat-copy strong { color: #0d1321; font-size: 31px; line-height: 1.12; }
.dashboard-stat-arrow { position: absolute; right: 12px; top: 50%; color: #6d83aa; font-size: 32px; line-height: 1; transform: translateY(-50%); }
.dashboard-panel-grid { display: grid; grid-template-columns: 1.12fr 1.06fr 1fr 1.08fr; gap: 18px; width: min(1540px,calc(100vw - 136px)); margin: 24px auto 0; }
.dashboard-panel { min-height: 216px; padding: 22px 22px 20px; border: 1px solid #e2e9f5; border-radius: 13px; background: rgba(255,255,255,.96); box-shadow: 0 9px 24px rgba(42,84,153,.045); }
.dashboard-panel-head { display: flex; min-height: 34px; align-items: center; justify-content: space-between; gap: 12px; }
.dashboard-panel-head > div { display: flex; align-items: center; gap: 11px; }.dashboard-panel-head h2 { margin: 0; color: #131c2f; font-size: 18px; }.dashboard-panel-head a { color: var(--primary); font-size: 13px; font-weight: 700; }.dashboard-panel-head a b { display: inline-grid; min-width: 22px; height: 22px; margin-left: 4px; border-radius: 50%; place-items: center; color: white; background: #ed3030; font-size: 12px; }
.dashboard-panel-icon { display: inline-grid; width: 25px; height: 25px; place-items: center; }.dashboard-panel-icon svg { width: 24px; height: 24px; }.dashboard-panel-icon.blue { color: var(--primary); }.dashboard-panel-icon.purple { color: #7255dc; }
.dashboard-list { display: grid; gap: 12px; margin: 20px 0 0; padding: 0; list-style: none; }.dashboard-list li a { display: grid; grid-template-columns: 8px minmax(0,1fr) auto; gap: 9px; align-items: center; color: #354158; font-size: 13px; line-height: 1.5; }.dashboard-list li a:hover span { color: var(--primary); }.dashboard-list i { width: 5px; height: 5px; border-radius: 50%; background: var(--primary); }.dashboard-list span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.dashboard-list time { color: #8592a9; font-size: 12px; white-space: nowrap; }.dashboard-empty { display: grid; min-height: 133px; margin-top: 15px; place-items: center; color: #8b98ad; font-size: 13px; }
.dashboard-notice-panel p { max-width: 240px; margin: 24px 0 0; color: #354158; font-size: 15px; line-height: 2; }.dashboard-notice-panel strong { color: #de3c36; }.dashboard-panel-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 18px; }.dashboard-panel-actions a { color: var(--primary); font-size: 12px; font-weight: 700; }.dashboard-panel-actions a:hover { text-decoration: underline; }.dashboard-panel-actions .button { font-size: 13px; }.dashboard-panel-actions .button:hover { text-decoration: none; }
.dashboard-format-panel p { margin: 23px 0 13px; color: #354158; font-size: 15px; }.dashboard-format-badges { display: flex; gap: 10px; }.dashboard-format-badges span { display: inline-flex; min-width: 58px; min-height: 35px; padding: 0 8px; border: 1px solid #b9d2fa; border-radius: 7px; align-items: center; justify-content: center; color: #1266ec; background: #eff5ff; font-size: 12px; font-weight: 800; }.dashboard-format-panel > small { display: block; margin-top: 17px; color: #8491a7; font-size: 11px; line-height: 1.6; }

.portal-page { overflow: hidden; }
.hero { position: relative; display: grid; grid-template-columns: minmax(420px, .95fr) minmax(520px, 1.05fr); min-height: 386px; padding: 62px max(4vw, calc((100vw - 1480px) / 2)); background: radial-gradient(circle at 10% 10%, #fff 0, rgba(255,255,255,.8) 30%, transparent 55%), linear-gradient(135deg, #f9fbff 0%, #eaf2ff 60%, #f7faff 100%); }
.hero::after { position: absolute; right: -10%; bottom: -70px; left: -10%; height: 170px; background: repeating-radial-gradient(ellipse at center, transparent 0 12px, rgba(71,132,242,.08) 13px 14px); content: ""; transform: scaleY(.35); }
.hero-copy { position: relative; z-index: 2; align-self: center; padding-left: 24px; }
.eyebrow, .section-kicker { color: var(--primary); font-size: 11px; font-weight: 800; letter-spacing: .18em; }
.hero h1 { margin: 8px 0 12px; font-size: clamp(42px, 4.2vw, 68px); line-height: 1.13; letter-spacing: -.04em; }
.hero-copy > p { max-width: 610px; margin: 0; color: #52627e; font-size: 17px; line-height: 1.9; }
.hero-actions { display: flex; align-items: center; gap: 22px; margin-top: 27px; }
.availability { color: #44536f; font-size: 13px; }
.availability i { display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; background: #16b47b; box-shadow: 0 0 0 5px rgba(22,180,123,.12); }
.hero-art { position: relative; z-index: 2; min-height: 300px; }
.orb { position: absolute; border-radius: 50%; filter: blur(1px); }
.orb-one { top: 20px; right: 80px; width: 250px; height: 250px; background: radial-gradient(circle at 35% 30%, rgba(255,255,255,.95), rgba(65,130,255,.25) 55%, rgba(31,100,235,.08)); }
.orb-two { right: 250px; bottom: 10px; width: 170px; height: 100px; background: rgba(58,127,255,.18); filter: blur(34px); }
.document-card { position: absolute; top: 2px; right: 18%; width: 175px; height: 225px; padding: 25px 22px; border: 1px solid rgba(255,255,255,.9); border-radius: 12px 12px 34px 12px; background: rgba(255,255,255,.85); box-shadow: 0 20px 40px rgba(50,98,184,.1); transform: rotate(8deg); }
.document-card span { font-weight: 800; }
.document-card i { display: block; width: 100%; height: 5px; margin-top: 15px; border-radius: 5px; background: #e5edfb; }
.document-card i:nth-of-type(2) { width: 82%; }.document-card i:nth-of-type(3) { width: 93%; }.document-card i:nth-of-type(4) { width: 60%; }
.shield { position: absolute; z-index: 4; top: 60px; left: 39%; width: 190px; filter: drop-shadow(0 24px 20px rgba(25,83,194,.24)); }
.art-balance { position: absolute; z-index: 3; bottom: 35px; left: 10%; width: 155px; color: #647da8; filter: drop-shadow(0 14px 12px rgba(62,93,143,.16)); }
.art-stamp { position: absolute; z-index: 3; right: 10%; bottom: 34px; width: 68px; height: 108px; border-radius: 30px 30px 12px 12px; background: linear-gradient(#2f82ff 0 26%, #0e52d7 27% 55%, #d9e8ff 56% 100%); box-shadow: 0 14px 24px rgba(25,84,191,.22); }
.art-platform { position: absolute; right: 18%; bottom: 9px; left: 26%; height: 65px; }
.art-platform i { position: absolute; right: 0; bottom: 0; left: 0; height: 24px; border: 1px solid #aec9f5; border-radius: 50%; background: linear-gradient(#fff,#d9e8ff); box-shadow: 0 8px 18px rgba(28,79,172,.16); }
.art-platform i:nth-child(2) { right: 10%; bottom: 17px; left: 10%; }.art-platform i:nth-child(3) { right: 22%; bottom: 34px; left: 22%; }

.workflow-panel, .metrics, .response-workbench { width: min(1480px, calc(100vw - 48px)); margin-right: auto; margin-left: auto; }
.metric-icon { display: inline-grid; width: 48px; height: 48px; border-radius: 50%; place-items: center; font-size: 24px; font-weight: 800; }
.blue { background: #eaf2ff; color: #1765ee; }.green { background: #e9f9f4; color: #05a774; }.orange { background: #fff2e9; color: #f07819; }.red { background: #ffefed; color: #dc382b; }

.workflow-panel, .response-workbench { margin-top: 18px; padding: 23px; border: 1px solid var(--line); border-radius: var(--radius); background: white; box-shadow: 0 10px 28px rgba(41,84,157,.05); }
.panel-title-row, .workbench-head, .jobs-head, .panel-head, .section-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.panel-title-row h2, .workbench-head h2 { margin: 2px 0 0; font-size: 21px; }
.workflow-steps { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr auto 1fr; align-items: center; gap: 14px; margin-top: 21px; }
.workflow-steps > i { color: #9badc9; font-style: normal; font-size: 20px; }
.workflow-step { display: flex; align-items: center; gap: 11px; }
.workflow-step > span { display: inline-grid; flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%; place-items: center; background: var(--primary-soft); color: var(--primary); font-weight: 800; }
.workflow-step div { display: grid; }.workflow-step small { margin-top: 2px; color: var(--muted); font-size: 11px; }

.metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-top: 18px; }
.metrics article { display: flex; align-items: center; gap: 15px; min-height: 118px; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius); background: white; }
.metrics article div { display: grid; }.metrics small { color: var(--muted); }.metrics strong { font-size: 31px; line-height: 1.15; }.metrics em { margin-top: 5px; color: #8a96aa; font-size: 10px; font-style: normal; }

.response-workbench { margin-bottom: 46px; scroll-margin-top: 85px; }
.workbench-head { align-items: flex-end; margin-bottom: 22px; }
.workbench-head p, .jobs-head p { margin: 4px 0 0; color: var(--muted); }
.workbench-grid { display: grid; grid-template-columns: minmax(330px,.78fr) minmax(520px,1.22fr); gap: 18px; }
.upload-panel, .jobs-panel { border: 1px solid var(--line); border-radius: 13px; background: #fbfdff; }
.upload-panel { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 330px; padding: 28px; text-align: center; }
.upload-icon { display: grid; width: 64px; height: 64px; border-radius: 20px; place-items: center; background: linear-gradient(145deg,#2e80ff,#0c53d8); color: white; box-shadow: 0 14px 26px rgba(24,99,234,.22); font-size: 32px; }
.upload-panel h3, .jobs-head h3 { margin: 15px 0 5px; font-size: 19px; }.upload-panel p { margin: 0; color: var(--muted); }
.file-picker { position: relative; display: inline-flex; margin: 20px 0 10px; overflow: hidden; }
.file-picker span { display: inline-flex; min-width: 132px; min-height: 42px; align-items: center; justify-content: center; border: 1px solid #a9c4f9; border-radius: 9px; background: white; color: var(--primary); font-weight: 700; cursor: pointer; }
.file-picker input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.case-name-field { display: grid; width: min(420px,100%); gap: 6px; margin-top: 18px; color: var(--muted); font-size: 12px; text-align: left; }
.case-name-field input { min-height: 42px; padding: 9px 12px; border: 1px solid #d1def2; border-radius: 9px; background: white; color: var(--text); font: inherit; }
.case-name-field input:focus { border-color: var(--primary); outline: 2px solid rgba(36,115,255,.12); }
.upload-selection { display: grid; width: min(420px,100%); gap: 4px; margin-bottom: 10px; padding: 10px 12px; border: 1px solid #d7e3f5; border-radius: 9px; background: white; color: #78869c; font-size: 12px; text-align: left; }
.upload-selection strong { color: var(--ok); }.upload-selection span { overflow-wrap: anywhere; color: var(--text); }.upload-selection.uploading { border-color: #f0c46d; background: #fff9ec; }.upload-submit:disabled { cursor: wait; opacity: .72; }
.upload-panel > small { color: #8996aa; }.upload-submit { width: min(260px,100%); margin-top: 18px; }
.quota-notice { width: min(440px,100%); margin-bottom: 20px; padding: 10px 13px; border: 1px solid #c9dbfb; border-radius: 10px; background: #f1f6ff; color: #446083; font-size: 12px; line-height: 1.6; }
.quota-notice strong { color: var(--primary); font-size: 15px; }
.quota-notice.is-exhausted { border-color: #efcfa8; background: #fff8ed; color: #95520f; }
.quota-notice-error { border-color: #efc3be; background: #fff3f1; color: #a33a31; }
.quota-blocked .upload-icon, .quota-blocked .file-picker, .quota-blocked .upload-selection, .quota-blocked > small { opacity: .48; }
.quota-blocked .file-picker span { cursor: not-allowed; }.quota-blocked .upload-submit:disabled { background: #a8b8cf; box-shadow: none; cursor: not-allowed; }
.admin-locked { opacity: .56; filter: grayscale(.4); pointer-events: none; }
.admin-only-note { display: flex; gap: 10px; margin-bottom: 18px; padding: 13px 16px; border: 1px solid #efd5a9; border-radius: 10px; align-items: center; background: #fff8ec; color: #8a5b18; }
.admin-only-note span { color: #876b43; }
.jobs-panel { min-height: 330px; padding: 20px; }
.jobs-head { padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.jobs-head-copy { min-width: 0; flex: 1; }
.jobs-head h3 { margin: 0; }
.jobs-head h3 small { color: var(--muted); font-size: 13px; font-weight: 400; line-height: 1.55; }
.owner-filter-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.owner-filter-form label { color: var(--muted); font-size: 11px; font-weight: 700; }
.owner-filter-form select { min-width: 220px; min-height: 37px; padding: 7px 10px; border: 1px solid #d1def2; border-radius: 9px; background: white; color: var(--text); font: inherit; font-size: 12px; }
.owner-filter-form select:focus { border-color: var(--primary); outline: 2px solid rgba(36,115,255,.12); }
.owner-filter-form .button { min-height: 37px; padding: 7px 12px; }
.retention-alert { color: var(--danger); font-weight: 700; }
.jobs-head > span { padding: 4px 9px; border-radius: 999px; background: var(--primary-soft); color: var(--primary); font-size: 12px; font-weight: 700; }
.job-list, .file-list { display: grid; gap: 9px; margin-top: 14px; }
.job-row, .file-row { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: white; }
.job-row:hover, .file-row:hover { border-color: #a9c5fa; box-shadow: 0 6px 18px rgba(45,96,181,.07); }
.job-file-icon { display: inline-grid; flex: 0 0 auto; width: 38px; height: 42px; border-radius: 8px; place-items: center; background: var(--primary-soft); color: var(--primary); font-size: 12px; font-weight: 800; }
.job-main { display: grid; min-width: 0; margin-right: auto; }.job-main strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.job-main small, .file-row small { color: var(--muted); font-size: 11px; }.job-main .job-attention-reason { overflow: hidden; color: #a14200; text-overflow: ellipsis; white-space: nowrap; }
.jobs-pagination { display: flex; margin-top: 14px; align-items: center; justify-content: center; gap: 12px; color: var(--muted); font-size: 12px; }.jobs-pagination a { padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; background: white; color: var(--primary); font-weight: 700; }.jobs-pagination a:hover { border-color: #a9c5fa; }

.page { width: min(1280px, calc(100vw - 40px)); margin: 0 auto; padding: 34px 0 50px; }
.detail-hero { margin-bottom: 18px; padding: 26px 28px; border: 1px solid #dbe6f7; border-radius: 16px; background: linear-gradient(135deg,#fff,#edf4ff); box-shadow: 0 12px 30px rgba(39,82,153,.06); }
.upload-complete { display: flex; gap: 10px; margin-bottom: 16px; padding: 14px 18px; border: 1px solid #b9e2d3; border-radius: 12px; align-items: center; background: #edf9f4; color: #216c55; }.upload-complete span { color: #427665; }
.back-link { display: inline-block; margin-bottom: 20px; color: var(--primary); font-size: 13px; font-weight: 700; }
.detail-hero h1 { max-width: 750px; margin: 4px 0 4px; font-size: 28px; overflow-wrap: anywhere; }.detail-hero p { margin: 0; color: var(--muted); }
.grid { display: grid; gap: 16px; margin-bottom: 16px; }.grid.two { grid-template-columns: minmax(320px,.9fr) minmax(420px,1.1fr); }
.panel { padding: 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }.elevated-panel { box-shadow: 0 10px 26px rgba(40,82,150,.05); }.attention-panel { margin-bottom: 16px; border-left: 4px solid #d9782b; }.final-panel { margin-top: 4px; }
.panel h2 { margin: 0 0 14px; font-size: 18px; }.panel-head h2 { margin: 0; }
.button { display: inline-flex; min-height: 39px; padding: 8px 15px; border: 1px solid transparent; border-radius: 9px; align-items: center; justify-content: center; color: #263149; background: white; cursor: pointer; font-weight: 700; }
.button.primary { color: white; background: var(--primary); box-shadow: 0 8px 18px rgba(20,100,246,.18); }.button.primary:hover { background: var(--primary-dark); }.button.secondary { border-color: var(--line); }.button.secondary:hover { border-color: #a9c5fa; color: var(--primary); }.button.danger { color: white; background: var(--danger); }.button.large { min-width: 150px; min-height: 48px; }
.actions { display: inline-flex; align-items: center; gap: 9px; }.actions form { margin: 0; }
.muted { color: var(--muted); font-size: 12px; }
.badge { display: inline-flex; flex: 0 0 auto; min-width: 82px; height: 28px; padding: 0 10px; border-radius: 999px; align-items: center; justify-content: center; background: var(--surface-soft); color: var(--muted); font-size: 11px; font-weight: 800; }
.state-pending { background: #eaf2ff; color: #185cc9; }.state-processing { background: #fff4dc; color: var(--warning); }.state-done { background: #e8f7f1; color: var(--ok); }.state-needs_attention { background: #fff0e5; color: #a14200; }
.kv { display: grid; grid-template-columns: 92px minmax(0,1fr); gap: 10px 12px; margin: 0; }.kv dt { color: var(--muted); }.kv dd { margin: 0; }.path { overflow-wrap: anywhere; font-family: Consolas,"Courier New",monospace; font-size: 12px; }.error { color: var(--danger); }
.attention-edit-form { display: grid; max-width: 720px; gap: 9px; }.attention-edit-form label { color: var(--muted); font-size: 12px; font-weight: 700; }.attention-edit-form textarea { width: 100%; min-height: 92px; padding: 10px 11px; border: 1px solid #d1def2; border-radius: 9px; background: white; color: var(--text); font: inherit; resize: vertical; }.attention-edit-form textarea:focus { border-color: var(--primary); outline: 2px solid rgba(36,115,255,.12); }.attention-edit-form .button { width: fit-content; }
.file-row { justify-content: space-between; }.file-row span { min-width: 0; overflow-wrap: anywhere; }.empty { margin-top: 14px; padding: 24px; border: 1px dashed #cbd8eb; border-radius: 10px; color: var(--muted); text-align: center; }
.download-disclaimer { margin: 16px 0 0; padding-top: 12px; border-top: 1px solid var(--line); color: #77849a; font-size: 13px; text-align: right; }
.site-footer { margin-top: -28px; padding: 0 20px 18px; color: #77849a; font-size: 14px; font-weight: 500; text-align: center; }

.users-page { width: min(1180px, calc(100vw - 40px)); }
.users-hero { display: flex; min-height: 190px; padding: 30px 34px; border: 1px solid #d8e5f8; border-radius: 18px; align-items: center; justify-content: space-between; gap: 24px; background: radial-gradient(circle at 88% 20%,rgba(77,139,255,.18),transparent 32%),linear-gradient(135deg,#fff,#edf4ff); box-shadow: 0 14px 34px rgba(39,82,153,.07); }
.users-hero h1 { margin: 6px 0 7px; font-size: 31px; }.users-hero p { max-width: 670px; margin: 0; color: var(--muted); }
.users-total { flex: 0 0 auto; padding: 10px 15px; border: 1px solid #c5d9fb; border-radius: 999px; background: rgba(255,255,255,.82); color: var(--primary); font-size: 13px; font-weight: 800; }
.quota-save-success { display: flex; margin-top: 16px; padding: 13px 16px; border: 1px solid #b9e2d3; border-radius: 11px; align-items: center; gap: 10px; background: #edf9f4; color: #236b55; }.quota-save-success span { color: #4a7969; }
.account-save-error { display: flex; margin-top: 16px; padding: 13px 16px; border: 1px solid #efc3be; border-radius: 11px; align-items: center; gap: 10px; background: #fff3f1; color: var(--danger); }.account-save-error span { color: #92524c; }.account-save-error.compact { display: block; margin-top: 18px; }
.users-panel { margin-top: 18px; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: white; box-shadow: 0 10px 28px rgba(41,84,157,.05); }
.users-panel-head { display: flex; padding-bottom: 18px; border-bottom: 1px solid var(--line); align-items: flex-end; justify-content: space-between; gap: 18px; }
.users-panel-head h2 { margin: 0; font-size: 21px; }.users-panel-head p { margin: 4px 0 0; color: var(--muted); }.users-panel-head > span { color: #71809a; font-size: 12px; }
.user-create-panel { border-color: #cfdef5; background: linear-gradient(145deg,#fff,#f8fbff); }.user-create-form { display: grid; grid-template-columns: repeat(4,minmax(150px,1fr)) auto; margin-top: 18px; align-items: end; gap: 12px; }.user-create-form label { display: grid; gap: 6px; color: var(--muted); font-size: 11px; }.user-create-form input { width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid #d1def2; border-radius: 9px; background: white; color: var(--text); }.user-create-form input:focus { border-color: var(--primary); outline: 2px solid rgba(36,115,255,.12); }.user-create-form .button { min-height: 42px; white-space: nowrap; }.user-create-form :disabled { cursor: not-allowed; opacity: .58; }
.quota-user-list { display: grid; gap: 12px; margin-top: 18px; }
.quota-user-row { display: grid; grid-template-columns: minmax(180px,.7fr) minmax(130px,.5fr) minmax(460px,1.4fr); padding: 18px; border: 1px solid #e0e8f4; border-radius: 13px; align-items: center; gap: 20px; background: #fbfdff; }
.quota-user-identity { display: flex; align-items: center; gap: 11px; }.quota-user-identity > div { display: grid; }.quota-user-identity small { color: var(--muted); font-size: 11px; }.account-delete-form { margin-top: 4px; }.account-delete-button { width: fit-content; padding: 0; border: 0; background: transparent; color: var(--danger); cursor: pointer; font-size: 11px; font-weight: 700; }.account-delete-button:hover { text-decoration: underline; }
.quota-user-avatar { display: inline-grid; width: 42px; height: 42px; border-radius: 13px; place-items: center; background: linear-gradient(145deg,#2d7cff,#0b50d2); color: white; font-weight: 800; box-shadow: 0 8px 17px rgba(20,100,246,.18); }
.quota-user-status { display: grid; justify-items: start; gap: 4px; }.quota-user-status > small { color: #8996aa; font-size: 10px; }
.quota-status-badge { display: inline-flex; min-height: 29px; padding: 4px 10px; border-radius: 999px; align-items: center; background: #eaf2ff; color: #185cc9; font-size: 11px; font-weight: 800; }
.quota-status-badge.is-unlimited { background: #e8f7f1; color: #087b59; }.quota-status-badge.is-exhausted { background: #fff0df; color: #a45108; }.quota-status-badge.is-error { background: #ffedeb; color: var(--danger); }
.quota-edit-form { display: flex; align-items: flex-end; justify-content: flex-end; gap: 10px; }.quota-edit-form label { display: grid; min-width: 155px; gap: 5px; color: var(--muted); font-size: 11px; }.quota-edit-form input { width: 100%; min-height: 39px; padding: 8px 11px; border: 1px solid #d1def2; border-radius: 9px; background: white; color: var(--text); }.quota-edit-form input:focus { border-color: var(--primary); outline: 2px solid rgba(36,115,255,.12); }
.quota-edit-actions { display: flex; gap: 8px; }.quota-edit-actions .button { white-space: nowrap; }
.quota-edit-form :disabled, .account-delete-button:disabled { cursor: not-allowed; opacity: .48; }
.record-inline-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 5px; }
.record-inline-actions a { color: var(--primary); font-size: 11px; font-weight: 700; }
.record-inline-actions a:hover { text-decoration: underline; }
.history-record-list { display: grid; gap: 10px; margin-top: 18px; }
.history-record-row { display: grid; grid-template-columns: minmax(180px,.8fr) 1fr auto; padding: 16px 18px; border: 1px solid #e0e8f4; border-radius: 12px; align-items: center; gap: 18px; background: #fbfdff; }
.history-record-row > div:first-child { display: grid; }
.history-record-row small, .history-record-row > span { color: var(--muted); font-size: 12px; }
.record-actions { display: flex; gap: 8px; }
.record-hero { margin-bottom: 18px; }
.record-summary-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; margin-bottom: 18px; }
.record-summary-grid article { display: grid; min-height: 108px; padding: 20px; border: 1px solid var(--line); border-radius: 13px; align-content: center; gap: 4px; background: white; box-shadow: 0 10px 25px rgba(41,84,157,.05); }
.record-summary-grid small { color: var(--muted); }
.record-summary-grid strong { color: var(--primary); font-size: 28px; }
.record-panel { margin-top: 18px; }
.record-panel .panel-head { margin-bottom: 16px; }
.record-panel .panel-head h2 { margin: 0; }
.record-panel .panel-head p { margin: 3px 0 0; }
.record-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 11px; }
.record-table { width: 100%; min-width: 900px; border-collapse: collapse; background: white; font-size: 12px; }
.record-table th { padding: 11px 13px; border-bottom: 1px solid var(--line); background: #f3f7ff; color: #586781; text-align: left; white-space: nowrap; }
.record-table td { padding: 13px; border-bottom: 1px solid #e8eef8; vertical-align: top; }
.record-table tr:last-child td { border-bottom: 0; }
.record-file-list { display: grid; gap: 3px; margin: 0 0 6px; padding-left: 17px; }
.record-job-id { display: block; max-width: 240px; overflow-wrap: anywhere; color: #8793a8; font-size: 10px; }
.quota-history-table { min-width: 760px; }

.login-body { min-height: 100vh; background: #eef4ff; }.login-page { min-height: 100vh; padding: 30px; }.login-shell { display: grid; grid-template-columns: minmax(460px,1.1fr) minmax(420px,.9fr); width: min(1120px,100%); min-height: 660px; margin: 0 auto; overflow: hidden; border: 1px solid rgba(210,225,249,.9); border-radius: 24px; background: white; box-shadow: 0 28px 80px rgba(28,72,147,.15); }
.login-brand-panel { position: relative; overflow: hidden; padding: 40px 46px; color: white; background: linear-gradient(145deg,#0f5dea,#073aa7); }
.login-brand-panel::before, .login-brand-panel::after { position: absolute; width: 420px; height: 420px; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; content: ""; }.login-brand-panel::before { right: -150px; bottom: -190px; box-shadow: 0 0 0 55px rgba(255,255,255,.03),0 0 0 110px rgba(255,255,255,.03); }.login-brand-panel::after { top: -300px; left: -210px; }
.login-brand { position: relative; z-index: 2; display: flex; align-items: center; gap: 12px; font-size: 21px; }.login-brand .brand-mark { color: rgba(255,255,255,.18); }.large-mark { width: 42px; height: 46px; }
.login-message { position: relative; z-index: 2; margin-top: 80px; }.login-message > span, .login-heading > span { font-size: 11px; font-weight: 800; letter-spacing: .18em; opacity: .78; }.login-message h1 { margin: 12px 0 18px; font-size: 45px; line-height: 1.2; }.login-message p { max-width: 420px; color: rgba(255,255,255,.75); font-size: 16px; line-height: 1.8; }
.login-visual { position: absolute; right: 45px; bottom: 42px; display: grid; width: 165px; height: 190px; place-items: center; clip-path: polygon(50% 0,94% 17%,87% 72%,50% 100%,13% 72%,6% 17%); background: linear-gradient(145deg,rgba(255,255,255,.4),rgba(255,255,255,.08)); filter: drop-shadow(0 20px 25px rgba(0,0,0,.15)); }.login-visual::before { position: absolute; inset: 10px; border: 1px solid rgba(255,255,255,.35); clip-path: inherit; content: ""; }.login-visual span { font-size: 48px; font-weight: 800; }
.login-form-panel { display: flex; align-items: center; justify-content: center; padding: 48px; }.login-form { width: min(370px,100%); }.login-heading { margin-bottom: 30px; }.login-heading > span { color: var(--primary); }.login-heading h2 { margin: 7px 0 4px; font-size: 31px; }.login-heading p { margin: 0; color: var(--muted); }
.field-label { display: block; margin: 17px 0 7px; color: #34415c; font-size: 13px; font-weight: 700; }.input-wrap { display: flex; min-height: 48px; padding: 0 14px; border: 1px solid #d7e1f0; border-radius: 10px; align-items: center; background: #fbfdff; }.input-wrap:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(20,100,246,.09); }.input-wrap > span { margin-right: 10px; color: #9bb0d0; font-size: 10px; }.input-wrap input { min-width: 0; flex: 1; padding: 10px 0; border: 0; outline: 0; background: transparent; color: var(--text); }.login-submit { width: 100%; min-height: 48px; margin-top: 25px; }.session-note { margin: 16px 0 0; color: #8793a6; font-size: 11px; text-align: center; }.login-error { padding: 10px 12px; border: 1px solid #fac5bf; border-radius: 9px; background: #fff1ef; color: var(--danger); font-size: 13px; }

@media (max-width: 1180px) {
  .topbar { grid-template-columns: 1fr auto; }.main-nav { display: none; }.account-cluster { grid-column: 2; }
  .hero { grid-template-columns: .95fr 1.05fr; padding-right: 18px; padding-left: 18px; }.hero-copy { padding-left: 0; }
  .workflow-step small { display: none; }.user-create-form { grid-template-columns: 1fr 1fr; }.user-create-form .button { grid-column: 2; }.quota-user-row { grid-template-columns: minmax(180px,.8fr) minmax(120px,.5fr) 1fr; }.quota-edit-form { align-items: stretch; flex-direction: column; }.quota-edit-actions { justify-content: flex-end; }.history-record-row { grid-template-columns: minmax(160px,.7fr) 1fr; }.history-record-row .record-actions { grid-column: 1 / -1; justify-content: flex-end; }.login-shell { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 820px) {
  .topbar { min-height: 62px; padding: 0 14px; }.brand { font-size: 14px; }.brand-mark { width: 30px; height: 34px; }.account-cluster { gap: 6px; }.quota-pill { min-height: 38px; padding: 5px 9px; }.quota-pill small { display: none; }.account-menu summary { min-width: 0; }.account-menu summary > span:nth-child(2), .chevron { display: none; }
  .hero { display: block; min-height: auto; padding: 54px 20px 42px; }.hero h1 { font-size: 40px; }.hero-copy > p { font-size: 15px; }.hero-art { display: none; }
  .workflow-panel, .metrics, .response-workbench { width: min(100vw - 24px,1480px); }.workflow-panel { overflow-x: auto; }.panel-title-row { align-items: flex-start; flex-direction: column; }.workflow-steps { min-width: 760px; }
  .metrics { grid-template-columns: 1fr 1fr; }.workbench-head { align-items: flex-start; flex-direction: column; }.workbench-grid, .grid.two { grid-template-columns: 1fr; }.section-head { align-items: flex-start; flex-direction: column; }.actions { flex-wrap: wrap; }.jobs-head { align-items: flex-start; }
  .page { width: min(100vw - 24px,1280px); padding-top: 20px; }.detail-hero { padding: 20px; }.detail-hero h1 { font-size: 22px; }.users-hero { min-height: 0; padding: 24px; align-items: flex-start; flex-direction: column; }.users-hero h1 { font-size: 26px; }.users-panel-head { align-items: flex-start; flex-direction: column; }.user-create-form { grid-template-columns: 1fr; }.user-create-form .button { grid-column: auto; }.quota-user-row { grid-template-columns: 1fr 1fr; }.quota-edit-form { grid-column: 1 / -1; }.record-summary-grid { grid-template-columns: 1fr; }.record-summary-grid article { min-height: 86px; }.record-hero .section-head { align-items: flex-start; flex-direction: column; }
  .login-page { padding: 14px; }.login-shell { display: block; min-height: 0; }.login-brand-panel { min-height: 230px; padding: 26px; }.login-message { margin-top: 35px; }.login-message h1 { font-size: 31px; }.login-message p { font-size: 13px; }.login-visual { display: none; }.login-form-panel { padding: 34px 26px 40px; }
}

@media (max-width: 520px) {
  .brand span:last-child { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.quota-pill { padding-right: 7px; padding-left: 7px; }.hero-actions { align-items: flex-start; flex-direction: column; }.metrics { grid-template-columns: 1fr; }.metrics article { min-height: 100px; }.job-row { align-items: flex-start; flex-wrap: wrap; }.job-main { width: calc(100% - 54px); }.job-row .badge { margin-left: 50px; }.jobs-head { align-items: stretch; flex-direction: column; }.jobs-head > span { align-self: flex-start; }.owner-filter-form { align-items: stretch; flex-direction: column; }.owner-filter-form select, .owner-filter-form .button { width: 100%; }.panel-head { align-items: flex-start; flex-direction: column; }.file-row { align-items: flex-start; flex-direction: column; }.kv { grid-template-columns: 78px minmax(0,1fr); }.quota-user-row, .history-record-row { grid-template-columns: 1fr; }.quota-edit-form { grid-column: auto; }.quota-edit-actions { align-items: stretch; flex-direction: column; }.quota-edit-actions .button { width: 100%; }.history-record-row .record-actions { grid-column: auto; justify-content: stretch; }.history-record-row .record-actions .button { flex: 1; }
}

@media (max-width: 1380px) {
  .dashboard-hero-copy { padding-left: 18px; }.dashboard-stat-grid, .dashboard-panel-grid { width: min(1280px,calc(100vw - 48px)); }
}

@media (max-width: 1180px) {
  .dashboard-hero { grid-template-columns: .95fr 1.05fr; padding-right: 18px; padding-left: 18px; }.dashboard-hero-copy { padding-left: 0; }.dashboard-stat-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }.dashboard-panel-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 820px) {
  .dashboard-hero { display: block; min-height: auto; padding: 42px 20px 28px; }.dashboard-hero h1 { font-size: 46px; }.dashboard-hero-copy > p { font-size: 15px; }.dashboard-hero-art { min-height: 260px; margin-top: 18px; }.dashboard-hero-art svg { height: 260px; }.dashboard-stat-grid, .dashboard-panel-grid { width: min(100vw - 24px,640px); }.dashboard-stat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }.dashboard-stat-card { min-height: 105px; padding: 16px 13px; }.dashboard-stat-icon { width: 52px; height: 52px; }.dashboard-stat-icon svg { width: 28px; height: 28px; }.dashboard-stat-copy small { font-size: 14px; }.dashboard-stat-copy strong { font-size: 26px; }.dashboard-panel-grid { grid-template-columns: 1fr; margin-top: 16px; }.dashboard-panel { min-height: 180px; }.dashboard-hero-actions { flex-wrap: wrap; }.dashboard-button { min-width: 190px; }
}

@media (max-width: 520px) {
  .dashboard-hero { padding: 34px 16px 22px; }.dashboard-eyebrow { font-size: 13px; }.dashboard-hero h1 { margin-top: 9px; font-size: 39px; }.dashboard-hero-actions { align-items: stretch; flex-direction: column; gap: 10px; }.dashboard-button { width: 100%; min-width: 0; min-height: 50px; font-size: 15px; }.dashboard-trust-list { gap: 10px 17px; margin-top: 27px; font-size: 12px; }.dashboard-hero-art { min-height: 190px; }.dashboard-hero-art svg { height: 190px; }.dashboard-stat-grid { grid-template-columns: 1fr; }.dashboard-stat-card { min-height: 96px; }.dashboard-panel { padding: 18px 16px; }.dashboard-list li a { grid-template-columns: 8px minmax(0,1fr); }.dashboard-list time { grid-column: 2; }.dashboard-notice-panel p { max-width: none; }.dashboard-format-panel > small { margin-top: 13px; }
}

.security-disclaimer {
  width: min(520px, 100%);
  margin: 16px 0 2px;
  padding: 11px 13px;
  border: 1px solid #efb8b1;
  border-radius: 9px;
  background: #fff3f1;
  color: #9b342c;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.65;
  text-align: left;
}
.service-status-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 10px;
}
.service-status-grid > div {
  display: grid;
  gap: 5px;
}
.service-status-grid small {
  color: var(--muted);
  font-size: 11px;
}
.account-settings-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(150px, .7fr) auto;
  align-items: end;
}
.service-quota-grid {
  display: contents;
}
.account-settings-form .permission-toggle {
  min-width: 145px;
}
.permission-toggle {
  display: flex !important;
  min-height: 39px;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 11px;
}
.permission-toggle input[type="checkbox"] {
  width: 18px;
  min-height: 18px;
  accent-color: var(--primary);
}
.permission-toggle small {
  color: var(--primary);
  font-size: 10px;
}
.user-create-form {
  grid-template-columns: repeat(5, minmax(130px, 1fr)) auto;
}

@media (max-width: 820px) {
  .user-create-form {
    grid-template-columns: 1fr 1fr;
  }
  .account-settings-form {
    grid-template-columns: 1fr 1fr;
  }
  .account-settings-form .quota-edit-actions {
    grid-column: 1 / -1;
  }
}

@media (max-width: 520px) {
  .user-create-form {
    grid-template-columns: 1fr;
  }
  .security-disclaimer {
    font-size: 12px;
  }
  .service-status-grid,
  .account-settings-form {
    grid-template-columns: 1fr;
  }
  .account-settings-form .quota-edit-actions {
    grid-column: auto;
  }
}
