/* Shared visual system for the business dashboard. */
:root { --ink:#15235a; --violet:#5d22f5; --mint:#08bfa0; --stroke:#e5eaf5; --card:#fff; }
.dashboard-body { min-width:320px; background:linear-gradient(145deg,#f8fbff 0,#f1f5ff 45%,#fff 100%); color:var(--ink); }
.dashboard-page { width:min(1440px,calc(100% - 40px)); margin:auto; padding:22px 0 60px; }
.dashboard-header { display:flex; align-items:center; gap:28px; margin:0 0 18px; }
.brand-lockup { display:flex; align-items:center; gap:11px; color:var(--ink); text-decoration:none; }
.brand-lockup b { display:block; font-size:25px; letter-spacing:-.055em; }
.brand-lockup small { display:block; margin-top:1px; color:#7b86a5; font-size:13px; }
.brand-glyph { display:grid; width:38px; height:38px; place-items:center; border-radius:12px; background:linear-gradient(145deg,#7747ff,#4613d8); box-shadow:0 10px 20px #6442e544; color:#fff; font-size:11px; font-weight:800; }
.dashboard-nav { display:flex; align-items:center; gap:9px; margin-left:auto; }
.nav-tab { display:flex; align-items:center; min-height:42px; padding:0 15px; border:1px solid #edf0f8; border-radius:10px; background:#fff; color:#697491; font-size:13px; font-weight:700; text-decoration:none; box-shadow:0 4px 13px #314b8010; }
.nav-tab.active { background:linear-gradient(135deg,#6231f4,#7b20f8); box-shadow:0 8px 16px #5d22f542; color:#fff; }
.period-panel { display:flex; align-items:stretch; gap:12px; margin-bottom:14px; }
.sync-dashboard-form { display:flex; align-items:center; gap:12px; flex:1; padding:10px 12px; border:1px solid #edf1fb; border-radius:16px; background:#fff; box-shadow:0 8px 24px #40547d0a; }
.date-control { display:flex; align-items:end; gap:7px; padding:7px 10px; border-radius:10px; background:#f8f9ff; }
.date-control label { display:grid; gap:2px; color:#7b86a5; font-size:10px; }
.date-control input { min-height:27px; padding:0; border:0; border-radius:0; background:transparent; color:var(--ink); font-size:13px; font-weight:700; }
.date-control > span { padding-bottom:5px; color:#8791aa; }.date-control-end { padding-bottom:0; }
.quick-periods { display:flex; align-items:center; gap:4px; margin-left:4px; }.quick-periods span { margin-right:4px; color:#8993aa; font-size:11px; }
.quick-periods button { min-height:31px; padding:0 10px; border-radius:7px; background:#f7f8fc; color:#75809b; font-size:11px; font-weight:700; }
.sync-dashboard-button { min-height:37px; margin-left:auto; padding:0 14px; border-radius:9px; background:#eae3ff; color:#5320dc; font-size:12px; font-weight:800; }
.loaded-badge { display:grid; align-content:center; min-width:205px; padding:12px 16px; border:1px solid #ddf4ed; border-radius:16px; background:linear-gradient(135deg,#ecfff7,#f9fffc); box-shadow:0 8px 24px #40547d0a; }.loaded-badge b{color:#078d72;font-size:13px}.loaded-badge small{margin-top:3px;color:#8a9caa;font-size:11px}
.metric-grid { position:relative; display:grid; grid-template-columns:repeat(9,minmax(116px,1fr)); gap:10px; margin-bottom:14px; }
.metric-card { min-height:126px; padding:15px; border:1px solid #edf0f8; border-radius:14px; background:var(--card); box-shadow:0 8px 24px #40547d0a; }.metric-card p{min-height:31px;margin:0;color:#687594;font-size:12px;font-weight:650;line-height:1.25}.metric-card strong{display:block;margin:6px 0 5px;color:var(--ink);font-size:21px;letter-spacing:-.04em;white-space:nowrap}.metric-caption{color:#18a885;font-size:10px;font-weight:750}
.metric-icon { display:block; width:23px; height:23px; margin-bottom:9px; border-radius:8px; background:linear-gradient(135deg,#f0eaff,#ded1ff); }.icon-percent{border-radius:50%;background:linear-gradient(135deg,#ffe4fa,#f9b0ee)}.icon-chart,.icon-trend{background:linear-gradient(135deg,#dfffe8,#9beec6)}.icon-coin{border-radius:50%;background:linear-gradient(135deg,#fff0c7,#ffd770)}.metric-gear{position:absolute;right:8px;top:7px;width:24px;height:24px;border-radius:7px;background:#f4f6fb;color:#7b679d;font-size:15px}
.analytics-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }.insight-card{min-height:300px;padding:20px;border:1px solid #edf0f8;border-radius:17px;background:#fff;box-shadow:0 8px 24px #40547d0a}.insight-heading{display:flex;align-items:start;justify-content:space-between}.insight-heading p{margin:0;color:var(--ink);font-size:20px;font-weight:800;letter-spacing:-.045em}.insight-heading small{display:block;margin-top:3px;color:#8a95ad;font-size:11px}.gear-button{display:grid;width:33px;height:33px;place-items:center;border-radius:9px;background:#f4efff;color:#6431ed;font-size:17px}.table-chip{padding:7px 10px;border-radius:8px;background:#f6f3ff;color:#6c3ce8;font-size:11px;font-weight:700}
.expense-content,.profit-content { display:grid; grid-template-columns:176px 1fr; align-items:center; gap:20px; margin-top:16px; }.donut{position:relative;display:grid;width:166px;height:166px;place-items:center;border-radius:50%;background:conic-gradient(#5e30f2 0 29%,#02c8ab 29% 47%,#65a9ff 47% 69%,#f6a4cd 69% 83%,#f2d36a 83% 100%)}.expense-donut{background:conic-gradient(#6741f0 0 30%,#51a8ff 30% 54%,#f2af69 54% 70%,#27c7a7 70% 85%,#c2c9da 85% 100%)}.donut:after{position:absolute;inset:29px;content:"";border-radius:50%;background:#fff}.donut span{z-index:1;text-align:center;color:var(--ink);font-size:20px;font-weight:850;letter-spacing:-.04em}.donut span small{display:block;margin-top:2px;color:#8b96ad;font-size:10px;font-weight:650;letter-spacing:0}
.insight-list { display:grid; gap:3px; align-self:stretch; overflow:auto; max-height:205px; }.insight-list>div{display:grid;grid-template-columns:minmax(0,1fr) auto 48px;align-items:center;gap:9px;padding:7px 8px;border-bottom:1px solid #f0f2f8;color:#687491;font-size:12px}.insight-list>div b{color:#394568;font-size:12px;text-align:right}.insight-list>div small{color:#8a95ae;font-size:10px;text-align:right}.product-list>div>span{min-width:0}.product-list b:first-child{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#53607c;font-size:12px}.product-list span small{display:block;margin-top:2px;text-align:left}.negative{color:#ed4d5f!important}
.pnl-card { padding:20px 0 0; border:1px solid #edf0f8; border-radius:17px; background:#fff; box-shadow:0 8px 24px #40547d0a; }.pnl-heading{display:flex;justify-content:space-between;gap:15px;padding:0 20px 16px}.pnl-heading h2{margin:1px 0 0;color:var(--ink);font-size:20px;letter-spacing:-.045em}.pnl-actions{display:flex;gap:8px;align-items:center}.pnl-actions input{min-height:36px;width:270px;border-radius:9px;font-size:12px}.outline-button{display:inline-flex;align-items:center;min-height:36px;padding:0 10px;border:1px solid #e5e3f4;border-radius:9px;background:#fff;color:#5e31db;font-size:11px;font-weight:750;text-decoration:none}
.report-table-wrap { margin:0; max-height:600px; border-top:1px solid #eef1f7; }.report-table{min-width:2300px;font-size:11px;table-layout:fixed}.report-table th{position:sticky;top:0;z-index:2;min-width:108px;overflow:hidden;border-bottom:1px solid #dde5f1;background:#f8faff;color:#7b86a3;font-size:9px}.report-table td{overflow:hidden;border-bottom:5px solid #fff;background:#fbfcff;color:#52607c;text-overflow:ellipsis}.report-table tbody tr:nth-child(even) td{background:#f4f7fd}.report-table tbody tr:hover td{background:#edf3ff}.report-table tfoot td{border-bottom:0;background:#eee9ff;color:#4520b8;font-weight:850}.highlight-seller_payout{background:#e7f6e9!important;color:#0b8c58!important;font-weight:800}.highlight-gross_profit{background:#f0eaff!important;color:#6430de!important;font-weight:850}.highlight-profitability{background:#e6faf3!important;color:#099d72!important;font-weight:850}.article-code{color:#5944c6;font-weight:750}.column-resizer{position:absolute;top:0;right:0;width:6px;height:100%;cursor:col-resize}.column-resizer:hover{background:#7541f8}
.dashboard-upload { margin:14px 0 0; padding:15px 20px; border:1px solid #edf0f8; border-radius:14px; background:#fff; }.settings-dialog{width:min(470px,calc(100% - 32px));color:var(--ink)}.settings-dialog p{margin:0 0 16px;color:#71809d;font-size:13px;line-height:1.45}.settings-list{display:grid;gap:7px;margin:0 0 18px}.setting-row{display:flex;align-items:center;gap:9px;padding:10px;border:1px solid #edf0f7;border-radius:10px}.setting-row label{display:flex;flex:1;align-items:center;gap:8px;color:#53607c;font-size:13px}.setting-row input{width:16px;min-height:16px}.setting-row button{width:28px;height:28px;border-radius:7px;background:#f2efff;color:#6135d6;font-weight:800}
@media (max-width:1120px){.metric-grid{grid-template-columns:repeat(5,1fr)}.dashboard-nav{gap:5px}.nav-tab{padding:0 9px}.quick-periods{display:none}}
@media (max-width:760px){.dashboard-page{width:min(100% - 22px,1440px);padding-top:13px}.dashboard-header,.period-panel,.pnl-heading{align-items:stretch;flex-direction:column}.dashboard-nav{margin-left:0;overflow:auto}.brand-lockup b{font-size:21px}.sync-dashboard-form{align-items:stretch;flex-wrap:wrap}.date-control{flex:1}.sync-dashboard-button{margin-left:0}.loaded-badge{min-width:0}.metric-grid{grid-template-columns:repeat(2,1fr)}.analytics-grid{grid-template-columns:1fr}.expense-content,.profit-content{grid-template-columns:130px 1fr;gap:10px}.donut{width:124px;height:124px}.donut:after{inset:23px}.donut span{font-size:16px}.pnl-actions{align-items:stretch;flex-wrap:wrap}.pnl-actions input{width:100%}.report-table-wrap{max-height:500px}}
@media (max-width:430px){.metric-grid{grid-template-columns:1fr 1fr}.metric-card{min-height:112px}.metric-card strong{font-size:18px}.expense-content,.profit-content{grid-template-columns:1fr}.donut{margin:auto}.insight-list{max-height:220px}}