/* style.css — extracted from index.html (split k1) */
  :root {
    --bg: #0f1117;
    --panel: #171a23;
    --border: #2a2e3d;
    --text: #e6e9f0;
    --muted: #8b93a7;
    --accent: #5b8cff;
    --green: #3fb950;
    --yellow: #d29922;
    --red: #f85149;
    --app-max-width: 900px;
  }
  * { box-sizing: border-box; margin: 0; padding: 0; }
  body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background: var(--bg); color: var(--text); min-height: 100vh;
  }
  .container { max-width: min(var(--app-max-width, 900px), calc(100vw - 32px)); margin: 0 auto; padding: 24px 16px 60px; }
  header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 18px 0 22px; border-bottom: 1px solid var(--border); margin-bottom: 24px;
  }
  h1 { font-size: 22px; font-weight: 700; }
  h1 small { color: var(--muted); font-weight: 400; font-size: 13px; margin-left: 8px; }
  .nav-tabs { display: flex; gap: 8px; margin-bottom: 20px; flex-wrap: wrap; }
  .tab {
    padding: 8px 16px; border-radius: 8px; background: var(--panel);
    border: 1px solid var(--border); color: var(--muted); cursor: pointer;
    font-size: 14px; font-weight: 500;
  }
  .tab.active { color: var(--accent); border-color: var(--accent); }
  .btn {
    padding: 8px 14px; border-radius: 8px; border: 1px solid var(--border);
    background: var(--panel); color: var(--text); cursor: pointer; font-size: 14px;
  }
  .btn:hover { border-color: var(--accent); }
  .btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
  .btn.danger:hover { border-color: var(--red); color: var(--red); }
  .btn.small { padding: 4px 10px; font-size: 12px; }

  /* login */
  #login-screen { max-width: 360px; margin: 12vh auto 0; text-align: center; }
  #login-screen h1 { margin-bottom: 24px; }
  #login-form { display: flex; flex-direction: column; gap: 12px; }
  input[type=password], input[type=text], textarea, select {
    width: 100%; padding: 10px 12px; border-radius: 8px;
    border: 1px solid var(--border); background: var(--panel); color: var(--text);
    font-size: 14px; font-family: inherit;
  }
  input:focus, textarea:focus, select:focus { outline: none; border-color: var(--accent); }
  #login-error { color: var(--red); font-size: 13px; margin-top: 8px; min-height: 18px; }

  /* form */
  #add-form, #notes-add-form {
    background: var(--panel); border: 1px solid var(--border); border-radius: 12px;
    padding: 16px; margin-bottom: 24px; display: flex; flex-direction: column; gap: 10px;
  }
  .form-row { display: flex; gap: 10px; flex-wrap: wrap; }
  .form-row input[type=text] { flex: 1; min-width: 200px; }
  .form-row select { width: auto; }
  textarea { min-height: 70px; resize: vertical; }

  /* list */
  .item {
    background: var(--panel); border: 1px solid var(--border); border-radius: 12px;
    padding: 14px 16px; margin-bottom: 12px; cursor: pointer;
  }
  .item.done .item-title { text-decoration: line-through; color: var(--muted); }
  .item.critical {
    border-color: rgba(248,81,73,.55);
    background: rgba(248,81,73,.07);
    box-shadow: inset 0 0 0 1px rgba(248,81,73,.25);
  }
  .item-top { display: flex; align-items: center; gap: 12px; }
  .item-title { font-size: 16px; font-weight: 600; flex: 1; }
  .item-desc {
    color: var(--muted); font-size: 14px; margin-top: 6px; white-space: pre-wrap;
    display: -webkit-box; -webkit-line-clamp: 8; -webkit-box-orient: vertical; overflow: hidden;
  }
  .item.expanded .item-desc { -webkit-line-clamp: unset; display: block; }
  .item-meta { display: flex; gap: 8px; margin-top: 10px; align-items: center; flex-wrap: wrap; }
  .tag {
    padding: 2px 10px; border-radius: 20px; font-size: 12px; font-weight: 600;
  }
  .tag.priority-high { background: rgba(248,81,73,.15); color: var(--red); }
  .tag.priority-medium { background: rgba(210,153,34,.15); color: var(--yellow); }
  .tag.priority-low { background: rgba(63,185,80,.15); color: var(--green); }
  .tag.priority-critical { background: rgba(248,81,73,.22); color: #ff8b85; border: 1px solid rgba(248,81,73,.6); }
  .tag.priority-someday { background: rgba(139,147,167,.08); color: var(--muted); font-style: italic; }
  .tag.status-todo { background: rgba(139,147,167,.15); color: var(--muted); }
  .tag.status-doing { background: rgba(91,140,255,.15); color: var(--accent); }
  .tag.status-done { background: rgba(63,185,80,.15); color: var(--green); }
  .item-actions { margin-left: auto; display: flex; gap: 6px; }
  .item-actions .btn { padding: 4px 10px; font-size: 12px; }
  .sort-bar { display: flex; gap: 8px; margin-bottom: 16px; align-items: center; }
  .sort-bar select { width: auto; }
  #empty, #notes-empty { color: var(--muted); text-align: center; padding: 40px 0; }
  .edit-form { display: flex; flex-direction: column; gap: 8px; margin-top: 10px;
    border-top: 1px solid var(--border); padding-top: 12px; }
  .hidden { display: none !important; }
  #status-line { color: var(--muted); font-size: 12px; margin-top: 20px; text-align: center; }
  .usage-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:16px; }
  .usage-note { color:var(--muted); font-size:13px; line-height:1.45; margin-bottom:16px; }
  .usage-grid { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:18px; }
  .usage-card { background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:14px 16px; flex:1 1 0; min-width:0; }
  .usage-card strong { display:block; font-size:20px; margin-top:5px; }
  .usage-card span { color:var(--muted); font-size:12px; }
  .usage-table-wrap { overflow-x:auto; background:var(--panel); border:1px solid var(--border); border-radius:12px; }
  .usage-table { width:100%; border-collapse:collapse; font-size:12px; white-space:nowrap; }
  .usage-table th, .usage-table td { padding:10px 12px; border-bottom:1px solid var(--border); text-align:right; }
  .usage-table th:first-child, .usage-table td:first-child { text-align:left; }
  .usage-table th { color:var(--muted); font-weight:600; }
  .usage-table tr:last-child td { border-bottom:0; }
  .usage-table th[data-align="left"], .usage-table td[data-align="left"] { text-align:left; }
  .usage-table th[data-align="center"], .usage-table td[data-align="center"] { text-align:center; }
  .usage-table tr.bench-sep td { padding:6px 12px; background:var(--bg); border-bottom:1px solid var(--border); }
  .usage-table tbody tr:not(.bench-sep):hover td { background:rgba(91,140,255,.08); }
  .cache-miss { color:var(--red); font-weight:700; }
  .bench-live-log { background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:12px 14px; font-size:12px; line-height:1.5; max-height:220px; overflow-y:auto; white-space:pre-wrap; word-break:break-word; margin:0 0 18px 0; }
  .bench-live-log:empty { display:none; }
  .bench-alert { border:1px solid var(--red); color:var(--red); border-radius:12px; padding:10px 14px; font-size:13px; font-weight:600; margin:0 0 16px 0; }
  .bench-alert.hidden { display:none; }
  .bench-live { background:var(--panel); border:1px solid var(--border); border-left:4px solid var(--green); border-radius:12px; padding:10px 14px; font-size:13px; margin:0 0 16px 0; line-height:2.1; }
  .bench-live:empty { display:none; }
  .bench-live .bench-done { display:block; margin-top:4px; font-size:12px; color:var(--muted); }
  .bench-agg { line-height:2.1; flex-basis:100%; }
  .bench-row summary { display:flex; flex-wrap:wrap; align-items:flex-start; gap:4px 10px; cursor:pointer; list-style:none; }
  .bench-row summary::-webkit-details-marker { display:none; }
  .bench-row summary::marker { content:''; }
  .bench-row summary::before { content:'▶'; font-size:11px; color:var(--muted); flex:0 0 auto; align-self:flex-start; margin-top:7px; }
  .bench-row[open] > summary::before { content:'▼'; }
  .bench-row summary > .bench-head { flex:1; min-width:0; }
  .bench-model { color:var(--accent); font-size:16px; }
  .bench-head { display:inline; }
  .bench-chip { display:inline-block; background:var(--panel); border:1px solid var(--border); border-radius:8px; padding:2px 9px; margin:2px 6px 2px 0; font-size:12px; white-space:nowrap; }
  .bench-chip b { font-size:13px; }
  .bench-chip-bad { border-color:var(--red); color:var(--red); }
  .tab-alert { border-color:var(--red) !important; color:var(--red) !important; }
  /* --- OpenCode Limits --- */
  .limits-wrap { margin-bottom:20px; }
  .limits-title { font-weight:700; font-size:15px; margin-bottom:12px; display:flex; align-items:center; gap:8px; }
  .limits-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:12px; }
  .limit-card { background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:16px; }
  .limit-head { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:8px; }
  .limit-label { font-weight:600; font-size:14px; }
  .limit-pct { font-size:22px; font-weight:700; }
  .limit-pct.over { color:var(--red); }
  .limit-pct.warn { color:#f0ad4e; }
  .limit-pct.ok { color:var(--green, #4caf50); }
  .limit-bar-track { width:100%; height:8px; background:var(--border); border-radius:4px; overflow:hidden; margin-bottom:8px; }
  .limit-bar-fill { height:100%; border-radius:4px; transition:width .4s ease; }
  .limit-bar-fill.ok { background:var(--green, #4caf50); }
  .limit-bar-fill.warn { background:#f0ad4e; }
  .limit-bar-fill.over { background:var(--red); }
  .limit-meta { display:flex; justify-content:space-between; font-size:12px; color:var(--muted); }
  .limit-balance { font-weight:600; }
  .limit-balance.negative { color:var(--red); }
  .limit-balance.positive { color:var(--green, #4caf50); }
  .usage-chart { background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:14px; margin-bottom:18px; }
  .bar-row { display:flex; align-items:center; gap:8px; margin:7px 0; font-size:12px; }
  .bar-label { width:92px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; }
  .usage-filters { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:14px; font-size:13px; }
  .usage-filters label { display:flex; align-items:center; gap:6px; color:var(--muted); }
  .usage-filters select { background:var(--panel); color:var(--text); border:1px solid var(--border); border-radius:8px; padding:5px 8px; font-size:13px; }
  .usage-check input { accent-color:var(--red); }
  /* Skills tab: neutral white checkboxes (red reads as a problem state) */
  #skills-enabled, #skills-prov-curator, #skills-prov-ours, #skills-prov-origin { accent-color:#fff; }
  .usage-pager { display:flex; align-items:center; gap:8px; margin-left:auto; }
  .usage-pager button { min-width:30px; }
  .usage-pager button:disabled { opacity:.35; cursor:default; }
  #usage-window-label { font-weight:700; color:var(--text); }
  .usage-more-wrap { padding:12px; text-align:center; }
  .bar { height:14px; border-radius:4px; background:var(--accent); min-width:2px; }
  .bar-value { color:var(--muted); }

  /* live monitor */
  .live-now-wrap { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:18px; }
  .live-card { background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:12px 16px; min-width:130px; flex:1 1 0; }
  .live-card .lv { font-size:22px; font-weight:700; }
  .live-card .lk { font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
  .live-role { display:inline-block; padding:2px 10px; border-radius:999px; font-size:12px; font-weight:600; }
  .live-role.primary { background:rgba(76,175,80,.15); color:#6cc474; }
  .live-role.fallback { background:rgba(255,152,0,.15); color:#ffb54d; }
  .live-role.manual { background:rgba(91,140,255,.15); color:#7ea0ff; }
  .live-ctx-bar { height:8px; border-radius:4px; background:rgba(255,255,255,.08); overflow:hidden; margin-top:6px; }
  .live-ctx-fill { height:100%; background:var(--accent); }
  .live-ctx-fill.warn { background:#ffb54d; } .live-ctx-fill.hot { background:#e5534b; }
  .live-pulse { font-size:12px; color:var(--muted); margin-right:10px; }
  .live-pulse.on { color:#6cc474; }
  .live-ev { display:flex; gap:10px; padding:7px 10px; border-radius:8px; font-size:13px; border-bottom:1px solid var(--border); }
  .live-ev:hover { background:rgba(91,140,255,.06); }
  .live-ev-time { color:var(--muted); font-size:11px; white-space:nowrap; font-family:monospace; }
  .live-ev-body { flex:1; min-width:0; }
  .live-ev-detail { color:var(--muted); font-size:11px; }
  .live-arrow { font-family:monospace; }
  .probe-404 { border:1px solid rgba(229,83,75,.55) !important; background:rgba(229,83,75,.09) !important; opacity:.92; }
  .probe-404 .live-arrow { color:#e5534b; }
  .live-sessions { display:grid; gap:16px; margin-bottom:18px; }
  .live-sess-block { background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:14px 16px; }
  .live-sess-head { display:flex; align-items:center; gap:10px; margin-bottom:10px; font-size:13px; color:var(--muted); flex-wrap:wrap; }
  .live-sess-head .live-title { color:var(--text); font-weight:600; }
  .live-src { display:inline-block; padding:1px 8px; border-radius:999px; font-size:11px; font-weight:600; background:rgba(91,140,255,.12); color:#7ea0ff; }
  .live-src.telegram { background:rgba(0,150,255,.12); color:#57b6ff; }
  .live-src.cron { background:rgba(150,110,255,.12); color:#b79bff; }
  .live-now-wrap { display:flex; flex-wrap:wrap; gap:12px; }

  /* modal */
  .modal-overlay {
    position: fixed; inset: 0; z-index: 100;
    background: rgba(0,0,0,.6);
    display: flex; align-items: center; justify-content: center;
    padding: 20px;
  }
  .modal-box {
    background: var(--panel); border: 1px solid var(--border); border-radius: 14px;
    width: 100%; max-width: 620px; max-height: 90vh; overflow-y: auto;
    padding: 20px 22px;
  }
  .modal-box h2 { font-size: 18px; margin-bottom: 14px; }
  .modal-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:14px; }
  .modal-head h2 { margin-bottom:0; }
  .modal-box.small { max-width: 380px; }
  .modal-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 16px; }
  .width-row { display: flex; gap: 10px; align-items: center; }
  .width-row input[type=number] { width: 90px; flex: none; }
  .width-row input[type=range] { flex: 1; accent-color: var(--accent); }
  .width-hint { color: var(--muted); font-size: 12px; margin-top: 8px; }
  .modal-body label {
    display: block; color: var(--muted); font-size: 12px; font-weight: 600;
    margin: 10px 0 4px; text-transform: uppercase; letter-spacing: .03em;
  }
  .modal-body textarea { min-height: 130px; }
  #notes-new-desc { min-height: 260px; }
  #notes-edit-desc { min-height: 260px; }

  /* file manager */
  .fm-path-bar { display:flex; gap:8px; margin-bottom:12px; align-items:center; }
  .fm-path-bar input { flex:1; font-family:monospace; font-size:13px; }
  .fm-path-bar button { white-space:nowrap; }
  .fm-section { background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:16px; margin-bottom:16px; }
  .fm-section h3 { font-size:14px; font-weight:600; margin-bottom:10px; display:flex; align-items:center; gap:8px; }
  .fm-fav-note { font-size:12px; font-weight:400; color:var(--accent); margin-left:auto; }
  .fm-entry { display:flex; align-items:center; gap:8px; padding:6px 8px; border-radius:6px; cursor:pointer; font-size:13px; }
  .fm-entry:hover { background:rgba(91,140,255,.08); }
  .fm-entry.is-dir { font-weight:500; }
  .fm-entry .fm-name { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .fm-entry .fm-meta { color:var(--muted); font-size:11px; white-space:nowrap; }
  .fm-entry input[type=checkbox] { accent-color:var(--accent); cursor:pointer; }
  .fm-fav { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:8px; background:var(--bg); margin-bottom:6px; cursor:pointer; }
  .fm-fav:hover { background:rgba(91,140,255,.08); }
  .fm-fav-path { font-family:monospace; font-size:12px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1; }
  .fm-fav-name { font-weight:600; font-size:13px; margin-right:6px; white-space:nowrap; }
  .fm-empty { color:var(--muted); font-size:13px; text-align:center; padding:20px 0; }
  .fm-toolbar { display:flex; gap:8px; margin-bottom:10px; flex-wrap:wrap; }
  #fm-list { min-height:200px; }
  .fm-selected-count { color:var(--accent); font-size:12px; font-weight:600; }
  .fm-search-hit { display:flex; align-items:flex-start; gap:8px; padding:6px 8px; border-radius:6px; cursor:pointer; font-size:13px; }
  .fm-search-hit:hover { background:rgba(91,140,255,.08); }
  .fm-search-hit .fm-name { font-weight:600; }
  .fm-search-hit .fm-path { font-family:monospace; font-size:11px; color:var(--muted); }
  .fm-search-hit .fm-line { font-family:monospace; font-size:12px; color:var(--yellow); margin-top:2px; }
  .fm-search-hit .fm-line em { color:var(--red); font-style:normal; font-weight:700; }
  .fm-search-hit input[type=checkbox] { accent-color:var(--accent); cursor:pointer; }

  /* file editor modal */
  .editor-modal { padding:0; display:flex; flex-direction:column; max-height:90vh; width:92vw; max-width:1400px; }
  .editor-header { display:flex; align-items:center; gap:10px; padding:14px 18px; border-bottom:1px solid var(--border); flex-shrink:0; }
  .editor-header .editor-title { font-size:14px; font-weight:600; font-family:monospace; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .editor-header .btn { font-size:12px; padding:5px 12px; }
  .editor-status { padding:4px 18px; font-size:11px; color:var(--muted); border-top:1px solid var(--border); flex-shrink:0; display:flex; justify-content:space-between; }
  .editor-body { flex:1; overflow:hidden; position:relative; }
  .editor-body .CodeMirror { height:calc(90vh - 80px); }
  .editor-binary { display:flex; align-items:center; justify-content:center; height:100%; min-height:30vh; color:var(--muted); font-size:15px; text-align:center; padding:40px; }
  /* wiki reader */
  .wiki-wrap { display:flex; gap:28px; align-items:flex-start; }
  .wiki-side { width:260px; flex-shrink:0; max-height:70vh; overflow:auto; border:1px solid var(--border); border-radius:8px; padding:8px; }
  .wiki-group { font-size:11px; font-weight:700; color:var(--muted); margin:8px 4px 4px; text-transform:uppercase; }
  .wiki-item { padding:5px 8px; border-radius:6px; cursor:pointer; font-size:13px; }
  .wiki-item:hover { background:rgba(91,140,255,.08); }
  .wiki-item.active { background:rgba(91,140,255,.15); font-weight:600; }
  .wiki-main { flex:1; min-width:0; padding-left:12px; }
  .wiki-doc { font-size:14px; line-height:1.6; }
  .wiki-doc table { border-collapse:collapse; margin:10px 0; }
  .wiki-doc th, .wiki-doc td { border:1px solid var(--border); padding:6px 10px; text-align:left; }
  .wiki-doc pre { background:rgba(0,0,0,.3); padding:10px; border-radius:6px; overflow:auto; }
  a.wikilink { color:var(--accent); text-decoration:none; border-bottom:1px dotted var(--accent); cursor:pointer; }
  .wiki-backlinks { margin-top:16px; padding-top:8px; border-top:1px solid var(--border); font-size:13px; color:var(--muted); }
  .wiki-search-hit { padding:6px 8px; border-radius:6px; cursor:pointer; font-size:13px; }
  .wiki-search-hit:hover { background:rgba(91,140,255,.08); }
  #wiki-graph-box { width:100%; height:70vh; margin:0 auto; }
  /* skills tab */
  .skills-table { table-layout:auto; }
  .skills-table th, .skills-table td { padding:8px 8px; }
  .skills-table .skills-name { white-space:normal; word-break:break-word; min-width:150px; }
  .skill-file-list { list-style:none; padding:0; margin:0 0 12px; }
  .skill-file-list li { display:flex; align-items:center; gap:8px; padding:4px 0; }
  .skill-pre { white-space:pre-wrap; word-break:break-word; font-size:12.5px; line-height:1.55; }
  .sk-h { color:var(--accent); font-weight:700; }
  .sk-fm { color:var(--muted); }
  .sk-fence { color:var(--muted); font-weight:700; }
  .sk-code { color:#9ecbff; }
  .sk-ic { color:#ffb54d; background:rgba(255,181,77,.1); border-radius:4px; padding:0 4px; }
  .sk-b { font-weight:700; }
  .sk-list { color:var(--text); }
  .sk-quote { color:var(--muted); font-style:italic; }
  .sk-str { color:#ffb54d; }
  .sk-c { color:var(--muted); font-style:italic; }

  .bench-spread { color:var(--muted); font-size:11px; white-space:nowrap; }

/* Benchmark — compare modal in fullscreen (CSS fallback + real fullscreen) */
#exbench-table-modal.bench-fs { padding: 0; }
#exbench-table-modal.bench-fs .modal-box {
  width: 100vw; max-width: none;
  height: 100vh; max-height: none;
  border: none; border-radius: 0;
  display: flex; flex-direction: column;
  overflow: hidden; padding: 14px 18px;
}
#exbench-table-modal.bench-fs .modal-head { flex: none; }
#exbench-table-modal.bench-fs .modal-body {
  flex: 1 1 auto; min-height: 0; overflow: auto;
}

/* Benchmark — per-model "v porovnání" toggle next to the model name */
.bench-model-toggle {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: 10px;
  font-size: 12px;
  font-weight: 400;
  color: var(--muted);
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
.bench-model-toggle input { margin: 0; cursor: pointer; }
.bench-model-toggle:hover { color: var(--fg, inherit); }