
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'DM Sans',sans-serif;background:#F7F7FC;color:#1C1C2E;-webkit-font-smoothing:antialiased;font-size:13px}
nav{background:#0A0A0F;height:54px;display:flex;align-items:center;padding:0 24px;gap:8px;border-bottom:1px solid rgba(255,255,255,.07)}
.nav-mark{width:28px;height:28px;border-radius:7px;background:#4A1FD4;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.nav-name{font-size:13px;font-weight:700;color:#fff;margin-right:16px}
.nav-tab{padding:5px 13px;border-radius:7px;font-size:11px;font-weight:600;cursor:pointer;border:none;background:transparent;color:rgba(255,255,255,.38);transition:all .14s;white-space:nowrap}
.nav-tab:hover{color:rgba(255,255,255,.75);background:rgba(255,255,255,.06)}
.nav-tab.on{color:#B8FF4B;background:rgba(184,255,75,.09)}
.pg{display:none;padding:20px;max-width:1040px;margin:0 auto}.pg.on{display:block}
.card{background:#fff;border:0.5px solid #E2E2EF;border-radius:12px;overflow:hidden;margin-bottom:14px}
.ch{padding:10px 16px;background:#F9F9FB;border-bottom:0.5px solid #E2E2EF;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px}
.ct{font-size:12px;font-weight:700;color:#1C1C2E}
.cs{font-size:11px;color:#888}
.cb{padding:14px 16px}
.g2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;margin-bottom:14px}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:14px}
.g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:14px}
.stat{background:#fff;border:0.5px solid #E2E2EF;border-radius:10px;padding:9px 12px}
.sl{font-size:10px;color:#888;text-transform:uppercase;letter-spacing:.04em;margin-bottom:3px}
.sv{font-size:18px;font-weight:800}
.ss{font-size:10px;color:#888;margin-top:2px}
.bdg{font-size:9px;font-weight:700;padding:2px 8px;border-radius:20px;text-transform:uppercase;white-space:nowrap}
.green{background:#ECFDF5;color:#065F46}
.blue{background:#EDE8FF;color:#3B0764}
.orange{background:#FFF7ED;color:#9A3412}
.red{background:#FEE2E2;color:#991B1B}
.gray{background:#F3F4F6;color:#374151}
.yellow{background:#FEF3C7;color:#78350F}
.btn{padding:7px 14px;border-radius:8px;font-size:11px;font-weight:700;cursor:pointer;border:0.5px solid #E2E2EF;background:#fff;color:#1C1C2E;transition:all .13s;white-space:nowrap;font-family:'DM Sans',sans-serif}
.btn:hover{background:#F4F4F8}
.btn.v{background:#4A1FD4;border-color:#4A1FD4;color:#fff}
.btn.v:hover{background:#6B47E8}
.btn.g{background:#059669;border-color:#059669;color:#fff}
.btn.r{background:#DC2626;border-color:#DC2626;color:#fff}
.btn.sm{font-size:10px;padding:4px 10px}
.btn.xs{font-size:9px;padding:3px 8px}
.row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:0.5px solid #F3F3F7;font-size:12px;gap:8px}
.row:last-child{border-bottom:none}
.rl{color:#888}
.rv{font-weight:700}
.note{border-radius:9px;padding:10px 14px;font-size:12px;line-height:1.72;margin-bottom:14px}
.sw{position:relative;width:40px;height:22px;flex-shrink:0;cursor:pointer}
.sw input{display:none}
.sw-t{position:absolute;inset:0;border-radius:11px;background:#D3D1C7;transition:background .2s}
.sw-d{position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.sw input:checked+.sw-t{background:#4A1FD4}
.sw input:checked~.sw-d{transform:translateX(18px)}
.tog{display:flex;align-items:center;justify-content:space-between;padding:11px 16px;border-bottom:0.5px solid #F5F5F8}
.tog:last-child{border-bottom:none}
.tog-l{flex:1;margin-right:14px}
.tog-t{font-size:12px;font-weight:600;color:#1C1C2E}
.tog-d{font-size:11px;color:#888;margin-top:2px;line-height:1.5}
select,input{padding:8px 10px;border:0.5px solid #E2E2EF;border-radius:8px;font-size:12px;color:#1C1C2E;background:#fff;font-family:'DM Sans',sans-serif;transition:border-color .13s}
select:focus,input:focus{outline:none;border-color:#4A1FD4}
.field{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}
.lbl{font-size:10px;font-weight:600;color:#888;text-transform:uppercase;letter-spacing:.04em}
.tr{display:flex;align-items:center;padding:8px 16px;border-bottom:0.5px solid #F3F3F7;gap:9px}
.tr:last-child{border-bottom:none}
.tr:hover{background:#FAFAFA}
.av{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0}

/* Flow diagram */
.flow{display:flex;align-items:center;gap:0;flex-wrap:wrap;margin:14px 0}
.flow-box{background:#F0F0F8;border:1px solid #E2E2EF;border-radius:10px;padding:10px 14px;text-align:center;flex:1;min-width:90px}
.flow-box.lime{background:#ECFDF5;border-color:#6EE7B3}
.flow-box.violet{background:#EDE8FF;border-color:#C4B5FD}
.flow-box.yours{background:#0A0A0F;border-color:#4A1FD4}
.fb-t{font-size:11px;font-weight:700;color:#1C1C2E;margin-bottom:3px}
.fb-t.white{color:#fff}
.fb-d{font-size:10px;color:#888;line-height:1.45}
.fb-d.white{color:rgba(255,255,255,.5)}
.flow-arr{color:#B4B2A9;font-size:18px;padding:0 6px;flex-shrink:0}

/* Dispute status colors */
.status-open{background:#FEF3C7;color:#78350F}
.status-won{background:#ECFDF5;color:#065F46}
.status-lost{background:#FEE2E2;color:#991B1B}
.status-review{background:#EDE8FF;color:#3B0764}
.status-pending{background:#F3F4F6;color:#374151}

/* Fee preview card */
.fee-preview{background:#F9F9FB;border:0.5px solid #E2E2EF;border-radius:10px;padding:13px 14px;margin-top:10px}
.fp-row{display:flex;justify-content:space-between;font-size:12px;padding:4px 0}
.fp-divider{height:1px;background:#E2E2EF;margin:7px 0}
.fp-total{font-weight:800;color:#4A1FD4;font-size:14px}

/* Timeline */
.timeline{display:flex;flex-direction:column;gap:0;position:relative;padding-left:22px}
.timeline::before{content:'';position:absolute;left:6px;top:8px;bottom:8px;width:1.5px;background:#E2E2EF}
.tl{position:relative;padding:0 0 12px 14px}
.tl::before{content:'';position:absolute;left:-6px;top:5px;width:13px;height:13px;border-radius:50%;border:2px solid #E2E2EF;background:#fff}
.tl.done::before{background:#059669;border-color:#059669}
.tl.warn::before{background:#D97706;border-color:#D97706}
.tl.bad::before{background:#DC2626;border-color:#DC2626}
.tl-t{font-size:12px;font-weight:700;color:#1C1C2E}
.tl-d{font-size:11px;color:#888;margin-top:2px;line-height:1.5}
.tl-time{font-size:10px;color:#B4B2A9;margin-top:3px}
