/* Modular Geodesic Tessellation Observatory: arithmetic-first chamber skin. */
.page-modular-geodesic-tessellation-observatory main { overflow: clip; }
.mgt-app {
    --mgt-ink: #e7f4f4;
    --mgt-muted: #8aa9b0;
    --mgt-line: rgba(122, 210, 221, .26);
    --mgt-accent: #75e6d1;
    --mgt-gold: #ffc96a;
    --mgt-violet: #bfa5ff;
    --mgt-deep: #061923;
    color: var(--mgt-ink);
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 24px 56px;
}
.mgt-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.42fr) minmax(320px, .58fr);
    gap: 20px;
    align-items: start;
}
.mgt-stage, .mgt-controls, .mgt-readouts, .mgt-diagnostics, .mgt-ledger,
.mgt-notes article, .mgt-guide, .mgt-formula-note {
    background: linear-gradient(135deg, rgba(9, 39, 52, .9), rgba(4, 19, 29, .97));
    border: 1px solid var(--mgt-line);
    box-shadow: 0 16px 42px rgba(0, 0, 0, .18);
}
.mgt-stage { padding: clamp(18px, 3vw, 30px); }
.mgt-stage__head, .mgt-card-head, .mgt-controls__head {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
}
.mgt-route-chip, .mgt-stage .eyebrow, .mgt-card-head .eyebrow {
    margin: 0 0 8px;
    color: var(--mgt-accent);
    font-size: .72rem;
    letter-spacing: .14em;
    font-weight: 700;
}
.mgt-stage h2, .mgt-controls h2, .mgt-readouts h2, .mgt-diagnostics h2,
.mgt-ledger h2, .mgt-notes h2, .mgt-guide h2 {
    margin: 0;
    color: #f3ffff;
    font-size: clamp(1.08rem, 2vw, 1.55rem);
    line-height: 1.2;
}
.mgt-stage__head p:not(.eyebrow):not(.mgt-route-chip) {
    max-width: 70ch;
    margin: 12px 0 0;
    color: var(--mgt-muted);
    line-height: 1.65;
}
.mgt-state-badge, .mgt-readout-badge {
    display: inline-flex;
    min-width: 78px;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(117, 230, 209, .45);
    color: var(--mgt-accent);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .1em;
    white-space: nowrap;
}
.mgt-state-badge[data-state="dirty"] { color: var(--mgt-gold); border-color: rgba(255, 201, 106, .58); }
.mgt-state-badge[data-state="running"] { color: var(--mgt-violet); border-color: rgba(191, 165, 255, .58); }
.mgt-state-badge[data-state="computed"] { color: #baf6ae; border-color: rgba(186, 246, 174, .58); }
.mgt-canvas-frame {
    position: relative;
    margin-top: 22px;
    overflow: hidden;
    border: 1px solid rgba(117, 230, 209, .28);
    background: var(--mgt-deep);
}
#mgtCanvas {
    display: block;
    width: 100%;
    height: auto;
    min-height: 280px;
    aspect-ratio: 5 / 3;
    outline: none;
    touch-action: none;
}
#mgtCanvas:focus-visible { box-shadow: inset 0 0 0 3px rgba(255, 201, 106, .88); }
.mgt-canvas-legend {
    position: absolute;
    right: 14px;
    bottom: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    color: #c9e7e7;
    font-size: .72rem;
    pointer-events: none;
}
.mgt-canvas-legend span { display: inline-flex; gap: 6px; align-items: center; }
.mgt-canvas-legend i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.mgt-legend-domain { background: var(--mgt-accent); }
.mgt-legend-ford { background: var(--mgt-gold); }
.mgt-legend-itinerary { background: var(--mgt-violet); }
.mgt-canvas-fallback {
    margin-top: 16px;
    padding: 14px;
    border-left: 3px solid var(--mgt-gold);
    background: rgba(255, 201, 106, .08);
    color: #d7ecec;
}
.mgt-canvas-fallback p { margin: 6px 0 0; color: var(--mgt-muted); }
#mgtFallbackSummary { margin-top: 8px; font: .82rem/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; }
.mgt-canvas-help, .mgt-live { color: var(--mgt-muted); font-size: .82rem; line-height: 1.55; }
.mgt-canvas-help { margin: 12px 0 0; }
.mgt-live { min-height: 1.4em; margin: 6px 0 0; color: #c8e8e3; }
.mgt-metrics, .mgt-readout-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
    margin: 20px 0 0;
}
.mgt-metrics div, .mgt-readout-grid div {
    min-width: 0;
    padding: 11px 12px;
    border: 1px solid rgba(122, 210, 221, .17);
    background: rgba(4, 18, 27, .46);
}
.mgt-metrics dt, .mgt-readout-grid dt { color: var(--mgt-muted); font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; }
.mgt-metrics dd, .mgt-readout-grid dd {
    margin: 5px 0 0;
    color: #f0fff9;
    font: 700 .94rem/1.2 ui-monospace, SFMono-Regular, Consolas, monospace;
    overflow-wrap: anywhere;
}
.mgt-controls { padding: 20px; }
.mgt-controls__head { align-items: center; }
.mgt-controls__head h2 { font-size: 1.15rem; }
.mgt-control-group { margin-top: 18px; padding-top: 16px; border-top: 1px solid rgba(122, 210, 221, .16); }
.mgt-section-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.mgt-section-heading h3, .mgt-shortcut-note h3 { margin: 0; color: #dff7f1; font-size: .76rem; letter-spacing: .12em; }
.mgt-section-heading span { color: var(--mgt-accent); font: 700 .78rem ui-monospace, SFMono-Regular, Consolas, monospace; }
.mgt-mode-grid, .mgt-action-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.mgt-mode-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.mgt-controls button, .mgt-output-row button {
    min-width: 0;
    min-height: 44px;
    border: 1px solid rgba(122, 210, 221, .3);
    background: rgba(9, 42, 48, .64);
    color: #e7fbf5;
    cursor: pointer;
    font: inherit;
    font-size: .72rem;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: .06em;
    transition: border-color .16s ease, background-color .16s ease, transform .16s ease;
}
.mgt-controls button:hover, .mgt-output-row button:hover { border-color: var(--mgt-accent); background: rgba(20, 75, 74, .72); }
.mgt-controls button:active, .mgt-output-row button:active { transform: translateY(1px); }
.mgt-controls button:focus-visible, .mgt-output-row button:focus-visible { outline: 3px solid rgba(255, 201, 106, .86); outline-offset: 2px; }
.mgt-controls button.is-active, .mgt-controls button.primary-control {
    border-color: var(--mgt-accent);
    background: rgba(33, 128, 111, .78);
    color: #fff;
}
.mgt-controls button.danger-control { border-color: rgba(255, 201, 106, .46); }
.mgt-range-label { display: flex; justify-content: space-between; gap: 12px; align-items: center; color: #e1f4ef; font-size: .84rem; }
.mgt-range-label output { color: var(--mgt-accent); font: 700 .78rem ui-monospace, SFMono-Regular, Consolas, monospace; }
.mgt-controls input[type="range"] { width: 100%; min-height: 44px; accent-color: var(--mgt-accent); }
.mgt-control-help { margin: 8px 0 0; color: var(--mgt-muted); font-size: .76rem; line-height: 1.5; }
.mgt-action-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mgt-action-grid button:first-child { grid-column: span 2; }
.mgt-shortcut-note { margin-top: 18px; padding-top: 16px; border-top: 1px solid rgba(122, 210, 221, .16); }
.mgt-shortcut-note p { margin: 8px 0 0; color: var(--mgt-muted); font-size: .77rem; line-height: 1.55; }
.mgt-shortcut-note kbd { padding: 3px 6px; border: 1px solid rgba(117, 230, 209, .32); background: rgba(0, 0, 0, .25); color: #f4fff9; font: .72rem ui-monospace, SFMono-Regular, Consolas, monospace; }
.mgt-results { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); gap: 20px; margin-top: 20px; }
.mgt-readouts, .mgt-diagnostics, .mgt-ledger { padding: 22px; }
.mgt-readout-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mgt-readout-grid .is-wide { grid-column: 1 / -1; }
.mgt-note { margin: 14px 0 0; color: var(--mgt-muted); font-size: .78rem; line-height: 1.55; }
.mgt-table-wrap { overflow-x: auto; margin-top: 14px; }
.mgt-table-wrap table { width: 100%; min-width: 430px; border-collapse: collapse; font-size: .76rem; }
.mgt-table-wrap th, .mgt-table-wrap td { padding: 9px 8px; border-bottom: 1px solid rgba(122, 210, 221, .15); text-align: left; vertical-align: top; }
.mgt-table-wrap th { color: var(--mgt-accent); font-size: .68rem; letter-spacing: .08em; }
.mgt-table-wrap td { color: #d7eeee; }
.mgt-table-wrap code, .mgt-formula code { font: .78rem ui-monospace, SFMono-Regular, Consolas, monospace; color: #fff5c6; }
.mgt-output-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }
.mgt-output-row button:disabled { opacity: .42; cursor: not-allowed; }
.mgt-report-details { margin-top: 12px; color: var(--mgt-muted); }
.mgt-report-details summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; color: var(--mgt-accent); }
#mgtReportOutput { max-height: 280px; overflow: auto; margin: 8px 0 0; padding: 12px; white-space: pre-wrap; overflow-wrap: anywhere; background: rgba(0, 0, 0, .26); color: #dcf8ef; font: .74rem/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; }
.mgt-ledger { margin-top: 20px; }
.mgt-ledger .mgt-table-wrap table { min-width: 600px; }
.mgt-notes, .mgt-formula-wrap { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 20px; }
.mgt-notes article, .mgt-guide, .mgt-formula-note { padding: 22px; }
.mgt-notes h2, .mgt-guide h2 { font-size: 1.05rem; }
.mgt-notes p, .mgt-guide p, .mgt-notes li, .mgt-guide li { color: var(--mgt-muted); font-size: .8rem; line-height: 1.62; }
.mgt-notes ul, .mgt-guide ul { margin: 12px 0 0; padding-left: 1.1rem; }
.mgt-formula-wrap { grid-template-columns: minmax(0, 1fr) minmax(280px, .8fr); }
.mgt-formula-note summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; color: var(--mgt-accent); font-weight: 700; }
.mgt-formula-note p { color: var(--mgt-muted); font-size: .8rem; line-height: 1.6; }
.mgt-guide__local { color: var(--mgt-accent) !important; }
.mgt-lower-grid { max-width: 1440px; margin: 0 auto; padding: 0 24px; }
.mgt-png-link[hidden] { display: none; }
@media (max-width: 1050px) {
    .mgt-layout, .mgt-results { grid-template-columns: 1fr; }
    .mgt-controls { order: 2; }
    .mgt-notes { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .mgt-app, .mgt-lower-grid { padding-left: 14px; padding-right: 14px; }
    .mgt-stage, .mgt-controls, .mgt-readouts, .mgt-diagnostics, .mgt-ledger, .mgt-notes article, .mgt-guide, .mgt-formula-note { padding: 16px; }
    .mgt-stage__head, .mgt-card-head, .mgt-controls__head { flex-direction: column; }
    .mgt-state-badge, .mgt-readout-badge { align-self: flex-start; }
    .mgt-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mgt-readout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mgt-mode-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mgt-canvas-legend { position: static; padding: 10px; border-top: 1px solid rgba(122, 210, 221, .14); }
    .mgt-table-wrap table { min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .mgt-controls button, .mgt-output-row button { transition: none; }
}