.utf-frontier {
  --utf-accent: #1f5d7a;
  --utf-text: #1a1f24;
  --utf-muted: #5d6770;
  --utf-border: #d8dde2;
  --utf-soft: #f6f8fa;
  --utf-soft-blue: #eef5f8;
  --utf-danger: #8a2f2f;
  --utf-good: #245d3c;
  color: var(--utf-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.55;
  max-width: 1180px;
  margin: 0 auto;
  padding: 26px 18px 56px;
}
.utf-frontier * { box-sizing: border-box; }
.utf-frontier h1,.utf-frontier h2,.utf-frontier h3,.utf-frontier h4 { color: var(--utf-text); line-height: 1.15; margin-top: 0; }
.utf-frontier h1 { font-size: clamp(2.2rem,5vw,4.3rem); letter-spacing: -0.035em; margin-bottom: 10px; }
.utf-frontier h2 { font-size: clamp(1.45rem,2.2vw,2rem); }
.utf-frontier h3 { font-size: 1.25rem; }
.utf-frontier p { margin-top: 0; }
.utf-paper-header { padding: 28px 0 38px; border-bottom: 2px solid var(--utf-text); }
.utf-kicker { text-transform: uppercase; letter-spacing: .12em; font-weight: 700; font-size: .78rem; color: var(--utf-accent); margin-bottom: 12px; }
.utf-subtitle { font-size: clamp(1.2rem,2.3vw,1.8rem); font-weight: 600; margin-bottom: 10px; }
.utf-intro { color: var(--utf-muted); max-width: 820px; font-size: 1.04rem; }
.utf-thesis-grid { display:grid; grid-template-columns: .85fr 1.15fr; gap: 28px; padding: 34px 0; align-items:start; }
.utf-theorem-box { border-left: 4px solid var(--utf-accent); background: var(--utf-soft-blue); padding: 22px 24px; }
.utf-theorem-label { display:block; font-size:.76rem; text-transform:uppercase; letter-spacing:.08em; font-weight:700; color:var(--utf-accent); margin-bottom:10px; }
.utf-equation { font-family: "Times New Roman", Georgia, serif; font-size: clamp(1.25rem,2vw,1.7rem); margin-bottom: 8px; }
.utf-mode-tabs { display:flex; gap: 4px; border-bottom:1px solid var(--utf-border); margin: 6px 0 28px; }
.utf-mode-tab { appearance:none; border:0; border-bottom:3px solid transparent; background:transparent; color:var(--utf-muted); font:inherit; font-weight:700; padding:12px 18px; cursor:pointer; }
.utf-mode-tab.is-active { color:var(--utf-text); border-bottom-color:var(--utf-accent); }
.utf-mode-tab:focus-visible,.utf-button:focus-visible,.utf-frontier input:focus-visible,.utf-frontier select:focus-visible,.utf-fiber-inspect:focus-visible { outline:3px solid color-mix(in srgb,var(--utf-accent),white 50%); outline-offset:2px; }
.utf-mode-panel { display:none; }
.utf-mode-panel.is-active { display:block; }
.utf-builder,.utf-run-section,.utf-result-section,.utf-paper-notes,.utf-sources { padding: 30px 0; border-bottom:1px solid var(--utf-border); }
.utf-section-heading > div { display:flex; gap:16px; align-items:flex-start; }
.utf-step { margin:0; width:40px; height:40px; border:2px solid var(--utf-accent); color:var(--utf-accent); border-radius:50%; display:grid; place-items:center; font-weight:800; flex:0 0 auto; }
.utf-section-heading p:not(.utf-step) { color:var(--utf-muted); max-width:850px; }
.utf-control-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:22px 0; }
.utf-field { display:flex; flex-direction:column; gap:7px; min-width:0; }
.utf-field > span,.utf-feature-fieldset legend { font-weight:750; font-size:.92rem; }
.utf-field small,.utf-help,.utf-feature-card small { color:var(--utf-muted); font-size:.78rem; }
.utf-field select,.utf-field input { width:100%; min-height:44px; border:1px solid #bfc7ce; border-radius:4px; background:white; color:var(--utf-text); padding:8px 10px; font-size:16px; }
.utf-feature-fieldset { border:0; padding:0; margin: 28px 0 18px; }
.utf-feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:12px; }
.utf-feature-card { display:flex; align-items:flex-start; gap:10px; border:1px solid var(--utf-border); padding:13px; background:white; cursor:pointer; min-height:112px; }
.utf-feature-card:has(input:checked) { border-color:var(--utf-accent); background:var(--utf-soft-blue); box-shadow:inset 0 0 0 1px var(--utf-accent); }
.utf-feature-card input { margin-top:3px; flex:0 0 auto; }
.utf-feature-body { display:flex; flex-direction:column; gap:4px; min-width:0; }
.utf-feature-body code,.utf-frontier code { overflow-wrap:anywhere; }
.utf-representation-live { display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; padding:15px 18px; background:var(--utf-soft); border-left:3px solid var(--utf-text); }
.utf-representation-live span { color:var(--utf-muted); font-size:.82rem; text-transform:uppercase; letter-spacing:.05em; font-weight:700; }
.utf-representation-live strong { font-family:"Times New Roman",Georgia,serif; font-size:1.25rem; }
.utf-target-warning { margin-top:12px; padding:12px 14px; border-left:3px solid #a16a16; background:#fbf7ec; }
.utf-actions { display:flex; flex-wrap:wrap; gap:10px; margin:18px 0; }
.utf-button { min-height:44px; border-radius:4px; border:1px solid transparent; padding:10px 15px; font:inherit; font-weight:750; cursor:pointer; }
.utf-button:disabled { opacity:.5; cursor:not-allowed; }
.utf-primary { background:var(--utf-accent); color:white; }
.utf-secondary { background:white; border-color:var(--utf-accent); color:var(--utf-accent); }
.utf-text { background:transparent; border-color:var(--utf-border); color:var(--utf-text); }
.utf-progress-wrap { max-width:720px; padding-top:10px; }
.utf-progress-label { display:flex; justify-content:space-between; gap:16px; font-size:.86rem; margin-bottom:7px; }
.utf-progress { width:100%; height:12px; accent-color:var(--utf-accent); }
.utf-runtime-note { min-height:24px; color:var(--utf-muted); }
.utf-error-inline,.utf-error { color:var(--utf-danger); font-weight:700; }
.utf-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border:1px solid var(--utf-border); margin:18px 0 24px; }
.utf-metrics > div { padding:15px; border-right:1px solid var(--utf-border); }
.utf-metrics > div:last-child { border-right:0; }
.utf-metrics span { display:block; color:var(--utf-muted); font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; }
.utf-metrics strong { display:block; font-size:1.4rem; margin-top:3px; }
.utf-obstruction-panel { margin:20px 0; }
.utf-obstruction-header { border-left:4px solid var(--utf-danger); background:#fbf2f2; padding:16px 18px; display:flex; flex-direction:column; gap:3px; }
.utf-obstruction-header span,.utf-certificate span { text-transform:uppercase; font-size:.74rem; letter-spacing:.06em; font-weight:800; }
.utf-representation-witness { margin-top:14px; padding:12px 14px; background:var(--utf-soft); display:flex; gap:10px; flex-wrap:wrap; align-items:baseline; }
.utf-representation-witness span { font-weight:700; }
.utf-witness-grid { display:grid; grid-template-columns:1fr 54px 1fr; gap:12px; align-items:center; margin-top:14px; }
.utf-witness-neq { font-size:2.1rem; text-align:center; font-family:Georgia,serif; }
.utf-graph-card { border:1px solid var(--utf-border); padding:16px; min-width:0; }
.utf-graph-card h4 { margin-bottom:5px; }
.utf-graph-svg { width:100%; max-width:260px; display:block; margin:4px auto 8px; }
.utf-graph-svg .utf-edges line { stroke:#2a3137; stroke-width:2.2; }
.utf-graph-svg .utf-nodes circle { fill:white; stroke:var(--utf-accent); stroke-width:2.4; }
.utf-graph-svg .utf-nodes text { fill:var(--utf-text); font-size:12px; font-weight:700; }
.utf-graph-card dl { margin:0; }
.utf-graph-card dl div { display:grid; grid-template-columns:120px 1fr; gap:8px; padding:5px 0; border-top:1px solid #edf0f2; }
.utf-graph-card dt { color:var(--utf-muted); font-size:.8rem; }
.utf-graph-card dd { margin:0; font-size:.85rem; overflow-wrap:anywhere; }
.utf-certificate { border-left:4px solid var(--utf-good); background:#f0f7f3; padding:17px 18px; }
.utf-frontier-box { margin-top:24px; border:2px solid var(--utf-text); padding:20px; }
.utf-frontier-heading { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.utf-frontier-status { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-weight:800; background:var(--utf-text); color:white; padding:5px 8px; }
.utf-frontier-heading h3 { margin:0; }
.utf-frontier-claim { font-size:1.05rem; margin:16px 0; }
.utf-boundary-box { background:var(--utf-soft); padding:12px 14px; }
.utf-boundary-box p { margin:4px 0 0; }
.utf-validity-drawer { margin:16px 0; border:1px solid var(--utf-border); padding:0; }
.utf-validity-drawer summary { cursor:pointer; font-weight:750; padding:13px 15px; }
.utf-validity-content { border-top:1px solid var(--utf-border); padding:15px; }
.utf-theorem-proof { margin:10px 0; padding-left:12px; border-left:3px solid var(--utf-accent); }
.utf-theorem-proof p { margin:4px 0; }
.utf-theorem-proof small { color:var(--utf-muted); }
.utf-state-panel { margin:24px 0; padding:18px; background:var(--utf-soft-blue); }
.utf-state-panel h3 { margin-bottom:5px; }
.utf-state-values { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; }
.utf-state-values label { display:flex; flex-direction:column; gap:5px; font-size:.78rem; font-weight:750; }
.utf-state-values input { min-height:42px; width:100%; border:1px solid var(--utf-border); padding:8px; background:white; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.76rem; }
.utf-copy-status { color:var(--utf-muted); margin-bottom:0; }
.utf-fiber-explorer,.utf-spectrum-section { margin-top:30px; border-top:1px solid var(--utf-border); padding-top:24px; }
.utf-inline-heading { display:flex; justify-content:space-between; gap:18px; align-items:flex-start; flex-wrap:wrap; }
.utf-inline-heading h3 { margin-bottom:3px; }
.utf-inline-heading p { color:var(--utf-muted); }
.utf-pagination { display:flex; align-items:center; gap:8px; }
.utf-fiber-table-wrap,.utf-spectrum-results { width:100%; overflow-x:auto; }
.utf-fiber-table,.utf-spectrum-results table { width:100%; border-collapse:collapse; font-size:.86rem; }
.utf-fiber-table th,.utf-fiber-table td,.utf-spectrum-results th,.utf-spectrum-results td { text-align:left; border-bottom:1px solid var(--utf-border); padding:10px 8px; vertical-align:top; }
.utf-fiber-inspect { min-height:36px; border:1px solid var(--utf-accent); color:var(--utf-accent); background:white; border-radius:3px; cursor:pointer; font-weight:700; }
.utf-fiber-detail { margin-top:16px; }
.utf-fiber-detail-head { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; padding:12px; background:var(--utf-soft); }
.utf-fiber-objects { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:8px; }
.utf-fiber-object { border:1px solid var(--utf-border); padding:9px; display:flex; flex-direction:column; gap:3px; font-size:.78rem; }
.utf-recovery-controls { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:700px; }
.utf-recovery-grid { display:grid; grid-template-columns:1fr 70px 1fr 70px 1fr; gap:10px; align-items:center; margin:22px 0; }
.utf-recovery-grid > div:not(.utf-recovery-arrow) { border:1px solid var(--utf-border); padding:14px; min-width:0; text-align:center; }
.utf-recovery-grid > div > span { display:block; font-size:.78rem; text-transform:uppercase; letter-spacing:.05em; font-weight:750; color:var(--utf-muted); }
.utf-recovery-arrow { font-size:1.8rem; text-align:center; }
.utf-recovery-arrow small { display:block; font-size:.7rem; color:var(--utf-muted); }
.utf-bitstring { margin:35px 0; overflow-wrap:anywhere; }
.utf-recovery-certificate,.utf-recovery-boundary { padding:14px 16px; margin:12px 0; }
.utf-recovery-certificate.is-pass { border-left:4px solid var(--utf-good); background:#f0f7f3; }
.utf-recovery-certificate.is-fail { border-left:4px solid var(--utf-danger); background:#fbf2f2; }
.utf-recovery-boundary { background:var(--utf-soft); }
.utf-notes-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.utf-sources ol { padding-left:22px; }
.utf-sources li { margin-bottom:12px; }
.utf-sources li span { display:block; color:var(--utf-muted); font-size:.88rem; }
.utf-sources a { color:var(--utf-accent); }
.utf-version-footer { display:flex; gap:12px 20px; flex-wrap:wrap; padding-top:20px; color:var(--utf-muted); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.72rem; }
.utf-noscript { margin-top:18px; padding:14px; border:1px solid var(--utf-danger); }

@media (max-width: 900px) {
  .utf-thesis-grid,.utf-control-grid,.utf-feature-grid { grid-template-columns:1fr 1fr; }
  .utf-witness-grid { grid-template-columns:1fr; }
  .utf-recovery-grid { grid-template-columns:1fr; }
  .utf-recovery-arrow { transform:rotate(90deg); }
  .utf-metrics { grid-template-columns:1fr 1fr; }
  .utf-metrics > div:nth-child(2) { border-right:0; }
  .utf-metrics > div { border-bottom:1px solid var(--utf-border); }
  .utf-fiber-objects { grid-template-columns:1fr 1fr; }
}
@media (max-width: 620px) {
  .utf-frontier { padding-left:12px; padding-right:12px; }
  .utf-thesis-grid,.utf-control-grid,.utf-feature-grid,.utf-state-values,.utf-notes-grid,.utf-recovery-controls { grid-template-columns:1fr; }
  .utf-metrics { grid-template-columns:1fr; }
  .utf-metrics > div { border-right:0; }
  .utf-fiber-objects { grid-template-columns:1fr; }
  .utf-actions .utf-button { width:100%; }
  .utf-section-heading > div { gap:10px; }
  .utf-step { width:34px; height:34px; }
  .utf-mode-tabs { overflow-x:auto; }
}
.utf-demo-presets { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:12px; }
.utf-demo-presets > span { font-size:.76rem; text-transform:uppercase; letter-spacing:.05em; font-weight:750; color:var(--utf-muted); }
.utf-preset { appearance:none; background:white; border:1px solid var(--utf-border); color:var(--utf-text); min-height:36px; padding:7px 10px; border-radius:3px; cursor:pointer; font:inherit; font-size:.82rem; }
.utf-preset:hover { border-color:var(--utf-accent); color:var(--utf-accent); }

.utf-frontier-legend { margin-top:8px; color:var(--utf-muted); font-size:.88rem; }
.utf-state-compatibility-warning { margin:14px 0 20px; padding:13px 15px; border-left:4px solid #a16a16; background:#fbf7ec; }
.utf-state-verification { margin:10px 0 0; color:var(--utf-muted); font-size:.86rem; }
.utf-state-verification.is-pass { color:var(--utf-good); font-weight:700; }
.utf-state-verification.is-fail { color:var(--utf-danger); font-weight:700; }