:root { color-scheme: light; --ink:#172033; --muted:#667085; --line:#e6eaf0; --paper:#fff; --bg:#f5f7fb; --blue:#356ae6; --blue-soft:#edf3ff; --red:#c43d4b; --amber:#a56a00; --green:#16704b; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); font:14px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif; }
.shell { max-width:1220px; margin:0 auto; padding:38px 24px 60px; }
.hero { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; margin-bottom:28px; }
.eyebrow { margin:0 0 8px; color:var(--blue); font-size:11px; font-weight:700; letter-spacing:.14em; }
h1 { margin:0; font-size:34px; line-height:1.2; letter-spacing:-.03em; }
h2 { margin:0; font-size:18px; }
.subtitle { color:var(--muted); max-width:700px; margin:12px 0 0; }
.privacy-badge,.badge { background:var(--blue-soft); color:var(--blue); padding:6px 10px; border-radius:999px; font-size:12px; white-space:nowrap; }
.panel { background:var(--paper); border:1px solid var(--line); border-radius:16px; padding:22px; margin-bottom:18px; box-shadow:0 4px 18px rgba(30,50,90,.03); }
.panel-heading { display:flex; justify-content:space-between; gap:20px; align-items:center; }
.panel-heading.compact { margin-bottom:16px; }
.panel-heading p { color:var(--muted); margin:5px 0 0; }
.file-button,.secondary-button,.primary-button { display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:10px; background:var(--blue); color:white; padding:10px 15px; cursor:pointer; font-weight:600; }
.file-button input { display:none; }
.secondary-button { background:#eef1f6; color:var(--ink); font-size:13px; }
.quick-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.holdings-heading .status { margin:4px 0 0; }
.holdings-heading-actions { display:flex; align-items:center; justify-content:flex-end; gap:12px; }
.holdings-heading-actions .muted { margin:0; }
.section-nav { position:sticky; top:8px; z-index:30; display:flex; gap:8px; overflow-x:auto; margin:0 0 18px; padding:8px; border:1px solid var(--line); border-radius:13px; background:rgba(255,255,255,.94); box-shadow:0 5px 18px rgba(30,50,90,.08); backdrop-filter:blur(10px); scrollbar-width:none; }
.section-nav::-webkit-scrollbar { display:none; }
.section-nav a { flex:0 0 auto; padding:7px 12px; border-radius:8px; color:var(--muted); text-decoration:none; font-size:13px; font-weight:650; }
.section-nav a:hover,.section-nav a:focus { color:var(--blue); background:var(--blue-soft); outline:none; }
.section-anchor { scroll-margin-top:76px; }
.holding-form { border:1px solid #cbd7ee; border-radius:12px; background:#f8faff; padding:16px; margin-top:18px; }
.form-title { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.icon-button { border:0; background:transparent; color:var(--muted); cursor:pointer; }
.form-grid { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px 12px; align-items:start; }.form-grid > label { min-width:0; }.form-grid input,.form-grid select { width:100%; min-width:0; }
.choice-input { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-top:5px; }.choice-input select,.choice-input input { margin-top:0; min-width:0; }
.combo { position:relative; display:flex; margin-top:5px; }.combo input { margin-top:0; padding-right:34px; }.combo-toggle { position:absolute; right:0; top:0; height:100%; width:32px; border:0; background:transparent; color:var(--muted); cursor:pointer; font-size:17px; }.combo-menu { display:none; position:absolute; z-index:20; left:0; right:0; top:calc(100% + 3px); max-height:190px; overflow:auto; background:#fff; border:1px solid #cbd5e1; border-radius:8px; box-shadow:0 8px 20px rgba(30,50,90,.15); }.combo.open .combo-menu { display:block; }.combo-option { padding:8px 10px; cursor:pointer; }.combo-option:hover { background:var(--blue-soft); color:var(--blue); }
.type-guide { margin:12px 0 0; padding:10px 12px; border-radius:8px; background:#eef4ff; color:#31558f; font-size:12px; }
.form-actions { display:flex; gap:10px; margin-top:14px; }
.drop-zone { border:1.5px dashed #b9c4d5; border-radius:12px; padding:20px; color:var(--muted); text-align:center; margin-top:18px; transition:.2s; }
.drop-zone.active { border-color:var(--blue); background:var(--blue-soft); color:var(--blue); }
.assumptions { display:grid; grid-template-columns:1fr 1fr 2fr; gap:12px; margin-top:16px; }
label { color:var(--muted); font-size:12px; }
select,input[type=text] { display:block; width:100%; margin-top:5px; border:1px solid var(--line); border-radius:8px; padding:9px 10px; color:var(--ink); background:#fff; font:inherit; }
.status,.muted { color:var(--muted); font-size:12px; margin:14px 0 0; }
.hidden { display:none; }
.alerts { display:grid; gap:10px; margin-bottom:18px; }
.alert { border-radius:10px; padding:11px 14px; border-left:4px solid var(--amber); background:#fff8e8; color:#765000; }
.alert.error { border-left-color:var(--red); background:#fff0f1; color:#8e2634; }
.cards { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:18px; }
.dashboard-cards { margin-bottom:18px; }.dashboard-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }.dashboard-grid h3 { margin:0 0 8px; font-size:14px; }.allocation-list { display:grid; gap:8px; }.allocation-row { display:grid; grid-template-columns:150px 1fr auto; gap:10px; align-items:center; font-size:13px; }.allocation-bar { height:8px; border-radius:99px; background:#e7edf8; overflow:hidden; }.allocation-bar i { display:block; height:100%; border-radius:inherit; background:var(--blue); }.allocation-pct { color:var(--muted); font-size:12px; }
.card { background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:17px; }
.card-label { color:var(--muted); font-size:12px; }.card-value { display:block; font-size:24px; font-weight:700; margin-top:5px; }.card-note { color:var(--muted); font-size:11px; }
.grid-two { display:grid; grid-template-columns:1.15fr .85fr; gap:18px; }
.currency-row { padding:12px 0; border-top:1px solid var(--line); }.currency-row:first-child { border-top:0; }
.currency-row strong { display:block; margin-bottom:5px; }.currency-metrics { display:flex; gap:20px; color:var(--muted); font-size:12px; }.currency-metrics b { color:var(--ink); }
.risk-list { display:grid; gap:10px; }.risk { padding:12px; border-radius:10px; background:#f8fafc; }.risk strong { display:block; }.risk p { margin:4px 0 0; color:var(--muted); font-size:12px; }
.command-list { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }.command { border:1px solid var(--line); border-radius:10px; padding:12px; background:#fbfcff; }.command strong { display:block; }.command p { color:var(--muted); font-size:12px; margin:4px 0 8px; }.command button { border:0; border-radius:7px; background:var(--blue-soft); color:var(--blue); padding:6px 9px; cursor:pointer; font-size:12px; }
.risk-limit-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:16px; }.risk-limit { border:1px solid #d9e4f6; border-radius:11px; padding:12px; background:#f7faff; }.risk-limit span { display:block; color:var(--muted); font-size:12px; }.risk-limit strong { display:block; margin-top:4px; color:var(--blue); font-size:19px; }.risk-rule-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.risk-rule { border:1px solid var(--line); border-radius:10px; background:#fff; overflow:hidden; }.risk-rule summary { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:12px; cursor:pointer; font-weight:650; }.risk-rule summary em { color:var(--muted); font-size:12px; font-style:normal; font-weight:500; }.risk-rule ul { margin:0; padding:0 28px 13px; color:var(--muted); font-size:13px; line-height:1.55; }.risk-rule li+li { margin-top:5px; }
.rule-advice-result .status { display:block; margin-top:14px; }
.rule-advice-output { margin-top:10px; scroll-margin-top:78px; }.advice-summary { display:flex; align-items:center; gap:12px; padding:15px; border:1px solid #dbe4f2; border-radius:12px; background:#f7faff; }.advice-summary strong { font-size:15px; }.risk-level { flex:0 0 auto; padding:5px 10px; border-radius:999px; font-size:12px; font-weight:750; }.risk-level.high { color:#9d2635; background:#ffe9ec; }.risk-level.medium { color:#805500; background:#fff2d4; }.risk-level.low { color:#11633f; background:#e5f7ee; }.advice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:12px; }.advice-section { border:1px solid var(--line); border-radius:12px; padding:14px; background:#fff; }.advice-section h4 { display:flex; justify-content:space-between; gap:10px; margin:0 0 10px; font-size:14px; }.advice-section h4 span { color:var(--muted); font-size:12px; font-weight:500; }.advice-section.do { border-top:3px solid var(--blue); }.advice-section.stop { border-top:3px solid var(--red); }.advice-section.watch { border-top:3px solid var(--amber); }.advice-section.confirm { border-top:3px solid #7c5ce7; }.advice-items { display:grid; gap:9px; }.advice-items article { padding:10px; border-radius:9px; background:#f8fafc; }.advice-items b { display:block; }.advice-items p { margin:4px 0 0; color:var(--muted); font-size:12px; }.advice-items small { display:block; margin-top:5px; color:#58677d; }.advice-empty { margin:0; color:var(--muted); font-size:12px; }.advice-section pre { margin:0; white-space:pre-wrap; font:inherit; }
.table-wrap { overflow:auto; }.table-wrap table { width:100%; min-width:980px; border-collapse:collapse; }.table-wrap th,.table-wrap td { text-align:right; padding:10px 8px; border-top:1px solid var(--line); white-space:nowrap; }.table-wrap th { color:var(--muted); font-size:12px; font-weight:600; }.table-wrap th:first-child,.table-wrap td:first-child,.table-wrap th:nth-child(2),.table-wrap td:nth-child(2),.table-wrap th:last-child,.table-wrap td:last-child { text-align:left; }.negative { color:var(--red); }.positive { color:var(--green); }.warning { color:var(--amber); }
.holding-category-tabs { display:flex; gap:8px; overflow-x:auto; margin:-4px 0 14px; padding-bottom:2px; scrollbar-width:none; }.holding-category-tabs::-webkit-scrollbar { display:none; }.holding-category-tabs button { flex:0 0 auto; border:0; border-radius:999px; padding:7px 13px; background:#eef1f6; color:var(--muted); cursor:pointer; font-weight:650; }.holding-category-tabs button.active { background:var(--blue); color:#fff; }.holding-group-row td { padding:9px 10px!important; background:#f5f8fd; color:var(--ink); text-align:left!important; border-top:1px solid #dbe4f2!important; }.holding-group-row strong { margin-right:8px; }.holding-group-row span { color:var(--muted); font-size:12px; }
.row-actions { display:flex; gap:6px; }.row-actions button { border:0; background:#eef1f6; color:var(--ink); padding:4px 7px; border-radius:6px; cursor:pointer; font-size:12px; }
.transaction-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:15px; }.transaction-stat { background:#f8fafc; border-radius:10px; padding:11px; }.transaction-stat span { display:block; color:var(--muted); font-size:12px; }.transaction-stat strong { display:block; font-size:18px; margin-top:2px; }.transaction-table table { min-width:900px; }
.transaction-toolbar { display:flex; justify-content:flex-end; align-items:center; gap:10px; flex-wrap:wrap; margin:-4px 0 14px; }.transaction-toolbar input { width:min(340px,100%); }
.transaction-pagination { display:flex; align-items:center; justify-content:flex-end; gap:10px; margin-top:14px; }.transaction-pagination .muted { margin:0; min-width:110px; text-align:center; }.transaction-pagination button:disabled { opacity:.45; cursor:not-allowed; }
.report { display:grid; gap:15px; }.report-block { border-top:1px solid var(--line); padding-top:12px; }.report-block:first-child { border-top:0; padding-top:0; }.report-block h3 { margin:0 0 6px; font-size:14px; }.report-block p { margin:4px 0; }.report-block ul { margin:4px 0; padding-left:20px; }
footer { color:var(--muted); font-size:12px; text-align:center; margin-top:24px; }
@media (max-width:800px) { .shell { padding:22px 14px 40px; } .hero,.panel-heading { flex-direction:column; align-items:stretch; } h1 { font-size:28px; } .cards { grid-template-columns:repeat(2,1fr); } .grid-two,.assumptions,.form-grid { grid-template-columns:1fr 1fr; } .privacy-badge { align-self:flex-start; } .panel { padding:16px; border-radius:13px; } .quick-actions > * { flex:1 1 calc(50% - 10px); } .section-nav { top:5px; margin-left:-4px; margin-right:-4px; } .holdings-heading-actions { justify-content:space-between; } }
@media (max-width:480px) { .cards,.grid-two,.assumptions,.form-grid { grid-template-columns:1fr; } .quick-actions > * { flex:1 1 100%; } .card-value { font-size:21px; } }
@media (max-width:800px) { .command-list,.risk-rule-list,.advice-grid { grid-template-columns:1fr; }.risk-limit-grid { grid-template-columns:repeat(2,1fr); }.dashboard-grid { grid-template-columns:1fr; }.allocation-row { grid-template-columns:110px 1fr auto; }.advice-summary { align-items:flex-start; flex-direction:column; } }
@media (max-width:800px) { .transaction-stats { grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px) { .transaction-pagination { justify-content:space-between; }.transaction-pagination .secondary-button { padding:9px 12px; } }
.agent-chat-panel textarea{width:100%;box-sizing:border-box;resize:vertical;min-height:96px;border:1px solid var(--border,#d9e0ea);border-radius:12px;padding:12px 14px;font:inherit;background:#fff;color:inherit}
.agent-answer{white-space:pre-wrap;word-break:break-word;margin:16px 0 0;padding:16px;border-radius:12px;background:#f5f7fb;border:1px solid var(--border,#d9e0ea);line-height:1.65;max-height:560px;overflow:auto;font:inherit}
.agent-chat-panel .form-actions{align-items:center}
.login-gate{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:24px;background:linear-gradient(145deg,#eef3ff,#f7f9fc)}
.login-gate.hidden{display:none}
.login-card{width:min(420px,100%);display:grid;gap:18px;padding:32px;border:1px solid #dce3f1;border-radius:22px;background:#fff;box-shadow:0 24px 70px rgba(29,48,83,.16)}
.login-card h1,.login-card p{margin:0}
.login-card label{display:grid;gap:8px;font-weight:650}
.login-card input{width:100%;box-sizing:border-box;padding:12px 14px;border:1px solid #cfd8e8;border-radius:10px;font:inherit}
