/* On Easy v233.1 — semantic visual foundation.
   This file loads after feature CSS. It normalizes the primary product surfaces
   without changing their layout or behavior. New product UI should use these
   tokens instead of adding another near-duplicate size or radius. */

:root {
  /* Type: title · section · body · support · meta. */
  --oe-type-title: 1.75rem;
  --oe-leading-title: 1.214;
  --oe-type-section: 1.25rem;
  --oe-leading-section: 1.3;
  --oe-type-body: 1.0625rem;
  --oe-leading-body: 1.47;
  --oe-type-support: 0.9375rem;
  --oe-leading-support: 1.4;
  --oe-type-meta: 0.8125rem;
  --oe-leading-meta: 1.385;

  /* Controls: compact desktop utility · standard · prominent. */
  --oe-control-compact: 2.25rem;
  --oe-control-standard: 2.75rem;
  --oe-control-prominent: 3.25rem;

  /* Space: 4 · 8 · 12 · 16 · 24 · 32. */
  --oe-space-1: 0.25rem;
  --oe-space-2: 0.5rem;
  --oe-space-3: 0.75rem;
  --oe-space-4: 1rem;
  --oe-space-5: 1.5rem;
  --oe-space-6: 2rem;

  /* Shape and depth: controls · surfaces · circular identity only. */
  --oe-radius-control: 0.75rem;
  --oe-radius-surface: 1.125rem;
  --oe-radius-round: 999px;
  --oe-elevation-quiet: inset 0 0 0 1px var(--rule);
  --oe-elevation-raised: 0 1rem 3rem rgba(0, 0, 0, 0.42);
}

body.oe-app {
  font-size: var(--oe-type-body);
  line-height: var(--oe-leading-body);
}

/* Roster: identity first, current work second. */
.oeh-tile-name,
.oeh-row-time,
.oeh-menu-label,
.oeh-new-affordance,
.oeh-new-tip {
  font-size: var(--oe-type-meta);
  line-height: var(--oe-leading-meta);
}
.oeh-row-name {
  font-size: var(--oe-type-body);
  line-height: var(--oe-leading-body);
  letter-spacing: -0.012em;
}
.oeh-row-preview,
.oeh-empty p {
  font-size: var(--oe-type-support);
  line-height: var(--oe-leading-support);
}
.oeh-row-btn {
  min-height: var(--oe-control-prominent);
  padding: var(--oe-space-2);
  border-radius: var(--oe-radius-control);
}
.oeh-icon-btn,
.oeh-avatar,
.oeh-more,
.oeh-menu button,
.oeh-menu-input {
  min-width: var(--oe-control-standard);
  min-height: var(--oe-control-standard);
}
.oeh-icon-btn,
.oeh-menu,
.oeh-menu-input,
.oeh-empty {
  border-radius: var(--oe-radius-control);
}

/* Conversation: one readable rhythm from header through composer. */
.oe-thread-title h1 {
  font-size: var(--oe-type-support);
  line-height: var(--oe-leading-support);
}
.oe-msg {
  font-size: var(--oe-type-body);
  line-height: var(--oe-leading-body);
  border-radius: var(--oe-radius-surface);
  padding: var(--oe-space-3) var(--oe-space-4);
}
.oe-msg.is-waiting,
.oe-hint,
.oe-notice p,
.oe-mail-strip li,
.oe-starter-actions button,
.oe-thread-earlier,
.oe-thread-later {
  font-size: var(--oe-type-support);
  line-height: var(--oe-leading-support);
}
.oe-thread-banner,
.oe-icon-btn,
.btn.oe-small,
.oe-starter-actions button {
  min-height: var(--oe-control-standard);
}
.oe-thread-banner,
.oe-icon-btn,
.oe-starter-actions button {
  border-radius: var(--oe-radius-control);
}
.oe-compose {
  padding-top: var(--oe-space-4);
  padding-left: var(--oe-space-3);
  padding-right: var(--oe-space-3);
}

/* Computer: status and content lead; setup detail recedes. */
.oe-attn-kicker,
.oe-live-empty strong {
  font-size: var(--oe-type-body);
  line-height: var(--oe-leading-body);
}
.oe-attn-body,
.oe-computer-details summary,
.oe-computer-presence .oe-hint,
.oe-live-empty span,
.oe-live-caption,
.oe-live-key-status {
  font-size: var(--oe-type-support);
  line-height: var(--oe-leading-support);
}
.oe-attn,
.oe-live-thumb,
.oe-live-key-input,
.oe-live-open {
  border-radius: var(--oe-radius-control);
}
.oe-attn-skip,
.oe-attn-go,
.oe-live-key-input,
#btn-computer-keyboard,
#btn-computer-key-backspace,
.oe-computer-details summary,
.oe-live-open {
  min-height: var(--oe-control-standard);
}

/* One raised state. Ordinary panels rely on spacing and the quiet divider. */
.oeh-menu,
#computer-preview.oe-computer-rail[open] {
  box-shadow: var(--oe-elevation-raised);
}

@media (min-width: 900px) {
  /* Compact is reserved for non-primary desktop utilities. */
  .oeh-new-tip { min-height: var(--oe-control-compact); }
}

@media (prefers-reduced-motion: reduce) {
  .oeh-life,
  .oe-face,
  .oe-msg.is-waiting,
  .oe-msg.is-streaming::after {
    animation: none !important;
  }
}