/* Jun's selected CS themes: Grid dark / Porcelain light. Shared assets and controls remain canonical. */
.cs-site { --cs-bg: #f5f7f8; --cs-panel: #fff; --cs-text: #112838; --cs-muted: #526674; --cs-line: #d9e1e6; --cs-accent: var(--accent, #003f7a); --cs-on-accent: #fff; --cs-radius: 16px; background: var(--cs-bg); color: var(--cs-text); min-height: 100vh; }
.cs-site[data-theme=dark] { --cs-bg: #000; --cs-panel: #0b0b0b; --cs-text: #fafafa; --cs-muted: #aaa; --cs-line: #292929; --cs-accent: #fff; --cs-on-accent: #000; --cs-radius: 2px; color-scheme: dark; }
.cs-site a { color: inherit; text-decoration: none; }
.cs-site a:hover { text-decoration: underline; text-underline-offset: 5px; }
.cs-site :focus-visible { outline: 2px solid var(--cs-text); outline-offset: 5px; }
.cs-header, .cs-footer { max-width: 1280px; margin-inline: auto; padding: 24px 32px; display: flex; align-items: center; gap: 32px; }
.cs-header { border-bottom: 1px solid var(--cs-line); flex-wrap: wrap; }
.cs-header .mithril-public-navigation-panel { background: var(--cs-panel); color: var(--cs-text); border-color: var(--cs-line); z-index: 10; }
.cs-preferences { margin-inline-start: auto; display: flex; align-items: center; gap: 12px; }
.cs-theme { min-width: 44px; min-height: 44px; border: 1px solid var(--cs-line); border-radius: var(--cs-radius); background: var(--cs-panel); color: var(--cs-text); font-size: 24px; }
.cs-skip { position: absolute; inset-inline-start: 20px; top: -100px; z-index: 20; background: var(--cs-panel); padding: 12px; }
.cs-skip:focus { top: 8px; }
.cs-site main { max-width: 1280px; margin: auto; }
.cs-hero { padding: 88px 32px 72px; }
.cs-eyebrow, .cs-number { color: var(--cs-muted); text-transform: uppercase; letter-spacing: .08em; font-size: 12px; }
.cs-hero h1 { max-width: 1080px; font-size: clamp(40px, 6vw, 88px); font-weight: 500; line-height: 1.12; letter-spacing: -.045em; margin: 24px 0; text-wrap: balance; }
.cs-lead { max-width: 760px; font-size: 21px; line-height: 1.6; color: var(--cs-muted); }
.cs-availability { max-width: 760px; border-inline-start: 2px solid var(--cs-line); padding-inline-start: 16px; margin-block: 24px; font-size: 14px; line-height: 1.6; color: var(--cs-muted); }
.cs-site .cs-button { display: inline-flex; align-items: center; min-height: 48px; padding: 12px 24px; border-radius: var(--cs-radius); background: var(--cs-accent); color: var(--cs-on-accent); }
.cs-back { display: inline-block; margin-bottom: 28px; font-size: 13px; }
.cs-feature-list { padding-inline: 32px; }
.cs-feature-link { display: grid; grid-template-columns: 48px 1fr 24px; gap: 24px; align-items: start; padding-block: 32px; border-top: 1px solid var(--cs-line); }
.cs-feature-link h2 { font-size: 25px; margin: 0 0 10px; font-weight: 500; }
.cs-feature-link p { max-width: 860px; color: var(--cs-muted); line-height: 1.6; margin: 0; }
.cs-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-inline: 32px; border-inline-start: 1px solid var(--cs-line); }
.cs-grid > div { padding: 32px; border: 1px solid var(--cs-line); border-inline-start: 0; }
.cs-grid > article { padding: 32px; border: 1px solid var(--cs-line); border-inline-start: 0; }
.cs-grid p { line-height: 1.6; color: var(--cs-muted); }
.cs-grid h2 { font-size: 22px; font-weight: 500; line-height: 1.4; }
.cs-workflow { padding: 72px 32px; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; }
.cs-workflow h2 { font-size: 32px; font-weight: 500; line-height: 1.3; }
.cs-workflow ol { padding-inline-start: 24px; color: var(--cs-muted); line-height: 1.7; }
.cs-workflow li { padding-block: 8px; }
.cs-evidence { background: var(--cs-panel); padding: 28px; border: 1px solid var(--cs-line); border-radius: var(--cs-radius); }
.cs-evidence h3 { font-size: 22px; font-weight: 500; }
.cs-evidence-row { border-top: 1px solid var(--cs-line); padding-block: 16px; font-size: 14px; margin: 0; }
.cs-related { display: flex; gap: 24px; flex-wrap: wrap; padding: 32px; border-block: 1px solid var(--cs-line); font-size: 14px; }
.cs-related a, .cs-footer a { min-height: 44px; display: inline-flex; align-items: center; }
.cs-footer { color: var(--cs-muted); font-size: 12px; flex-wrap: wrap; padding-block: 40px; }
.cs-header .mithril-public-navigation > ul { flex-wrap: wrap; gap: 16px; }
.cs-header .mithril-public-navigation a, .cs-header .mithril-public-navigation summary { min-height: 44px; display: flex; align-items: center; }
.cs-start-link { white-space: nowrap; font-size: 13px; }
.cs-reading { padding: 32px; line-height: 1.7; }
.cs-filters, .cs-choice { display: flex; gap: 20px; flex-wrap: wrap; }
.cs-filters label, .cs-form > label { display: flex; flex-direction: column; gap: 8px; }
.cs-site input, .cs-site select, .cs-choice button, .cs-evidence button { min-height: 44px; padding: 10px 12px; border: 1px solid var(--cs-line); border-radius: var(--cs-radius); background: var(--cs-panel); color: var(--cs-text); max-width: 100%; }
.cs-choice button[aria-pressed=true] { background: var(--cs-accent); color: var(--cs-on-accent); }
.cs-article-card { padding-block: 28px; border-bottom: 1px solid var(--cs-line); }
.cs-article-card h2 { font-size: 26px; font-weight: 500; line-height: 1.4; }
.cs-article-card p { color: var(--cs-muted); }
.cs-article-body { max-width: 850px; margin: auto; }
.cs-article-body h1 { font-size: clamp(32px, 5vw, 54px); line-height: 1.2; }
.cs-article-body h2 { font-size: 28px; margin-top: 36px; }
.cs-article-body a { text-decoration: underline; text-underline-offset: 3px; }
.cs-price-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.cs-price { font-size: 30px; font-weight: 500; }
.cs-price small { font-size: 15px; }
.cs-form { display: flex; flex-direction: column; gap: 24px; }
.cs-form .cs-checkbox { flex-direction: row; align-items: start; }
.cs-checkbox input { min-width: 20px; min-height: 20px; margin-top: 4px; }
.cs-form button.cs-button { align-self: start; border: 0; }
.cs-evidence pre { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; text-align: start; }
.cs-evidence p, .cs-form p { line-height: 1.6; }
.cs-evidence small { color: var(--cs-muted); line-height: 1.6; }
@media (max-width: 700px) {
  .cs-header, .cs-footer { padding-inline: 24px; gap: 12px; }
  .cs-header .cs-preferences { width: 100%; justify-content: space-between; margin-inline-start: 0; }
  .cs-hero { padding: 48px 24px; }
  .cs-hero h1 { font-size: 44px; }
  .cs-lead { font-size: 18px; }
  .cs-feature-list { padding-inline: 24px; }
  .cs-feature-link { grid-template-columns: 24px 1fr 16px; gap: 12px; }
  .cs-grid { grid-template-columns: 1fr; margin-inline: 24px; }
  .cs-workflow { grid-template-columns: 1fr; padding: 48px 24px; gap: 24px; }
  .cs-related { padding-inline: 24px; gap: 12px; flex-direction: column; }
  .cs-reading { padding-inline: 24px; }
  .cs-reading .cs-feature-list { padding-inline: 0; }
  .cs-filters { flex-direction: column; }
  .cs-price-grid { grid-template-columns: 1fr; }
}

:root{color-scheme:dark}body{margin:0;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}textarea{width:100%;padding:12px;border:1px solid var(--cs-line);background:var(--cs-panel);color:var(--cs-text);border-radius:var(--cs-radius)}.brand{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:600;letter-spacing:.02em}.brand img{width:28px;height:32px}.cs-site[data-theme=dark] .brand img{filter:invert(1)}.cs-site[data-theme=dark]{background-image:linear-gradient(#ffffff05 1px,transparent 1px),linear-gradient(90deg,#ffffff05 1px,transparent 1px);background-size:48px 48px}.cs-site button{min-height:44px;padding:10px 16px;border:1px solid var(--cs-line);background:var(--cs-panel);color:var(--cs-text);border-radius:var(--cs-radius)}.cs-site button.primary{background:var(--cs-accent);color:var(--cs-on-accent)}.cs-site label{display:flex;flex-direction:column;gap:8px;font-size:14px}.cs-site label.check{flex-direction:row;align-items:flex-start;line-height:1.5}.cs-site input[type=checkbox]{min-height:auto;margin-top:4px}.cs-site form{display:grid;gap:20px;max-width:680px}.muted,.cs-site small{color:var(--cs-muted);line-height:1.6}.cs-console{display:grid;grid-template-columns:190px 1fr;gap:32px;padding:32px;min-height:70vh}.cs-side{display:flex;flex-direction:column;gap:5px}.cs-side a{padding:13px 12px;border:1px solid transparent;border-radius:var(--cs-radius)}.cs-side a[aria-current=page]{border-color:var(--cs-line);background:var(--cs-panel)}.cs-console h1{font-size:28px;letter-spacing:-.025em;font-weight:500;margin:0 0 12px}.row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.record{padding:24px 0;border-bottom:1px solid var(--cs-line)}.record h2{font-size:18px;font-weight:500;margin:0 0 8px}.record p{margin:8px 0;line-height:1.5}.record details{margin-top:16px}.record summary{cursor:pointer;padding:10px 0}.record pre{padding:16px;background:var(--cs-panel);border:1px solid var(--cs-line);font-size:12px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;max-height:420px;overflow:auto}.status{display:inline-flex;border:1px solid var(--cs-line);padding:4px 8px;font-size:12px;border-radius:2px}.error{color:var(--cs-text);border-inline-start:3px solid #cf5f4b;padding:10px 16px;white-space:pre-wrap}.notice{border-inline-start:2px solid var(--cs-line);padding:12px 16px;color:var(--cs-muted);line-height:1.6}.empty{padding:32px 0;color:var(--cs-muted)}.editor{display:grid;gap:12px;max-width:680px;padding:20px 0}.cs-header nav{display:flex;gap:22px;flex-wrap:wrap;font-size:14px}.cs-header nav a{min-height:44px;display:flex;align-items:center}.cs-header{gap:24px;padding-block:16px}.cs-header .actions{margin-inline-start:auto}.cs-footer{border-top:1px solid var(--cs-line)}.cs-reading{max-width:900px}.screen-reader{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}.badge-line{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.badge-line span{border:1px solid var(--cs-line);padding:12px 16px;font-size:13px}
@media(max-width:760px){.cs-header,.cs-footer{padding-inline:20px;gap:12px}.cs-header nav{gap:16px;order:3;width:100%;overflow:auto;flex-wrap:nowrap}.cs-header .actions{gap:8px}.cs-header select{max-width:115px}.cs-console{grid-template-columns:1fr;padding:24px 20px;gap:24px}.cs-side{flex-direction:row;overflow:auto;white-space:nowrap;border-bottom:1px solid var(--cs-line)}.cs-side a{padding:12px 10px}.cs-console h1{font-size:26px}.record pre{max-width:calc(100vw - 40px)}.cs-hero{padding:56px 20px 40px}.cs-feature-list{padding-inline:20px}.cs-feature-link{grid-template-columns:28px 1fr 18px;gap:12px}.cs-reading{padding:24px 20px}.cs-workflow{padding:40px 20px}.cs-grid{margin-inline:20px}.cs-console .row{align-items:flex-start}}
