:root { --bg:#12121c; --card:#1c1c2b; --ink:#e8e8f0; --muted:#8a8aa0; --accent:#6c8cff; --err:#ff6c8c; }
* { box-sizing:border-box; }
body { margin:0; font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
       background:var(--bg); color:var(--ink); }
nav { position:sticky; top:0; display:flex; justify-content:space-between; align-items:center;
      padding:12px 16px; background:rgba(18,18,28,.92); backdrop-filter:blur(8px);
      border-bottom:1px solid #2a2a3d; z-index:10; }
nav a { color:var(--muted); text-decoration:none; margin-left:14px; }
nav a.active { color:var(--accent); }
main { max-width:640px; margin:0 auto; padding:16px; }
.card { background:var(--card); border:1px solid #2a2a3d; border-radius:14px;
        padding:14px 16px; margin-bottom:14px; overflow-wrap:anywhere; }
.card header { display:flex; justify-content:space-between; color:var(--muted); font-size:.85em; margin-bottom:6px; }
.card a { color:var(--accent); }
.card.answer { border-color:var(--accent); }
.thumb { max-width:100%; border-radius:10px; margin:6px 0; }
.search { display:flex; gap:8px; margin-bottom:18px; }
input[type=search], input[type=password] { flex:1; padding:11px 14px; border-radius:10px;
   border:1px solid #2a2a3d; background:#15151f; color:var(--ink); font-size:1em; }
button { padding:11px 18px; border:0; border-radius:10px; background:var(--accent);
   color:#fff; font-size:1em; cursor:pointer; }
.muted { color:var(--muted); } .small { font-size:.88em; } .err { color:var(--err); }
details summary { cursor:pointer; color:var(--muted); }
.login { display:grid; place-items:center; min-height:100vh; }
.center { text-align:center; min-width:280px; }
.center form { display:flex; flex-direction:column; gap:10px; margin-top:10px; }
.addform { display:flex; flex-direction:column; gap:12px; }
textarea { padding:12px 14px; border-radius:10px; border:1px solid #2a2a3d;
  background:#15151f; color:var(--ink); font:inherit; resize:vertical; }
.filebtn { display:block; text-align:center; padding:12px; border:1px dashed #3a3a55;
  border-radius:10px; color:var(--muted); cursor:pointer; }
.flash { background:#1d2b1f; border:1px solid #2f5c38; border-radius:10px; padding:10px 14px; }
.chips { display:flex; gap:8px; flex-wrap:wrap; margin:0 0 14px; }
.chip { padding:5px 12px; border-radius:999px; border:1px solid #2a2a3d; color:var(--muted);
  text-decoration:none; font-size:.85em; }
.chip.on { background:var(--accent); color:#fff; border-color:var(--accent); }
.cat { font-style:normal; background:#26263c; border-radius:6px; padding:2px 8px; font-size:.8em; }
.stars { color:#f5c542; letter-spacing:1px; font-size:.85em; }
#micbtn.rec { border-color:#ff6c8c; color:#ff6c8c; }
.navmic { background:none; border:1px solid #2a2a3d; border-radius:999px; padding:4px 10px;
  color:var(--muted); cursor:pointer; font-size:1em; }
.navmic.rec { border-color:#ff6c8c; color:#ff6c8c; }
.catmove { background:#26263c; color:var(--ink); border:0; border-radius:6px;
  padding:2px 6px; font-size:.8em; max-width:130px; }
.projtabs { border-bottom:1px solid #2a2a3d; padding-bottom:12px; }
.projtabs .chip.on { background:#7a5cff; border-color:#7a5cff; }
.cat.proj { background:#33265c; }
.center-h { text-align:center; color:var(--muted); font-weight:500; }
.bigbtns { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:18px 0 22px; }
.bigbtn { padding:34px 10px; font-size:1.15em; font-weight:600; border-radius:18px;
  border:1px solid #2a2a3d; background:var(--card); color:var(--ink); cursor:pointer; }
.bigbtn.sel { border-color:var(--accent); background:#232343; }
#capform { display:flex; flex-direction:column; gap:10px; }
.caprow { display:flex; gap:10px; } .caprow button { flex:1; }
.ghost { background:#26263c; }
.note { border-left:3px solid #3a3a55; padding:6px 10px; margin:8px 0; }
.note.ai { border-left-color:var(--accent); background:#1a1a30; border-radius:0 8px 8px 0; }
.note p { margin:4px 0 0; }
.commentrow { display:flex; gap:8px; margin-top:10px; }
.commentrow input { flex:1; padding:9px 12px; border-radius:8px; border:1px solid #2a2a3d;
  background:#15151f; color:var(--ink); }
.commentrow button { padding:9px 14px; }
a.bigbtn { display:flex; align-items:center; justify-content:center; text-decoration:none; }
.fieldmic { position:relative; display:flex; gap:8px; }
.fieldmic textarea, .fieldmic input[type=search] { flex:1; }
.micside { padding:8px 14px; border-radius:10px; border:1px solid #2a2a3d;
  background:#26263c; color:var(--ink); cursor:pointer; font-size:1.05em; }
.micside.rec { border-color:#ff6c8c; color:#ff6c8c; animation:pulse 1.2s infinite; }
@keyframes pulse { 50% { opacity:.55; } }
.homesearch { margin-top:8px; }
