/* ============================================================
   KAMI OS — LIVING UI (Cycle 2+)
   Calmer type, less visual noise, faster feel
   ============================================================ */

:root {
  --topbar-h: 56px;
  --sidebar-w: 232px;
}

/* Softer typography — less "headache" sci-fi screaming */
.page-head h1 {
  font-family: var(--font-head);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.3px;
}

.page-head .sub {
  font-size: 14px;
  line-height: 1.55;
  color: var(--text-dim);
}

.topbar-title {
  font-family: var(--font-head);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.5px;
}

.ghost-btn {
  letter-spacing: 0.4px;
  text-transform: none;
  font-size: 12px;
  height: 34px;
  padding: 0 12px;
}

.panel-head h3 {
  letter-spacing: 0.8px;
  font-size: 13px;
}

.panel {
  backdrop-filter: blur(8px);
}

.nav-item {
  padding: 9px 11px;
}

.nav-label {
  font-size: 13px;
  letter-spacing: 0.2px;
}

/* Mission banner — cleaner, less shouty */
.mission-banner {
  padding: 20px 22px !important;
  border-radius: var(--radius) !important;
}

.mission-banner .eyebrow {
  letter-spacing: 1.2px;
  font-size: 10px;
}

.mission-banner .mission-text {
  font-family: var(--font-head) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
}

/* Living system pulse in footer */
.living-pulse {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--good);
  margin-left: 8px;
}

.living-pulse .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--good);
  box-shadow: 0 0 8px var(--good);
  animation: living-breathe 2.4s ease-in-out infinite;
}

@keyframes living-breathe {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.45; transform: scale(0.85); }
}

/* Command center — income target strip */
.income-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding: 14px 18px;
  margin-bottom: 16px;
  background: linear-gradient(90deg, rgba(46, 230, 166, 0.08), rgba(0, 229, 255, 0.04));
  border: 1px solid rgba(46, 230, 166, 0.22);
  border-radius: var(--radius);
}

.income-strip .is-label {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--text-faint);
}

.income-strip .is-main {
  font-family: var(--font-head);
  font-size: 16px;
  font-weight: 600;
  margin-top: 4px;
}

.income-strip .is-gap {
  font-family: var(--font-mono);
  font-size: 22px;
  font-weight: 700;
  color: var(--warn);
}

.income-strip .is-gap.met {
  color: var(--good);
}

/* Japanese HQ — one-tap study log */
.jp-quick-log {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding-bottom: 4px;
}

/* Calendar — live NOW block */
.cal-event.cal-now {
  box-shadow: 0 0 0 1px rgba(74, 222, 128, 0.35), inset 0 0 20px rgba(74, 222, 128, 0.06);
}

@media (max-width: 680px) {
  .view { padding: 16px; }
  .topbar { padding: 0 12px; gap: 8px; }
  .ghost-btn kbd { display: none; }
}