:root{--bg-primary: #0d0e14;--bg-secondary: #131520;--bg-card: #191b2a;--bg-input: #1e2035;--bg-hover: #252840;--text-primary: #e1e4ea;--text-secondary: #8b8fa3;--text-muted: #5d6178;--accent: #6366f1;--accent-hover: #818cf8;--accent-dim: rgba(99,102,241,.15);--green: #22c55e;--red: #ef4444;--border: #2a2d42;--radius: 16px;--radius-sm: 12px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,sans-serif;background:var(--bg-primary);color:var(--text-primary);min-height:100vh}button{cursor:pointer;border:none;font-family:inherit;font-size:inherit;outline:none}input{outline:none;border:none;font-family:inherit;background:transparent;color:var(--text-primary)}.header{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-bottom:1px solid var(--border)}.logo{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:700;color:var(--text-primary)}.logo svg{width:32px;height:32px}.nav{display:flex;gap:8px}.nav-btn{padding:8px 16px;border-radius:8px;background:transparent;color:var(--text-secondary);font-weight:500;font-size:15px;transition:all .2s}.nav-btn:hover{color:var(--text-primary);background:var(--bg-hover)}.nav-btn.active{color:var(--text-primary);background:var(--accent-dim)}.connect-btn{padding:10px 20px;border-radius:12px;background:var(--accent);color:#fff;font-weight:600;font-size:14px;transition:all .2s}.connect-btn:hover{background:var(--accent-hover)}.connect-btn.connected{background:var(--bg-card);border:1px solid var(--border);color:var(--text-primary)}.main{display:flex;justify-content:center;padding:60px 16px}.swap-card{width:100%;max-width:480px;background:var(--bg-card);border-radius:var(--radius);border:1px solid var(--border);padding:16px}.card-header{display:flex;justify-content:space-between;align-items:center;padding:0 4px 16px}.card-title{font-size:16px;font-weight:600}.settings-btn{width:32px;height:32px;border-radius:8px;background:transparent;color:var(--text-secondary);display:flex;align-items:center;justify-content:center;transition:all .2s;font-size:18px}.settings-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.token-input-box{background:var(--bg-input);border-radius:var(--radius-sm);padding:16px;margin-bottom:4px}.token-input-row{display:flex;justify-content:space-between;align-items:center}.amount-input{font-size:28px;font-weight:500;width:60%;color:var(--text-primary)}.amount-input::placeholder{color:var(--text-muted)}.token-select{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;background:var(--bg-hover);color:var(--text-primary);font-weight:600;font-size:16px;transition:all .2s}.token-select:hover{background:var(--border)}.token-select .arrow{font-size:12px;color:var(--text-secondary)}.balance-row{display:flex;justify-content:space-between;margin-top:8px;font-size:13px;color:var(--text-secondary)}.balance-row .max-btn{color:var(--accent);background:none;font-size:13px;font-weight:600}.balance-row .max-btn:hover{color:var(--accent-hover)}.swap-arrow-container{display:flex;justify-content:center;margin:-10px 0;position:relative;z-index:2}.swap-arrow-btn{width:36px;height:36px;border-radius:10px;background:var(--bg-card);border:3px solid var(--bg-input);color:var(--text-secondary);display:flex;align-items:center;justify-content:center;font-size:16px;transition:all .2s}.swap-arrow-btn:hover{color:var(--text-primary);background:var(--bg-hover)}.action-btn{width:100%;padding:16px;border-radius:var(--radius-sm);background:var(--accent);color:#fff;font-weight:600;font-size:16px;margin-top:8px;transition:all .2s}.action-btn:hover{background:var(--accent-hover)}.action-btn:disabled{background:var(--bg-hover);color:var(--text-muted);cursor:not-allowed}.price-info{padding:12px 4px;font-size:13px;color:var(--text-secondary)}.price-info-row{display:flex;justify-content:space-between;padding:4px 0}.liq-positions{margin-top:16px}.liq-pair{background:var(--bg-input);border-radius:var(--radius-sm);padding:16px;margin-bottom:8px}.liq-pair-header{display:flex;justify-content:space-between;align-items:center;font-weight:600}.liq-pair-detail{margin-top:8px;font-size:13px;color:var(--text-secondary)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:100}.modal{background:var(--bg-card);border-radius:var(--radius);border:1px solid var(--border);width:90%;max-width:420px;max-height:80vh;overflow:hidden}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid var(--border)}.modal-header h3{font-size:16px}.modal-close{background:none;color:var(--text-secondary);font-size:20px}.modal-search{padding:12px 16px}.modal-search input{width:100%;padding:12px;border-radius:var(--radius-sm);background:var(--bg-input);border:1px solid var(--border);color:var(--text-primary);font-size:14px}.modal-search input::placeholder{color:var(--text-muted)}.token-list{max-height:400px;overflow-y:auto;padding:0 8px 8px}.token-item{display:flex;align-items:center;gap:12px;padding:10px 8px;border-radius:8px;cursor:pointer;transition:all .2s;width:100%;background:none;text-align:left;color:var(--text-primary)}.token-item:hover{background:var(--bg-hover)}.token-icon{width:36px;height:36px;border-radius:50%;background:var(--accent-dim);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:var(--accent);flex-shrink:0}.token-info{flex:1}.token-info .symbol{font-weight:600;font-size:15px}.token-info .name{font-size:12px;color:var(--text-secondary)}.token-balance{font-size:14px;color:var(--text-secondary)}.slippage-panel{padding:12px 4px 8px}.slippage-label{font-size:13px;color:var(--text-secondary);margin-bottom:8px}.slippage-options{display:flex;gap:8px}.slippage-opt{padding:6px 14px;border-radius:8px;background:var(--bg-input);color:var(--text-secondary);font-size:14px;font-weight:500;transition:all .2s}.slippage-opt:hover{background:var(--bg-hover)}.slippage-opt.active{background:var(--accent-dim);color:var(--accent)}.slippage-custom{display:flex;align-items:center;gap:4px}.slippage-custom input{width:50px;padding:6px 8px;border-radius:8px;background:var(--bg-input);font-size:14px;text-align:center}.toast{position:fixed;bottom:24px;right:24px;padding:12px 20px;border-radius:12px;background:var(--bg-card);border:1px solid var(--border);color:var(--text-primary);font-size:14px;z-index:200;animation:slideIn .3s ease}.toast.success{border-color:var(--green)}.toast.error{border-color:var(--red)}@keyframes slideIn{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@media(max-width:600px){.header{padding:12px 16px}.nav{display:none}.main{padding:24px 12px}.swap-card{padding:12px}.amount-input{font-size:22px}}.plus-divider{display:flex;justify-content:center;padding:4px 0;color:var(--text-muted);font-size:20px}.liq-info-box{background:var(--bg-input);border-radius:var(--radius-sm);padding:12px 16px;margin-top:8px}.liq-info-row{display:flex;justify-content:space-between;padding:4px 0;font-size:14px;color:var(--text-secondary)}.liq-info-row .value{color:var(--text-primary);font-weight:500}