PolyTools Trade Cost 0.1.1 / src/popup/popup.css
| 1 | :root { color-scheme: light dark; --bg:#fcfcfb; --card:#ffffff; --ink:#0b0b0b; --ink2:#52514e; --muted:#6b6a65; --line:rgba(11,11,11,.10); --accent:#1f66bd; --accent-ink:#ffffff; --pos:#006300; } |
| 2 | @media (prefers-color-scheme: dark) { :root { --bg:#1a1a19; --card:#222220; --ink:#f0efec; --ink2:#c3c2b7; --muted:#9a988f; --line:rgba(255,255,255,.10); --accent:#1f66bd; --pos:#2fbf4f; } } |
| 3 | * { box-sizing: border-box; } |
| 4 | [hidden] { display: none !important; } |
| 5 | body { margin:0; background:var(--bg); color:var(--ink); font:13px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif; min-width:340px; } |
| 6 | .wrap { padding:14px; max-width:480px; margin:0 auto; display:grid; gap:12px; } |
| 7 | .top { display:flex; gap:10px; align-items:center; } |
| 8 | .brand { font-weight:650; font-size:15px; margin:0; } |
| 9 | .muted { color:var(--muted); } .small { font-size:11.5px; } |
| 10 | .primary { display:grid; gap:2px; text-align:left; width:100%; border:0; border-radius:12px; padding:12px 14px; background:var(--accent); color:var(--accent-ink); font:inherit; font-weight:600; cursor:pointer; } |
| 11 | .primary .sub { font-weight:400; color:#ffffff; } |
| 12 | .primary:hover { filter:brightness(1.05); } |
| 13 | .card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:12px; display:grid; gap:10px; } |
| 14 | h2 { font-size:12px; margin:0; color:var(--ink2); text-transform:uppercase; letter-spacing:.04em; } |
| 15 | .field { display:grid; gap:4px; } |
| 16 | .check { display:flex; gap:8px; align-items:flex-start; } |
| 17 | select, input[type=number] { font:inherit; color:var(--ink); background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:6px 8px; } |
| 18 | .saved { color:var(--pos); min-height:1em; } |
| 19 | .card-in { display:grid; gap:10px; } |
| 20 | a { color:var(--accent); } |
| 21 | p { margin:0; } |