:root { --canvas:#f4f5f1; --surface:#fff; --line:#dde2dc; --ink:#1a2c2a; --muted:#64716e; --nav:#153b38; --nav-muted:#a6c0ba; --teal:#0f796e; --teal-soft:#e8f3ef; --blue:#356c98; --amber:#9a6115; --amber-soft:#fff4df; --coral:#ac4436; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; background:var(--canvas); color:var(--ink); font:14px/1.45 Inter,"PingFang SC","Microsoft YaHei",Arial,sans-serif; }
button,select,input { font:inherit; } button { cursor:pointer; } h1,h2,p { margin-top:0; } h1 { margin-bottom:3px; font-size:29px; line-height:1.18; letter-spacing:0; } h2 { margin-bottom:0; font-size:16px; letter-spacing:0; } .hidden { display:none!important; }
.login-shell { min-height:100vh; display:grid; place-items:center; padding:24px; background:var(--canvas); } .login-panel { width:min(100%,390px); padding:32px; border:1px solid var(--line); border-radius:6px; background:var(--surface); box-shadow:0 12px 32px rgba(18,54,50,.07); }.brand { display:flex; align-items:center; gap:9px; color:#fff; font-size:19px; font-weight:750; }.brand-dark { color:var(--ink); margin-bottom:30px; }.brand-mark { width:13px; height:13px; border-radius:2px; background:#7dceb5; }.eyebrow { margin:0 0 7px; color:var(--muted); font-size:11px; font-weight:740; letter-spacing:.06em; text-transform:uppercase; }.login-copy,.page-subtitle { color:var(--muted); }.login-copy { margin:0 0 22px; }.login-panel label { display:grid; gap:7px; margin-top:15px; font-size:13px; font-weight:680; }.login-panel input { width:100%; padding:10px; border:1px solid var(--line); border-radius:5px; }.login-panel input:focus { outline:2px solid #a5d7ca; outline-offset:1px; border-color:var(--teal); }.login-error { margin:14px 0 -4px; padding:9px 10px; color:#8f2f25; background:#fff0ee; font-size:12px; }.button { padding:9px 12px; border:1px solid var(--line); border-radius:5px; background:var(--surface); color:var(--ink); }.button.primary { width:100%; margin-top:20px; border-color:var(--teal); background:var(--teal); color:#fff; }.button.primary:hover { background:#0c645c; }
.password-dialog { width:min(100% - 32px, 410px); padding:0; border:1px solid var(--line); border-radius:6px; box-shadow:0 18px 60px rgba(18,54,50,.2); }.password-dialog::backdrop { background:rgba(18,44,42,.4); }.password-form { padding:23px; background:var(--surface); }.password-form label { display:grid; gap:7px; margin-top:14px; color:#4e5e5a; font-size:12px; font-weight:660; }.password-form input { width:100%; padding:10px; border:1px solid var(--line); border-radius:4px; }.password-form input:focus { outline:2px solid #a5d7ca; outline-offset:1px; border-color:var(--teal); }.dialog-close { width:28px; height:28px; border:0; border-radius:4px; background:transparent; color:var(--muted); font-size:23px; line-height:1; }.dialog-close:hover { background:#edf2ef; color:var(--ink); }.password-message { min-height:18px; margin:13px 0 -7px; color:var(--teal); font-size:12px; }
.app-shell { display:grid; grid-template-columns:224px minmax(0,1fr); min-height:100vh; }.sidebar { display:flex; flex-direction:column; padding:27px 16px 18px; background:var(--nav); }.workspace-label { margin:14px 4px 34px; color:var(--nav-muted); font-size:12px; }.nav-list { display:grid; gap:4px; }.nav-item { padding:10px 12px; border-radius:5px; color:var(--nav-muted); text-decoration:none; }.nav-item:hover,.nav-item.active { background:rgba(255,255,255,.11); color:#fff; }.sidebar-footer { display:flex; align-items:center; gap:8px; margin-top:auto; padding:10px 4px; color:var(--nav-muted); font-size:12px; }.live-dot { width:7px; height:7px; border-radius:50%; background:#7dceb5; }
.main-content { width:100%; max-width:1660px; margin:0 auto; padding:35px 42px 56px; }.topbar { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:22px; }.page-subtitle { margin:7px 0 0; }.header-actions { display:flex; align-items:center; gap:9px; padding-top:3px; }.updated { margin-right:6px; color:var(--muted); font-size:12px; white-space:nowrap; }.icon-button { width:34px; height:34px; border:1px solid var(--line); border-radius:5px; background:var(--surface); color:var(--ink); font-size:18px; line-height:1; }.icon-button:hover { border-color:var(--teal); color:var(--teal); }
.policy-strip { display:flex; align-items:center; gap:17px; padding:13px 16px; border:1px solid #cce0da; border-radius:6px; background:var(--teal-soft); color:#28514c; }.policy-intro { display:grid; gap:1px; min-width:108px; }.formula-label { color:var(--teal); font-size:11px; font-weight:750; }.policy-rule { display:flex; align-items:center; flex-wrap:wrap; gap:6px; padding-left:17px; border-left:1px solid #bed7cf; font-size:12px; }.policy-rule strong { font-size:13px; }.rule-arrow { color:#79a89e; }.rule-tag,.policy-tag { display:inline-flex; align-items:center; min-height:22px; padding:2px 7px; border-radius:3px; background:#d9ebe5; color:#176a60; font-size:11px; font-weight:720; white-space:nowrap; }.rule-tag.nano,.policy-tag.nano { background:var(--amber-soft); color:var(--amber); }.owner-only { margin-left:auto; color:#496963; }.partner .owner-only,.partner .owner-metric { display:none; }
.toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:22px 0 12px; }.filters { display:flex; gap:10px; }.filters label { color:var(--muted); font-size:12px; }.filters select { margin-left:6px; padding:7px 26px 7px 8px; border:1px solid var(--line); border-radius:5px; background:var(--surface); color:var(--ink); }.audit-chip { display:inline-flex; align-items:center; gap:6px; color:var(--teal); font-size:12px; font-weight:680; }.audit-chip span { font-size:10px; }.demo-banner { margin:0 0 14px; padding:10px 12px; border-left:3px solid #d2a02f; background:#fff6df; color:#6a5521; }
.metrics-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); overflow:hidden; border:1px solid var(--line); border-radius:6px; background:var(--surface); }.metric { min-height:116px; padding:17px; border-right:1px solid var(--line); }.metric:last-child { border-right:0; }.metric span { display:block; color:var(--muted); font-size:12px; }.metric strong { display:block; margin:10px 0 6px; font-size:22px; letter-spacing:0; }.metric small { color:var(--muted); font-size:11px; }.metric.emphasis { background:#f7fbf9; }.metric.emphasis strong,.positive { color:var(--teal); font-weight:730; }.nano-metric { background:#fffcf6; }.partner .metrics-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.partner-metric { display:none; }.partner .partner-metric { display:block; }
.content-grid { display:grid; grid-template-columns:minmax(0,1fr) 298px; gap:18px; margin-top:18px; }.table-section,.side-panel { border:1px solid var(--line); border-radius:6px; background:var(--surface); }.section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:18px 18px 15px; border-bottom:1px solid var(--line); }.table-note { padding-top:7px; color:var(--muted); font-size:12px; white-space:nowrap; }.table-wrap { overflow-x:auto; } table { width:100%; min-width:700px; border-collapse:collapse; } th { padding:11px 13px; border-bottom:1px solid var(--line); background:#fafbf9; color:var(--muted); font-size:11px; font-weight:720; text-align:right; white-space:nowrap; } td { padding:12px 13px; border-bottom:1px solid #edf0eb; text-align:right; white-space:nowrap; } th:first-child,td:first-child { text-align:left; } tbody tr:last-child td { border-bottom:0; }.product-name { font-weight:690; }.model-sub { display:block; margin-top:3px; color:var(--muted); font-size:11px; font-weight:400; }.reference { color:#53635f; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12px; }.side-panel { padding-bottom:14px; }.bar-list { padding:5px 18px 12px; }.bar-item { margin:15px 0; }.bar-label { display:flex; justify-content:space-between; gap:8px; margin-bottom:7px; font-size:12px; }.bar-track { height:7px; overflow:hidden; border-radius:3px; background:#edf0eb; }.bar-fill { height:7px; border-radius:3px; background:var(--blue); }.risk-panel { margin:7px 18px 0; padding:14px; border-left:3px solid var(--teal); background:#f7fbf9; }.risk-kicker { display:block; margin-bottom:7px; color:var(--teal); font-size:11px; font-weight:740; }.risk-panel strong { font-size:16px; }.risk-panel p { margin:7px 0 0; color:var(--muted); font-size:12px; line-height:1.55; }.settlement-section { margin-top:18px; }
.rules-section { margin-top:18px; overflow:hidden; border:1px solid var(--line); border-radius:6px; background:var(--surface); }.rules-note { max-width:920px; margin:16px 18px 0; color:var(--muted); font-size:12px; line-height:1.6; }.catalog-wrap { margin:15px 18px 18px; padding:13px 14px; border:1px solid #d6e4df; background:#f7fbf9; }.catalog-title { margin:0 0 10px; color:#496963; font-size:12px; font-weight:700; }.catalog-list { display:flex; flex-wrap:wrap; gap:8px; }.catalog-item { display:grid; grid-template-columns:auto auto; gap:1px 8px; max-width:100%; padding:8px 10px; border:1px solid #ccdcd6; border-radius:4px; background:#fff; color:var(--ink); text-align:left; }.catalog-item:hover,.catalog-item:focus-visible { border-color:var(--teal); outline:0; box-shadow:0 0 0 2px #cde6de; }.catalog-item strong { font-size:12px; }.catalog-item span { grid-column:1 / -1; overflow:hidden; color:var(--muted); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }.catalog-item em { color:var(--amber); font-size:11px; font-style:normal; }.catalog-item.configured em { color:var(--teal); }.rules-table-wrap { border-top:1px solid var(--line); }.rule-form { margin:18px; padding:18px; border:1px solid #d5e3de; border-radius:5px; background:#f9fcfa; }.form-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:15px; }.form-heading h3 { margin:0; font-size:16px; }.form-message { color:var(--teal); font-size:12px; text-align:right; }.rule-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; }.rule-fields label { display:grid; gap:6px; color:#4e5e5a; font-size:12px; font-weight:660; }.rule-fields input,.rule-fields select { width:100%; min-width:0; padding:9px 10px; border:1px solid var(--line); border-radius:4px; background:#fff; color:var(--ink); }.rule-fields input:focus,.rule-fields select:focus { outline:2px solid #a5d7ca; outline-offset:1px; border-color:var(--teal); }.field-wide { grid-column:span 2; }.form-footer { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:16px; }.form-footer p { max-width:640px; margin:0; color:var(--muted); font-size:12px; }.button.compact { width:auto; margin:0; white-space:nowrap; }.empty-cell { padding:24px; color:var(--muted); text-align:center!important; }
@media (max-width:1180px) { .policy-strip { align-items:flex-start; flex-wrap:wrap; }.owner-only { margin-left:0; }.metrics-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.metric:nth-child(3) { border-right:0; }.metric:nth-child(-n+3) { border-bottom:1px solid var(--line); }.content-grid { grid-template-columns:1fr; }.side-panel { display:grid; grid-template-columns:1fr 1fr; }.side-panel .section-heading { grid-column:1/-1; }.risk-panel { margin-bottom:14px; }.rule-fields { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .app-shell { display:block; }.sidebar { display:none; }.main-content { padding:21px 16px 34px; }.topbar,.toolbar { align-items:flex-start; flex-direction:column; }.header-actions { width:100%; justify-content:space-between; }.updated { margin-right:auto; }.policy-strip { display:grid; gap:11px; }.policy-rule { padding-left:0; border-left:0; }.metrics-grid,.partner .metrics-grid { grid-template-columns:1fr 1fr; }.metric { border-bottom:1px solid var(--line); }.metric:nth-child(2n) { border-right:0; }.metric:last-child { border-bottom:0; }.content-grid { margin-top:14px; }.side-panel { display:block; }.filters { width:100%; }.filters label { flex:1; }.filters select { width:calc(100% - 32px); }.audit-chip { display:none; }.table-note { white-space:normal; text-align:right; }.login-panel { padding:26px; }.rule-fields { grid-template-columns:1fr; }.field-wide { grid-column:auto; }.form-footer { align-items:flex-start; flex-direction:column; }.button.compact { width:100%; }.catalog-item { width:100%; }.rule-form { margin:14px; padding:14px; } }

.policy-tag.pending_pricing { background:var(--amber-soft); color:var(--amber); }
.policy-tag.failed,.policy-tag.exception { background:#fff0ee; color:#8f2f25; }
.policy-tag.refund { background:#eef2f8; color:#42678e; }