:root{--bg:#f4f6f9;--card:#fff;--ink:#1c2733;--muted:#64748b;--accent:#2563eb;--danger:#dc2626;--line:#dbe2ea}
*{box-sizing:border-box}
body{margin:0;font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:var(--bg);color:var(--ink)}
.topbar{display:flex;align-items:center;gap:1rem;padding:.6rem 1.2rem;background:#0f2540;color:#fff}
.topbar .brand{color:#fff;font-weight:700;text-decoration:none}
.topbar nav{margin-left:auto;display:flex;gap:1rem;align-items:center}
.topbar nav a{color:#cfe1f5;text-decoration:none}
.wrap{max-width:880px;margin:1.4rem auto;padding:0 1rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:1.2rem 1.4rem;margin-bottom:1rem}
.narrow{max-width:420px;margin:2.5rem auto}
h1{font-size:1.3rem;margin:.1rem 0 .8rem}
h2{font-size:1.05rem;margin:0 0 .6rem}
label{display:block;margin:.65rem 0;font-size:.9rem;color:var(--muted)}
input{display:block;width:100%;margin-top:.25rem;padding:.5rem .6rem;border:1px solid var(--line);border-radius:7px;font-size:1rem;color:var(--ink);background:#fff}
button{margin-top:.8rem;padding:.55rem 1rem;border:0;border-radius:7px;background:var(--accent);color:#fff;font-size:.95rem;cursor:pointer}
button.danger{background:var(--danger)}
.linklike{background:none;color:#cfe1f5;padding:0;margin:0;font-size:.9rem;text-decoration:underline;cursor:pointer}
.flash{padding:.6rem .8rem;border-radius:7px;margin:.6rem 0;font-size:.92rem}
.flash-error{background:#fee2e2;color:#7f1d1d}
.flash-success{background:#dcfce7;color:#14532d}
.flash-warning{background:#fef3c7;color:#78350f}
.flash-info{background:#e0efff;color:#1e3a5f}
.muted{color:var(--muted);font-size:.9rem}
.kv{border-collapse:collapse;width:100%}
.kv th{text-align:left;color:var(--muted);font-weight:600;padding:.35rem .8rem .35rem 0;width:9rem;vertical-align:top}
.kv td{padding:.35rem 0}
a{color:var(--accent)}
.cols{display:flex;gap:1rem;flex-wrap:wrap}
.box{flex:1 1 260px;border:1px solid var(--line);border-radius:8px;padding:1rem}
.qr{display:block;margin:.6rem auto;border:1px solid var(--line);border-radius:8px;background:#fff}
.secret{font-size:1.05rem;letter-spacing:.08em;background:#eef2f7;padding:.3rem .5rem;border-radius:6px}
.wrapcode{display:block;word-break:break-all;background:#eef2f7;padding:.4rem;border-radius:6px;font-size:.8rem}
.codes{columns:2;list-style-position:inside;padding:.4rem}
.codes code{font-size:1.05rem;letter-spacing:.06em}
.notice{background:#eef2f7;border-radius:8px;padding:1rem;margin:.8rem 0}
.inline{display:inline;margin:0}
.btn{display:inline-block;padding:.5rem .9rem;background:var(--accent);color:#fff;border-radius:7px;text-decoration:none;margin-top:.6rem}
.foot{max-width:880px;margin:2rem auto;color:var(--muted);font-size:.8rem;text-align:center}
.cards { display: flex; gap: 12px; flex-wrap: wrap; margin: 16px 0; }
.cards .card { min-width: 140px; text-align: center; padding: 14px; }
table.list { width: 100%; border-collapse: collapse; margin: 12px 0; }
table.list th, table.list td { border-bottom: 1px solid #2a3350; padding: 7px 9px; text-align: left; font-size: 14px; }
table.list th { color: #9fb0d0; font-weight: 600; }
.badge { padding: 2px 8px; border-radius: 9px; font-size: 12px; }
.badge.active { background: #1d4028; color: #7ee2a0; }
.badge.invited { background: #40381d; color: #e2c97e; }
.badge.suspended { background: #401d1d; color: #e27e7e; }
.badge.internship_ended { background: #333; color: #aaa; }
.actions { display: flex; gap: 10px; flex-wrap: wrap; margin: 12px 0; }
.actions form { display: inline; }
form.inline { display: inline-flex; gap: 6px; }
ul.alerts li { margin: 6px 0; }
.btn { display: inline-block; padding: 7px 14px; background: #2a3350; color: #fff; border-radius: 6px; text-decoration: none; }
.muted { color: #9fb0d0; font-size: 13px; }
fieldset { border: 1px solid #2a3350; border-radius: 6px; margin: 10px 0; }
label { display: block; margin: 8px 0; }

/* --- M1d part 2: plans/settings/provider/models/slots/clients --- */
.filters { display: flex; gap: 8px; align-items: center; margin: 10px 0; flex-wrap: wrap; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .85em; }
.w80 { width: 80px; } .w90 { width: 110px; } .w100 { width: 110px; }
.w110 { width: 120px; } .w160 { width: 180px; } .w220 { width: 240px; }
.check { display: inline-flex; gap: 5px; align-items: center; margin-right: 12px; }
.model-list { display: flex; flex-direction: column; gap: 4px; margin: 10px 0; }
.model-row { display: grid; grid-template-columns: minmax(200px, 1.3fr) 130px 55px 105px 90px 95px 95px 95px 70px minmax(230px, 1.2fr) 170px; gap: 6px; align-items: center; border: 1px solid #2a3350; border-radius: 6px; padding: 6px; font-size: 13px; }
.model-row.model-head { font-weight: 600; color: #9fb0d0; border-style: dashed; }
.model-row.removed { opacity: .55; }
.model-row .actions { margin: 0; display: flex; gap: 6px; }
.setting-row { display: grid; grid-template-columns: 300px 1fr; gap: 10px; align-items: start; margin: 7px 0; }
.setting-row .setting-key { margin: 0; font-size: 13px; }
.badge.awaiting { background: #40381d; color: #e2c97e; }
.badge.approved { background: #1d4028; color: #7ee2a0; }
.badge.rejected { background: #401d1d; color: #e27e7e; }
.badge.revoked { background: #333; color: #aaa; }
.badge.archived { background: #333; color: #aaa; }
.badge.restricted { background: #40381d; color: #e2c97e; }
.grants { max-height: 240px; overflow: auto; border: 1px solid #2a3350; border-radius: 6px; padding: 8px; margin: 8px 0; }
.grants strong { display: block; margin: 6px 0; }
.slot { margin: 14px 0; }
form.inline label { display: inline-flex; margin: 0; gap: 4px; align-items: center; }

/* --- M2: limit engine (usage meters, overrides) --- */
.meter { height: 10px; border-radius: 6px; background: #1a2138; border: 1px solid #2a3350; overflow: hidden; display: inline-block; vertical-align: middle; min-width: 140px; }
.meter span { display: block; height: 100%; background: #4f7dd9; }
.meter.warn span { background: #d9a44f; }
.meter.danger span { background: #d95f4f; }
.badge.expired { background: #333; color: #aaa; }
.limit-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }

/* --- M3: chat --- */
.mode-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; margin: 10px 0; }
.mode-card { display: flex; flex-direction: column; gap: 4px; border: 1px solid #2a3350; border-radius: 8px; padding: 12px; cursor: pointer; }
.mode-card:has(input:checked) { border-color: #4f7dd9; background: #1a2138; }
.chat-log { display: flex; flex-direction: column; gap: 14px; margin: 18px 0; }
.msg { border: 1px solid #2a3350; border-radius: 8px; padding: 10px 12px; max-width: 100%; }
.msg-user { border-color: #33517e; background: #16203a; }
.msg-assistant { background: #121a2e; }
.msg-meta { font-size: 12px; color: #9fb0d0; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-bottom: 4px; }
.msg-body { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14px; }
.msg-time { margin-left: auto; }
.chat-notice { font-size: 12.5px; color: #e2c97e; background: #241f10; border: 1px solid #4a411f; border-radius: 6px; padding: 6px 10px; }
.cites { margin-top: 6px; font-size: 12.5px; }
.cites a { margin-right: 8px; }
#composer { margin: 14px 0 40px; }
#draft { width: 100%; min-height: 84px; background: #0e1526; color: #e8eefc; border: 1px solid #2a3350; border-radius: 8px; padding: 10px; font: inherit; }
.composer-row { display: flex; gap: 10px; align-items: center; margin-top: 8px; flex-wrap: wrap; }
.composer-row .grow { flex: 1; }
.chip { display: inline-block; background: #1a2138; border: 1px solid #2a3350; border-radius: 999px; padding: 3px 10px; font-size: 12px; margin: 2px 4px 2px 0; }
.fb button { opacity: .55; }
.fb button.on { opacity: 1; color: #7ee2a0; }
.badge.mutedb { background: #222; color: #888; }
.export-row a { margin-right: 6px; }
tr.dim { opacity: .6; }

/* ---- M4: memory / approvals / templates / notifications / clients ---- */
.badge.warnb { background: #b45309; color: #fff; }
.badge.okb { background: #15803d; color: #fff; }
.badge.approved { background: #15803d; color: #fff; }
.navbell { position: relative; }
.tplsel { max-width: 12rem; }
.checkline { display: inline-flex; gap: .35rem; align-items: center; margin-right: 1rem; }
.ctxpre { white-space: pre-wrap; background: #f6f7f9; border: 1px solid #ddd; border-radius: 6px; padding: .75rem; font-size: .85rem; }
details.box { border: 1px solid #ddd; border-radius: 6px; padding: .5rem .75rem; margin: .5rem 0; }
details.inline { display: inline-block; }
form.stack label { display: block; margin-bottom: .5rem; }
form.stack input[type=text], form.stack input[type=number], form.stack select, form.stack textarea { width: 100%; max-width: 40rem; display: block; margin-top: .25rem; }
form.wide textarea { width: 100%; }
tr.dim td { opacity: .55; }

/* --- M5 image/video/assets --- */
.small { font-size: .82rem; }
.pager { margin-top: .75rem; }
.refitem { display: inline-flex; align-items: center; gap: .4rem; margin: .25rem .5rem .25rem 0; padding: .25rem .4rem; border: 1px solid #ddd; border-radius: 6px; }
tr.jactive td { background: #fffbe6; }
figure.card img, figure.card video { display: block; border-radius: 6px; }
figure.card figcaption { margin-top: .4rem; font-size: .85rem; }
#confirm.box { margin-top: .5rem; }
.badge.okb { background: #e6f7ec; color: #12602f; }
.checkline { display: block; margin-top: .35rem; }
