:root { --bg:#0f1420; --panel:#1a2233; --text:#e6ebf5; --dim:#8b96ab; --acc:#4f8ef7;
        --buy:#2ecc71; --review:#f1c40f; --pass:#5d6a80; --alert:#e67e22; --gone:#e74c3c; }
* { box-sizing:border-box; }
body { margin:0; font:14px/1.45 -apple-system, "Segoe UI", Roboto, sans-serif; background:var(--bg); color:var(--text); }
nav { display:flex; gap:18px; align-items:center; padding:10px 18px; background:var(--panel); position:sticky; top:0; }
nav a { color:var(--dim); text-decoration:none; } nav a:hover { color:var(--text); }
.brand { font-weight:700; } .health { margin-left:auto; color:var(--dim); font-size:12px; }
main { padding:18px; max-width:1400px; margin:0 auto; }
.toolbar { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:14px; align-items:center; }
input, select, textarea, button { background:#111827; color:var(--text); border:1px solid #2b3852; border-radius:6px; padding:6px 9px; font:inherit; }
button { cursor:pointer; background:var(--acc); border:0; } button:hover { filter:brightness(1.1); }
table { width:100%; border-collapse:collapse; background:var(--panel); border-radius:8px; overflow:hidden; }
th, td { padding:8px 10px; text-align:left; border-bottom:1px solid #232e45; }
th { cursor:pointer; color:var(--dim); user-select:none; white-space:nowrap; }
tr.detail-row td { background:#141b2b; }
.badge { padding:2px 8px; border-radius:10px; font-size:12px; font-weight:600; color:#0b0f17; }
.badge.BUY { background:var(--buy);} .badge.REVIEW { background:var(--review);}
.badge.PASS { background:var(--pass); color:var(--text);} .badge.ALERT { background:var(--alert);}
.status-gone { color:var(--gone); } .status-active { color:var(--buy); } .status-unknown { color:var(--dim); }
.card { display:flex; flex-direction:column; gap:10px; background:var(--panel); padding:16px; border-radius:8px; max-width:640px; }
.card label { display:flex; flex-direction:column; gap:4px; color:var(--dim); }
.watch-row { display:flex; gap:12px; align-items:center; background:var(--panel); padding:10px 14px; border-radius:8px; margin-bottom:8px; }
.watch-row .grow { flex:1; } .hint { color:var(--dim); font-size:12px; }
textarea.notes { width:100%; min-height:60px; }
a { color:var(--acc); }
small { color:var(--dim); }
.card.narrow { max-width:380px; margin-top:14px; }
.error { color:#f77; min-height:1em; }
button.danger { background:#8b2635; }
a.button { display:inline-block; background:var(--acc); color:#0b0f17; padding:8px 14px; border-radius:6px; font-weight:600; }
nav .grow { flex:1; }
hr { border:0; border-top:1px solid #232e45; width:100%; }
#password-msg { color:var(--dim); font-size:12px; }
#fb-canvas { width:100%; max-width:1280px; border:1px solid #2b3852; border-radius:8px; outline:none; cursor:default; background:#000; }
#fb-canvas:focus { border-color:var(--acc); }
.fb-toolbar { display:flex; gap:12px; align-items:center; margin-bottom:10px; flex-wrap:wrap; }
details summary { cursor:pointer; }
details { display:flex; flex-direction:column; gap:10px; }
.fb-option { border:1px solid #232e45; border-radius:8px; padding:10px 14px; display:flex; flex-direction:column; gap:6px; }
pre.cmd { background:#0b0f17; padding:10px 12px; border-radius:6px; overflow-x:auto; user-select:all; margin:0; }
.card label.check { flex-direction:row; align-items:center; gap:8px; }
.card label.check input { width:auto; }