:root { --bg:#f4f6f5; --card:#fff; --text:#1b2420; --muted:#66736d; --line:#e2e7e4; --accent:#0a7c5a; --danger:#c2402f; }
@media (prefers-color-scheme: dark) { :root { --bg:#121614; --card:#1b211e; --text:#e6ece9; --muted:#93a19a; --line:#2b3430; --accent:#2fb386; --danger:#e0685a; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
a { color:var(--accent); }
.top { position:sticky; top:0; z-index:5; background:var(--accent); color:#fff; padding:10px 16px 0; }
.brand { font-weight:700; font-size:17px; padding-bottom:8px; }
.top nav { display:flex; gap:4px; }
.top nav a { color:#fff; opacity:.8; text-decoration:none; padding:8px 12px; border-radius:8px 8px 0 0; }
.top nav a.on { opacity:1; background:var(--bg); color:var(--text); font-weight:600; }
main { max-width:760px; margin:0 auto; padding:12px 12px 40px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px 16px; margin-bottom:12px; }
.card h1, .card h2 { margin:0 0 8px; font-size:18px; }
.muted { color:var(--muted); } .small { font-size:13px; }
.err { color:var(--danger); }
.note { border-color:var(--accent); }
.btn { font:inherit; border:1px solid var(--line); background:var(--card); color:var(--text); padding:9px 14px; border-radius:9px; cursor:pointer; }
.btn.primary { background:var(--accent); border-color:var(--accent); color:#fff; font-weight:600; }
.btn.small { padding:6px 10px; font-size:13px; }
.btn.danger { color:var(--danger); }
input, select { font:inherit; width:100%; padding:9px 10px; margin-top:4px; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--text); }
input.num { width:80px; display:inline-block; }
label { display:block; }
.stack > * { margin-bottom:10px; }
.inline { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.login { max-width:360px; margin:40px auto; }
.login .btn { width:100%; margin-top:10px; }
.status { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
.filter { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px; }
.filter a { text-decoration:none; color:var(--muted); padding:5px 10px; border-radius:20px; border:1px solid var(--line); font-size:13px; }
.filter a.on { color:#fff; background:var(--accent); border-color:var(--accent); }
.items { list-style:none; padding:0; margin:0; }
.item { background:var(--card); border:1px solid var(--line); border-radius:12px; margin-bottom:8px; overflow:hidden; }
.item a { display:flex; gap:12px; padding:10px; color:inherit; text-decoration:none; }
.item img, .item .noimg { width:92px; height:92px; flex:none; object-fit:cover; border-radius:8px; background:var(--line); }
.item .title { font-weight:600; }
.item .price { font-weight:700; margin:2px 0; }
.item .meta { color:var(--muted); font-size:13px; }
.item.old { opacity:.65; }
.searches { list-style:none; padding:0; margin:0 0 12px; }
.searches li { border-top:1px solid var(--line); padding:10px 0; }
.searches li.off .title { color:var(--muted); }
.searches .title { font-weight:600; }
.searches .url { font-size:13px; word-break:break-all; }
.tag { font-size:12px; font-weight:400; color:var(--muted); border:1px solid var(--line); border-radius:6px; padding:0 5px; }
.actions { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.steps { padding-left:20px; }
.devices { padding-left:18px; font-size:13px; }
details summary { cursor:pointer; color:var(--accent); margin-bottom:6px; }
.empty { color:var(--muted); }