/* ═══ editors-skin.css — the notebook's neon set over the three editors.
   Loaded AFTER each editor's own stylesheet; the editors are already
   CSS-variable driven, so this is mostly a token swap. Each editor keeps
   its own identity color, matching its card on the TBAi home page:
   pseudocode = cyan, python = gold, html = lime. Run stays green, danger
   is the site pink, greys warm up to the notebook ground. ═══ */

body.nb-ps, body.nb-py, body.nb-html {
  --danger: #ff238d;
}

body.nb-ps {
  --accent: #00e7f0;
  --accent-rgb: 0,231,240;
  --accent-hover: #8ef8fd;
  --accent-glow: rgba(0, 231, 240, .25);
  --editor-caret: #00e7f0;
}

body.nb-py {
  --accent: #ffe600;
  --accent-rgb: 255,230,0;
  --accent-hover: #fff59a;
  --accent-glow: rgba(255, 230, 0, .22);
  --editor-caret: #ffe600;
}

body.nb-html {
  --accent: #54f22d;
  --accent-rgb: 84,242,45;
  --accent-hover: #a4fb8b;
  --accent-glow: rgba(84, 242, 45, .22);
  --editor-caret: #54f22d;
}

/* panel labels carry the editor's color, like section titles do on the
   notebook; the neutral grey stays for body text only */
body.nb-ps .panel-header, body.nb-py .panel-header, body.nb-html .panel-header {
  color: var(--accent);
}

/* selection matches the accent instead of browser blue */
body.nb-ps ::selection, body.nb-py ::selection, body.nb-html ::selection {
  background: var(--accent-glow);
}

/* ═══════════════════════════════════════════════════════════════════
   THE ARIA WORDMARK IN AN EDITOR HEADER
   Added 3 Sep 2026 with the new course logos. The editors used to show
   the single-letter mark next to the words "aria:", which said the name
   twice; the wordmark says it once, properly, and the tool name sits
   beside it.

   NO COURSE SUFFIX HERE, deliberately. The editors are shared -- CS's
   Course Tools links the pseudocode editor and AP's links the console --
   so stamping one course on a tool both courses open would be wrong more
   often than it was right. Adding one is a mask swap if that changes.

   Same mask treatment as the notebooks: shape from the PNG, colour from
   the palette, so an editor follows a theme for free.

   ONE MARK EVERYWHERE, 4 Sep 2026. This pointed at aria-word.png while
   both notebooks had moved to aria-plain.png, so "update all of the
   logos" quietly missed the editors -- they were the surface still
   showing the old artwork. Same file as the notebooks now, so a new
   upload reaches all three at once.
   ═══════════════════════════════════════════════════════════════════ */
.aria-lockup{
  display:block;
  height:26px;
  aspect-ratio:1047 / 352;
  background:linear-gradient(95deg, #DF337F 0%, #C634A5 100%);
  -webkit-mask:url('/logos/aria-plain.png') left center / contain no-repeat;
          mask:url('/logos/aria-plain.png') left center / contain no-repeat;
  flex-shrink:0;
}
@supports not ((-webkit-mask: url('#')) or (mask: url('#'))) {
  .aria-lockup{background:url('/logos/aria-plain.png') left center / contain no-repeat;}
}