/* Korean-first body text; tabular numerals keep changing voyage values steady. */
body.simple-ui {
  font-family:var(--font-body);
  font-size:var(--type-body);
  font-weight:var(--weight-regular);
  line-height:var(--leading-body);
  letter-spacing:0;
  color:var(--text-primary);
  font-kerning:normal;
  -webkit-text-size-adjust:100%;
}
.simple-ui button,.simple-ui select,.simple-ui input {font-family:var(--font-body);line-height:var(--leading-ui)}
.simple-ui h1,.simple-ui h2,.simple-ui h3 {font-family:var(--font-body);font-weight:var(--weight-semibold);line-height:var(--leading-ui);color:var(--text-primary);word-break:keep-all;letter-spacing:-.02em}
.simple-ui p,.simple-ui summary {word-break:keep-all;overflow-wrap:break-word}
.simple-ui :is(#arrival-time,#saving-percent,#total-fuel,#total-time,#current-speed,#next-speed,#segment-fuel,#required-speed,.playback-time,.instructions-table,.segment-options button,.schedule-chips button,.live-details dd) {font-family:var(--font-number);font-variant-numeric:tabular-nums lining-nums;font-feature-settings:'tnum' 1,'lnum' 1}

/* Page title, panel headings, labels and notes have distinct emphasis. */
.simple-ui .system-brand {font-size:var(--type-heading);font-weight:var(--weight-semibold);letter-spacing:-.025em;line-height:1.4}
.simple-ui .dashboard-title h2 {font-size:var(--type-page);font-weight:var(--weight-bold);letter-spacing:-.025em;line-height:1.3}
.simple-ui .dashboard-title h2 span {font-weight:var(--weight-regular);color:var(--text-secondary)}
.simple-ui .planner-summary h1 {font-size:var(--type-heading);font-weight:var(--weight-semibold)}
.simple-ui .live-voyage h3,.simple-ui .analysis-details>summary {font-size:var(--type-section);font-weight:var(--weight-semibold);line-height:1.5;color:var(--text-primary)}
.simple-ui .planner-intro,.simple-ui .route-meta {font-size:var(--type-small);line-height:1.65;color:var(--text-secondary)}
.simple-ui .screen-mode button {font-size:var(--type-note);font-weight:var(--weight-medium);line-height:1.5;letter-spacing:0}
.simple-ui .screen-mode button[aria-pressed=true] {font-weight:var(--weight-semibold)}
.simple-ui .summary-end,.simple-ui .analysis-details .summary-end {font-size:var(--type-note);font-weight:var(--weight-regular);line-height:1.5;color:var(--text-secondary)}

/* Voyage form: labels are stronger than supporting instructions. */
.simple-ui .port-fields label,.simple-ui .schedule-fields label {font-size:var(--type-small);font-weight:var(--weight-medium);line-height:1.5;color:var(--text-primary)}
.simple-ui .port-fields select {font-size:var(--type-control);font-weight:var(--weight-medium);line-height:1.35;color:var(--text-primary)}
.simple-ui .schedule-fields input {font-family:var(--font-number);font-size:var(--type-body);font-weight:var(--weight-medium);line-height:1.35;letter-spacing:0;font-variant-numeric:tabular-nums;color:var(--text-primary)}
.simple-ui .required-speed {font-size:var(--type-small);line-height:1.6;color:var(--text-secondary)}
.simple-ui .required-speed strong {font-size:var(--type-body);font-weight:var(--weight-semibold);color:var(--text-primary)}
.simple-ui .schedule-helper>summary,.simple-ui .segment-settings>summary,.simple-ui .preset-details>summary {font-size:var(--type-small);font-weight:var(--weight-medium);line-height:1.55;color:var(--text-primary)}
.simple-ui .schedule-chip-label {font-size:var(--type-note);line-height:1.6;color:var(--text-secondary)}
.simple-ui .schedule-chips button,.simple-ui .segment-options button {font-size:var(--type-small);font-weight:var(--weight-medium);line-height:1.45}
.simple-ui .schedule-chips button[aria-pressed=true],.simple-ui .segment-options button.active {font-weight:var(--weight-bold)}
.simple-ui .primary-button {font-size:var(--type-control);font-weight:var(--weight-semibold);letter-spacing:0;line-height:1.5}
.simple-ui .schedule-message,.simple-ui .form-error {font-size:var(--type-small);font-weight:var(--weight-medium);line-height:1.75;word-break:keep-all;overflow-wrap:anywhere}
.simple-ui .route-preset strong {font-size:var(--type-body);font-weight:var(--weight-medium);line-height:1.55}
.simple-ui .route-preset small {font-size:var(--type-note);line-height:1.6;color:var(--text-secondary)}

/* ETA and fuel stay visually dominant without coloring every label. */
.simple-ui .stat-label {font-size:var(--type-body);font-weight:var(--weight-medium);line-height:1.5;color:var(--text-primary)}
.simple-ui .eta-stat .arrival-time {font-size:clamp(1.25rem,1.75vw,1.625rem);font-weight:var(--weight-bold);line-height:1.4;letter-spacing:-.025em;color:var(--text-primary);overflow-wrap:normal}
.simple-ui .fuel-headline strong {font-size:var(--type-kpi);font-weight:var(--weight-bold);line-height:var(--leading-number);letter-spacing:-.035em;color:var(--accent)}
.simple-ui .fuel-headline .unit {font-size:var(--type-heading);font-weight:var(--weight-medium)}
.simple-ui .fuel-total {font-size:var(--type-small);line-height:1.5;color:var(--text-secondary)}
.simple-ui .fuel-total b {font-size:var(--type-heading);font-weight:var(--weight-semibold);line-height:1.4;color:var(--text-primary)}
.simple-ui .kpi-meta,.simple-ui .stat #saving-tonnes {font-size:var(--type-small);line-height:1.65;color:var(--text-secondary)}
.simple-ui .kpi-meta b {font-weight:var(--weight-semibold);color:var(--text-primary)}
.simple-ui .arrival-status {font-size:var(--type-note);font-weight:var(--weight-semibold);line-height:1.5;letter-spacing:0}

/* Live instructions: current speed, next speed, explanation, then context. */
.simple-ui #live-state {font-size:var(--type-note);font-weight:var(--weight-medium);line-height:1.5;letter-spacing:0;color:var(--text-secondary)}
.simple-ui .live-voyage .speed-readout strong {font-size:var(--type-speed);font-weight:var(--weight-semibold);line-height:1.1;letter-spacing:-.04em;color:var(--text-primary)}
.simple-ui .live-voyage .speed-readout span {font-size:var(--type-small);font-weight:var(--weight-medium);line-height:1.4;letter-spacing:.02em;color:var(--text-secondary)}
.simple-ui .live-voyage .current-segment {font-size:var(--type-note);font-weight:var(--weight-medium);line-height:1.55;color:var(--text-secondary)}
.simple-ui #nav-kicker {font-size:var(--type-small);font-weight:var(--weight-medium);line-height:1.55;color:var(--text-secondary)}
.simple-ui #next-speed {font-size:1.875rem;font-weight:var(--weight-bold);line-height:var(--leading-number);letter-spacing:-.025em;color:var(--accent)}
.simple-ui #next-speed small {font-family:var(--font-body);font-size:var(--type-note);font-weight:var(--weight-regular);letter-spacing:0;color:var(--text-secondary)}
.simple-ui #next-advisory {font-size:var(--type-body);font-weight:var(--weight-regular);line-height:1.75;color:var(--text-primary)}
.simple-ui #next-advisory strong {font-family:var(--font-number);font-size:var(--type-control);font-weight:var(--weight-bold);font-variant-numeric:tabular-nums;color:var(--text-primary)}
.simple-ui .recommendation {font-size:var(--type-body);line-height:var(--leading-body)}
.simple-ui .recommendation>span {font-size:var(--type-small);font-weight:var(--weight-medium);color:var(--text-secondary)}
.simple-ui .recommendation p {font-size:var(--type-body);font-weight:var(--weight-medium);line-height:1.75;color:var(--text-primary)}
.simple-ui .recommendation small {font-size:var(--type-small);font-weight:var(--weight-regular);line-height:1.65;color:var(--text-secondary)}
.simple-ui .segment-fuel-row {font-size:var(--type-small);line-height:1.6;color:var(--text-secondary)}
.simple-ui .segment-fuel-row b {font-size:var(--type-control);font-weight:var(--weight-semibold);color:var(--text-primary)}
.simple-ui .live-details {font-size:var(--type-small);line-height:1.65}
.simple-ui .live-details>summary {font-size:var(--type-small);font-weight:var(--weight-medium);color:var(--text-primary)}
.simple-ui .live-details dt {font-size:var(--type-small);font-weight:var(--weight-regular);color:var(--text-secondary)}
.simple-ui .live-details dd {font-size:var(--type-small);font-weight:var(--weight-medium);color:var(--text-primary)}
.simple-ui .live-details dd small,.simple-ui .live-details dl>div:last-child dd {font-size:var(--type-note);font-weight:var(--weight-regular);line-height:1.6}

/* Controls and map annotations remain readable at their compact scale. */
.simple-ui .play-button {font-size:var(--type-body);font-weight:var(--weight-semibold);line-height:1.5}
.simple-ui .speed-controls button,.simple-ui .speed-controls select {font-size:var(--type-note);font-weight:var(--weight-medium);line-height:1.5}
.simple-ui .playback-note,.simple-ui .playback-time {font-size:var(--type-note);font-weight:var(--weight-medium);line-height:1.6;color:var(--text-secondary)}
.simple-ui .view-switch button {font-size:var(--type-note);font-weight:var(--weight-medium);line-height:1.5}
.simple-ui .view-switch button[aria-pressed=true] {font-weight:var(--weight-semibold)}
.simple-ui .map-legend {font-size:var(--type-note);font-weight:var(--weight-medium);line-height:1.5;color:var(--text-primary)}
.simple-ui .map-legend .speed-gradient {width:48px;flex-shrink:0}
.simple-ui .port-label,.simple-ui .globe-port .port-caption {font-family:var(--font-body);font-size:var(--type-small);font-weight:var(--weight-semibold);line-height:1.5}
.simple-ui .globe-port .port-caption small {font-size:var(--type-note);font-weight:var(--weight-medium);line-height:1.4;letter-spacing:.02em}
.simple-ui .globe-ship .ship-speed-label {font-family:var(--font-number);font-size:var(--type-small);font-weight:var(--weight-semibold);line-height:1.5;font-variant-numeric:tabular-nums;letter-spacing:0}
.simple-ui .boundary-number,.simple-ui .map-segment-number {font-family:var(--font-number);font-size:var(--type-note);font-weight:var(--weight-semibold);line-height:18px;letter-spacing:0}
.simple-ui .segment-tooltip,.simple-ui .scene-tooltip {font-family:var(--font-body);font-size:var(--type-small);line-height:1.6}
.simple-ui .country-label,.simple-ui .ocean-label {font-family:var(--font-body);font-size:var(--type-note);font-weight:var(--weight-medium);line-height:1.5}
.simple-ui .ocean-label {letter-spacing:.04em}
.simple-ui .leaflet-control-attribution {font-size:.625rem!important;line-height:1.5}

/* Expanded analysis: larger table text and non-shrinking SVG tick labels. */
.simple-ui .analysis-content h3 {font-size:var(--type-control);font-weight:var(--weight-semibold);line-height:1.5}
.simple-ui .analysis-content .profile-legend,.simple-ui .analysis-content .profile-legend>span {font-size:var(--type-note);font-weight:var(--weight-medium);line-height:1.5;color:var(--text-secondary)}
.simple-ui .text-button {font-size:var(--type-small);font-weight:var(--weight-semibold);line-height:1.5;color:var(--accent)}
.simple-ui .analysis-content .chart-wrap {min-width:0;max-width:100%;overflow-x:auto;overflow-y:hidden;padding-top:20px;overscroll-behavior-x:contain;scrollbar-color:var(--line-strong) var(--surface)}
.simple-ui .analysis-content .chart-wrap svg {min-width:640px}
.simple-ui #speed-chart text {font-family:var(--font-number);font-size:var(--type-control);font-weight:var(--weight-medium);font-variant-numeric:tabular-nums;letter-spacing:0;fill:var(--text-secondary)}
.simple-ui .chart-axis-unit {top:0;font-size:var(--type-note);font-weight:var(--weight-medium);line-height:1.4;color:var(--text-secondary)}
.simple-ui .chart-caption {font-size:var(--type-note);line-height:1.6;color:var(--text-secondary)}
.simple-ui .instructions-table {font-size:var(--type-small);line-height:1.65}
.simple-ui .instructions-table th {font-family:var(--font-body);font-size:var(--type-small);font-weight:var(--weight-semibold);line-height:1.5;color:var(--text-primary)}
.simple-ui .instructions-table td {font-size:var(--type-small);font-weight:var(--weight-regular);line-height:1.65}
.simple-ui .instructions-table td:first-child,.simple-ui .instructions-table td:nth-child(5),.simple-ui .instructions-table td:nth-child(10) {font-family:var(--font-body)}
.simple-ui .instructions-table td:nth-child(6) {font-weight:var(--weight-semibold);color:var(--text-primary)}
.simple-ui .instructions-table td:nth-child(7),.simple-ui .instructions-table tr.current td:first-child {font-weight:var(--weight-semibold)}
.simple-ui .instructions-table .change-fast {color:var(--text-fast)}
.simple-ui .instructions-table .change-slow {color:var(--text-slow)}
.simple-ui .instructions-table td:nth-child(10) {color:var(--text-secondary)}
.simple-ui .dashboard-footer {font-size:var(--type-note);font-weight:var(--weight-regular);line-height:1.7;color:var(--text-secondary)}
.simple-ui .dialog-heading h2 {font-size:1.375rem;font-weight:var(--weight-semibold);line-height:1.45}
.simple-ui .dialog-heading .section-eyebrow {font-size:var(--type-note);font-weight:var(--weight-medium);letter-spacing:.04em;color:var(--text-secondary)}
.simple-ui .dialog-content {font-size:var(--type-control);font-weight:var(--weight-regular);line-height:1.85}
.simple-ui .dialog-content h3 {font-size:var(--type-heading);font-weight:var(--weight-semibold);line-height:1.5}
.simple-ui .dialog-content p {color:var(--text-secondary);word-break:keep-all;overflow-wrap:anywhere}
.simple-ui .source-item a {font-size:var(--type-body);font-weight:var(--weight-medium);line-height:1.7}
.simple-ui .source-item small {font-size:var(--type-note);line-height:1.6;color:var(--text-secondary)}
.simple-ui .source-item p {font-size:var(--type-body);line-height:1.8}

@media(max-width:1200px) {
  .simple-ui .eta-stat .arrival-time {font-size:1.25rem}
  .simple-ui .fuel-headline strong {font-size:2rem}
}
@media(max-width:800px) {
  .simple-ui .planner-summary h1 {font-size:var(--type-section)}
  .simple-ui .port-fields select,.simple-ui .schedule-fields input {font-size:1rem}
  .simple-ui .eta-stat .arrival-time {font-size:1.375rem}
}
@media(max-width:540px) {
  .simple-ui .system-brand {font-size:var(--type-section)}
  .simple-ui .screen-mode button {font-size:var(--type-note)}
  .simple-ui .dashboard-title h2 {font-size:1.625rem}
  .simple-ui .eta-stat .arrival-time {font-size:1.375rem}
  .simple-ui .fuel-headline strong {font-size:2.125rem}
  .simple-ui .fuel-total {font-size:var(--type-note)}
  .simple-ui .fuel-total b {font-size:1.0625rem}
  .simple-ui .live-voyage .speed-readout strong {font-size:2.75rem}
  .simple-ui #next-speed {font-size:1.75rem}
  .simple-ui .next-instruction-heading {flex-wrap:wrap}
  .simple-ui .recommendation p {font-size:var(--type-body);line-height:1.7}
  .simple-ui .recommendation small {font-size:var(--type-note)}
  .simple-ui .analysis-details>summary {font-size:var(--type-body)}
  .simple-ui .analysis-details .summary-end {font-size:var(--type-note)}
}
