:root{
  --noir:#0C0B0A;--noir2:#171412;--noir3:#221E1A;--cream:#F3EDE2;--cream2:#D6CDBE;--gold:#C9A96E;--gold2:#E2C68F;--muted:#8C8276;--line:rgba(243,237,226,.10);
  --head:'Instrument Serif',Georgia,serif;--body:'Inter',Arial,sans-serif;
}
*{box-sizing:border-box}html,body{height:100%}
body{margin:0;background:var(--noir);color:var(--cream);font-family:var(--body);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
.hidden{display:none!important}
.kicker{font-size:10px;letter-spacing:.25em;color:var(--gold);font-weight:600}
h1{font-family:var(--head);font-weight:400;font-size:40px;line-height:1.05;margin:.3em 0 .4em}h1 em,h2 em{font-style:italic;color:var(--gold)}
h3{font-family:var(--head);font-weight:400;font-size:22px;margin:0 0 6px}
.muted{color:var(--muted)}.small{font-size:12.5px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--gold);background:transparent;color:var(--cream);padding:10px 16px;border-radius:999px;font:inherit;font-weight:500;cursor:pointer;text-decoration:none;white-space:nowrap;transition:.15s}
.btn.primary{background:var(--gold);color:var(--noir);border-color:var(--gold)}.btn.primary:hover{background:var(--gold2)}
.btn.ghost{border-color:var(--line);color:var(--cream2)}.btn.ghost:hover{border-color:var(--gold);color:var(--cream)}
.btn.small{padding:7px 12px;font-size:12.5px}.btn.block{width:100%}.btn[aria-disabled="true"]{opacity:.35;pointer-events:none}
.linkbtn{background:none;border:0;color:var(--muted);font:inherit;font-size:12.5px;cursor:pointer;text-align:left;padding:4px 0}.linkbtn:hover{color:var(--gold)}
input,textarea{font:inherit;color:var(--cream);background:var(--noir2);border:1px solid var(--line);border-radius:10px;padding:10px 12px;outline:none;width:100%}
input:focus,textarea:focus{border-color:var(--gold)}
.error{color:#e9907a;font-size:12.5px;min-height:1.2em;margin-top:6px}

/* login */
.login{min-height:100%;display:grid;place-items:center;padding:24px;background:radial-gradient(1200px 600px at 70% -10%,rgba(201,169,110,.18),transparent 60%),var(--noir)}
.login-card{width:min(420px,100%);background:var(--noir2);border:1px solid var(--line);border-radius:20px;padding:36px 32px}
.login-card label{display:block;font-size:12px;color:var(--cream2);margin:14px 0 0}.login-card input{margin-top:6px}.login-card .btn{width:100%;margin-top:22px}

/* app layout */
.app{display:grid;grid-template-columns:240px 1fr;height:100vh;height:100svh}
.side{border-right:1px solid var(--line);padding:22px 16px;display:flex;flex-direction:column;gap:14px;background:var(--noir2);min-height:0}
.brand{display:flex;flex-direction:column}.brand strong{font-family:var(--head);font-weight:400;font-size:30px;line-height:1}
.plist{flex:1;overflow:auto;display:flex;flex-direction:column;gap:4px;min-height:0}
.pitem{display:flex;flex-direction:column;padding:10px 12px;border-radius:10px;cursor:pointer;border:1px solid transparent}
.pitem:hover{background:var(--noir3)}.pitem.active{border-color:var(--gold);background:var(--noir3)}
.pitem b{font-weight:500;font-size:13.5px}.pitem span{font-size:11.5px;color:var(--muted)}
.side-foot{display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--line);padding-top:12px}

.work{display:flex;flex-direction:column;min-height:0;min-width:0}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 22px;border-bottom:1px solid var(--line)}
.title{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.name-input{font-family:var(--head);font-size:24px;background:transparent;border:0;padding:0;border-radius:0}.name-input:focus{border-bottom:1px solid var(--gold)}
.client-input{background:transparent;border:0;padding:0;font-size:12.5px;color:var(--muted);border-radius:0}.client-input:focus{border-bottom:1px solid var(--gold)}
.actions{display:flex;align-items:center;gap:8px}.cost{font-size:11.5px;color:var(--muted);margin-right:6px}

.cols{display:grid;grid-template-columns:minmax(360px,46%) 1fr;flex:1;min-height:0}
.chat{display:flex;flex-direction:column;border-right:1px solid var(--line);min-height:0}
.msgs{flex:1;overflow:auto;padding:22px;display:flex;flex-direction:column;gap:16px}
.msg{max-width:92%;padding:12px 16px;border-radius:16px;white-space:pre-wrap;word-wrap:break-word}
.msg.user{align-self:flex-end;background:var(--noir3);border:1px solid var(--line);border-bottom-right-radius:4px}
.msg.assistant{align-self:flex-start;background:transparent;border:1px solid var(--line);border-bottom-left-radius:4px}
.msg.assistant.error{border-color:#7a3b2e}
.msg .meta{display:block;font-size:11px;color:var(--muted);margin-top:8px}
.msg h1,.msg h2,.msg h3{font-size:15px;font-family:var(--body);font-weight:600;margin:.6em 0 .2em;color:var(--gold2)}
.msg ul,.msg ol{margin:.3em 0;padding-left:1.3em}.msg p{margin:.3em 0}.msg strong{color:var(--cream);font-weight:600}
.status{min-height:22px;padding:0 22px 6px;font-size:12.5px;color:var(--gold)}
.status.on::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--gold);margin-right:8px;animation:pulse 1.2s infinite}
@keyframes pulse{0%,100%{opacity:.25}50%{opacity:1}}
.composer{padding:12px 22px 18px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:8px}
.composer textarea{resize:vertical;min-height:58px;max-height:220px}
.composer-row{display:flex;align-items:center;gap:8px}.spacer{flex:1}

.panel{display:flex;flex-direction:column;min-height:0;background:#0F0E0C}
.tabs{display:flex;gap:4px;padding:12px 18px 0;border-bottom:1px solid var(--line)}
.tab{background:none;border:0;border-bottom:2px solid transparent;color:var(--muted);padding:8px 12px;font:inherit;cursor:pointer}
.tab.active{color:var(--cream);border-bottom-color:var(--gold)}
.tabpane{flex:1;overflow:auto;padding:18px}
.empty{color:var(--muted);text-align:center;padding:60px 20px;border:1px dashed var(--line);border-radius:14px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.thumb{position:relative;border:1px solid var(--line);border-radius:8px;overflow:hidden;cursor:zoom-in;background:#000;aspect-ratio:16/9}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}.thumb .n{position:absolute;left:8px;bottom:6px;font-size:11px;color:var(--cream);background:rgba(0,0,0,.55);padding:2px 7px;border-radius:999px}
.dropzone{border:1px dashed var(--gold);border-radius:14px;padding:26px;text-align:center;color:var(--cream2);cursor:pointer}.dropzone.over{background:rgba(201,169,110,.08)}
.files{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.files li{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.files li .fn{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.files li .fs{color:var(--muted);font-size:11.5px}
.files li .ok{color:#8fd19e;font-size:11px}.files li .del{background:none;border:0;color:var(--muted);cursor:pointer;font-size:16px}.files li .del:hover{color:#e9907a}
.team{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:10px}
.team li{border:1px solid var(--line);border-radius:12px;padding:12px 14px}.team li b{display:block;font-family:var(--head);font-weight:400;font-size:19px;color:var(--gold2)}.team li span{font-size:12.5px;color:var(--cream2)}
.cloud-status{margin:12px 0;padding:12px 14px;border:1px solid var(--line);border-radius:12px;font-size:13px}.cloud-status.ok{border-color:#3f6b4a}
.cloud-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
#cloudTest{display:flex;flex-wrap:wrap;gap:8px}#cloudTest input{flex:1;min-width:180px}#cloudTest ul{width:100%}

.welcome{position:absolute;inset:0 0 0 240px;display:flex;flex-direction:column;justify-content:center;padding:48px;max-width:860px;gap:10px}
.welcome p{color:var(--cream2);font-size:16px;max-width:560px}.welcome .btn{align-self:flex-start;margin-top:10px}

.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.9);display:grid;place-items:center;z-index:50}
.lightbox img{max-width:94vw;max-height:88vh;border:1px solid var(--line)}
.lightbox .close,.lightbox .nav{position:absolute;background:none;border:0;color:var(--cream);font-size:40px;cursor:pointer;padding:10px 18px}
.lightbox .close{top:8px;right:14px}.lightbox .prev{left:8px;top:50%}.lightbox .next{right:8px;top:50%}
.lightbox .cap{position:absolute;bottom:14px;left:0;right:0;text-align:center;color:var(--muted);font-size:12px}

@media (max-width:980px){
  .app{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  .side{flex-direction:row;align-items:center;gap:10px;padding:10px 12px;border-right:0;border-bottom:1px solid var(--line);overflow:auto}
  .brand strong{font-size:22px}.plist{flex-direction:row;flex:1}.pitem span{display:none}.side-foot{border:0;padding:0;flex-direction:row;gap:10px}
  .cols{grid-template-columns:1fr;grid-template-rows:1fr auto}
  .panel{max-height:46vh;border-top:1px solid var(--line)}.chat{border-right:0}
  .welcome{inset:auto 0 0 0;top:60px;padding:24px}h1{font-size:30px}
  .topbar{padding:10px 14px}.actions .cost{display:none}
}

.libsearch{display:flex;gap:8px;align-items:center;margin:8px 0 14px;flex-wrap:wrap}.libsearch input[type=text],.libsearch input:not([type]){flex:1;min-width:180px}.libsearch label{display:flex;align-items:center;gap:6px;color:var(--cream2)}
.libgroup{border:1px solid var(--line);border-radius:12px;margin-bottom:10px;overflow:hidden}
.libhead{width:100%;display:flex;align-items:center;gap:10px;background:var(--noir2);border:0;color:var(--cream);padding:12px 14px;font:inherit;cursor:pointer;text-align:left}
.libhead b{font-family:var(--head);font-weight:400;font-size:18px;flex:1}.libhead .cnt{font-size:11.5px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:2px 9px}
.libhead .chev{color:var(--gold);font-size:20px;line-height:1;transition:.15s}.libgroup.open .chev{transform:rotate(90deg)}
.libgroup .grid{display:none;padding:12px}.libgroup.open .grid{display:grid}
#libGrid{display:block}
.grid.lib .thumb{aspect-ratio:auto;cursor:default}.grid.lib .thumb img{aspect-ratio:16/9;object-fit:cover}
.libcard{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#000;display:flex;flex-direction:column}
.libcard img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;background:#111}
.libcard .lb{padding:8px 10px;display:flex;flex-direction:column;gap:4px}.libcard b{font-weight:500;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.libcard .lm{font-size:11px;color:var(--muted)}.libcard .la{display:flex;gap:6px;margin-top:4px}.libcard .la .btn{padding:4px 10px;font-size:11.5px}