:root {
      --mimir-bg: #f6f2ee;
      --mimir-bg-soft: #fbf8f5;
      --mimir-surface: #ffffff;
      --mimir-surface-muted: #fcfaf8;
      --mimir-border: #e7ddd5;
      --mimir-border-strong: #d8c6b8;
      --mimir-text: #151515;
      --mimir-text-soft: #5f5a56;
      --mimir-text-faint: #867f78;
      --mimir-orange: #ef5b2a;
      --mimir-orange-deep: #d54819;
      --mimir-orange-soft: #fff0e8;
      --mimir-blue: #0f5f79;
      --mimir-blue-deep: #0b4f64;
      --mimir-blue-soft: #e8f4f8;
      --mimir-danger: #b42318;
      --mimir-danger-soft: #fff2f1;
      --mimir-shadow-xs: 0 1px 2px rgba(21, 21, 21, 0.05);
      --mimir-shadow-sm: 0 12px 28px rgba(21, 21, 21, 0.06);
      --mimir-shadow-md: 0 20px 40px rgba(21, 21, 21, 0.08);
      --mimir-radius-sm: 12px;
      --mimir-radius-md: 18px;
      --mimir-radius-lg: 24px;
      font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: auto; }
    body {
      margin: 0;
      background:
        radial-gradient(circle at top left, rgba(239, 91, 42, 0.06), transparent 24%),
        linear-gradient(180deg, #f8f5f1 0%, var(--mimir-bg) 220px);
      color: var(--mimir-text);
      font-size: 11px;
    }
    button, input, textarea, select { font: inherit; }
    body.modal-open { overflow: hidden; }
    a { color: inherit; }
    .count-tag {
      min-height: 18px !important;
      padding-inline: 6px !important;
      font-size: 8px !important;
      line-height: 1 !important;
    }
    .hypothesis-character-count {
      font-size: 8px !important;
      line-height: 1.1 !important;
    }
    .app-topbar-shell {
      position: sticky;
      top: 0;
      z-index: 40;
      padding: 0 4px;
      overflow-x: clip;
      background: linear-gradient(180deg, rgba(246, 242, 238, 0.96) 0%, rgba(246, 242, 238, 0.86) 100%);
      backdrop-filter: blur(14px);
    }
    .app-topbar {
      width: min(1920px, 100%);
      max-width: 100%;
      margin: 0 auto;
      display: grid;
      grid-template-columns: minmax(0, 220px) auto minmax(0, 220px);
      align-items: center;
      gap: 12px;
      min-height: 52px;
      padding: 5px 0;
      border-bottom: 1px solid rgba(21, 21, 21, 0.08);
    }
    .app-topbar-left,
    .app-topbar-right {
      display: flex;
      align-items: center;
      min-width: 0;
    }
    .app-topbar-left { gap: 14px; }
    .app-topbar-center {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      flex-wrap: nowrap;
      min-width: 0;
    }
    .app-topbar-brand-lockup {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
    }
    .app-topbar-innova-logo {
      display: block;
      height: 32px;
      width: auto;
      max-width: 120px;
      flex: 0 0 auto;
      border-radius: 6px;
    }
    .app-topbar-brand-copy {
      display: grid;
      gap: 2px;
      min-width: 0;
    }
    .app-topbar-brand {
      margin: 0;
      font-size: 18px;
      line-height: 1;
      font-weight: 800;
      letter-spacing: -0.03em;
      color: var(--mimir-text);
    }
    .app-topbar-module {
      color: var(--mimir-text-soft);
      font-size: 8px;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      white-space: nowrap;
    }
    .app-topbar-right {
      justify-content: flex-end;
      gap: 12px;
    }
    .app-topbar-user {
      display: inline-flex;
      align-items: center;
      min-height: 32px;
      padding: 0 12px;
      border-radius: 999px;
      border: 1px solid rgba(15, 95, 121, 0.14);
      background: rgba(255, 255, 255, 0.72);
      color: var(--mimir-text-soft);
      font-size: 8.5px;
      white-space: nowrap;
    }
    .app-topbar-btn,
    .app-topbar-btn:visited {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 34px;
      padding: 0 12px;
      border: 1px solid transparent;
      border-radius: 999px;
      background: transparent;
      color: var(--mimir-text-soft);
      text-decoration: none;
      cursor: pointer;
      font-size: 8.5px;
      line-height: 1;
      font-weight: 600;
      transition:
        color 0.16s ease,
        background-color 0.16s ease,
        border-color 0.16s ease,
        transform 0.16s ease,
        box-shadow 0.16s ease;
      white-space: nowrap;
    }
    .app-topbar-btn:hover,
    .app-topbar-btn:focus-visible {
      background: rgba(15, 95, 121, 0.06);
      border-color: rgba(15, 95, 121, 0.14);
      color: var(--mimir-text);
      outline: none;
    }
    .app-topbar-btn.active,
    .app-topbar-btn.active:visited {
      background: var(--mimir-orange-soft);
      color: var(--mimir-orange-deep);
      border-color: rgba(239, 91, 42, 0.24);
      box-shadow: 0 8px 18px rgba(239, 91, 42, 0.14);
    }
    .app-topbar-btn.disabled,
    .app-topbar-btn[disabled] {
      background: rgba(255, 255, 255, 0.54) !important;
      color: #b1aaa4 !important;
      border-color: transparent !important;
      cursor: not-allowed !important;
      pointer-events: none;
      box-shadow: none !important;
    }
    .app-topbar-btn-logout,
    .app-topbar-btn-logout:visited {
      min-width: 0;
      padding-inline: 10px;
      border-color: rgba(21, 21, 21, 0.08);
      background: rgba(255, 255, 255, 0.78);
      color: var(--mimir-text-soft);
      box-shadow: var(--mimir-shadow-xs);
    }
    .app-topbar-btn-logout:hover,
    .app-topbar-btn-logout:focus-visible {
      border-color: rgba(21, 21, 21, 0.14);
      background: #ffffff;
      color: var(--mimir-text);
    }
    @media (max-width: 1180px) {
      .app-topbar {
        grid-template-columns: minmax(0, 1fr);
        justify-items: stretch;
        gap: 12px;
        padding: 14px 0 16px;
      }
      .app-topbar-left,
      .app-topbar-center,
      .app-topbar-right {
        justify-content: space-between;
      }
      .app-topbar-center {
        justify-content: flex-start;
        flex-wrap: wrap;
      }
    }
    @media (max-width: 720px) {
      .app-topbar-shell { padding: 0 10px; }
      .app-topbar {
        min-height: auto;
        gap: 8px;
      }
      .app-topbar-left,
      .app-topbar-right {
        flex-wrap: wrap;
      }
      .app-topbar-user { width: 100%; justify-content: center; }
      .app-topbar-btn,
      .app-topbar-btn:visited { min-height: 38px; padding-inline: 12px; }
      .app-topbar-innova-logo {
        height: 28px;
      }
    }
