:root {
  --pv-navy-950: #071626;
  --pv-navy-900: #0b2035;
  --pv-navy-800: #12304d;
  --pv-blue-700: #0757c7;
  --pv-blue-600: #0f62e6;
  --pv-blue-500: #2474ef;
  --pv-blue-100: #eaf2ff;
  --pv-blue-50: #f4f8ff;
  --pv-green-600: #15803d;
  --pv-green-100: #dcfce7;
  --pv-amber-600: #b45309;
  --pv-amber-100: #fef3c7;
  --pv-red-600: #c62828;
  --pv-red-100: #fee2e2;
  --pv-gray-950: #111827;
  --pv-gray-700: #374151;
  --pv-gray-600: #4b5563;
  --pv-gray-500: #6b7280;
  --pv-gray-300: #d1d5db;
  --pv-gray-200: #e5e7eb;
  --pv-gray-100: #f3f4f6;
  --pv-gray-50: #f8fafc;
  --pv-white: #fff;
  --pv-radius-sm: 8px;
  --pv-radius: 12px;
  --pv-radius-lg: 18px;
  --pv-shadow: 0 12px 30px rgba(7, 22, 38, .08);
  --pv-shadow-lg: 0 28px 70px rgba(7, 22, 38, .18);
  --pv-font: "IBM Plex Sans", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { color-scheme: light; }
body { margin: 0; font-family: var(--pv-font); color: var(--pv-gray-950); background: var(--pv-gray-50); line-height: 1.5; }
button, input, select, textarea { font: inherit; }
a { color: var(--pv-blue-600); text-decoration: none; }
a:hover { color: var(--pv-blue-700); text-decoration: underline; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid rgba(15, 98, 230, .35); outline-offset: 2px; }
[hidden] { display: none !important; }

.pv-shell { min-height: 100vh; background: var(--pv-gray-50); }
.pv-topbar { min-height: 64px; color: #fff; background: var(--pv-navy-950); border-bottom: 1px solid rgba(255,255,255,.08); }
.pv-topbar__inner { width: min(1440px, 100%); min-height: 64px; margin: auto; padding: 0 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.pv-brand { display: inline-flex; align-items: center; gap: 12px; color: inherit; font-weight: 600; letter-spacing: .02em; }
.pv-brand:hover { color: inherit; text-decoration: none; }
.pv-brand__mark { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; background: linear-gradient(145deg, var(--pv-blue-500), #47a3ff); box-shadow: inset 0 0 0 1px rgba(255,255,255,.25); }
.pv-brand__copy small { display: block; margin-top: -2px; color: #a9bfd5; font-size: 11px; font-weight: 400; letter-spacing: .08em; }
.pv-topbar__actions { display: flex; align-items: center; gap: 8px; }
.pv-main { width: min(1200px, calc(100% - 40px)); margin: 0 auto; padding: 32px 0 56px; }
.pv-page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.pv-eyebrow { margin: 0 0 6px; color: var(--pv-blue-600); font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.pv-title { margin: 0; color: var(--pv-navy-950); font-size: clamp(26px, 3vw, 36px); font-weight: 600; line-height: 1.2; letter-spacing: -.025em; }
.pv-subtitle { max-width: 680px; margin: 8px 0 0; color: var(--pv-gray-600); font-size: 14px; }
.pv-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.pv-grid { display: grid; gap: 20px; }
.pv-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pv-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.pv-card { background: #fff; border: 1px solid var(--pv-gray-200); border-radius: var(--pv-radius); box-shadow: 0 1px 2px rgba(7,22,38,.03); }
.pv-card__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 22px 16px; border-bottom: 1px solid var(--pv-gray-200); }
.pv-card__head h2, .pv-card__head h3 { margin: 0; font-size: 17px; font-weight: 600; }
.pv-card__body { padding: 22px; }
.pv-card__foot { padding: 16px 22px; background: var(--pv-gray-50); border-top: 1px solid var(--pv-gray-200); border-radius: 0 0 var(--pv-radius) var(--pv-radius); }
.pv-card--accent { border-top: 3px solid var(--pv-blue-600); }

.pv-button { min-height: 44px; padding: 0 17px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid transparent; border-radius: var(--pv-radius-sm); background: var(--pv-blue-600); color: #fff; font-weight: 600; font-size: 14px; cursor: pointer; transition: background .15s, border .15s, transform .15s, box-shadow .15s; }
.pv-button:hover { background: var(--pv-blue-700); color: #fff; text-decoration: none; box-shadow: 0 6px 16px rgba(15,98,230,.18); }
.pv-button:active { transform: translateY(1px); }
.pv-button:disabled, .pv-button[aria-disabled="true"] { opacity: .55; cursor: not-allowed; box-shadow: none; }
.pv-button--secondary { color: var(--pv-gray-950); background: #fff; border-color: var(--pv-gray-300); }
.pv-button--secondary:hover { color: var(--pv-gray-950); background: var(--pv-gray-100); border-color: var(--pv-gray-500); }
.pv-button--ghost { color: var(--pv-blue-600); background: transparent; }
.pv-button--ghost:hover { color: var(--pv-blue-700); background: var(--pv-blue-100); box-shadow: none; }
.pv-button--danger { background: var(--pv-red-600); }
.pv-button--danger:hover { background: #a81717; }
.pv-button--small { min-height: 36px; padding: 0 12px; font-size: 13px; }
.pv-button--wide { width: 100%; }

.pv-field { margin-bottom: 18px; }
.pv-label { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 7px; color: var(--pv-gray-700); font-size: 13px; font-weight: 600; }
.pv-required { color: var(--pv-red-600); }
.pv-input, .pv-select, .pv-textarea { width: 100%; min-height: 46px; padding: 10px 13px; color: var(--pv-gray-950); background: #fff; border: 1px solid var(--pv-gray-300); border-radius: var(--pv-radius-sm); transition: border .15s, box-shadow .15s, background .15s; }
.pv-textarea { min-height: 110px; resize: vertical; }
.pv-input:hover, .pv-select:hover, .pv-textarea:hover { border-color: var(--pv-gray-500); }
.pv-input:focus, .pv-select:focus, .pv-textarea:focus { outline: 0; border-color: var(--pv-blue-600); box-shadow: 0 0 0 3px rgba(15,98,230,.13); }
.pv-input[aria-invalid="true"] { border-color: var(--pv-red-600); box-shadow: 0 0 0 3px rgba(198,40,40,.1); }
.pv-input-group { position: relative; }
.pv-input-group .pv-input { padding-right: 48px; }
.pv-input-action { position: absolute; right: 4px; top: 4px; width: 38px; height: 38px; display: grid; place-items: center; border: 0; border-radius: 6px; color: var(--pv-gray-600); background: transparent; cursor: pointer; }
.pv-input-action:hover { color: var(--pv-blue-700); background: var(--pv-blue-100); }
.pv-help, .pv-error { margin: 6px 0 0; color: var(--pv-gray-500); font-size: 12px; }
.pv-error { color: var(--pv-red-600); }
.pv-check { min-height: 44px; display: inline-flex; align-items: center; gap: 9px; color: var(--pv-gray-700); font-size: 13px; cursor: pointer; }
.pv-check input { width: 18px; height: 18px; accent-color: var(--pv-blue-600); }

.pv-alert { padding: 13px 15px; display: flex; gap: 10px; align-items: flex-start; border: 1px solid #bed6ff; border-radius: var(--pv-radius-sm); color: #12437f; background: var(--pv-blue-50); font-size: 13px; }
.pv-alert--error { color: #8e1c1c; border-color: #fecaca; background: #fff1f2; }
.pv-alert--success { color: #126333; border-color: #bbf7d0; background: #f0fdf4; }
.pv-alert--warning { color: #84420a; border-color: #fde68a; background: #fffbeb; }
.pv-status { display: inline-flex; align-items: center; gap: 6px; min-height: 26px; padding: 3px 9px; border-radius: 999px; color: var(--pv-gray-700); background: var(--pv-gray-100); font-size: 12px; font-weight: 600; white-space: nowrap; }
.pv-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--pv-gray-500); }
.pv-status--success { color: var(--pv-green-600); background: var(--pv-green-100); }
.pv-status--success::before { background: var(--pv-green-600); }
.pv-status--warning { color: var(--pv-amber-600); background: var(--pv-amber-100); }
.pv-status--warning::before { background: var(--pv-amber-600); }
.pv-status--danger { color: var(--pv-red-600); background: var(--pv-red-100); }
.pv-status--danger::before { background: var(--pv-red-600); }
.pv-status--info { color: var(--pv-blue-700); background: var(--pv-blue-100); }
.pv-status--info::before { background: var(--pv-blue-600); }

.pv-metrics { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; margin-bottom: 20px; }
.pv-metric { min-height: 112px; padding: 18px; background: #fff; border: 1px solid var(--pv-gray-200); border-radius: var(--pv-radius); }
.pv-metric__label { color: var(--pv-gray-600); font-size: 13px; }
.pv-metric__value { margin-top: 8px; color: var(--pv-navy-950); font-size: 30px; font-weight: 600; line-height: 1; }
.pv-metric__note { margin-top: 8px; color: var(--pv-gray-500); font-size: 12px; }
.pv-table-wrap { overflow-x: auto; border: 1px solid var(--pv-gray-200); border-radius: var(--pv-radius); background: #fff; }
.pv-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pv-table th { padding: 12px 14px; color: var(--pv-gray-600); background: var(--pv-gray-50); border-bottom: 1px solid var(--pv-gray-200); text-align: left; font-size: 12px; font-weight: 600; letter-spacing: .03em; white-space: nowrap; }
.pv-table td { padding: 14px; border-bottom: 1px solid var(--pv-gray-200); vertical-align: middle; }
.pv-table tr:last-child td { border-bottom: 0; }
.pv-table tbody tr:hover { background: var(--pv-blue-50); }

.pv-tabs { display: flex; align-items: center; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--pv-gray-200); }
.pv-tab { min-height: 46px; padding: 0 15px; border: 0; border-bottom: 3px solid transparent; color: var(--pv-gray-600); background: transparent; font-weight: 600; white-space: nowrap; cursor: pointer; }
.pv-tab:hover { color: var(--pv-blue-700); background: var(--pv-blue-50); }
.pv-tab[aria-selected="true"], .pv-tab.active { color: var(--pv-blue-700); border-bottom-color: var(--pv-blue-600); }
.pv-count { min-width: 22px; height: 22px; padding: 0 6px; display: inline-grid; place-items: center; margin-left: 5px; border-radius: 999px; color: var(--pv-gray-700); background: var(--pv-gray-100); font-size: 11px; }

.pv-empty { min-height: 220px; padding: 32px; display: grid; place-items: center; text-align: center; color: var(--pv-gray-600); }
.pv-empty__icon { width: 52px; height: 52px; margin: 0 auto 12px; display: grid; place-items: center; border-radius: 50%; color: var(--pv-blue-700); background: var(--pv-blue-100); font-size: 22px; }
.pv-empty h3 { margin: 0 0 6px; color: var(--pv-gray-950); font-size: 16px; }
.pv-empty p { margin: 0; font-size: 13px; }
.pv-skeleton { height: 14px; border-radius: 7px; background: linear-gradient(90deg,#eef1f5 25%,#f8fafc 50%,#eef1f5 75%); background-size: 200% 100%; animation: pv-shimmer 1.3s infinite; }
@keyframes pv-shimmer { to { background-position: -200% 0; } }

.pv-dialog { width: min(460px, calc(100% - 32px)); padding: 0; border: 0; border-radius: var(--pv-radius-lg); box-shadow: var(--pv-shadow-lg); }
.pv-dialog::backdrop { background: rgba(7,22,38,.62); backdrop-filter: blur(3px); }
.pv-dialog__head { padding: 22px 24px 14px; }
.pv-dialog__head h2 { margin: 0; font-size: 20px; }
.pv-dialog__body { padding: 0 24px 22px; color: var(--pv-gray-600); }
.pv-dialog__foot { padding: 16px 24px; display: flex; justify-content: flex-end; gap: 10px; background: var(--pv-gray-50); border-top: 1px solid var(--pv-gray-200); border-radius: 0 0 var(--pv-radius-lg) var(--pv-radius-lg); }
.pv-toast-region { position: fixed; z-index: 1000; right: 20px; bottom: 20px; display: grid; gap: 10px; pointer-events: none; }
.pv-toast { min-width: min(340px, calc(100vw - 40px)); padding: 13px 15px; color: #fff; background: var(--pv-navy-900); border-radius: var(--pv-radius-sm); box-shadow: var(--pv-shadow-lg); animation: pv-toast-in .18s ease-out; }
.pv-toast--error { background: #8e1c1c; }
@keyframes pv-toast-in { from { opacity: 0; transform: translateY(8px); } }

.pv-auth { min-height: 100vh; display: grid; grid-template-columns: minmax(360px, 46%) 1fr; background: var(--pv-gray-50); }
.pv-auth__brand { min-height: 100vh; padding: clamp(32px, 5vw, 72px); display: flex; flex-direction: column; justify-content: space-between; color: #fff; background: linear-gradient(155deg, var(--pv-navy-950), var(--pv-navy-800)); position: relative; overflow: hidden; }
.pv-auth__brand::after { content: ""; position: absolute; right: -18%; bottom: -16%; width: 560px; aspect-ratio: 1; border: 1px solid rgba(91,164,255,.22); border-radius: 50%; box-shadow: 0 0 0 80px rgba(36,116,239,.06), 0 0 0 160px rgba(36,116,239,.04); }
.pv-auth__brand > * { position: relative; z-index: 1; }
.pv-auth__brand-copy { max-width: 580px; }
.pv-auth__brand-copy h1 { max-width: 560px; margin: 0 0 20px; font-size: clamp(36px, 5vw, 58px); font-weight: 300; line-height: 1.12; letter-spacing: -.04em; }
.pv-auth__brand-copy p { max-width: 530px; margin: 0; color: #bfd0e1; font-size: 16px; line-height: 1.8; }
.pv-auth__steps { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; margin-top: 36px; background: rgba(255,255,255,.13); }
.pv-auth__step { padding: 14px; background: rgba(8,27,45,.8); }
.pv-auth__step span { display: block; margin-bottom: 4px; color: #6fb0ff; font-size: 11px; font-weight: 600; letter-spacing: .1em; }
.pv-auth__step strong { font-size: 13px; font-weight: 500; }
.pv-auth__panel { min-height: 100vh; padding: 32px; display: grid; place-items: center; }
.pv-auth__box { width: min(440px, 100%); }
.pv-auth__box h2 { margin: 0; color: var(--pv-navy-950); font-size: 30px; font-weight: 600; letter-spacing: -.02em; }
.pv-auth__intro { margin: 8px 0 28px; color: var(--pv-gray-600); font-size: 14px; }
.pv-auth__links { margin-top: 20px; padding-top: 18px; display: flex; justify-content: space-between; gap: 16px; border-top: 1px solid var(--pv-gray-200); color: var(--pv-gray-600); font-size: 13px; }
.pv-segment { padding: 4px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-bottom: 24px; background: var(--pv-gray-100); border-radius: 10px; }
.pv-segment button { min-height: 40px; border: 0; border-radius: 7px; color: var(--pv-gray-600); background: transparent; cursor: pointer; }
.pv-segment button[aria-pressed="true"] { color: var(--pv-navy-950); background: #fff; box-shadow: 0 1px 4px rgba(7,22,38,.12); font-weight: 600; }
.pv-profile { display: grid; grid-template-columns: 300px minmax(0,1fr); gap: 20px; }
.pv-identity { padding: 26px 22px; text-align: center; }
.pv-avatar { width: 76px; height: 76px; margin: 0 auto 14px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: linear-gradient(145deg,var(--pv-blue-600),#49a4ff); font-size: 28px; font-weight: 600; }
.pv-identity h2 { margin: 0; font-size: 20px; }
.pv-identity p { margin: 4px 0 14px; color: var(--pv-gray-500); font-size: 13px; }
.pv-meta-list { margin: 22px 0 0; padding: 0; list-style: none; text-align: left; border-top: 1px solid var(--pv-gray-200); }
.pv-meta-list li { padding: 12px 0; display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--pv-gray-200); font-size: 12px; }
.pv-meta-list span { color: var(--pv-gray-500); }

@media (max-width: 900px) {
  .pv-auth { grid-template-columns: 1fr; }
  .pv-auth__brand { min-height: auto; padding: 28px 24px; }
  .pv-auth__brand-copy { margin-top: 50px; }
  .pv-auth__brand-copy h1 { font-size: 34px; }
  .pv-auth__steps { display: none; }
  .pv-auth__panel { min-height: auto; padding: 42px 20px; }
  .pv-profile { grid-template-columns: 1fr; }
  .pv-grid--3 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .pv-topbar__inner { padding: 0 16px; }
  .pv-brand__copy small { display: none; }
  .pv-main { width: min(100% - 28px, 1200px); padding-top: 22px; }
  .pv-page-head { align-items: flex-start; flex-direction: column; }
  .pv-grid--2, .pv-grid--3, .pv-metrics { grid-template-columns: 1fr; }
  .pv-card__head, .pv-card__body { padding-left: 16px; padding-right: 16px; }
  .pv-auth__brand-copy { margin-top: 34px; }
  .pv-auth__brand-copy h1 { font-size: 30px; }
  .pv-auth__brand-copy p { font-size: 14px; }
  .pv-auth__panel { padding: 32px 18px; }
  .pv-auth__links { flex-direction: column; }
  .pv-dialog__foot { flex-direction: column-reverse; }
  .pv-dialog__foot .pv-button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }