.mock-nav { display:flex; gap:20px; align-items:center; font-size:12px; }
.mock-nav a { color:#b7bcb9; }
.mock-nav a[aria-current="page"] { color:white; }
.mock-badge { display:inline-block; padding:3px 7px; border:1px solid #ad9472; border-radius:3px; color:#846237; background:#faf2e5; font-size:11px; font-weight:600; white-space:nowrap; }
.mock-nav .mock-badge { margin-left:6px; color:#e9d1ac; background:transparent; border-color:#7b6a53; }
.mock-main { max-width:1550px; }
.mock-warning { padding:12px 16px; margin:0 0 18px; border:1px solid #decdae; border-left:3px solid #ac8250; border-radius:4px; background:#fbf7ef; color:#655338; font-size:12px; }
.mock-warning p { margin:4px 0 0; }
.mock-toolbar { display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap; margin-bottom:16px; }
.mock-toolbar .field { min-width:145px; }
.mock-segment { display:flex; padding:3px; border:1px solid var(--line); border-radius:4px; background:#e8ebe8; }
.mock-segment button { min-height:34px; padding:7px 13px; color:#6d7470; border-radius:3px; background:transparent; cursor:pointer; font-size:12px; }
.mock-segment button[aria-pressed="true"] { color:#27382e; background:white; box-shadow:0 1px 3px #30333318; font-weight:600; }
.mock-main .platform-panel { margin-bottom:16px; padding:18px; }
.mock-main h2 { margin:0; font-size:15px; font-weight:600; }
.mock-main .platform-panel-title p { font-size:12px; }
.mock-selection-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.mock-options { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.mock-choice { display:flex; gap:8px; align-items:center; padding:8px 11px; border:1px solid #d9ddd9; border-radius:4px; background:#f8f9f7; cursor:pointer; font-size:12px; }
.mock-choice:has(input:checked) { border-color:#9aa9a0; background:#f0f4f1; }
.mock-choice input, .mock-dimension input { accent-color:#456953; }
.mock-choice small { display:block; font-size:10px; color:#7c847e; }
.mock-dot { width:8px; height:8px; display:inline-block; border-radius:50%; margin-right:5px; flex:none; }
.mock-dimension { display:flex; align-items:center; gap:5px; font-size:11px; cursor:pointer; color:#737b73; padding:4px 8px; border:1px solid #e2e5df; border-radius:3px; }
.mock-selection-actions { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-top:12px; }
.mock-selection-actions > span { margin-right:auto; color:#899087; font-size:11px; }
.mock-selection-actions .text-button + .text-button { margin-left:0; }
#share-status { display:block; margin-top:8px; font-size:11px; color:#56715c; overflow-wrap:anywhere; }
.mock-chart-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:12px; }
.mock-chart { position:relative; min-width:0; border:1px solid #e1e6df; border-radius:4px; padding:10px; }
.mock-chart h3 { margin:0 0 4px; font-size:12px; font-weight:600; color:#5a665c; display:flex; justify-content:space-between; }
.mock-chart h3 span { color:#b4b9af; font-size:10px; }
.mock-chart svg { display:block; width:100%; height:auto; overflow:visible; }
.mock-chart svg text { fill:#899185; font:10px Arial,sans-serif; }
.mock-grid { stroke:#e9ede5; stroke-width:1; }
.mock-zero { stroke:#9da69e; stroke-width:1; stroke-dasharray:3 3; }
.mock-crosshair { stroke:#949d92; stroke-width:1; opacity:0; stroke-dasharray:3 3; }
.mock-crosshair.is-active { opacity:.65; }
.mock-chart circle { cursor:pointer; }
.mock-chart circle:hover, .mock-chart circle:focus-visible { stroke-width:3.5; }
.mock-series { pointer-events:stroke; }
.mock-series.mock-series-active { stroke-width:3.5; }
.mock-inline-legend { cursor:help; }
.mock-inline-legend.mock-series-active text { fill:#354b40; font-weight:700; }
.mock-chart svg .mock-axis-title { fill:#657465; font-size:9px; }
.mock-plot-tooltip { display:none; position:absolute; z-index:4; left:16px; right:16px; bottom:58px; padding:7px 9px; border:1px solid #c9d3c8; border-radius:3px; background:#ffffffed; box-shadow:0 2px 6px #30333312; color:#425744; font-size:10px; line-height:1.6; pointer-events:none; }
.mock-plot-tooltip.is-visible { display:block; }
.mock-chart-empty { min-height:180px; grid-column:1/-1; display:grid; place-items:center; text-align:center; color:#969c92; font-size:12px; }
.mock-readout { min-height:28px; padding:6px 10px; margin-top:12px; background:#f4f6f3; border-radius:3px; font-size:11px; color:#6b756c; font-variant-numeric:tabular-nums; }
.mock-readout button { background:transparent; padding:0 6px; color:#506b81; cursor:pointer; text-decoration:underline; font-size:11px; }
.mock-scaling-legend p { margin:9px 0; font-size:11px; }
.mock-scaling-legend i { display:inline-block; width:24px; height:2px; margin-right:10px; vertical-align:middle; }
.mock-scaling-legend small { color:#91988e; font-size:10px; }
.mock-table-scroll { overflow:auto; max-height:440px; margin:12px -1px 0; border:1px solid var(--line); border-radius:4px; }
.mock-table-controls { display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end; margin-top:12px; }
.mock-table-controls .field { min-width:145px; }
.mock-table-controls > .mock-footnote { margin:0 0 7px; }
.mock-tables-split { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:12px; }
.mock-task-table { min-width:0; }
.mock-task-table h3 { margin:2px 0 0; font-size:13px; color:#506251; }
.mock-tables-split .mock-table-scroll { margin-top:8px; }
.mock-tables-split .mock-table-scroll table { min-width:620px; }
.mock-table-scroll table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0; white-space:nowrap; font-variant-numeric:tabular-nums; font-size:12px; }
.mock-table-scroll th, .mock-table-scroll td { padding:9px 10px; text-align:right; border-bottom:1px solid #e5e8e3; }
.mock-table-scroll thead th { position:sticky; top:0; z-index:2; background:#f4f6f3; color:#727970; font-size:11px; font-weight:600; text-align:center; }
.mock-table-scroll tbody th { position:sticky; left:0; z-index:1; background:white; text-align:left; width:180px; min-width:180px; max-width:180px; font-size:12px; }
.mock-table-scroll thead tr:first-child th:first-child { left:0; z-index:3; width:180px; min-width:180px; max-width:180px; }
.mock-table-scroll thead tr:nth-child(2) th { top:33px; min-width:62px; }
.mock-table-scroll thead tr:first-child th { height:33px; }
.mock-table-scroll thead .mock-step-head { position:sticky; left:180px; z-index:3; min-width:95px; }
.mock-table-scroll tbody td:nth-child(2) { position:sticky; left:180px; z-index:1; background:white; min-width:95px; }
.mock-sort-button { background:transparent; color:inherit; font:inherit; cursor:pointer; padding:0; }
.mock-sort-button:hover, .mock-sort-button:focus-visible { color:#375c44; text-decoration:underline; }
.mock-table-scroll .mock-dim-head { border-left:1px solid #e0e5dd; }
.mock-table-scroll tr.mock-group-start > * { border-top:2px solid #c8d3c8; }
.mock-table-scroll tr:last-child td, .mock-table-scroll tr:last-child th { border-bottom:0; }
.mock-table-scroll small { display:block; margin-top:2px; color:#969c95; font-size:10px; font-weight:400; }
.mock-table-scroll td:nth-child(2), .mock-table-scroll td:nth-child(3), .mock-table-scroll td:last-child { text-align:center; }
.mock-table-scroll .mock-avg { font-weight:600; color:#37533e; }
.mock-table-scroll .mock-phase { color:#9a865b; font-style:italic; }
.mock-table-scroll tr[data-row] { cursor:pointer; }
.mock-table-scroll tr.mock-highlight th { background:#edf3ed; }
.mock-table-scroll tr.mock-highlight td { box-shadow:inset 0 1px #a0b0a0,inset 0 -1px #a0b0a0; }
.mock-table-scroll tr.mock-pinned th { box-shadow:inset 3px 0 #547896; }
.mock-row-button { background:transparent; padding:2px 0; cursor:pointer; color:#526e87; }
.mock-state { display:inline-block; padding:3px 6px; border-radius:3px; font-size:10px; }
.mock-state.complete { color:#55705c; background:#eff3ed; }
.mock-state.tail, .mock-state.incomplete, .mock-state.audit { color:#997339; background:#faf1df; }
.mock-state.waiting { color:#838b84; background:#f0f2ef; }
.mock-source-link { color:#567891; font-size:11px; text-decoration:underline; overflow-wrap:anywhere; }
.mock-footnote { margin:12px 0 0; color:#80867e; font-size:11px; line-height:1.8; }
.mock-detail { border-left:3px solid #547896; }
.mock-detail p { margin:10px 0 5px; font-size:12px; }
.mock-detail small { color:#8d9689; font-size:10px; overflow-wrap:anywhere; }
.mock-auc-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:14px; }
.mock-auc-grid > div { padding:12px 14px; border:1px solid #e0e5dd; border-radius:4px; }
.mock-auc-grid span, .mock-auc-grid small { display:block; color:#7b8577; font-size:11px; }
.mock-auc-grid strong { display:block; margin:4px 0; color:#3d5542; font-size:23px; font-weight:600; }
.mock-source-panel summary { cursor:pointer; color:#727b6f; font-size:12px; }
.mock-source-panel p { color:#80867e; font-size:12px; }
.mock-source-panel li { margin:12px 0; color:#687560; font-size:12px; overflow-wrap:anywhere; }
.mock-source-panel li small { display:block; margin-top:4px; font-size:10px; color:#92998c; }
.mock-empty { text-align:center !important; padding:32px !important; color:#939b8c; }
.comparison-asset { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.comparison-asset p { margin:7px 0; color:#737c71; font-size:12px; }
.comparison-plan { max-width:1050px; color:#64715f; }
.comparison-plan h3 { margin:22px 0 8px; font-size:14px; color:#465342; }
.comparison-plan p, .comparison-plan li { font-size:13px; }
.comparison-plan li { margin:9px 0; }
.comparison-plan code { font-size:11px; overflow-wrap:anywhere; }
@media (max-width:1100px) {
  .mock-chart-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .mock-selection-grid { grid-template-columns:1fr; gap:14px; }
}
@media (max-width:800px) {
  .mock-chart-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mock-toolbar .field { flex:1; min-width:145px; }
  .mock-main .platform-panel { padding:14px; }
  .mock-main .platform-panel-title { flex-wrap:wrap; }
  .mock-nav { gap:12px; }
  .mock-main > .platform-heading { align-items:flex-start; }
  .mock-auc-grid { grid-template-columns:1fr; }
  .comparison-asset { align-items:flex-start; flex-direction:column; }
  .mock-tables-split { grid-template-columns:1fr; }
  .mock-table-controls .field { flex:1; }
}
@media (max-width:520px) {
  .masthead-inner { flex-wrap:wrap; padding:14px 16px; gap:12px; }
  .mock-main { padding:20px 14px 40px; }
  .mock-main .platform-heading h1 { font-size:22px; }
  .mock-chart-grid { grid-template-columns:1fr; }
  .mock-choice { padding:7px 8px; }
  .mock-step-choice { flex:1; justify-content:center; }
  .mock-segment { width:100%; }
  .mock-segment button { flex:1; }
}

.mock-dot[data-origin="a"] { background:#547896; }
.mock-dot[data-origin="b"] { background:#a77b4b; }
.mock-dot[data-origin="c"] { background:#718d74; }
.mock-scaling-legend i[data-poststep="6000"] { background:#576c7c; }
.mock-scaling-legend i[data-poststep="12000"] { background:#8c775f; }
.mock-scaling-legend i[data-poststep="30000"] { background:#6f8a79; }
.mock-scaling-legend i[data-poststep="60000"] { background:#99809b; }
.mock-table-scroll td[data-heat="low"] { background:#f7faf7; }
.mock-table-scroll td[data-heat="medium"] { background:#eef4ef; }
.mock-table-scroll td[data-heat="high"], .mock-table-scroll td[data-heat="positive"] { background:#e3eee5; }
.mock-table-scroll td[data-heat="negative"] { background:#f5ebe0; }
