/* AI MEMORY — Pop Neo-Brutalist theme.
   Saturated cyan/yellow/red on black+white, huge bold type, thick borders,
   hard 8px offset shadows, chunky sticker buttons, playful asymmetry. */
:root{
  --cyan:#12E0EA; --yellow:#FFE400; --red:#FF2D55; --lime:#B6FF3B;
  --black:#0B0B0B; --white:#FFFFFF; --paper:#FFFDF5; --ink:#0B0B0B;
  --bd:4px; --shadow:8px 8px 0 var(--black); --shadow-sm:4px 4px 0 var(--black);
  --radius:0px; --font:900 1rem/1.4 "Arial Black","Helvetica Neue",Helvetica,Arial,sans-serif;
  --body:600 1rem/1.5 system-ui,"Segoe UI",Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font:var(--body);color:var(--ink);background:var(--paper);
  background-image:radial-gradient(var(--black) 1.2px,transparent 1.2px);
  background-size:22px 22px;-webkit-text-size-adjust:100%}
a{color:inherit}
h1,h2,h3{font:var(--font);text-transform:uppercase;letter-spacing:-.02em;margin:0}
h1{font-size:2rem} h2{font-size:1.4rem} h3{font-size:1.05rem}

/* --- buttons --- */
.btn{display:inline-flex;align-items:center;gap:.4em;font:800 1rem/1 system-ui,sans-serif;
  text-transform:uppercase;letter-spacing:.01em;padding:.7em 1em;border:var(--bd) solid var(--black);
  background:var(--white);color:var(--black);cursor:pointer;box-shadow:var(--shadow-sm);
  text-decoration:none;transition:transform .05s,box-shadow .05s;white-space:nowrap}
.btn:hover{transform:translate(-1px,-1px);box-shadow:6px 6px 0 var(--black)}
.btn:active{transform:translate(4px,4px);box-shadow:0 0 0 var(--black)}
.btn-yellow{background:var(--yellow)} .btn-cyan{background:var(--cyan)}
.btn-red{background:var(--red);color:var(--white)} .btn-lime{background:var(--lime)}
.btn-black{background:var(--black);color:var(--white)}
.btn-sm{padding:.45em .7em;font-size:.8rem;border-width:3px;box-shadow:3px 3px 0 var(--black)}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:var(--shadow-sm)}

/* --- inputs --- */
.ipt,.txa,.sel{width:100%;font:600 1rem system-ui,sans-serif;padding:.7em .8em;
  border:var(--bd) solid var(--black);background:var(--white);box-shadow:var(--shadow-sm)}
.txa{min-height:120px;resize:vertical;font-family:inherit}
.ipt:focus,.txa:focus,.sel:focus{outline:none;box-shadow:0 0 0 3px var(--cyan),var(--shadow-sm)}
.lbl{font:800 .75rem/1 system-ui;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.35em;display:block}
.stack{display:flex;flex-direction:column;gap:.8rem}
.row{display:flex;gap:.6rem;flex-wrap:wrap;align-items:flex-end}
.grow{flex:1 1 180px}

/* --- cards --- */
.card{background:var(--white);border:var(--bd) solid var(--black);box-shadow:var(--shadow);padding:1.1rem}
.card+.card{margin-top:1rem}

/* --- auth --- */
.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:1.2rem}
.auth-card{max-width:420px;width:100%;background:var(--white)}
.brand{display:flex;align-items:center;gap:.5rem}
.brand-emoji{font-size:2.4rem;filter:drop-shadow(3px 3px 0 var(--black))}
.brand h1{font-size:2.1rem;background:var(--cyan);border:3px solid var(--black);padding:.05em .3em;box-shadow:var(--shadow-sm)}
.tag{font-weight:700;margin:.8rem 0 1.2rem}
.fine{font-size:.8rem;color:#555;margin-top:.6rem}
.banner{border:var(--bd) solid var(--black);padding:.8rem;font-weight:800;box-shadow:var(--shadow-sm);margin-bottom:1rem}
.banner.ok{background:var(--lime)} .banner.bad{background:var(--red);color:#fff}

/* --- app shell --- */
#app{min-height:100vh}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:.8rem;
  background:var(--yellow);border-bottom:var(--bd) solid var(--black);padding:.6rem .9rem;flex-wrap:wrap}
.brand-sm{font:900 1.1rem "Arial Black",sans-serif;text-transform:uppercase;text-decoration:none;
  display:flex;align-items:center;gap:.35rem;background:var(--white);border:3px solid var(--black);
  padding:.25em .5em;box-shadow:var(--shadow-sm)}
.nav{display:flex;gap:.4rem;flex:1 1 100%;order:3;overflow-x:auto;padding-bottom:.2rem}
.nav a{font:800 .8rem system-ui;text-transform:uppercase;text-decoration:none;padding:.45em .7em;
  border:3px solid var(--black);background:var(--white);box-shadow:3px 3px 0 var(--black);white-space:nowrap}
.nav a.active{background:var(--cyan)}
.nav a .badge{background:var(--red);color:#fff;border:2px solid #000;border-radius:999px;padding:0 .4em;margin-left:.3em;font-size:.7rem}
.topbar-right{display:flex;align-items:center;gap:.5rem;margin-left:auto}
.scope-pill{font:800 .7rem system-ui;text-transform:uppercase;background:var(--white);
  border:3px solid var(--black);padding:.3em .5em;box-shadow:3px 3px 0 var(--black);max-width:40vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.logout-form{margin:0}
@media(min-width:820px){.nav{flex:1;order:0;overflow:visible}}

.view{max-width:1000px;margin:0 auto;padding:1.2rem}
.page-head{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;margin-bottom:1rem}
.page-head h2{background:var(--white);border:var(--bd) solid var(--black);padding:.15em .5em;box-shadow:var(--shadow-sm)}
.page-head .spacer{flex:1}
.intro{font-weight:700;background:var(--cyan);border:3px solid #000;padding:.6rem .8rem;box-shadow:var(--shadow-sm);margin-bottom:1rem}
.loading{font-weight:800;padding:2rem;text-align:center}
.hint{font-weight:600;font-size:.85rem;margin-top:.6rem;line-height:1.45}
.hint code{background:var(--black);color:var(--lime);font:700 .82em ui-monospace,monospace;padding:.05em .35em}
.mem .sub{font-weight:600;font-size:.85rem;color:#333;word-break:break-word}
.empty{font-weight:800;text-align:center;padding:2rem;border:3px dashed var(--black);background:#fff}

/* --- memory cards / lists --- */
.grid{display:grid;gap:1rem}
@media(min-width:680px){.grid.two{grid-template-columns:1fr 1fr}}
.mem{background:var(--white);border:var(--bd) solid var(--black);box-shadow:var(--shadow-sm);padding:.9rem;position:relative}
.mem h3{margin-bottom:.3rem;word-break:break-word}
.mem .body{font-weight:600;white-space:pre-wrap;word-break:break-word;max-height:9em;overflow:hidden}
.mem .meta{display:flex;gap:.4rem;flex-wrap:wrap;margin:.6rem 0;align-items:center}
.chip{font:800 .68rem system-ui;text-transform:uppercase;letter-spacing:.03em;border:2px solid #000;padding:.15em .5em;background:#fff}
.chip.trusted{background:var(--lime)} .chip.pending{background:var(--yellow)} .chip.archived{background:#ddd}
.chip.type{background:var(--cyan)} .chip.via{background:#fff}
.mem .actions{display:flex;gap:.4rem;flex-wrap:wrap}

/* citations */
.cite{display:inline-flex;align-items:center;gap:.25em;font:800 .72rem system-ui;
  background:var(--yellow);border:2px solid #000;padding:.1em .45em;cursor:pointer;box-shadow:2px 2px 0 #000}
.snippet{font-weight:600;white-space:pre-wrap}

/* --- chat --- */
.chat-wrap{display:flex;flex-direction:column;gap:.8rem}
.thread{display:flex;flex-direction:column;gap:.8rem;min-height:200px}
.msg{border:var(--bd) solid var(--black);padding:.7rem .9rem;box-shadow:var(--shadow-sm);max-width:88%;white-space:pre-wrap;word-break:break-word;font-weight:600}
.msg.user{align-self:flex-end;background:var(--cyan)}
.msg.assistant{align-self:flex-start;background:var(--white)}
.msg .cites{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.5rem}
.msg .modeline{font:800 .65rem system-ui;text-transform:uppercase;opacity:.6;margin-top:.4rem}

/* --- token reveal --- */
.reveal{background:var(--black);color:var(--lime);font-family:ui-monospace,Menlo,monospace;
  font-weight:700;padding:.7rem;border:var(--bd) solid var(--black);word-break:break-all}
.codebox{background:var(--black);color:#fff;font-family:ui-monospace,Menlo,monospace;font-size:.82rem;
  padding:.8rem;border:3px solid var(--black);overflow-x:auto;white-space:pre;box-shadow:var(--shadow-sm)}

/* --- table --- */
.tbl{width:100%;border-collapse:collapse;background:#fff;border:var(--bd) solid #000;box-shadow:var(--shadow-sm)}
.tbl th,.tbl td{border:2px solid #000;padding:.5em .6em;text-align:left;font-weight:600;font-size:.85rem}
.tbl th{background:var(--cyan);text-transform:uppercase;font:800 .72rem system-ui}
.tbl td.mono{font-family:ui-monospace,monospace}

/* --- modal --- */
.modal-bg{position:fixed;inset:0;background:rgba(11,11,11,.45);display:grid;place-items:center;z-index:50;padding:1rem}
.modal{background:var(--white);border:var(--bd) solid #000;box-shadow:var(--shadow);max-width:560px;width:100%;padding:1.2rem;max-height:90vh;overflow:auto}
/* fullscreen editor modal (Collabora iframe) */
.modal-full{max-width:96vw;width:96vw;height:94vh;max-height:94vh;padding:0;overflow:hidden;display:flex}
.editor-wrap{display:flex;flex-direction:column;width:100%;height:100%}
.editor-bar{display:flex;align-items:center;gap:.6rem;padding:.5rem .8rem;border-bottom:var(--bd) solid #000;background:var(--white)}
.editor-title{font-weight:800;flex:0 0 auto;margin-right:auto}
.editor-frame{flex:1 1 auto;width:100%;border:0;display:block}

/* --- toast --- */
.toast{position:fixed;left:50%;bottom:1.2rem;transform:translateX(-50%) translateY(200%);
  background:var(--black);color:#fff;font-weight:800;padding:.7rem 1rem;border:3px solid var(--yellow);
  box-shadow:var(--shadow-sm);z-index:100;transition:transform .2s;max-width:90vw}
.toast.show{transform:translateX(-50%) translateY(0)}
.toast.bad{border-color:var(--red)}

.thumb{max-width:100%;max-height:180px;border:3px solid #000;box-shadow:var(--shadow-sm);display:block;cursor:pointer}
.mem-img{max-width:100%;max-height:380px;border:var(--bd) solid #000;box-shadow:var(--shadow-sm);display:block;margin:0 0 .8rem}
.muted{color:#555;font-weight:600}
.inline{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}

/* Public doc/legal pages (privacy, docs) */
.doc-wrap{max-width:760px;margin:0 auto;padding:1.6rem 1.2rem}
.doc-card h2{margin:1.3rem 0 .5rem;font-size:1.15rem;background:var(--yellow);
  border:3px solid var(--black);display:inline-block;padding:.05em .35em;box-shadow:var(--shadow-sm)}
.doc-card p,.doc-card li{line-height:1.5}
.doc-card ul,.doc-card ol{padding-left:1.3rem;margin:.4rem 0}
.doc-card li{margin:.3rem 0}
.doc-card .btn{margin-top:1.2rem;margin-right:.5rem}
.code{display:block;background:var(--black);color:var(--lime);font:700 .95rem ui-monospace,monospace;
  border:3px solid var(--black);padding:.7rem;box-shadow:var(--shadow-sm);overflow-x:auto;white-space:pre-wrap;word-break:break-all}
.examples li{margin:.5rem 0}

/* --- submemories + sharing (social) --- */
.chip.sub{background:#E9D5FF}
.panel{border:3px solid var(--black);background:#FBFBF3;box-shadow:var(--shadow-sm);padding:.8rem}
.sub-list{display:flex;flex-direction:column;gap:.5rem}
.sub-row{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;border:2px solid #000;background:#fff;padding:.4rem .5rem}
.sub-row .grow{flex:1 1 8rem;word-break:break-word}
/* read-only shared-group viewer */
.shared-tree{display:flex;flex-direction:column;gap:.7rem}
.shared-node{border-left:4px solid var(--cyan);padding:.4rem .6rem;background:#fff;border-top:2px solid #000;border-right:2px solid #000;border-bottom:2px solid #000;box-shadow:2px 2px 0 #000}
.shared-node h3{word-break:break-word}

/* --- one-click upload (/u/:token) --- */
.up-drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;
  text-align:center;min-height:210px;padding:1.6rem;border:var(--bd) dashed var(--black);background:#fff;
  box-shadow:var(--shadow-sm);cursor:pointer;transition:background .1s,transform .05s,box-shadow .05s}
.up-drop:hover{transform:translate(-1px,-1px);box-shadow:6px 6px 0 var(--black)}
.up-drop.drag{background:var(--cyan);transform:translate(-2px,-2px);box-shadow:10px 10px 0 var(--black)}
.up-drop.disabled{opacity:.5;pointer-events:none;filter:grayscale(1)}
.up-emoji{font-size:2.8rem;filter:drop-shadow(3px 3px 0 var(--black))}
.up-sub{font-weight:700;font-size:.85rem;color:#333}
.up-kbd{font:800 .72rem ui-monospace,monospace;background:var(--black);color:var(--lime);padding:.1em .4em;border:2px solid #000}
.up-list{display:flex;flex-direction:column;gap:.6rem;margin-top:1rem}
.up-row{display:flex;align-items:center;gap:.7rem;border:3px solid #000;background:#fff;box-shadow:3px 3px 0 #000;padding:.55rem .7rem}
.up-thumb{flex:0 0 auto}
.up-row .thumb-sm{width:46px;height:46px;object-fit:cover;border:2px solid #000;display:block}
.up-row .icon{width:46px;height:46px;display:grid;place-items:center;border:2px solid #000;background:var(--yellow);font-size:1.5rem}
.up-row .info{flex:1 1 auto;min-width:0}
.up-row .name{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.up-row .sz{font-weight:600;font-size:.78rem;color:#a11}
.progress{height:12px;border:2px solid #000;background:#fff;margin-top:.4rem;overflow:hidden}
.progress > i{display:block;height:100%;width:0;background:var(--cyan);transition:width .15s}
.up-row.done .progress > i{background:var(--lime)}
.up-row.err .progress > i{background:var(--red)}
.up-badge{font:800 .68rem system-ui;text-transform:uppercase;letter-spacing:.02em;border:2px solid #000;padding:.2em .5em;flex:0 0 auto}
.up-badge.up{background:var(--yellow)} .up-badge.done{background:var(--lime)} .up-badge.err{background:var(--red);color:#fff}
.uses-pill{display:inline-block;font:800 .72rem system-ui;text-transform:uppercase;background:var(--white);
  border:3px solid #000;padding:.25em .55em;box-shadow:3px 3px 0 #000}

/* Project tabs (Memories) — one click per project, active is highlighted */
.proj-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.4rem}
.proj-tab{display:inline-flex;align-items:center;gap:.45rem;font:800 .82rem system-ui;color:var(--ink);
  border:3px solid var(--black);background:var(--white);box-shadow:3px 3px 0 var(--black);
  padding:.35em .65em;cursor:pointer;text-transform:none;letter-spacing:0;line-height:1}
.proj-tab:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--black)}
.proj-tab.active{background:var(--cyan)}
.proj-tab .proj-count{font:900 .7rem system-ui;background:var(--black);color:#fff;
  border-radius:999px;padding:.05em .5em;min-width:1.5em;text-align:center}
.proj-tab.proj-new{background:var(--yellow);border-style:dashed}