/* Code editor panel for the DSA problem pages (language picker, starter code, solution, test cases, results). */
.ce{
  --ce-kw:#c678dd; --ce-ty:#e5c07b; --ce-str:#98c379; --ce-num:#d19a66; --ce-cm:#7a8291; --ce-fn:#61afef; --ce-op:#56b6c2;
  --ce-ok:#3fb950; --ce-bad:#f85149; --ce-warn:#d29922;
  border:1px solid var(--panel-border,#30363d); border-radius:12px; background:var(--panel,#161b22); margin:0 0 26px; overflow:hidden;
  font-family:var(--font-mono,ui-monospace,Menlo,Consolas,monospace);
}
:root[data-theme="light"] .ce{ --ce-kw:#8250df; --ce-ty:#953800; --ce-str:#0a7f3f; --ce-num:#b35900; --ce-cm:#6b7280; --ce-fn:#0b5cad; --ce-op:#0e7490; --ce-ok:#15803d; --ce-bad:#dc2626; --ce-warn:#b45309; }
.ce *{ box-sizing:border-box; }
.ce-top{ display:flex; align-items:center; gap:10px; padding:10px 12px; border-bottom:1px solid var(--panel-border,#30363d); flex-wrap:wrap; }
.ce-lang{ display:flex; align-items:center; gap:8px; font-size:12px; color:var(--text-dim,#8b949e); }
.ce-lang select{
  font:600 13px/1 var(--font-mono,monospace); color:var(--text,#e6edf3); background:var(--bg,#0d1117); border:1px solid var(--panel-border,#30363d);
  border-radius:8px; padding:8px 28px 8px 10px; cursor:pointer; appearance:none; -webkit-appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--text-dim,#8b949e) 50%),linear-gradient(135deg,var(--text-dim,#8b949e) 50%,transparent 50%);
  background-position:calc(100% - 15px) 55%,calc(100% - 10px) 55%; background-size:5px 5px,5px 5px; background-repeat:no-repeat;
}
.ce-lang select:focus-visible,.ce-btn:focus-visible,.ce-seg button:focus-visible,.ce-tab:focus-visible,.ce-pill:focus-visible,.ce-sp-btn:focus-visible{ outline:2px solid var(--accent,#58a6ff); outline-offset:1px; }
.ce-seg{ display:inline-flex; border:1px solid var(--panel-border,#30363d); border-radius:8px; overflow:hidden; }
.ce-seg button{ font:600 12px/1 var(--font-mono,monospace); padding:9px 12px; border:0; background:var(--bg,#0d1117); color:var(--text-dim,#8b949e); cursor:pointer; }
.ce-seg button + button{ border-left:1px solid var(--panel-border,#30363d); }
.ce-seg button.on{ background:var(--accent,#58a6ff); color:#04121f; }
:root[data-theme="light"] .ce-seg button.on{ color:#fff; }
.ce-seg button[disabled]{ opacity:.45; cursor:not-allowed; }
.ce-sp{ flex:1; }
.ce-btn{ font:600 13px/1 var(--font-mono,monospace); white-space:nowrap; cursor:pointer; border-radius:8px; padding:9px 14px; border:1px solid var(--panel-border,#30363d); background:var(--panel,#161b22); color:var(--text,#e6edf3); }
.ce-btn:hover{ border-color:var(--accent,#58a6ff); }
.ce-btn.go{ background:var(--accent,#58a6ff); border-color:var(--accent,#58a6ff); color:#04121f; }
:root[data-theme="light"] .ce-btn.go{ color:#fff; }
.ce-btn[disabled]{ opacity:.55; cursor:default; }
.ce-ed{ background:var(--bg,#0d1117); position:relative; }
.ce-ed textarea.ce-ta{
  display:block; width:100%; min-height:260px; height:300px; max-height:560px; resize:vertical; border:0; outline:0; padding:14px 16px; background:transparent; color:var(--text,#e6edf3);
  font:13px/1.6 var(--font-mono,monospace); font-variant-ligatures:none; font-feature-settings:"liga" 0,"calt" 0; tab-size:4; white-space:pre; overflow:auto;
}
.ce-ed .CodeMirror{ height:auto; min-height:260px; max-height:560px; font:13px/1.6 var(--font-mono,monospace); font-variant-ligatures:none; font-feature-settings:"liga" 0,"calt" 0; background:transparent; color:var(--text,#e6edf3); }
.ce-ed .CodeMirror-scroll{ min-height:260px; max-height:560px; }
.ce-ed .CodeMirror-gutters{ background:transparent; border-right:1px solid var(--panel-border,#30363d); }
.ce-ed .CodeMirror-linenumber{ color:var(--text-dim,#8b949e); }
.ce-ed .CodeMirror-cursor{ border-left:2px solid var(--text,#e6edf3); }
.ce-ed .CodeMirror-selected{ background:rgba(88,166,255,.25); }
.ce-ed .CodeMirror-focused .CodeMirror-selected{ background:rgba(88,166,255,.35); }
.ce-ed .CodeMirror-matchingbracket{ color:var(--text,#e6edf3) !important; background:rgba(88,166,255,.3); }
.ce-ed .CodeMirror-activeline-background{ background:rgba(127,127,127,.08); }
.ce-ed .cm-s-dsa .cm-keyword,.ce-ed .cm-s-dsa .cm-atom{ color:var(--ce-kw); }
.ce-ed .cm-s-dsa .cm-def,.ce-ed .cm-s-dsa .cm-variable-2{ color:var(--ce-fn); }
.ce-ed .cm-s-dsa .cm-type,.ce-ed .cm-s-dsa .cm-builtin,.ce-ed .cm-s-dsa .cm-variable-3{ color:var(--ce-ty); }
.ce-ed .cm-s-dsa .cm-string,.ce-ed .cm-s-dsa .cm-string-2{ color:var(--ce-str); }
.ce-ed .cm-s-dsa .cm-number{ color:var(--ce-num); }
.ce-ed .cm-s-dsa .cm-comment{ color:var(--ce-cm); font-style:italic; }
.ce-ed .cm-s-dsa .cm-meta{ color:var(--ce-op); }
.ce-ed .cm-s-dsa .cm-operator{ color:var(--ce-op); }
.ce-ed .cm-s-dsa .cm-error{ color:var(--ce-bad); }
.ce-info{ padding:7px 14px; font-size:11.5px; color:var(--text-dim,#8b949e); border-top:1px solid var(--panel-border,#30363d); background:var(--panel,#161b22); }
.ce-bot{ border-top:1px solid var(--panel-border,#30363d); }
.ce-tabs{ display:flex; gap:4px; padding:8px 10px 0; }
.ce-tab{ font:600 12px/1 var(--font-mono,monospace); padding:9px 12px; border:1px solid transparent; border-bottom:0; border-radius:8px 8px 0 0; background:none; color:var(--text-dim,#8b949e); cursor:pointer; }
.ce-tab.on{ color:var(--text,#e6edf3); background:var(--bg,#0d1117); border-color:var(--panel-border,#30363d); }
.ce-pane{ background:var(--bg,#0d1117); border-top:1px solid var(--panel-border,#30363d); padding:14px 16px 16px; }
.ce-pills{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.ce-pill{ font:600 12px/1 var(--font-mono,monospace); padding:8px 12px; border-radius:8px; border:1px solid var(--panel-border,#30363d); background:var(--panel,#161b22); color:var(--text-dim,#8b949e); cursor:pointer; display:inline-flex; align-items:center; gap:7px; }
.ce-pill.on{ color:var(--text,#e6edf3); border-color:var(--accent,#58a6ff); }
.ce-pill i{ width:8px; height:8px; border-radius:50%; background:var(--panel-border,#30363d); display:inline-block; }
.ce-pill.ok i{ background:var(--ce-ok); } .ce-pill.bad i{ background:var(--ce-bad); }
.ce-lbl{ font-size:12px; color:var(--text-dim,#8b949e); margin:10px 0 5px; }
.ce-lbl:first-child{ margin-top:0; }
.ce-val{ margin:0; padding:9px 12px; background:var(--panel,#161b22); border:1px solid var(--panel-border,#30363d); border-radius:8px; font:12.5px/1.55 var(--font-mono,monospace); color:var(--text,#e6edf3); white-space:pre-wrap; word-break:break-word; max-height:220px; overflow:auto; }
.ce-val.bad{ border-color:var(--ce-bad); } .ce-val.ok{ border-color:var(--ce-ok); }
.ce-verdict{ font:700 16px/1.3 var(--font-mono,monospace); margin:0 0 4px; }
.ce-verdict.ok{ color:var(--ce-ok); } .ce-verdict.bad{ color:var(--ce-bad); } .ce-verdict.warn{ color:var(--ce-warn); }
.ce-sub{ font-size:12px; color:var(--text-dim,#8b949e); margin:0 0 12px; }
.ce-empty{ font-size:13px; color:var(--text-dim,#8b949e); margin:0; }
.ce-spin{ display:inline-block; width:12px; height:12px; border:2px solid var(--panel-border,#30363d); border-top-color:var(--accent,#58a6ff); border-radius:50%; animation:ce-r .8s linear infinite; vertical-align:-2px; margin-right:8px; }
@keyframes ce-r{ to{ transform:rotate(360deg); } }
/* Run button while code runs: full colour (not the faded disabled look) with a spinner in the button's text colour. */
.ce-btn.go.busy[disabled]{ opacity:1; cursor:progress; display:inline-flex; align-items:center; justify-content:center; }
.ce-btn.go .ce-spin{ flex:none; box-sizing:border-box; width:13px; height:13px; margin:0 8px 0 0; border-width:2px; border-color:rgba(4,18,31,.22); border-top-color:currentColor; border-right-color:currentColor; vertical-align:0; animation-duration:.7s; }
:root[data-theme="light"] .ce-btn.go .ce-spin{ border-color:rgba(255,255,255,.35); border-top-color:currentColor; }
@media (prefers-reduced-motion:reduce){ .ce-spin{ animation:none; } }
@media (max-width:640px){
  .ce-top{ gap:8px; } .ce-sp{ display:none; }
  /* iPhone Safari zooms the page into any focused text under 16px; on phones CodeMirror
     types straight into the code area, so the code itself is 16px here. */
  .ce-ed textarea.ce-ta, .ce-ed .CodeMirror, .ce-lang select{ font-size:16px; }
}
#dsa-solved-badge{ font-family:var(--font-mono,monospace); font-size:12.5px; font-weight:600; color:var(--accent,#3fb950); margin:-14px 0 10px; display:flex; align-items:center; flex-wrap:wrap; gap:2px; }
#dsa-solved-badge .dsa-solved-langs{ font-weight:500; color:var(--text-dim,#8b949e); }
.dsa-due-pill{
  font-weight:700; color:var(--ce-warn,#d29922); background:color-mix(in srgb, var(--ce-warn,#d29922) 14%, transparent);
  border:1px solid color-mix(in srgb, var(--ce-warn,#d29922) 35%, transparent); border-radius:999px; padding:2px 9px; margin-left:8px; font-size:11px;
}
.dsa-review-block{ margin:0 0 22px; display:flex; flex-direction:column; gap:8px; }
.dsa-review-prompt{ font:600 12.5px/1.4 var(--font-mono,monospace); color:var(--accent,#3fb950); margin:0; }
.dsa-review-row{ display:flex; align-items:center; flex-wrap:wrap; gap:9px; }
.dsa-review-label{ font:500 12px/1 var(--font-mono,monospace); color:var(--text-dim,#8b949e); }
.dsa-review-btns{ display:inline-flex; gap:6px; flex-wrap:wrap; }
.dsa-review-btn{
  font:600 11.5px/1 var(--font-mono,monospace); padding:7px 11px; border-radius:7px; border:1px solid var(--panel-border,#30363d);
  background:var(--panel,#161b22); color:var(--text-dim,#8b949e); cursor:pointer;
}
.dsa-review-btn:hover{ border-color:var(--accent,#58a6ff); color:var(--text,#e6edf3); }
.dsa-review-btn.on{ background:var(--accent,#58a6ff); border-color:var(--accent,#58a6ff); color:#04121f; }
:root[data-theme="light"] .dsa-review-btn.on{ color:#fff; }
.dsa-review-btn.suggested:not(.on){ border-color:var(--accent,#58a6ff); color:var(--accent,#58a6ff); }
.dsa-review-clear,.dsa-review-done{
  font:600 11.5px/1 var(--font-mono,monospace); padding:7px 11px; border-radius:7px; border:1px solid var(--panel-border,#30363d);
  background:none; color:var(--text-dim,#8b949e); cursor:pointer;
}
.dsa-review-clear:hover,.dsa-review-done:hover{ border-color:var(--ce-bad,#f85149); color:var(--ce-bad,#f85149); }
.dsa-review-status{ font:500 12px/1.4 var(--font-mono,monospace); margin:0; color:var(--text-dim,#8b949e); }
.dsa-review-status.today{ color:var(--ce-warn,#d29922); font-weight:700; }
.dsa-review-status.overdue{ color:var(--ce-bad,#f85149); font-weight:700; }
@media (max-width:640px){
  .dsa-review-row{ gap:7px; }
  .dsa-review-btn,.dsa-review-clear,.dsa-review-done{ padding:8px 10px; }
}
.ce-sections-placeholder{
  border:1px solid var(--panel-border,#30363d); border-radius:12px; background:var(--panel,#161b22);
  padding:22px 24px; margin:16px 0 28px; display:flex; flex-direction:column; gap:18px;
}
.ce-sp-head{ display:flex; align-items:flex-start; gap:14px; }
.ce-sp-lock{
  flex:0 0 auto; width:32px; height:32px; padding:7px; box-sizing:border-box; border-radius:8px;
  color:var(--accent,#58a6ff); background:color-mix(in srgb, var(--accent,#58a6ff) 14%, transparent);
}
.ce-sp-headtext{ min-width:0; }
.ce-sp-title{ font:700 16.5px/1.3 var(--font-display,inherit); color:var(--text,#e6edf3); margin:0 0 4px; }
.ce-sp-sub{ font:400 13.5px/1.5 var(--font-body,inherit); color:var(--text-muted,var(--text-dim,#8b949e)); margin:0; }
.ce-sp-list{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:10px 22px; }
.ce-sp-list li{
  display:flex; align-items:center; gap:8px; font:600 12px/1 var(--font-mono,monospace);
  color:var(--text-dim,#8b949e); letter-spacing:.01em;
}
.ce-sp-icon{ flex:0 0 auto; width:15px; height:15px; color:var(--accent,#58a6ff); }
.ce-sp-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px; align-self:flex-start;
  font:700 13px/1 var(--font-mono,monospace); padding:11px 20px; border-radius:8px; border:1px solid var(--accent,#58a6ff);
  background:var(--accent,#58a6ff); color:#04121f; cursor:pointer; transition:filter .15s ease, transform .15s ease;
}
.ce-sp-btn:hover{ filter:brightness(1.08); }
.ce-sp-btn:active{ transform:translateY(1px); }
:root[data-theme="light"] .ce-sp-btn{ color:#fff; }
.ce-sp-eye{ width:15px; height:15px; flex:0 0 auto; }
@media (prefers-reduced-motion:reduce){ .ce-sp-btn{ transition:none; } }
@media (max-width:640px){
  .ce-sections-placeholder{ padding:18px; }
  .ce-sp-list{ flex-direction:column; gap:10px; }
  .ce-sp-btn{ align-self:stretch; width:100%; }
}

/* Mock interview (?mode=interview inside study/interview/): statement left, editor right. */
.iv-mode .theme-toggle,.iv-mode .dsa-acct-btn,.iv-mode .ce-seg{ display:none !important; }
.iv-mode body{ overflow:hidden; }
.iv-mode .wrap{ max-width:none; margin:0; padding:0; display:grid; grid-template-columns:minmax(0,2fr) minmax(0,3fr); height:100vh; }
.iv-mode .iv-left{ overflow:auto; padding:22px 24px 40px; border-right:1px solid var(--panel-border); }
.iv-mode .iv-right{ padding:14px; }
.iv-mode .iv-right .ce{ margin:0; }
/* Desktop: the editor side (60%) is one full-height column: toolbar, code filling all spare height,
   then the Testcases/Result panel pinned at the bottom (capped, scrolls inside). */
@media (min-width:900px){
  .iv-mode .iv-right{ display:flex; min-height:0; }
  .iv-mode .iv-right .ce{ flex:1; min-height:0; display:flex; flex-direction:column; }
  .iv-mode .ce-top,.iv-mode .ce-info,.iv-mode .ce-tabs{ flex-shrink:0; }
  .iv-mode .ce-ed{ flex:1; min-height:160px; }
  .iv-mode .ce-ed .CodeMirror,.iv-mode .ce-ed textarea.ce-ta{ position:absolute; inset:0; height:auto; min-height:0; max-height:none; }
  .iv-mode .ce-ed .CodeMirror-scroll{ min-height:0; max-height:none; }
  .iv-mode .ce-bot{ flex:0 1 auto; max-height:42%; min-height:0; display:flex; flex-direction:column; }
  .iv-mode .ce-pane{ flex:1; min-height:0; overflow:auto; }
}
@media (max-width:899px){
  .iv-mode body{ overflow:auto; }
  .iv-mode .wrap{ display:block; height:auto; }
  .iv-mode .iv-left{ border-right:0; padding:18px 16px 4px; }
  .iv-mode .iv-right{ padding:0 12px 24px; }
}

/* Desktop workspace on the problem pages (dsa-editor.js buildWorkspace):
   >= 1200px  problem list 15% | page 35% | editor 50%;  900-1199px  page 40% | editor 60% + list drawer.
   Below 900px none of this applies and the page stays stacked. */
.dsa-ws-grid{ display:contents; }
.dsa-nav,.dsa-ws-editor,.dsa-nav-toggle,.dsa-ws-bar{ display:none; }
@media (min-width:900px){
  html.dsa-ws-on body{ overflow:hidden; }
  /* Top bar: 52px; the 34px account/theme buttons are re-centred in it. */
  html.dsa-ws-on .dsa-ws-bar{ display:flex; align-items:center; gap:12px; height:52px; padding:0 104px 0 14px;
    background:var(--panel); border-bottom:1px solid var(--panel-border); }
  html.dsa-ws-on .dsa-ws-bar .back{ margin:0; }
  html.dsa-ws-on .theme-toggle,html.dsa-ws-on .dsa-acct-btn{ top:9px; }
  html.dsa-ws-on .dsa-ws-grid{ position:relative; display:grid; grid-template-columns:minmax(0,var(--ws-solo,40%)) minmax(0,1fr); height:calc(100vh - 52px); }
  html.dsa-ws-on .wrap{ max-width:none; margin:0; padding:12px 28px 64px; overflow:auto; min-width:0; min-height:0;
    border-right:1px solid var(--panel-border); }
  html.dsa-ws-on .wrap img,html.dsa-ws-on .wrap svg.dg{ max-width:100%; height:auto; }
  html.dsa-ws-on .ce-code-h{ display:none; }
  html.dsa-ws-on .dsa-ws-editor{ display:flex; min-width:0; min-height:0; padding:12px 14px 14px; }
  html.dsa-ws-on .dsa-ws-editor .ce{ margin:0; flex:1; min-height:0; display:flex; flex-direction:column; }
  html.dsa-ws-on .ce-top,html.dsa-ws-on .ce-info,html.dsa-ws-on .ce-tabs{ flex-shrink:0; }
  html.dsa-ws-on .ce-ed{ flex:1; min-height:160px; }
  html.dsa-ws-on .ce-ed .CodeMirror,html.dsa-ws-on .ce-ed textarea.ce-ta{ position:absolute; inset:0; height:auto; min-height:0; max-height:none; }
  html.dsa-ws-on .ce-ed .CodeMirror-scroll{ min-height:0; max-height:none; }
  html.dsa-ws-on .ce-bot{ flex:0 1 auto; max-height:42%; min-height:0; display:flex; flex-direction:column; }
  html.dsa-ws-on .ce-pane{ flex:1; min-height:0; overflow:auto; }

  html.dsa-ws-on .dsa-nav-toggle{ display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; padding:0;
    margin:0; flex-shrink:0; border-radius:8px; border:1px solid var(--panel-border); background:var(--panel);
    color:var(--text); cursor:pointer; }
  html.dsa-ws-on .dsa-nav-toggle:hover{ border-color:var(--accent); color:var(--accent); }
  html.dsa-ws-on .dsa-nav-toggle:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
  .dsa-nav-toggle-icon{ width:17px; height:17px; }

  /* Medium screens: the list is a drawer over the page. */
  html.dsa-ws-on .dsa-nav{ display:flex; flex-direction:column; position:fixed; left:0; top:52px; bottom:0; width:300px; z-index:40;
    transform:translateX(-102%); transition:transform .22s cubic-bezier(.2,.7,.2,1); box-shadow:12px 0 40px rgba(0,0,0,.35);
    background:var(--panel); border-right:1px solid var(--panel-border); min-height:0; }
  html.dsa-ws-on.dsa-nav-open .dsa-nav{ transform:none; }
}
@media (min-width:1200px){
  html.dsa-ws-on .dsa-ws-grid{ grid-template-columns:minmax(0,var(--ws-nav,15%)) minmax(0,var(--ws-page,35%)) minmax(0,1fr); }
  html.dsa-ws-on .dsa-nav{ position:static; width:auto; transform:none; transition:none; box-shadow:none; z-index:auto; }
  html.dsa-ws-on.dsa-nav-closed .dsa-ws-grid{ grid-template-columns:minmax(0,var(--ws-solo,40%)) minmax(0,1fr); }
  html.dsa-ws-on.dsa-nav-closed .dsa-nav{ display:none; }
}
@media (prefers-reduced-motion: reduce){ html.dsa-ws-on .dsa-nav{ transition:none; } }

.dsa-nav-head{ flex-shrink:0; padding:10px 12px 10px; border-bottom:1px solid var(--panel-border); display:flex; flex-direction:column; gap:8px; }
.dsa-nav-sheet-select{
  width:100%; font:500 12.5px/1.2 var(--font-body,inherit); color:var(--text); background:var(--bg); border:1px solid var(--panel-border);
  border-radius:8px; padding:7px 28px 7px 10px; cursor:pointer; outline:none; appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238C94A3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 10px center;
}
.dsa-nav-sheet-select:focus{ border-color:var(--accent); }
.dsa-nav-sheet-select option{ background:var(--panel); color:var(--text); }
.dsa-nav-search{ width:100%; font:13px/1.2 var(--font-body,inherit); color:var(--text); background:var(--bg); border:1px solid var(--panel-border);
  border-radius:8px; padding:8px 10px; }
.dsa-nav-search::placeholder{ color:var(--text-dim); }
.dsa-nav-search:focus{ outline:none; border-color:var(--accent); }
.dsa-nav-list{ flex:1; min-height:0; overflow:auto; padding:4px 8px 28px; overscroll-behavior:contain; }
.dsa-nav-cat{ font:600 11px/1.3 var(--font-mono,monospace); color:var(--text-dim); margin:16px 6px 6px; }
.dsa-nav-item{ display:flex; align-items:center; gap:8px; padding:6px 8px; border-radius:6px; font-size:13px; line-height:1.35;
  color:var(--text-muted); text-decoration:none; }
.dsa-nav-item:hover{ background:color-mix(in srgb, var(--text) 6%, transparent); color:var(--text); }
.dsa-nav-item:focus-visible{ outline:2px solid var(--accent); outline-offset:-2px; }
.dsa-nav-item.cur{ background:color-mix(in srgb, var(--accent) 13%, transparent); color:var(--text); font-weight:600; }
.dsa-nav-mark{ position:relative; width:14px; height:14px; flex-shrink:0; border-radius:50%; border:1.5px solid color-mix(in srgb, var(--text-dim) 60%, transparent); }
.dsa-nav-item.solved .dsa-nav-mark{ background:var(--accent); border-color:var(--accent); }
.dsa-nav-item.solved .dsa-nav-mark::after{ content:""; position:absolute; left:3.5px; top:1px; width:3.5px; height:7px;
  border:solid var(--bg); border-width:0 1.8px 1.8px 0; transform:rotate(45deg); }
.dsa-nav-title{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dsa-nav-diff{ flex-shrink:0; font:600 10px/1 var(--font-mono,monospace); }
.dsa-nav-diff.easy{ color:var(--easy); } .dsa-nav-diff.medium{ color:var(--medium); } .dsa-nav-diff.hard{ color:var(--hard); }
.dsa-nav-empty{ color:var(--text-dim); font-size:13px; padding:12px 8px; }
/* Thin, theme-coloured scrollbars for the workspace columns (the default ones are bright white on dark). */
.dsa-nav-list,html.dsa-ws-on .wrap,html.dsa-ws-on .ce-pane{ scrollbar-width:thin; scrollbar-color:color-mix(in srgb, var(--text-dim) 45%, transparent) transparent; }

/* Draggable column dividers (dsa-editor.js makeSplit): a 9px grab area centred on the column border,
   showing an accent line on hover, focus and while dragging. */
.dsa-split{ display:none; }
@media (min-width:900px){
  html.dsa-ws-on .dsa-split{ display:block; position:absolute; top:0; bottom:0; width:9px; margin-left:-5px; z-index:5; cursor:col-resize; touch-action:none; }
  html.dsa-ws-on .dsa-split[hidden]{ display:none; }
  html.dsa-ws-on .dsa-split::after{ content:""; position:absolute; top:0; bottom:0; left:4px; width:1px; background:transparent; transition:background .15s, box-shadow .15s; }
  html.dsa-ws-on .dsa-split:hover::after,html.dsa-ws-on .dsa-split:focus-visible::after,html.dsa-ws-on .dsa-split.on::after{
    background:var(--accent); box-shadow:0 0 0 1px color-mix(in srgb, var(--accent) 35%, transparent); }
  html.dsa-ws-on .dsa-split:focus-visible{ outline:none; }
  html.dsa-resizing, html.dsa-resizing *{ cursor:col-resize !important; user-select:none !important; }
}

/* Hide / Show button at the right of the Testcases | Result tabs (desktop only: on phones the
   panel is always shown); collapsed = only the tab row. */
.ce-tab-hide{ display:none; }
@media (min-width:900px){
  .ce-tab-hide{ margin-left:auto; align-self:center; display:inline-flex; align-items:center; gap:5px; font:600 12px/1 var(--font-mono,monospace);
    padding:6px 9px; margin-bottom:4px; border:1px solid transparent; border-radius:7px; background:none; color:var(--text-dim,#8b949e); cursor:pointer; }
  .ce-tab-hide:hover{ color:var(--text,#e6edf3); border-color:var(--panel-border,#30363d); }
  .ce-tab-hide:focus-visible{ outline:2px solid var(--accent,#58a6ff); outline-offset:1px; }
  .ce-hide-icon{ width:14px; height:14px; }
  .ce-bot.collapsed .ce-pane{ display:none; }
  .ce-bot.collapsed .ce-tabs{ padding-bottom:6px; }
  .ce-bot.collapsed .ce-tab.on{ background:none; border-color:transparent; color:var(--text-dim,#8b949e); }
  .ce-bot.collapsed .ce-tab-hide{ margin-bottom:0; }
}

/* Problem timer (dsa-editor.js buildTimer), shown in the page toolbar at the top right. */
.ce-timer{ display:inline-flex; align-items:center; gap:2px; }
.ce-timer-btn{ display:inline-flex; align-items:center; gap:6px; font:600 13px/1 var(--font-mono,monospace); padding:8px 10px; border-radius:8px;
  border:1px solid var(--panel-border,#30363d); background:var(--panel,#161b22); color:var(--text-dim,#8b949e); cursor:pointer; font-variant-numeric:tabular-nums; }
.ce-timer-btn:hover{ color:var(--text,#e6edf3); }
.ce-timer-btn.on{ color:var(--text,#e6edf3); border-color:color-mix(in srgb, var(--accent,#58a6ff) 55%, var(--panel-border,#30363d)); }
.ce-timer-btn.on .ce-timer-icon{ color:var(--accent,#58a6ff); }
.ce-timer-reset{ display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; padding:0; border:0; border-radius:7px;
  background:none; color:var(--text-dim,#8b949e); cursor:pointer; }
.ce-timer-reset:hover{ color:var(--text,#e6edf3); background:color-mix(in srgb, var(--text,#e6edf3) 8%, transparent); }
.ce-timer-reset[hidden]{ display:none; }
.ce-timer-icon{ width:14px; height:14px; }
.ce-timer-btn:focus-visible,.ce-timer-reset:focus-visible{ outline:2px solid var(--accent,#58a6ff); outline-offset:1px; }
/* In the page toolbar: one 34px pill left of the reading (right:100px), account (58px) and theme (16px) buttons. */
.ce-timer-bar{ position:absolute; top:16px; right:100px; z-index:20; height:34px; gap:0; padding:0 2px;
  border:1px solid var(--panel-border,#30363d); border-radius:8px; background:var(--panel,#161b22); }
body:has(.dsa-acct-btn) .ce-timer-bar{ right:142px; }
.ce-timer-bar .ce-timer-btn{ height:32px; padding:0 8px; border:0; background:none; }
.ce-timer-bar:has(.ce-timer-btn.on){ border-color:color-mix(in srgb, var(--accent,#58a6ff) 55%, var(--panel-border,#30363d)); }
html.dsa-ws-on .ce-timer-bar{ top:9px; }
html.dsa-ws-on body:has(.ce-timer-bar) .dsa-ws-bar{ padding-right:272px; }   /* room for timer + 3 buttons */
.iv-mode .ce-timer-bar{ display:none !important; }
