:root {
  color-scheme: light;
  --background: #fff;
  --surface: #f8fafc;
  --ink: #101c2b;
  --muted: #53647e;
  --border: #dbe2e9;
  --teal: #084d58;
  --key: #0348c4;
  --literal: #bb1628;
  --addition: #e5f6ec;
  --green: #078044;
  --radius: 6px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
  color: var(--ink);
  background: var(--background);
}
* { box-sizing: border-box; }
body { margin: 0; }
main { margin: 0 auto; padding: 10px 20px 18px; max-width: 1800px; }
button, select { font-family: inherit; font-size: 14px; line-height: 1.4; }
button { cursor: pointer; }
button:disabled { cursor: default; opacity: .56; }
button, select, summary, a, .code-scroll { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid #197caf; outline-offset: 3px; }
.topbar { display: flex; align-items: center; gap: 27px; min-height: 42px; margin-bottom: 16px; }
h1 { margin: 0 30px 0 0; font-size: 22px; font-weight: 650; color: var(--teal); letter-spacing: -.45px; white-space: nowrap; }
.example-control { display: flex; align-items: center; gap: 14px; }
.example-control label { font-size: 14px; }
select { padding: 9px 35px 9px 12px; min-height: 40px; border: 1px solid var(--border); border-radius: var(--radius); background: #fff; color: var(--ink); min-width: 245px; }
.local-notice { font-size: 14px; color: var(--muted); white-space: nowrap; }
.local-notice span { padding: 0 5px; }
.editors { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
.editor { min-width: 0; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.editor-header { min-height: 72px; display: flex; justify-content: space-between; align-items: center; padding: 12px 18px; gap: 12px; border-bottom: 1px solid var(--border); background: var(--surface); }
h2 { font-size: 18px; line-height: 1.4; font-weight: 650; margin: 0 0 2px; }
.editor-header p { margin: 0; font-size: 13px; line-height: 1.5; color: var(--muted); }
.editor-tools { display: flex; align-items: center; gap: 8px; color: var(--muted); }
.editor-tools > span { font-size: 13px; padding-right: 12px; white-space: nowrap; }
.icon-button { display: inline-flex; justify-content: center; align-items: center; width: 32px; height: 32px; padding: 7px; border: 0; border-radius: 4px; background: transparent; color: #324760; }
.icon-button:hover { background: #eaf0f4; }
svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.code-scroll { height: clamp(370px, 45vw, 458px); overflow: auto; overscroll-behavior: contain; background: linear-gradient(to right, #f8fafc 0, #f8fafc 65px, #fff 65px); scrollbar-width: thin; scrollbar-color: #c7d3dc transparent; }
pre { margin: 0; padding: 9px 0 16px; width: max-content; min-width: 100%; font: 15.5px/25px "SFMono-Regular", Consolas, "Liberation Mono", monospace; tab-size: 2; }
.code-line { display: flex; min-height: 25px; padding-right: 18px; }
.line-number { flex: 0 0 55px; color: #7a879a; text-align: right; padding-right: 14px; user-select: none; font-size: 13px; }
.change-marker { flex: 0 0 23px; color: var(--green); font-weight: 700; text-align: center; user-select: none; }
.line-text { padding-left: 0; }
.code-line.added { background: var(--addition); }
.yaml-key { color: var(--key); }
.yaml-literal { color: var(--literal); }
.section { margin-top: 16px; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
summary { list-style: none; display: flex; justify-content: space-between; align-items: center; min-height: 46px; padding: 11px 17px; font-size: 16px; font-weight: 600; cursor: pointer; }
summary::-webkit-details-marker { display: none; }
summary svg { width: 18px; height: 18px; color: #31445b; transition: transform 130ms ease; }
details:not([open]) summary svg { transform: rotate(180deg); }
details[open] summary { border-bottom: 1px solid var(--border); }
.diagnosis-content { padding: 10px 18px 15px; }
.finding { display: flex; gap: 16px; padding: 3px 0; }
.finding + .finding { margin-top: 10px; }
.finding-icon { margin-top: 2px; width: 21px; height: 21px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 13px; font-weight: 700; color: #fff; background: #547b93; }
.finding-icon.notice { background: #e59a20; }
.finding-icon.preserved { background: #327860; }
.finding h3 { margin: 1px 0 5px; font-size: 14px; line-height: 1.4; font-weight: 600; }
.finding p { margin: 0; font-size: 13px; line-height: 1.6; color: var(--muted); max-width: 1200px; }
.actions { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 12px 2px 18px; }
.actions p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--muted); }
.action-buttons { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; padding: 10px 20px; background: #fff; border: 1px solid var(--border); color: var(--ink); border-radius: var(--radius); white-space: nowrap; font-weight: 500; }
.button:not(:disabled):hover { background: #f4f7f9; border-color: #aebecb; }
.primary { color: #fff; border-color: var(--teal); background: var(--teal); box-shadow: 0 2px 5px #102a3f13; }
.primary:not(:disabled):hover { background: #063f49; border-color: #063f49; }
.changes { margin-top: 0; }
.changes-content { padding: 12px 18px; background: var(--surface); min-height: 65px; }
.empty-changes { font-size: 13px; color: var(--muted); line-height: 1.6; margin: 2px 0; }
.change + .change { padding-top: 13px; }
.change p { margin: 0 0 5px; font: 13px/1.5 "SFMono-Regular", Consolas, monospace; }
.change code { display: block; color: var(--muted); font: 12.5px/1.5 "SFMono-Regular", Consolas, monospace; overflow-wrap: anywhere; }
.change code::before { content: "+"; color: var(--green); font-weight: 700; margin-right: 13px; }
footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 20px; font-size: 11.5px; line-height: 1.6; color: var(--muted); margin: 15px 2px 0; }
footer p { margin: 0; }
footer nav { display: flex; gap: 10px; }
a { color: var(--muted); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--teal); }
#status { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); max-width: calc(100vw - 32px); margin: 0; border-radius: 7px; font-size: 13px; line-height: 1.5; background: #122d35; color: #fff; box-shadow: 0 3px 14px #102a3f24; z-index: 5; }
#status:not(:empty) { padding: 10px 16px; }
.editors[data-expanded] { grid-template-columns: minmax(0, 1fr); }
.editors[data-expanded="before"] #after-panel, .editors[data-expanded="after"] #before-panel { display: none; }
.noscript { padding: 15px; border: 1px solid #e8be70; background: #fff8eb; }
@media (max-width: 1050px) {
  .topbar { gap: 18px; flex-wrap: wrap; }
  h1 { margin-right: 5px; }
  .editor-tools > span { display: none; }
  .actions { align-items: flex-start; flex-direction: column; gap: 10px; }
  .action-buttons { align-self: flex-end; }
}
@media (max-width: 799px) {
  main { padding: 15px 12px; }
  .topbar { gap: 15px 18px; margin-bottom: 17px; }
  h1 { font-size: 21px; width: 100%; }
  .example-control { flex: 1 1 100%; }
  select { flex: 1; min-width: 0; }
  .local-notice { font-size: 12px; }
  .editors { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .editor-header { padding: 10px 14px; min-height: 66px; }
  .editor-tools > span { display: inline; }
  .code-scroll { height: 330px; }
  pre { font-size: 13px; line-height: 23px; }
  .code-line { min-height: 23px; }
  .action-buttons { align-self: stretch; gap: 8px; }
  .button { flex: 1; padding: 10px 14px; min-height: 46px; }
  .primary { flex-basis: 100%; }
  .finding { gap: 11px; }
  .diagnosis-content { padding: 10px 13px 15px; }
  .finding p { font-size: 12.5px; }
  footer nav { flex-wrap: wrap; }
}
@media (max-width: 390px) { .editor-tools > span { display: none; } .button { padding-inline: 10px; font-size: 13px; } }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }
/* Rebuilt journey extends the supplied compact editor design system. */
[hidden]{display:none!important}main{max-width:1380px;padding-top:20px}.topbar{border-bottom:1px solid var(--border);padding-bottom:16px}.topbar .local-notice{margin-left:auto}.text-button{border:0;padding:10px;color:var(--teal);background:transparent;min-height:44px}.skip-link{position:absolute;top:-80px;left:16px;z-index:10;padding:12px;background:#fff}.skip-link:focus{top:8px}
.progress{display:flex;list-style:none;padding:0;gap:32px;margin:22px 0 30px;color:var(--muted);font-size:14px}.progress li{border-bottom:2px solid transparent;padding-bottom:12px}.progress li[aria-current="step"]{color:var(--teal);border-color:var(--teal);font-weight:650}.progress span{margin-left:9px}#step-title{font-size:25px;letter-spacing:-.5px}.intro{color:var(--muted);font-size:15px;line-height:1.6;margin:9px 0 20px}#step-1{max-width:880px}
.scope{display:flex;gap:18px;margin:24px 0 20px}.scope label{display:flex;flex-direction:column;gap:8px;font-size:14px;min-width:0}.scope select{min-width:175px}.field-label,.input-content label{display:block;font-size:14px;margin:8px 0;font-weight:600}textarea{width:100%;resize:vertical;min-height:90px;border:1px solid #b9c6d1;border-radius:var(--radius);padding:13px;font:14px/1.6 "SFMono-Regular",Consolas,monospace;color:var(--ink);background:#fff}.hint{font-size:12.5px;color:var(--muted);line-height:1.6}.route-action{display:flex;align-items:center;gap:20px;margin:18px 0 24px}#route-status{font-size:13px;line-height:1.5;color:var(--muted);margin:0}
.case-list{border-top:1px solid var(--border)}.case{display:flex;align-items:center;justify-content:space-between;width:100%;text-align:left;padding:17px 12px;background:#fff;color:var(--ink);border:0;border-bottom:1px solid var(--border);border-left:3px solid transparent}.case strong{display:block;font-size:15px;font-weight:600}.case small{display:block;color:var(--muted);font-size:13px;margin-top:4px}.case:not(:disabled):hover,.case.suggested{background:var(--surface);border-left-color:var(--teal)}.case-cue{color:var(--muted);margin-left:16px}.reproduction-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.reproduction-heading .intro{margin-bottom:8px}.input-panel{margin:15px 0}.input-content{padding:0 16px 18px}.input-content .hint{margin-left:8px}#input-error,#own-error{font-size:14px;color:#a21b2d;overflow-wrap:anywhere}#dirty-status{display:inline-block}.code-scroll{height:355px}pre{font-size:13px;line-height:23px}.code-line{min-height:23px}.icon-button{min-width:44px;min-height:44px}
.findings{padding:8px 17px}.finding-row{display:flex;gap:18px;padding:12px 0;border-bottom:1px solid var(--border)}.finding-row:last-child{border-bottom:0}.finding-level{width:90px;flex-shrink:0;color:var(--muted);font-size:12px;padding-top:2px}.finding-row p{font-size:14px;line-height:1.5;margin:0 0 6px}.finding-row code{font-size:12px;color:var(--muted);overflow-wrap:anywhere}.diff{min-width:0;width:100%;overflow:auto;padding:18px;max-height:400px;background:var(--surface);white-space:pre}.next-steps{margin:25px 0;max-width:980px}.next-steps h3{font-size:15px}.next-steps ol{padding-left:22px}.next-steps li{font-size:14px;line-height:1.6;margin:9px 0;color:var(--muted)}.check-label{display:flex;align-items:flex-start;gap:12px;min-height:44px;padding:10px 0;font-size:14px;line-height:1.5;cursor:pointer}.check-label input{width:18px;height:18px;margin:2px 0 0;flex-shrink:0;accent-color:var(--teal)}.review-check{margin-top:12px;border-top:1px solid var(--border);padding-top:22px}.review-summary{color:var(--teal);font-size:14px;line-height:1.6}.error-preview{white-space:pre-wrap;overflow-wrap:anywhere;padding:15px;border:1px solid var(--border);font:13px/1.6 monospace}
@media(max-width:799px){.topbar{gap:8px}.topbar h1{width:auto;margin-right:auto}.topbar .local-notice{order:3;flex-basis:100%}.progress{gap:12px;justify-content:space-between;font-size:12px;margin-bottom:24px}.progress li{display:flex;gap:6px}.progress span{margin:0}.scope{gap:12px}.scope label{flex:1}.scope select{min-width:0;width:100%}.route-action,.reproduction-heading{flex-direction:column;align-items:stretch}.reproduction-heading .example-control{flex-basis:auto}.finding-row{gap:10px}.finding-level{width:65px}.actions{flex-direction:row;flex-wrap:wrap}.actions p{flex-basis:100%}.code-scroll{height:300px}.editor-header{gap:5px}.editor-tools{gap:0}.editor-tools>span{display:none}#step-title{font-size:23px}.button{white-space:normal}#step-3 .action-buttons{width:100%}}

.finding-row .finding-guide{margin:9px 0 0}.finding-guide a{display:inline-block;min-height:32px;padding:5px 0;text-underline-offset:3px}