:root{--bg: #0f1116;--panel: #141824;--panel2:#171b26;--pill:#1b2030;--stroke: rgba(255,255,255,.08);--text: #e9edf7;--muted: rgba(233,237,247,.7);--shadow: 0 12px 30px rgba(0,0,0,.35);--radius: 14px}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,Noto Sans,Liberation Sans,sans-serif}.appRoot{min-height:100vh}.topBar{height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;background:linear-gradient(180deg,#1a1e2af2,#161a24f2);border-bottom:1px solid var(--stroke)}.topLeftIcons{display:flex;gap:14px;align-items:center}.topIconBtn{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;text-decoration:none;background:transparent;border:1px solid transparent;opacity:.95;transition:transform .08s ease,opacity .12s ease,border-color .12s ease}.topIconBtn:hover{transform:translateY(-1px);opacity:1;border-color:#ffffff1a}.topIconBtn.active{border-color:#ffffff29;background:#ffffff0a}.cRed svg{color:#ff5a5a}.cGreen svg{color:#2fe28a}.cBlue svg{color:#4aa3ff}.cYellow svg{color:#ffd35a}.loginBtn{height:36px;padding:0 16px;border:none;border-radius:10px;background:#f6c945;color:#101217;font-weight:800;letter-spacing:.3px;cursor:pointer;box-shadow:0 10px 18px #00000040;transition:transform .08s ease,filter .12s ease}.loginBtn:hover{transform:translateY(-1px);filter:brightness(1.03)}.contentHeader{padding:18px 22px 40px}.home{display:flex;align-items:center;gap:18px}.brandTitle{margin:0;font-size:34px;font-weight:900;letter-spacing:.8px}.brandLink{margin:0;font-size:34px;font-weight:900;letter-spacing:.8px;color:var(--text);text-decoration:none;display:inline-block}.brandLink:hover{filter:brightness(1.05)}.centerPill{margin-left:26px;display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;background:#1b2030d9;border:1px solid var(--stroke);box-shadow:var(--shadow)}.pillLabel{color:var(--muted);font-size:14px}.pillIconBtn{width:34px;height:30px;display:grid;place-items:center;border-radius:10px;text-decoration:none;color:var(--text);background:#ffffff0a;border:1px solid rgba(255,255,255,.06);transition:transform .08s ease,background .12s ease}.pillIconBtn:hover{transform:translateY(-1px);background:#ffffff0f}.searchInput{margin-left:auto;width:260px;height:40px;padding:0 14px;border-radius:12px;background:#1b2030a6;color:var(--text);border:1px solid rgba(255,255,255,.08);outline:none}.searchInput::placeholder{color:#e9edf78c}.page{padding-top:18px}.pageTitle{margin:0 0 6px;font-size:22px;font-weight:800}.pageHint{margin:0;color:var(--muted)}.authBtns{display:flex;gap:10px;align-items:center}.addBtn{height:36px;padding:0 14px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:#ffffff0f;color:var(--text);font-weight:800;cursor:pointer}.addBtn:hover{filter:brightness(1.05);transform:translateY(-1px)}.logoutBtn{height:36px;padding:0 14px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:#ffffff08;color:var(--text);font-weight:800;cursor:pointer;opacity:.9}.logoutBtn:hover{opacity:1;transform:translateY(-1px)}