:root{color-scheme:dark;--bg:#0c1018;--sidebar:#0f1520;--panel:#141c29;--line:#253144;--text:#eef3fb;--muted:#98a7bd;--accent:#85dcbd;--accent-ink:#10221e;--soft:#1c2b37}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.dashboard-menu{--ck-menu-background:var(--sidebar);--ck-menu-rule:var(--line);--ck-menu-muted:var(--muted);--ck-menu-accent:var(--accent);--ck-menu-gutter:clamp(20px,5vw,42px)}main{max-width:1240px;margin:0 auto;padding:52px 42px}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:34px}.eyebrow{color:var(--accent);font-size:11px;font-weight:800;letter-spacing:.18em;margin-bottom:10px}h1{font-size:36px;letter-spacing:-.045em;line-height:1.2;margin:0 0 10px}h2,h3,p{margin-top:0}.lede{color:var(--muted);font-size:15px;margin-bottom:0}.button{display:inline-flex;align-items:center;justify-content:center;min-height:39px;padding:9px 17px;border-radius:8px;font-weight:700;font-size:13px;white-space:nowrap;cursor:pointer;border:1px solid transparent}.button.primary{background:var(--accent);color:var(--accent-ink)}.button.primary:hover{background:#a3e9cf}.button.secondary{border-color:#344359;color:#d3dce9;background:#1b2635}.button.secondary:hover{background:#26354a}.list-panel,.form-card{background:var(--panel);border:1px solid var(--line);border-radius:13px;overflow:hidden;box-shadow:0 12px 35px #00000015}.panel-heading{min-height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 25px;border-bottom:1px solid var(--line)}.panel-heading h2{font-size:15px;letter-spacing:-.01em;margin:0}.count{font-size:11px;border-radius:20px;background:#273547;color:#cbd8e7;padding:3px 8px;margin-left:7px}.panel-note{font-size:11px;color:#7f8fa5}.harness-row{display:flex;align-items:flex-start;gap:17px;padding:23px 25px;border-bottom:1px solid var(--line)}.harness-row:last-child{border-bottom:0}.harness-icon{display:grid;place-items:center;width:39px;height:39px;flex:none;background:#233b40;border-radius:10px;color:var(--accent);font-size:25px;line-height:1}.harness-main{min-width:0;flex:1}.harness-main h3{font-size:15px;margin:0 0 3px}.harness-main p{color:var(--muted);font-size:13px;margin-bottom:11px;overflow-wrap:anywhere}.row-meta{display:flex;flex-wrap:wrap;gap:9px;color:#7f90a7;font-size:11px}.meta-separator{color:#46546a}.row-side{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:12px}.badge{color:#c2dbd0;background:#223c37;border:1px solid #33564b;border-radius:100px;padding:3px 9px;font-size:10px;font-weight:700}.row-side code{color:#71829a;font-size:10px;max-width:150px;overflow:hidden;text-overflow:ellipsis}.empty{text-align:center;padding:70px 20px 77px}.empty-icon{width:55px;height:55px;border-radius:14px;background:#203b3d;color:var(--accent);font-size:35px;line-height:52px;margin:0 auto 17px}.empty h3{font-size:18px;margin-bottom:5px}.empty p{color:var(--muted);font-size:13px;margin-bottom:23px}.form-card{max-width:690px;padding:31px 34px}.field{margin-bottom:27px}.field label{display:block;font-size:13px;font-weight:700;margin-bottom:3px}.field p{font-size:12px;color:var(--muted);margin-bottom:10px}.required{color:var(--accent)}.optional{color:#8190a5;font-size:11px;font-weight:400;margin-left:5px}input,textarea{display:block;width:100%;background:#0e1621;border:1px solid #344259;border-radius:8px;color:var(--text);padding:10px 12px;outline:none}input:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px #85dcbd22}input::placeholder,textarea::placeholder{color:#65768c}textarea{resize:vertical}.form-actions{border-top:1px solid var(--line);padding-top:24px;display:flex;justify-content:flex-end;gap:10px}.form-error{background:#46292d;border:1px solid #ae565d;color:#ffced1;border-radius:8px;padding:10px 12px;margin-bottom:22px;font-size:13px}@media(max-width:720px){main{padding:32px 20px}.page-heading{align-items:flex-start;flex-direction:column}h1{font-size:30px}.harness-row{flex-wrap:wrap}.row-side{flex-direction:row;align-items:center;margin-left:55px;text-align:left}.form-card{padding:24px 20px}}

.back-link{display:inline-block;margin-bottom:28px;color:var(--muted);font-size:13px}.back-link:hover,.harness-main h3 a:hover{color:var(--accent)}.back-link:focus-visible,.harness-main h3 a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.detail-panel{max-width:800px}.detail-list{margin:0}.detail-list>div{display:grid;grid-template-columns:160px minmax(0,1fr);gap:20px;padding:19px 25px;border-bottom:1px solid var(--line)}.detail-list>div:last-child{border-bottom:0}.detail-list dt{color:var(--muted);font-size:12px}.detail-list dd{margin:0;overflow-wrap:anywhere}.detail-list code{font-size:12px}@media(max-width:560px){.detail-list>div{grid-template-columns:1fr;gap:3px;padding:17px 20px}}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f3f1eb;
  --sidebar: #fbf8f1;
  --panel: #fffdf8;
  --line: #d6d8d0;
  --text: #243949;
  --muted: #5d6d75;
  --accent: #6552ad;
  --accent-ink: #fffdf8;
  --soft: #e8e2f2;
}

:root[data-theme="light"] .button.primary:hover { background: #554398; }
:root[data-theme="light"] .button.secondary { border-color: #c5cbc8; color: var(--text); background: #f6f5ef; }
:root[data-theme="light"] .button.secondary:hover { background: #ebe9e1; }
:root[data-theme="light"] .count { color: #3d5060; background: #e9e8e1; }
:root[data-theme="light"] .panel-note,
:root[data-theme="light"] .row-meta,
:root[data-theme="light"] .row-side code { color: #63737b; }
:root[data-theme="light"] .meta-separator { color: #8b989b; }
:root[data-theme="light"] .harness-icon,
:root[data-theme="light"] .empty-icon { color: var(--accent); background: #e8e2f2; }
:root[data-theme="light"] .badge { color: #31534b; background: #e4f1e9; border-color: #a8cbb9; }
:root[data-theme="light"] .optional { color: #63737b; }
:root[data-theme="light"] input,
:root[data-theme="light"] textarea { color: var(--text); background: #fffdf8; border-color: #b7c1c0; }
:root[data-theme="light"] input::placeholder,
:root[data-theme="light"] textarea::placeholder { color: #697980; }
:root[data-theme="light"] input:focus,
:root[data-theme="light"] textarea:focus { box-shadow: 0 0 0 3px #6552ad22; }
:root[data-theme="light"] .form-error { color: #742f38; background: #fae7e8; border-color: #cb858a; }

.ck-top-menu__link.dashboard-brand { display: inline-flex; align-items: center; color: var(--text); flex-shrink: 0; }
.ck-top-menu__link.dashboard-brand:hover { color: var(--accent); }
.dashboard-wordmark { display: block; width: 112px; height: auto; }

.dashboard-shortcuts {
  --ck-modal-background: var(--panel);
  --ck-modal-text: var(--text);
  --ck-modal-muted: var(--muted);
  --ck-modal-border: var(--line);
  --ck-modal-rule: var(--line);
  --ck-modal-accent: var(--accent);
  --ck-modal-primary-text: var(--accent-ink);
  --ck-modal-shadow: #080d14;
}
:root[data-theme="light"] .dashboard-shortcuts {
  --ck-modal-border: var(--text);
  --ck-modal-shadow: #aeb8b4;
}
.shortcut-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 22px;
  padding: 18px 0 0;
  border-top: 1px solid var(--line);
  color: var(--text);
}
.shortcut-row kbd {
  display: inline-grid;
  place-items: center;
  min-width: 30px;
  min-height: 30px;
  padding: 3px 8px;
  border: 1px solid var(--line);
  border-radius: 0;
  color: var(--text);
  background: var(--soft);
  font: 500 12px/1 "IBM Plex Sans", "Helvetica Neue", sans-serif;
}
.harness-heading-actions{display:flex;flex-wrap:wrap;gap:10px}
.system-prompt-code{margin:14px 0 12px}
:root[data-theme="light"] .system-prompt-code{
  --ck-code-background:#fbf8f1;
  --ck-code-text:#243949;
  --ck-code-muted:#5d6d75;
  --ck-code-border:#c5cbc8;
  --ck-code-accent:#6552ad;
  --ck-code-comment:#64747c;
  --ck-code-keyword:#694ab0;
  --ck-code-string:#276547;
  --ck-code-number:#885119;
  --ck-code-function:#255a80;
  --ck-code-punctuation:#425966;
  --ck-code-tag:#965144;
  --ck-code-subtle:#ecebe5;
}
.harness-row-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:16px;font-size:13px;font-weight:700}.harness-row-actions>a:first-child{color:var(--accent);text-decoration:underline;text-underline-offset:3px}.harness-row-actions .button{min-height:32px;padding:6px 11px}
.session-harness-link{color:var(--accent);text-decoration:underline;text-underline-offset:3px}.session-harness-link:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.session-revision{margin-top:7px}.session-revision code,.harness-main h3 code{overflow-wrap:anywhere}
#promotion-status{margin:0 0 16px;color:var(--text)}.promotion-note{color:var(--muted);font-size:13px}.prompt-promotion-action{margin-top:14px}
#model-editor{margin-top:24px;scroll-margin-top:24px}#model-form label{display:block;margin-bottom:16px}

.model-selector{border:1px solid var(--line);border-radius:8px;padding:12px 16px;margin:0 0 12px}.model-selector legend{font-size:13px;font-weight:700}.model-selector label{display:flex;align-items:center;gap:10px;padding:8px 0;cursor:pointer}.model-selector input{width:18px;height:18px;margin:0;flex:none;accent-color:var(--accent)}.model-selector-note{color:var(--muted);font-size:13px}.model-selector-note a{text-decoration:underline}

/* Harness authoring uses the same field treatment for explicit defaults. */
.field select{display:block;width:100%;background:#0e1621;border:1px solid #344259;border-radius:8px;color:var(--text);padding:10px 12px;outline:none}.field select:focus{border-color:var(--accent);box-shadow:0 0 0 3px #85dcbd22}:root[data-theme="light"] .field select{background:#fffdf8;border-color:#b7c1c0}.model-selector span{overflow-wrap:anywhere}.harness-main code{overflow-wrap:anywhere}

.form-error a{display:inline-block;text-decoration:underline}
.session-id,.session-summary-body code{overflow-wrap:anywhere}
.session-summary{margin-bottom:24px}.session-summary-body{padding:20px 25px}.session-summary-body .lede{font-size:13px}
.transcript-turn{padding:24px 25px;border-bottom:1px solid var(--line)}.transcript-turn:last-child{border-bottom:0}
.transcript-turn-heading,.transcript-message-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.transcript-turn-heading h3,.transcript-message-heading h3{margin:0;font-size:14px}.transcript-message-heading h3{text-transform:capitalize;color:var(--accent)}
.transcript-message{margin-top:18px;padding:18px;border:1px solid var(--line);border-radius:8px}.transcript-message-user{background:var(--soft)}
.transcript-content,.transcript-details pre{white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;font:13px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace;margin:14px 0 0}
.transcript-status{color:var(--muted);font-size:13px;margin:12px 0 0}.transcript-details{margin-top:14px}.transcript-details summary{cursor:pointer;color:var(--muted);font-size:12px}.transcript-details summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.transcript-details h4{font-size:12px;margin:14px 0 0}.transcript-tool{padding:15px;border:1px solid var(--line);border-radius:8px}
@media(max-width:640px){.transcript-turn{padding:18px 14px}.transcript-message{padding:14px}.session-id{font-size:12px}.session-summary-body{padding:18px 14px}}

/* MagicMtn's small-link top menu. Host pages may override the --ck-menu-* tokens. */
@font-face {
  font-family: "IBM Plex Sans";
  src: url("./fonts/ibm-plex-sans-regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("./fonts/ibm-plex-sans-medium.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

.ck-top-menu {
  box-sizing: border-box;
  height: 56px;
  padding-inline: var(--ck-menu-gutter, 5.5vw);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  background: var(--ck-menu-background, #fbf8f1);
  border-bottom: 1px solid var(--ck-menu-rule, #dedfd6);
  font-family: "IBM Plex Sans", "Helvetica Neue", sans-serif;
}

.ck-top-menu__group {
  display: flex;
  align-items: center;
  gap: 26px;
}

.ck-top-menu__link {
  padding: 6px 0;
  color: var(--ck-menu-muted, #627076);
  font-size: 10px;
  line-height: 1.5;
  font-weight: 400;
  letter-spacing: .06em;
  text-transform: lowercase;
  text-decoration: none;
  white-space: nowrap;
}

.ck-top-menu__link:hover {
  color: var(--ck-menu-accent, #6552ad);
}

.ck-top-menu__link:focus-visible {
  outline: 2px solid var(--ck-menu-accent, #6552ad);
  outline-offset: 5px;
}

@media (max-width: 760px) {
  .ck-top-menu { height: 52px; }
  .ck-top-menu__group { gap: 14px; }
  .ck-top-menu__link { font-size: 9px; letter-spacing: .07em; }
}

@media (max-width: 520px) {
  .ck-top-menu {
    overflow-x: auto;
    justify-content: flex-start;
    scrollbar-width: thin;
  }
  .ck-top-menu__group { flex: none; }
}

/* Native dialog modal. Host pages may override the --ck-modal-* tokens. */
.ck-modal {
  box-sizing: border-box;
  width: min(calc(100% - 32px), 520px);
  max-height: min(80vh, 720px);
  margin: auto;
  padding: 0;
  overflow: auto;
  border: 1px solid var(--ck-modal-border, #243949);
  border-radius: 0;
  color: var(--ck-modal-text, #243949);
  background: var(--ck-modal-background, #fbf8f1);
  box-shadow: 12px 12px 0 var(--ck-modal-shadow, #243949);
  font-family: "IBM Plex Sans", "Helvetica Neue", sans-serif;
}

.ck-modal::backdrop {
  background: var(--ck-modal-backdrop, rgb(15 21 32 / 72%));
}

.ck-modal__header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 24px;
  padding: 28px 32px 20px;
  border-bottom: 1px solid var(--ck-modal-rule, #dedfd6);
}

.ck-modal__eyebrow {
  margin: 0 0 8px;
  color: var(--ck-modal-accent, #6552ad);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.ck-modal__title {
  margin: 0;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -.035em;
}

.ck-modal__body {
  padding: 24px 32px;
  color: var(--ck-modal-muted, #627076);
  font-size: 14px;
  line-height: 1.6;
}

.ck-modal__body p { margin: 0; }
.ck-modal__body p + p { margin-top: 12px; }

.ck-modal__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  padding: 20px 32px 28px;
}

.ck-modal__button,
.ck-modal__close {
  box-sizing: border-box;
  border: 1px solid var(--ck-modal-border, #243949);
  border-radius: 0;
  color: var(--ck-modal-text, #243949);
  background: transparent;
  font: inherit;
  cursor: pointer;
}

.ck-modal__button {
  min-height: 40px;
  padding: 8px 16px;
  font-size: 12px;
  font-weight: 500;
}

.ck-modal__button--primary {
  color: var(--ck-modal-primary-text, #fbf8f1);
  background: var(--ck-modal-border, #243949);
}

.ck-modal__close {
  flex: none;
  width: 32px;
  height: 32px;
  font-size: 21px;
  line-height: 1;
}

.ck-modal__button:hover,
.ck-modal__close:hover { border-color: var(--ck-modal-accent, #6552ad); }
.ck-modal__button:focus-visible,
.ck-modal__close:focus-visible {
  outline: 2px solid var(--ck-modal-accent, #6552ad);
  outline-offset: 3px;
}

@media (max-width: 600px) {
  .ck-modal__header { padding: 24px 20px 18px; }
  .ck-modal__body { padding: 20px; }
  .ck-modal__actions { padding: 16px 20px 24px; }
}

/* Read-only code viewer. Hosts can override the --ck-code-* tokens. */
.ck-code {
  --ck-code-background: #101824;
  --ck-code-text: #dce7ed;
  --ck-code-muted: #a9bac6;
  --ck-code-border: #314153;
  --ck-code-accent: #87d9c0;
  --ck-code-comment: #aab9c5;
  --ck-code-keyword: #c5a5f0;
  --ck-code-string: #a9e0b2;
  --ck-code-number: #f5c37b;
  --ck-code-function: #89c8f2;
  --ck-code-punctuation: #c4d4dd;
  --ck-code-tag: #f2ad98;
  --ck-code-subtle: #1b2a3b;
  box-sizing: border-box;
  min-width: 0;
  margin: 0;
  border: 1px solid var(--ck-code-border);
  border-radius: 0;
  color: var(--ck-code-text);
  background: var(--ck-code-background);
}

.ck-code__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 42px;
  padding: 7px 16px;
  border-bottom: 1px solid var(--ck-code-border);
  color: var(--ck-code-muted);
  font: 500 12px/1.4 "IBM Plex Sans", "Helvetica Neue", sans-serif;
}

.ck-code__label { overflow-wrap: anywhere; }
.ck-code__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }

.ck-code__copy,
.ck-code__view {
  flex: none;
  padding: 4px 8px;
  border: 1px solid var(--ck-code-border);
  border-radius: 0;
  color: var(--ck-code-text);
  background: transparent;
  font: inherit;
  cursor: pointer;
}

.ck-code__copy:hover,
.ck-code__view:hover,
.ck-code__view[aria-pressed="true"] { color: var(--ck-code-accent); }
.ck-code__copy:focus-visible,
.ck-code__view:focus-visible {
  outline: 2px solid var(--ck-code-accent);
  outline-offset: 2px;
}

.ck-code pre[class*="language-"] {
  box-sizing: border-box;
  max-width: 100%;
  margin: 0;
  padding: 16px;
  overflow: auto;
  border: 0;
  border-radius: 0;
  color: var(--ck-code-text);
  background: transparent;
  font: 13px/1.6 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  tab-size: 2;
}

.ck-code pre[class*="language-"]:focus-visible {
  outline: 2px solid var(--ck-code-accent);
  outline-offset: -2px;
}

.ck-code pre[hidden],
.ck-code .ck-code__preview[hidden] { display: none; }

.ck-code__preview {
  padding: 20px 24px;
  overflow-wrap: anywhere;
  font: 14px/1.65 "IBM Plex Sans", "Helvetica Neue", sans-serif;
}
.ck-code__preview > :first-child { margin-top: 0; }
.ck-code__preview > :last-child { margin-bottom: 0; }
.ck-code__preview h1,
.ck-code__preview h2,
.ck-code__preview h3 { margin: 1.4em 0 .55em; line-height: 1.25; }
.ck-code__preview h1 { font-size: 1.65em; }
.ck-code__preview h2 { font-size: 1.35em; }
.ck-code__preview h3 { font-size: 1.15em; }
.ck-code__preview p,
.ck-code__preview ul,
.ck-code__preview ol,
.ck-code__preview blockquote,
.ck-code__preview pre { margin: 0 0 1em; }
.ck-code__preview p { color: inherit; font-size: inherit; }
.ck-code__preview ul,
.ck-code__preview ol { padding-left: 1.5em; }
.ck-code__preview li + li { margin-top: .2em; }
.ck-code__preview blockquote { margin-left: 0; padding-left: 1em; border-left: 3px solid var(--ck-code-border); color: var(--ck-code-muted); }
.ck-code__preview a { color: var(--ck-code-accent); text-decoration: underline; }
.ck-code__preview pre {
  max-width: 100%;
  padding: 14px;
  overflow: auto;
  border: 1px solid var(--ck-code-border);
  background: var(--ck-code-subtle);
}
.ck-code__preview code { padding: 1px 4px; background: var(--ck-code-subtle); font: 12px/1.6 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.ck-code__preview pre code { padding: 0; background: transparent; }
.ck-code__preview table { display: block; max-width: 100%; margin-bottom: 1em; overflow-x: auto; border-collapse: collapse; }
.ck-code__preview th,
.ck-code__preview td { padding: 6px 10px; border: 1px solid var(--ck-code-border); text-align: left; }

.ck-code code[class*="language-"] {
  padding: 0;
  color: inherit;
  background: none;
  font: inherit;
  text-shadow: none;
}

.ck-code .token.comment,
.ck-code .token.prolog { color: var(--ck-code-comment); }
.ck-code .token.keyword,
.ck-code .token.atrule,
.ck-code .token.important { color: var(--ck-code-keyword); }
.ck-code .token.string,
.ck-code .token.char,
.ck-code .token.url,
.ck-code .token.attr-value { color: var(--ck-code-string); }
.ck-code .token.number,
.ck-code .token.boolean,
.ck-code .token.constant { color: var(--ck-code-number); }
.ck-code .token.function,
.ck-code .token.class-name,
.ck-code .token.title { color: var(--ck-code-function); }
.ck-code .token.operator,
.ck-code .token.punctuation { color: var(--ck-code-punctuation); }
.ck-code .token.tag,
.ck-code .token.selector,
.ck-code .token.property,
.ck-code .token.bold { color: var(--ck-code-tag); }
.ck-code .token.italic { font-style: italic; }