/* ===== Kod editor ish maydoni (kod-editor-ui.js bilan): butun ekran, bitta asboblar qatori, qorong'i kod paneli,
   holat qatori; telefonda Kod/Natija yorliqlari va pastki panel. Gradient yo'q. ===== */
body[data-page="kod-editor.html"] .app-footer { display: none; }
main.ke { max-width: none !important; padding-top: 14px !important; padding-bottom: 0 !important; }
.ke-hide { display: none !important; }

/* --- asboblar qatori --- */
.ke-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.ke-top .ke-mode { margin: 0; }
.ke-top .ke-mode-b { padding: 7px 13px; }
.ke-top .grow { flex: 1; }
.ke-acts { display: flex; gap: 6px; }
.ke-top .ke-btn.icon { padding: 9px; border-radius: 10px; }
.ke-top .ke-lang-btn { padding: 6px 12px 6px 7px; min-width: 170px; }
.ke-top .ke-blang { width: 26px; height: 26px; border-radius: 7px; }
.ke-top .ke-run, .ke-mbar .ke-run { background: var(--accent); box-shadow: none; padding: 10px 18px; border-radius: 10px; }
.ke-top .ke-run:hover, .ke-mbar .ke-run:hover { filter: brightness(1.08); transform: none; }

/* --- panellar: kod paneli kengroq, natija torroq --- */
.ke-grid { grid-template-columns: var(--ke-c1, 1.6fr) 10px minmax(0, 1fr); min-height: 0; }
.ke-gutter i { width: 4px; }

/* kod paneli VS Code kabi doim qorong'i */
/* kod paneli ranglari mavzuga qarab (sozlamalar): VS Code Dark (standart), One Dark, Yorug' */
main.ke { --ke-ebg: #1e1e1e; --ke-ehd: #252526; --ke-ebd: #2d2d2d; --ke-emu: #9d9d9d; --ke-etx: #fff; --ke-ehv: #2a2d2e; --ke-hint-bg: #252526; --ke-hint-tx: #d4d4d4; --ke-hint-act: #094771; }
main.ke.ke-th-onedark { --ke-ebg: #282c34; --ke-ehd: #21252b; --ke-ebd: #181a1f; --ke-emu: #8b929e; --ke-etx: #e6e6e6; --ke-ehv: #2c313a; --ke-hint-bg: #21252b; --ke-hint-tx: #abb2bf; --ke-hint-act: #2c4b7a; }
main.ke.ke-th-light { --ke-ebg: #ffffff; --ke-ehd: var(--bg); --ke-ebd: var(--border); --ke-emu: var(--muted); --ke-etx: var(--text); --ke-ehv: color-mix(in srgb, var(--text) 6%, transparent); --ke-hint-bg: var(--surface); --ke-hint-tx: var(--text); --ke-hint-act: var(--accent); }
.ke-grid > .ke-pane:first-of-type { background: var(--ke-ebg); border-color: var(--ke-ebd); }
.ke-grid > .ke-pane:first-of-type .ke-pane-h { background: var(--ke-ehd); border-bottom-color: var(--ke-ebd); }
.ke-grid > .ke-pane:first-of-type .ke-ftab { color: var(--ke-emu); border-right-color: var(--ke-ebd); }
.ke-grid > .ke-pane:first-of-type .ke-ftab:hover { background: var(--ke-ehv); color: var(--ke-etx); }
.ke-grid > .ke-pane:first-of-type .ke-ftab.act { background: var(--ke-ebg); color: var(--ke-etx); box-shadow: inset 0 -2px 0 var(--accent); }
.ke-grid > .ke-pane:first-of-type .ke-ftab .x { color: var(--ke-emu); }
.ke-grid > .ke-pane:first-of-type .ke-ftab .x:hover { background: var(--ke-ehv); color: var(--ke-etx); }
.ke-grid > .ke-pane:first-of-type .ke-fadd { color: var(--ke-emu); border-left-color: var(--ke-ebd); }
.ke-grid > .ke-pane:first-of-type .ke-fadd:hover { background: var(--ke-ehv); color: var(--ke-etx); }
.ke-grid > .ke-pane:first-of-type .ke-tab { color: var(--ke-emu); }
.ke-grid > .ke-pane:first-of-type .ke-tab:hover { color: var(--ke-etx); }
.ke-grid > .ke-pane:first-of-type .ke-tab.on { background: var(--ke-ebg); color: var(--ke-etx); box-shadow: inset 0 0 0 1px var(--ke-ebd); }
.ke-grid > .ke-pane:first-of-type .ke-icobtn { color: var(--ke-emu); }
.ke-grid > .ke-pane:first-of-type .ke-icobtn:hover { background: var(--ke-ehv); color: var(--ke-etx); }
.ke .ke-ed .CodeMirror { font-size: var(--ke-fs, 14px); }
/* takliflar oynasi kod paneli mavzusida */
.CodeMirror-hints { background: var(--ke-hint-bg, #252526) !important; border-color: var(--ke-ebd, #3c3c3c) !important; }
.CodeMirror-hint { color: var(--ke-hint-tx, #d4d4d4) !important; }
li.CodeMirror-hint-active { background: var(--ke-hint-act, #094771) !important; color: #fff !important; }
/* One Dark mavzusi (CodeMirror) */
.cm-s-onedark.CodeMirror { background: #282c34; color: #abb2bf; }
.cm-s-onedark .CodeMirror-gutters { background: #282c34; border-right: 0; }
.cm-s-onedark .CodeMirror-linenumber { color: #4b5263; }
.cm-s-onedark .CodeMirror-cursor { border-left: 2px solid #528bff; }
.cm-s-onedark div.CodeMirror-selected, .cm-s-onedark .CodeMirror-line::selection, .cm-s-onedark .CodeMirror-line > span::selection, .cm-s-onedark .CodeMirror-line > span > span::selection { background: #3e4451; }
.cm-s-onedark .CodeMirror-activeline-background { background: rgba(255,255,255,.04); }
.cm-s-onedark .CodeMirror-matchingbracket { color: #abb2bf !important; outline: 1px solid #5c6370; }
.cm-s-onedark .cm-comment { color: #5c6370; font-style: italic; }
.cm-s-onedark .cm-keyword, .cm-s-onedark .cm-meta { color: #c678dd; }
.cm-s-onedark .cm-atom, .cm-s-onedark .cm-number { color: #d19a66; }
.cm-s-onedark .cm-def, .cm-s-onedark .cm-builtin { color: #61afef; }
.cm-s-onedark .cm-variable { color: #e5c07b; }
.cm-s-onedark .cm-variable-2, .cm-s-onedark .cm-property { color: #e06c75; }
.cm-s-onedark .cm-variable-3, .cm-s-onedark .cm-type, .cm-s-onedark .cm-qualifier { color: #e5c07b; }
.cm-s-onedark .cm-string, .cm-s-onedark .cm-string-2 { color: #98c379; }
.cm-s-onedark .cm-operator, .cm-s-onedark .cm-bracket { color: #56b6c2; }
.cm-s-onedark .cm-tag { color: #e06c75; }
.cm-s-onedark .cm-attribute { color: #d19a66; }
.cm-s-onedark .cm-error { color: #f44747; }
/* yorug' mavzu: CodeMirror "default" */
main.ke.ke-th-light .CodeMirror { background: #fff; }
main.ke.ke-th-light .CodeMirror-gutters { background: #fafafa; border-right: 1px solid var(--border); }
.CodeMirror .ke-errline { background: rgba(239, 68, 68, .18); transition: background .4s; }

/* --- holat qatori --- */
.ke-sb { position: relative; display: flex; align-items: center; gap: 16px; margin: 8px 0 4px; padding: 5px 8px 5px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); font: 600 12px var(--font-display), system-ui; color: var(--muted); min-height: 32px; }
.ke-sb .lg { color: var(--text); }
.ke-sb .ps { font-variant-numeric: tabular-nums; }
.ke-sb .sv { display: inline-flex; align-items: center; gap: 5px; }
.ke-sb .sv.ok { color: #16a34a; }
.ke-sb .sv svg { width: 13px; height: 13px; }
.ke-sb .sp { flex: 1; }
.ke-sb .kb { display: inline-flex; align-items: center; gap: 6px; border: none; background: transparent; color: var(--muted); font: inherit; cursor: pointer; padding: 4px 8px; border-radius: 7px; }
.ke-sb .kb:hover { background: var(--bg); color: var(--text); }
.ke-sb .kb svg { width: 15px; height: 15px; }
.ke-keys { position: absolute; right: 6px; bottom: calc(100% + 8px); z-index: 70; width: min(440px, 90vw); padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); box-shadow: 0 18px 40px -16px rgba(0,0,0,.35); font: 500 13px/1.8 var(--font-body, system-ui), system-ui; color: var(--text); display: none; }
.ke-keys.open { display: block; }
.ke-keys kbd { font: 600 11px var(--mono); background: var(--bg); border: 1px solid var(--border); border-bottom-width: 2px; border-radius: 5px; padding: 1px 5px; color: var(--text); }

/* --- bildirishnoma --- */
.ke-toast { position: fixed; left: 50%; bottom: 26px; z-index: 10001; transform: translate(-50%, 20px); opacity: 0; pointer-events: none; padding: 10px 16px; border-radius: 10px; background: #1e1e1e; color: #fff; font: 600 13.5px var(--font-display), system-ui; transition: opacity .2s, transform .2s; max-width: 90vw; text-align: center; }
.ke-toast.show { opacity: 1; transform: translate(-50%, 0); }

/* --- telefon --- */
.ke-mtabs, .ke-mbar { display: none; }
@media (max-width: 900px) {
  main.ke { padding-top: 10px !important; }
  .ke-top { gap: 6px; margin-bottom: 8px; }
  .ke-top .ke-mode { flex: 1 1 100%; }
  .ke-top .ke-mode-b { flex: 1; justify-content: center; padding: 7px 8px; }
  .ke-top .grow { display: none; }
  .ke-top #keLang { flex: 1; min-width: 0; }
  .ke-top .ke-lang-btn { min-width: 0; width: 100%; }
  /* web rejimida til tanlash yo'q: rejim tugmalari va amallar bitta qatorga sig'adi */
  main.ke.ke-web .ke-top .ke-mode { flex: 1 1 0; min-width: 0; }
  main.ke.ke-web .ke-top .ke-mode-b { flex: 1 1 0; min-width: 0; display: block; padding: 7px 5px; font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center; }
  main.ke.ke-web .ke-top .ke-btn.icon { padding: 7px; }
  main.ke.ke-web .ke-top .ke-mode-b svg { display: none; }
  main.ke.ke-web .ke-acts { margin-left: auto; gap: 4px; }
  .ke-top > .ke-run { display: none; }
  .ke-top .ke-btn.icon { padding: 8px; }
  .ke-mtabs { display: flex; gap: 4px; padding: 4px; margin-bottom: 8px; background: var(--bg); border: 1px solid var(--border); border-radius: 12px; }
  .ke-mtabs button { flex: 1; border: none; background: transparent; color: var(--muted); font: 700 13.5px var(--font-display), system-ui; padding: 8px; border-radius: 9px; cursor: pointer; }
  .ke-mtabs button.on { background: var(--surface); color: var(--accent); box-shadow: 0 1px 4px rgba(0,0,0,.08); }
  .ke-grid { gap: 0 !important; grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: minmax(0, 1fr); }
  .ke-gutter { display: none !important; }
  main.ke:not(.ke-out-on) .ke-grid > .ke-pane:last-of-type { display: none; }
  main.ke.ke-out-on .ke-grid > .ke-pane:first-of-type { display: none; }
  .ke-ed .CodeMirror { height: 100% !important; }
  .ke-con { min-height: 0 !important; }
  .ke-prev { min-height: 0 !important; }
  .ke-sb { display: none; }
  .ke-mbar { display: flex; align-items: center; gap: 8px; position: sticky; bottom: 0; z-index: 20; padding: 8px 0 calc(8px + env(safe-area-inset-bottom)); background: var(--bg); }
  .ke-sym { flex: 1; min-width: 0; display: flex; gap: 5px; overflow-x: auto; scrollbar-width: none; }
  .ke-sym::-webkit-scrollbar { display: none; }
  .ke-sym button { flex: none; min-width: 36px; height: 38px; padding: 0 8px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); color: var(--text); font: 600 15px var(--mono); cursor: pointer; }
  .ke-sym button:active { background: var(--bg); }
  .ke-mbar .ke-run { flex: none; padding: 10px 14px; }
  .ke-mbar .ke-run span { white-space: nowrap; }
}


/* ===== vositalar (kod-editor-tools.js) ===== */
.ke-mbtn { display: inline-flex; align-items: center; gap: 7px; padding: 8px 12px; border-radius: 10px; font-size: 13px; }
.ke-mbtn svg { width: 16px; height: 16px; }
.ke-morebtn { display: none !important; }
.ke-sb .py { color: var(--muted); }
/* sozlamalar */
.ke-setpop { position: absolute; right: 6px; bottom: calc(100% + 8px); z-index: 75; width: min(330px, 92vw); padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); box-shadow: 0 18px 40px -16px rgba(0,0,0,.35); display: none; color: var(--text); font: 600 13px var(--font-display), system-ui; }
.ke-setpop.open { display: block; }
.ke-setpop .r { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 0; border-top: 1px solid var(--border); }
.ke-setpop .r:first-child { border-top: 0; padding-top: 2px; }
.ke-setpop .r.col { flex-direction: column; align-items: stretch; }
.ke-setpop .st { display: inline-flex; align-items: center; gap: 4px; }
.ke-setpop .st b { min-width: 26px; text-align: center; font-variant-numeric: tabular-nums; }
.ke-setpop button { border: 1px solid var(--border); background: var(--bg); color: var(--text); border-radius: 8px; padding: 5px 10px; font: 700 12.5px var(--font-display), system-ui; cursor: pointer; }
.ke-setpop .st button { width: 30px; padding: 5px 0; font-size: 15px; }
.ke-setpop .seg2 { display: flex; gap: 4px; }
.ke-setpop .seg2.w button { flex: 1; }
.ke-setpop button.on { background: var(--accent); border-color: var(--accent); color: #fff; }
/* xato izohi */
.ke-explain { margin: 14px 0 2px; padding: 11px 13px; border: 1px solid color-mix(in srgb, #f59e0b 45%, var(--border)); border-radius: 11px; background: color-mix(in srgb, #f59e0b 8%, var(--surface)); color: var(--text); font: 500 13.5px/1.55 var(--font-body, system-ui), system-ui; white-space: normal; }
.ke-explain .h { display: flex; align-items: center; gap: 7px; margin-bottom: 4px; font: 700 13px var(--font-display), system-ui; }
.ke-explain .h svg { width: 16px; height: 16px; color: #d97706; }
.ke-explain p { margin: 4px 0; }
.ke-explain .fx { color: var(--muted); }
.ke-explain code { font: 600 12px var(--mono); background: var(--bg); border: 1px solid var(--border); border-radius: 5px; padding: 0 4px; }
.ke-explain .go { margin-top: 6px; border: 1px solid var(--border); background: var(--surface); color: var(--accent); border-radius: 8px; padding: 5px 10px; font: 700 12.5px var(--font-display), system-ui; cursor: pointer; }
.ke-explain .go:hover { border-color: var(--accent); }
/* qurilma ko'rinishi */
.ke-devseg { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); }
.ke-devseg button { width: 28px; height: 26px; border: 0; background: transparent; color: var(--muted); border-radius: 7px; display: grid; place-items: center; cursor: pointer; }
.ke-devseg button svg { width: 15px; height: 15px; }
.ke-devseg button.on { background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--accent); }
.ke-pv { flex: 1; min-height: 0; position: relative; overflow: hidden; display: flex; }
.ke-pv .ke-prev { flex: 1; }
.ke-pv.dev { display: block; background: var(--bg); }
.ke-pv.dev .ke-prev { position: absolute; top: 14px; transform-origin: 0 0; border-radius: 14px; box-shadow: 0 0 0 1px var(--border), 0 18px 40px -20px rgba(0,0,0,.35); }
/* masala paneli */
.ke-mpanel { flex: 1; min-height: 0; overflow: auto; padding: 14px 16px 18px; color: var(--text); font: 500 14px/1.6 var(--font-body, system-ui), system-ui; }
.ke-mpanel .mh { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.ke-mpanel .lst { border: 0; background: transparent; color: var(--accent); font: 700 12.5px var(--font-display), system-ui; cursor: pointer; padding: 0; }
.ke-mpanel .lv { font: 700 11px var(--font-display), system-ui; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); border: 1px solid var(--border); border-radius: 6px; padding: 1px 7px; }
.ke-mpanel .sv { display: inline-flex; align-items: center; gap: 4px; color: #16a34a; font: 700 12px var(--font-display), system-ui; }
.ke-mpanel .sv svg, .ke-mpanel p svg { width: 14px; height: 14px; vertical-align: -2px; margin-right: 4px; }
.ke-mpanel h3 { margin: 2px 0 8px; font: 800 18px var(--font-display), system-ui; }
.ke-mpanel .d { margin-bottom: 10px; }
.ke-mpanel .d code, .ke-mpanel .io code { font: 600 12.5px var(--mono); background: var(--bg); border: 1px solid var(--border); border-radius: 5px; padding: 0 4px; }
.ke-mpanel .io { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; margin-bottom: 10px; font-size: 13.5px; }
.ke-mpanel .io b { font: 700 12.5px var(--font-display), system-ui; color: var(--muted); }
.ke-mpanel .ex, .ke-mpanel .cmp { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; margin: 8px 0; }
.ke-mpanel small { display: block; font: 700 11.5px var(--font-display), system-ui; color: var(--muted); margin-bottom: 3px; }
.ke-mpanel pre { margin: 0; padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg); font: 12.5px/1.5 var(--mono); white-space: pre-wrap; word-break: break-word; max-height: 160px; overflow: auto; }
.ke-mpanel .act { display: flex; gap: 8px; align-items: center; margin: 12px 0 6px; }
.ke-mpanel .act .ke-run { padding: 9px 16px; }
.ke-mpanel .act .ke-run svg { width: 15px; height: 15px; }
.ke-mpanel .sol { border: 1px solid var(--border); background: var(--surface); color: var(--text); border-radius: 10px; padding: 8px 12px; font: 700 13px var(--font-display), system-ui; cursor: pointer; }
.ke-mpanel .good { color: #16a34a; font-weight: 700; margin: 6px 0; }
.ke-mpanel .bad { color: #ef4444; font-weight: 700; margin: 6px 0; }
.ke-mpanel .prog { color: var(--muted); margin: 6px 0; }
.ke-mpanel pre.er { color: #ef4444; }
.ke-mpanel .solbox { margin-top: 8px; }
/* masalalar ro'yxati va telefon menyusi (modal) */
.ke-mlist, .ke-sheet { position: fixed; inset: 0; z-index: 9990; background: rgba(15, 18, 30, .5); display: none; align-items: center; justify-content: center; padding: 16px; }
.ke-mlist.open, .ke-sheet.open { display: flex; }
.ke-mlist .in { width: min(560px, 100%); max-height: min(80vh, 720px); display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--border); border-radius: 16px; overflow: hidden; color: var(--text); }
.ke-mlist .hd { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--border); }
.ke-mlist .hd b { font: 800 16px var(--font-display), system-ui; }
.ke-mlist .hd span { color: var(--muted); font-size: 13px; }
.ke-mlist .hd .x { margin-left: auto; width: 32px; height: 32px; border: 0; border-radius: 8px; background: var(--bg); color: var(--muted); display: grid; place-items: center; cursor: pointer; }
.ke-mlist .hd .x svg { width: 15px; height: 15px; }
.ke-mlist .bd { overflow: auto; padding: 4px 16px 16px; }
.ke-mlist h4 { margin: 14px 0 6px; font: 700 11.5px var(--font-display), system-ui; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.ke-mlist ol { list-style: none; margin: 0; padding: 0; }
.ke-mlist ol button { width: 100%; display: flex; align-items: center; gap: 10px; padding: 9px 10px; border: 0; border-top: 1px solid var(--border); background: transparent; color: var(--text); cursor: pointer; text-align: left; font: 600 14px var(--font-display), system-ui; }
.ke-mlist ol li:first-child button { border-top: 0; }
.ke-mlist ol button:hover { background: var(--bg); }
.ke-mlist .n { width: 26px; color: var(--muted); font-variant-numeric: tabular-nums; font-size: 12.5px; }
.ke-mlist .t { flex: 1; }
.ke-mlist .ck { color: #16a34a; } .ke-mlist .ck svg { width: 16px; height: 16px; }
.ke-mlist .ld { padding: 20px; color: var(--muted); }
.ke-sheet { align-items: flex-end; padding: 0; }
.ke-sheet .in { width: 100%; padding: 10px 12px calc(14px + env(safe-area-inset-bottom)); background: var(--surface); border-radius: 18px 18px 0 0; display: flex; flex-direction: column; }
.ke-sheet .it { border: 0; border-top: 1px solid var(--border); background: transparent; color: var(--text); text-align: left; padding: 14px 6px; font: 700 15px var(--font-display), system-ui; cursor: pointer; }
.ke-sheet .it:first-child { border-top: 0; }
.ke-sheet .ke-setpop { position: static; width: auto; box-shadow: none; border: 0; padding: 4px 2px; }
@media (max-width: 900px) {
  .ke-acts > .ke-btn:not(.ke-morebtn) { display: none !important; }
  .ke-morebtn { display: inline-flex !important; }
  .ke-top .ke-mbtn { padding: 8px 10px; }
  main.ke:not(.ke-web) .ke-top .ke-mbtn span { display: none; }
  .ke-mpanel { padding: 12px; }
}
/* 901-1400px: asboblar qatori bitta qatorga sig'sin ("Masalalar" faqat belgi, til va rejim tugmalari torroq) */
@media (min-width: 901px) and (max-width: 1400px) {
  .ke-top .ke-mbtn span { display: none; }
  .ke-top .ke-mbtn { padding: 9px; }
  .ke-top .ke-lang-btn { min-width: 0; }
  .ke-top .ke-mode-b { padding: 7px 10px; }
  .ke-acts { gap: 4px; }
}
/* natija paneli yorliqlari bitta qatorda (Natija, Kiritish, Masala) */
.ke-pane .ke-tabs { flex-wrap: nowrap; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.ke-pane .ke-tabs::-webkit-scrollbar { display: none; }
.ke-pane .ke-tab { white-space: nowrap; flex: none; }
@media (max-width: 900px) {
  .ke-pane .ke-pane-h { padding: 8px 10px; gap: 6px; }
  .ke-pane .ke-tab { padding: 6px 8px; font-size: 12px; }
}
@media (max-width: 420px) { .ke-pane .ke-clear { display: none; } }

/* ===== buyruqlar paneli (kod-editor-pro.js) ===== */
.ke-pal { position: fixed; inset: 0; z-index: 9995; display: none; justify-content: center; align-items: flex-start; padding: 12vh 16px 16px; background: rgba(15, 18, 30, .35); }
.ke-pal.open { display: flex; }
.ke-pal .in { width: min(560px, 100%); background: var(--surface); border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 24px 60px -20px rgba(0,0,0,.45); overflow: hidden; }
.ke-pal input { width: 100%; box-sizing: border-box; border: 0; border-bottom: 1px solid var(--border); padding: 14px 16px; font: 600 15px var(--font-display), system-ui; background: transparent; color: var(--text); outline: none; }
.ke-pal .ls { max-height: 50vh; overflow: auto; padding: 6px; }
.ke-pal .ls button { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 0; background: transparent; color: var(--text); text-align: left; padding: 9px 10px; border-radius: 8px; font: 600 14px var(--font-display), system-ui; cursor: pointer; }
.ke-pal .ls button.on, .ke-pal .ls button:hover { background: color-mix(in srgb, var(--accent) 12%, transparent); }
.ke-pal .ls kbd { font: 600 11px var(--mono); color: var(--muted); background: var(--bg); border: 1px solid var(--border); border-radius: 5px; padding: 1px 6px; }
.ke-pal .ls p { margin: 10px; color: var(--muted); font-size: 13px; }
.ke-keys2 { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border); }
.ke-keys2 > div { margin: 2px 0; }
/* lint belgilari kod paneli mavzusida */
.CodeMirror-lint-markers { width: 14px; }
.CodeMirror-lint-tooltip { z-index: 10002; font: 12.5px/1.45 var(--mono); }
/* fayl yorliqlari ostida aylantirish chizig'i ko'rinmasin (.ke * thin qoidasini bosib o'tadi) */
.ke .ke-ftabs { scrollbar-width: none; }
.ke .ke-ftabs::-webkit-scrollbar { display: none; }
@media (max-width: 900px) {
  .ke-top .ke-mode-b { white-space: nowrap; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
}
/* telefon: "Ishga tushirish" Kod/Natija qatorida, belgilar pastda to'rda (hammasi ko'rinadi) */
@media (max-width: 900px) {
  .ke-mtabs { align-items: center; }
  .ke-mtabs .ke-run { flex: none; padding: 8px 12px; border-radius: 9px; font-size: 13px; background: var(--accent); color: #fff; box-shadow: none; }
  .ke-mtabs .ke-run:disabled { opacity: .7; }
  .ke-mtabs .ke-run svg { width: 14px; height: 14px; }
  .ke-mbar { display: block; padding: 6px 0 calc(6px + env(safe-area-inset-bottom)); }
  .ke-sym { display: grid; grid-template-columns: repeat(auto-fill, minmax(28px, 1fr)); gap: 4px; overflow: visible; }
  .ke-sym button { min-width: 0; width: 100%; height: 36px; padding: 0; }
}
.ke-explain.top { margin: 0 0 12px; }