/* ── reset & base ── */
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:system-ui,sans-serif;background:var(--bg-canvas);color:var(--fg-default)}
a{color:var(--accent-blue-fg);text-decoration:none}
a:hover{text-decoration:underline}

/* ── layout ── */
.center-page{display:flex;align-items:center;justify-content:center;min-height:100vh}
.pad-page{padding:2rem}
.flex-col{display:flex;flex-direction:column;height:100vh}

/* ── card ── */
.card{background:var(--bg-default);border:1px solid var(--border-default);border-radius:8px;padding:1.5rem;margin-bottom:1.2rem}
.card-sm{padding:2rem;width:400px}
.card-md{width:480px}
.card h2{margin-bottom:1.2rem;color:var(--fg-emphasis);font-size:1.3rem}
.card h3{font-size:1rem;color:var(--fg-emphasis);margin-bottom:.8rem}

/* ── typography ── */
label{display:block;margin-bottom:.3rem;font-size:.85rem;color:var(--fg-muted)}

/* ── inputs ── */
input[type=text],input[type=password],input[type=email],select,.input-field{
  width:100%;padding:.5rem;margin-bottom:.8rem;background:var(--bg-canvas);
  border:1px solid var(--border-default);border-radius:4px;color:var(--fg-default);font-size:.9rem;outline:none}
input:focus,.input-field:focus{border-color:var(--accent-blue)}
textarea.input-field{font-family:inherit;resize:vertical}

/* ── buttons ── */
.btn{display:block;width:100%;padding:.6rem;background:var(--accent-primary);color:#fff;border:none;
  border-radius:6px;cursor:pointer;font-size:.9rem;text-align:center;text-decoration:none}
.btn:hover{background:var(--accent-primary-hover);text-decoration:none}
.btn-sm{display:inline-block;width:auto;padding:.35rem .8rem;font-size:.8rem}
.sec{background:var(--bg-subtle);color:var(--fg-muted)}
.sec:hover{background:var(--bg-muted)}
.del-btn{background:var(--accent-red-subtle);color:var(--accent-red-fg);border:1px solid rgba(182,35,40,0.31);
  border-radius:5px;padding:.3rem .8rem;cursor:pointer;font-size:.8rem}
.del-btn:hover{background:rgba(182,35,40,0.38)}
.send-btn{padding:.5rem 1rem;background:var(--accent-primary);color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:.85rem}
.send-btn:hover{background:var(--accent-primary-hover)}

/* ── separators ── */
.sep{margin:1.5rem 0;border-top:1px solid var(--border-muted)}

/* ── messages / alerts ── */
.msg{padding:.5rem;border-radius:4px;margin-bottom:1rem;font-size:.85rem}
.err{background:var(--accent-red-subtle);color:var(--accent-red-fg)}
.ok{background:var(--accent-green-subtle);color:var(--accent-green-fg)}
.info{background:var(--accent-blue-subtle);color:var(--accent-blue-fg)}
.warn{background:var(--accent-orange-subtle);color:var(--accent-orange-fg)}

/* ── top bar ── */
.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.2rem}
.top h2{margin:0}
.top a{color:var(--fg-muted);font-size:.8rem;text-decoration:none}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1.2rem;border-bottom:1px solid var(--border-muted);background:var(--bg-default)}
.topbar a{color:var(--fg-muted);font-size:.85rem}
.topbar a:hover{color:var(--fg-default)}

/* ── badges ── */
.badge{display:inline-block;background:var(--accent-blue-subtle);color:var(--accent-blue-fg);padding:.15rem .5rem;border-radius:4px;font-size:.75rem;font-weight:600}
.badge-user{background:var(--accent-purple-subtle);color:var(--accent-purple-fg)}
.badge-red{background:var(--accent-red);color:#fff;padding:0 .4rem;border-radius:10px;font-size:.7rem}
.badge-warn{background:var(--accent-orange-subtle);color:var(--accent-orange-fg)}

/* ── tabs ── */
.tabs{display:flex;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap}
.tab{padding:.4rem 1rem;border-radius:6px;background:var(--bg-subtle);color:var(--fg-muted);text-decoration:none;font-size:.9rem;border:none;cursor:pointer}
.tab.active{background:var(--accent-primary);color:#fff}
.page-tabs{display:flex;gap:.3rem;margin-bottom:1.2rem}
.page-tab{padding:.35rem .8rem;border-radius:5px;background:var(--bg-subtle);color:var(--fg-muted);font-size:.8rem;text-decoration:none}
.page-tab:hover{color:var(--fg-default);text-decoration:none}
.page-tab.active{background:var(--bg-muted);color:var(--fg-emphasis)}

/* ── drop zone ── */
.drop{border:2px dashed var(--border-default);border-radius:8px;padding:2.5rem 1rem;text-align:center;
  color:var(--fg-muted);cursor:pointer;transition:border-color .15s,color .15s;margin-bottom:1rem}
.drop.over{border-color:var(--accent-primary);color:var(--accent-green-fg)}
.flist{font-size:.8rem;color:var(--fg-muted);margin:.5rem 0;min-height:1.2em;word-break:break-all}

/* ── stats ── */
.stat-row{display:flex;gap:1.5rem;margin-bottom:1.5rem}
.stat{background:var(--bg-default);border:1px solid var(--border-default);border-radius:8px;padding:1rem 1.5rem}
.stat .n{font-size:1.6rem;color:var(--fg-emphasis);font-weight:700}
.stat .l{font-size:.8rem;color:var(--fg-muted);margin-top:.2rem}

/* ── tables ── */
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:.5rem .8rem;border-bottom:1px solid var(--border-muted);font-size:.85rem}
th{color:var(--fg-muted);font-weight:600}

/* ── admin grid ── */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:1.2rem}
.card-img{width:100%;height:220px;object-fit:cover;display:block;background:var(--bg-canvas)}
.card-body{padding:1rem}
.card-body h3{font-size:.95rem;color:var(--fg-emphasis);margin-bottom:.5rem;word-break:break-all}
.meta-grid{display:grid;grid-template-columns:auto 1fr;gap:.2rem .8rem;font-size:.8rem}
.meta-grid .k{color:var(--fg-muted)}
.meta-grid .v{color:var(--fg-default);word-break:break-word}
.prompt-box{margin-top:.6rem;padding:.5rem;background:var(--bg-canvas);border:1px solid var(--border-muted);
  border-radius:4px;font-size:.75rem;color:var(--fg-muted);max-height:80px;overflow-y:auto;word-break:break-word;line-height:1.4}
.lora-tag{display:inline-block;background:var(--accent-green-subtle);color:var(--accent-green-fg);padding:.1rem .4rem;border-radius:3px;font-size:.75rem;margin:.1rem}
.bulk-bar{display:flex;align-items:center;gap:.8rem;padding:.6rem 1rem;background:var(--bg-default);
  border:1px solid var(--border-default);border-radius:6px;margin-bottom:1rem;font-size:.85rem;color:var(--fg-default);position:sticky;top:0;z-index:10}

/* ── model page ── */
.model-tabs{display:flex;gap:.3rem;margin-bottom:1.2rem;flex-wrap:wrap}
.model-tab{padding:.4rem .9rem;border-radius:6px;background:var(--bg-subtle);color:var(--fg-muted);font-size:.85rem;text-decoration:none;border:1px solid transparent}
.model-tab:hover{color:var(--fg-default);text-decoration:none}
.model-tab.active{background:var(--accent-primary);color:#fff}
.model-item{display:flex;align-items:center;justify-content:space-between;padding:.7rem;
  background:var(--bg-canvas);border:1px solid var(--border-muted);border-radius:6px;margin-bottom:.5rem}
.model-info{flex:1}
.model-name{color:var(--fg-emphasis);font-size:.9rem;font-weight:600}
.model-meta{color:var(--fg-muted);font-size:.75rem;margin-top:.2rem}
.dl-btn{display:inline-block;padding:.35rem .8rem;background:var(--accent-primary);color:#fff;border:none;
  border-radius:5px;cursor:pointer;font-size:.8rem;text-decoration:none;white-space:nowrap}
.dl-btn:hover{background:var(--accent-primary-hover);text-decoration:none}
.doc-tabs{display:flex;gap:.3rem;margin-bottom:1rem;flex-wrap:wrap}
.doc-tab{padding:.35rem .8rem;border-radius:5px;background:var(--bg-subtle);color:var(--fg-muted);font-size:.8rem;text-decoration:none;border:1px solid transparent}
.doc-tab:hover{color:var(--fg-default);text-decoration:none}
.doc-tab.active{background:var(--bg-muted);color:var(--fg-emphasis);border-color:var(--bg-muted)}
.doc-row{display:flex;align-items:center;justify-content:space-between;padding:.5rem .7rem;
  background:var(--bg-canvas);border:1px solid var(--border-muted);border-radius:5px;margin-bottom:.4rem}
.doc-row .name{color:var(--fg-emphasis);font-size:.85rem}
.doc-row .date{color:var(--fg-muted);font-size:.75rem}
.no-model{text-align:center;color:var(--fg-muted);font-size:.85rem;padding:1rem}
.empty{text-align:center;color:var(--fg-muted);padding:3rem;font-size:.9rem}

/* ── tag ── */
.tag{display:inline-block;background:var(--accent-blue-subtle);color:var(--accent-blue-fg);padding:.2rem .6rem;border-radius:4px;font-size:.8rem;margin:.15rem}

/* ── gallery ── */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.8rem}
.gallery-item{border-radius:6px;overflow:hidden;border:1px solid var(--border-muted);background:var(--bg-canvas)}
.gallery-item img{width:100%;height:180px;object-fit:cover;display:block}
.gallery-item .cap{padding:.4rem .6rem;font-size:.75rem;color:var(--fg-muted)}

/* ── markdown ── */
.md h1{font-size:1.6rem;color:var(--fg-emphasis);margin:1.5rem 0 .8rem;padding-bottom:.3rem;border-bottom:1px solid var(--border-muted)}
.md h2{font-size:1.3rem;color:var(--fg-emphasis);margin:1.3rem 0 .6rem;padding-bottom:.2rem;border-bottom:1px solid var(--border-muted)}
.md h3{font-size:1.1rem;color:var(--fg-emphasis);margin:1rem 0 .5rem}
.md h4,.md h5,.md h6{font-size:1rem;color:var(--fg-emphasis);margin:.8rem 0 .4rem}
.md h1:first-child{margin-top:0}
.md p{margin:.6rem 0;line-height:1.7;font-size:.9rem}
.md a{color:var(--accent-blue-fg)}.md a:hover{text-decoration:underline}
.md strong{color:var(--fg-emphasis)}
.md em{color:var(--fg-default);font-style:italic}
.md code{background:var(--bg-canvas);padding:.15rem .4rem;border-radius:3px;font-size:.85em;font-family:'SF Mono',Consolas,monospace;color:var(--fg-emphasis)}
.md pre{background:var(--bg-canvas);border:1px solid var(--border-muted);border-radius:6px;padding:1rem;overflow-x:auto;margin:.8rem 0;line-height:1.5}
.md pre code{background:none;padding:0;font-size:.85rem}
.md ul,.md ol{margin:.6rem 0 .6rem 1.5rem;font-size:.9rem;line-height:1.7}
.md li{margin:.2rem 0}
.md blockquote{border-left:3px solid var(--border-default);padding:.5rem 1rem;margin:.8rem 0;color:var(--fg-muted);background:var(--bg-default)}
.md hr{border:none;border-top:1px solid var(--border-muted);margin:1.5rem 0}
.md img{max-width:100%;border-radius:6px;margin:.5rem 0}
.md del{color:var(--fg-muted)}

/* ── editor ── */
.editor{width:100%;min-height:400px;padding:.8rem;background:var(--bg-canvas);
  border:1px solid var(--border-default);border-radius:6px;color:var(--fg-default);
  font-family:'SF Mono',Consolas,monospace;font-size:.85rem;line-height:1.6;resize:vertical;tab-size:2}
.editor:focus{outline:none;border-color:var(--accent-blue)}

/* ── chat ── */
.chat-panel{flex:1;display:flex;flex-direction:column}
.messages{flex:1;overflow-y:auto;padding:1rem 1.2rem}
.msg-chat{margin-bottom:.6rem;position:relative;padding-right:1.5rem}
.msg-chat .name{font-weight:600;font-size:.8rem;color:var(--accent-blue-fg)}
.msg-chat .name.me{color:var(--accent-green-fg)}
.msg-chat .time{font-size:.7rem;color:var(--fg-subtle);margin-left:.4rem}
.msg-chat .body{font-size:.85rem;line-height:1.5;margin-top:.15rem;word-break:break-word}
.msg-chat .del-x{position:absolute;top:0;right:0;background:none;border:none;color:var(--fg-subtle);cursor:pointer;font-size:.9rem;display:none}
.msg-chat:hover .del-x{display:block;color:var(--accent-red-fg)}
.input-bar{display:flex;gap:.5rem;padding:.8rem 1.2rem;border-top:1px solid var(--border-muted);background:var(--bg-default)}
.input-bar input{flex:1;padding:.5rem .7rem;background:var(--bg-canvas);border:1px solid var(--border-default);border-radius:6px;color:var(--fg-default);font-size:.85rem;font-family:inherit}
.input-bar input:focus{outline:none;border-color:var(--accent-blue)}
.pm-layout{flex:1;display:flex;overflow:hidden}
.pm-sidebar{width:260px;border-right:1px solid var(--border-muted);overflow-y:auto;background:rgba(13,17,23,0.5)}
.conv{padding:.7rem 1rem;border-bottom:1px solid var(--border-muted);cursor:pointer;font-size:.85rem}
.conv:hover{background:var(--bg-default)}
.conv.active{background:var(--bg-default);border-left:3px solid var(--accent-primary)}
.conv .cname{color:var(--fg-emphasis);font-weight:600}
.conv .cpreview{color:var(--fg-muted);font-size:.75rem;margin-top:.2rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
.conv .cunread{float:right;background:var(--accent-red);color:#fff;padding:0 .4rem;border-radius:10px;font-size:.7rem}
.pm-thread{flex:1;display:flex;flex-direction:column}
.pm-empty{flex:1;display:flex;align-items:center;justify-content:center;color:var(--fg-muted);font-size:.9rem}
.pm-header{padding:.6rem 1rem;border-bottom:1px solid var(--border-muted);background:var(--bg-default);font-size:.9rem;color:var(--fg-emphasis);font-weight:600}
.new-conv{padding:.7rem 1rem;border-bottom:1px solid var(--border-muted);background:var(--bg-default)}
.new-conv select{width:100%;padding:.4rem;background:var(--bg-canvas);border:1px solid var(--border-default);border-radius:4px;color:var(--fg-default);font-size:.85rem}

/* ── status badges ── */
.status-beta{background:var(--accent-orange-subtle);color:var(--accent-orange-fg);padding:.1rem .5rem;border-radius:10px;font-size:.7rem;font-weight:600;text-transform:uppercase}
.status-released{background:var(--accent-green-subtle);color:var(--accent-green-fg);padding:.1rem .5rem;border-radius:10px;font-size:.7rem;font-weight:600;text-transform:uppercase}
.status-deprecated{background:var(--bg-subtle);color:var(--fg-muted);padding:.1rem .5rem;border-radius:10px;font-size:.7rem;font-weight:600;text-transform:uppercase}

/* ── theme picker ── */
.theme-select{padding:.3rem;background:var(--bg-canvas);border:1px solid var(--border-default);border-radius:4px;color:var(--fg-muted);font-size:.75rem}

/* ── utility ── */
.hide{display:none}
.text-muted{color:var(--fg-muted)}
.text-emphasis{color:var(--fg-emphasis)}
.text-sm{font-size:.85rem}
.text-xs{font-size:.8rem}
