:root{--ease-out:cubic-bezier(.22,1,.36,1);--motion-fast:160ms;--motion-panel:280ms}
button,a,input,select{transition:background-color var(--motion-fast),border-color var(--motion-fast),box-shadow var(--motion-fast),color var(--motion-fast)}
button:active:not(:disabled){transform:translateY(1px)}
:is(.field,.receive):focus-within{box-shadow:0 0 0 2px var(--blue)}
.trade-tabs a{transition:background-color 180ms,color 180ms}
#sidePanel[open]{animation:panel-in var(--motion-panel) var(--ease-out) both}
#modal[open]{animation:dialog-in 220ms var(--ease-out) both}
dialog[open]::backdrop{animation:backdrop-in 200ms ease-out both}
#swapView .swap-card{animation:dialog-in 260ms var(--ease-out) both;animation-delay:0s}
#bridgeView .bridge-view{animation:dialog-in 260ms var(--ease-out) both}
#sidePanel .panel-heading{border-bottom:0;padding-bottom:4px}
#panelViews #discoverView .section-heading{margin-bottom:18px;display:flex;align-items:center;gap:12px}
#panelViews #discoverView .section-heading .lede{font-size:20px;letter-spacing:-.6px;margin:0;color:var(--ink)}
#panelViews #discoverView .count-label{font-size:10px;margin:0;padding:6px 8px;border-radius:8px;background:var(--pale)}
#panelViews .search-field{border:1px solid var(--line);border-radius:14px;padding:0 12px;box-shadow:none}
#panelViews .filters{scrollbar-width:none}.filters::-webkit-scrollbar{display:none}
#panelViews .filters button{border:0;background:transparent;padding:8px 12px;border-radius:10px;font-size:12px}
#panelViews .filters button.selected{background:var(--ink);color:var(--pale)}
#panelViews #tokenTable{border:0;background:transparent;border-radius:0}
#panelViews #tokenTable .table-head{display:none}
#panelViews .discover-token{grid-template-columns:minmax(0,1fr) auto;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:15px 4px;background:transparent;text-align:left}
#panelViews .discover-token>span:last-child{display:none}
#panelViews .discover-token .coin{width:42px;height:42px;border-radius:14px;font-size:13px}
#panelViews .discover-token .token-cell{gap:12px}
#panelViews .discover-token .token-cell strong{font-size:15px;font-weight:600;letter-spacing:-.2px}
#panelViews .discover-token .token-cell small{font-size:11px;max-width:150px}
.token-identity{font:10px/1.7 monospace;color:var(--muted);display:block}
#panelViews .discover-token .asset-status{font-size:10px;max-width:83px;text-align:right;color:var(--muted)}
#sidePanel[open] .discover-token:nth-child(-n+8){animation:row-in 280ms var(--ease-out) both}
#sidePanel[open] .discover-token:nth-child(2){animation-delay:25ms}
#sidePanel[open] .discover-token:nth-child(3){animation-delay:50ms}
#sidePanel[open] .discover-token:nth-child(4){animation-delay:75ms}
#sidePanel[open] .discover-token:nth-child(5){animation-delay:100ms}
@media(hover:hover){#panelViews .discover-token:hover{background:var(--pale);border-radius:12px}.primary:hover:not(:disabled),.connect:hover:not(:disabled){box-shadow:0 5px 16px #00000020}.token:hover{border-color:var(--muted)}}
@keyframes panel-in{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:translateX(0)}}
@keyframes dialog-in{from{opacity:0;transform:translateY(7px) scale(.99)}to{opacity:1;transform:none}}
@keyframes row-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes backdrop-in{from{opacity:0}to{opacity:1}}
@media(max-width:440px){#sidePanel[open]{animation-name:dialog-in}#panelViews .discover-token .token-cell small{max-width:135px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}button:active:not(:disabled){transform:none}}
.swap-only{display:flex;align-items:center;gap:9px;font-size:12px;min-height:44px;color:var(--ink)}.swap-only input{width:18px;height:18px;accent-color:var(--blue)}
#discoverView:has(#swapOnly:checked) #loadMoreTokens{display:none}