/* === HAVEN OS — Mobile-first design system === */

:root {
  color-scheme: light;
  /* Inherited from Havenwork palette */
  --bg: #f3efe3;
  --panel: rgba(255, 251, 242, 0.92);
  --ink: #203126;
  --muted: #566b59;
  --accent: #a55a2a;
  --accent-soft: #d6bca0;
  --line: rgba(32, 49, 38, 0.12);
  --shadow: 0 4px 16px rgba(43, 56, 43, 0.10);
  --shadow-lg: 0 16px 40px rgba(43, 56, 43, 0.14);

  /* Haven status colors */
  --green: #3a7d44;
  --green-bg: rgba(58, 125, 68, 0.10);
  --yellow: #c8972a;
  --yellow-bg: rgba(200, 151, 42, 0.12);
  --red: #c44536;
  --red-bg: rgba(196, 69, 54, 0.10);
  --blue: #2a6a8a;
  --blue-bg: rgba(42, 106, 138, 0.10);

  /* Layout */
  --nav-height: 64px;
  --header-height: 52px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --radius: 18px;
  --radius-sm: 10px;
  --radius-full: 999px;
}

* {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

body {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 16px;
  color: var(--ink);
  background: linear-gradient(160deg, #f8f3e8 0%, var(--bg) 100%);
  min-height: 100dvh;
  overflow-x: hidden;
}

/* ===== SHELL ===== */

.haven-app {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
  max-width: 600px;
  margin: 0 auto;
}

/* ===== HEADER ===== */

.haven-header {
  position: sticky;
  top: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--header-height);
  padding: 0 1rem;
  background: rgba(248, 243, 232, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}

.haven-wordmark {
  margin: 0;
  font-size: 1.25rem;
  font-weight: normal;
  letter-spacing: 0.04em;
  color: var(--ink);
}

.settings-btn {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.5rem;
  font-size: 1.2rem;
  color: var(--muted);
  border-radius: var(--radius-sm);
  min-width: 44px;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.settings-btn:hover { background: var(--line); }

/* ===== MAIN CONTENT ===== */

.haven-main {
  flex: 1;
  overflow-y: auto;
  padding-bottom: calc(var(--nav-height) + var(--safe-bottom) + 1rem);
}

.haven-screen {
  display: none;
  padding: 1rem;
  animation: fadeIn 0.18s ease;
}

.haven-screen.active {
  display: block;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ===== BOTTOM NAV ===== */

.haven-nav {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 600px;
  height: calc(var(--nav-height) + var(--safe-bottom));
  padding-bottom: var(--safe-bottom);
  background: rgba(248, 243, 232, 0.95);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-top: 1px solid var(--line);
  display: flex;
  align-items: stretch;
  z-index: 100;
}

.nav-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--muted);
  font-family: inherit;
  font-size: 0.7rem;
  padding: 0.5rem 0.25rem;
  border-radius: var(--radius-sm);
  transition: color 0.15s;
}

.nav-item.active {
  color: var(--accent);
}

.nav-icon {
  font-size: 1.35rem;
  line-height: 1;
}

.nav-label {
  font-size: 0.65rem;
  letter-spacing: 0.03em;
}

/* ===== OVERLAYS ===== */

.overlay {
  position: fixed;
  inset: 0;
  z-index: 200;
  background: rgba(32, 49, 38, 0.45);
  display: flex;
  align-items: flex-end;
  padding: 0;
}

.overlay.hidden {
  display: none;
}

.overlay-sheet {
  background: var(--bg);
  border-radius: var(--radius) var(--radius) 0 0;
  width: 100%;
  max-height: 90dvh;
  overflow-y: auto;
  padding: 1.5rem 1rem calc(2rem + var(--safe-bottom));
}

.overlay-handle {
  width: 36px;
  height: 4px;
  background: var(--accent-soft);
  border-radius: var(--radius-full);
  margin: 0 auto 1.25rem;
}

.overlay-close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  background: none;
  border: none;
  font-size: 1.4rem;
  cursor: pointer;
  color: var(--muted);
  min-width: 44px;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ===== COMMON COMPONENTS ===== */

.screen-title {
  margin: 0 0 1rem;
  font-size: 1.4rem;
  font-weight: normal;
}

.empty-state {
  text-align: center;
  padding: 2.5rem 1rem;
  color: var(--muted);
}

.muted {
  color: var(--muted);
}

/* Buttons */
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 1.5rem;
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-full);
  font-family: inherit;
  font-size: 1rem;
  cursor: pointer;
  min-height: 44px;
  transition: opacity 0.15s;
}

.btn-primary:hover { opacity: 0.88; }

.btn-ghost {
  display: inline-flex;
  align-items: center;
  padding: 0.6rem 1rem;
  background: transparent;
  color: var(--accent);
  border: 1px solid var(--accent-soft);
  border-radius: var(--radius-full);
  font-family: inherit;
  font-size: 0.9rem;
  cursor: pointer;
  min-height: 44px;
}

.btn-danger {
  background: var(--red);
  color: #fff;
  border: none;
  border-radius: var(--radius-full);
  font-family: inherit;
  font-size: 0.95rem;
  padding: 0.7rem 1.25rem;
  cursor: pointer;
  min-height: 44px;
}

.btn-success {
  background: var(--green);
  color: #fff;
  border: none;
  border-radius: var(--radius-full);
  font-family: inherit;
  font-size: 0.9rem;
  padding: 0.55rem 1rem;
  cursor: pointer;
}

.btn-sm {
  font-size: 0.85rem;
  padding: 0.45rem 0.85rem;
  min-height: 36px;
}

/* Form fields */
.field-label {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  font-size: 0.9rem;
  color: var(--muted);
  margin-bottom: 1rem;
}

.field-input,
.field-textarea,
.field-select {
  font-family: inherit;
  font-size: 1rem;
  color: var(--ink);
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 0.7rem 0.85rem;
  width: 100%;
  outline: none;
  transition: border-color 0.15s;
}

.field-input:focus,
.field-textarea:focus,
.field-select:focus {
  border-color: var(--accent);
}

.field-textarea { resize: vertical; min-height: 80px; }

/* Cards */
.card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1rem;
  box-shadow: var(--shadow);
}

/* ===== COMPASS ===== */

.compass-view {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0.5rem 0 1.5rem;
  gap: 1.25rem;
}

.compass-greeting {
  text-align: center;
  width: 100%;
}

.greeting-phase {
  margin: 0 0 0.2rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent);
}

.greeting-text {
  margin: 0 0 0.2rem;
  font-size: 1.4rem;
  font-weight: normal;
}

.greeting-date {
  margin: 0;
  font-size: 0.9rem;
  color: var(--muted);
}

/* Compass ring */
.compass-ring {
  width: 140px;
  height: 140px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 6px solid var(--green);
  background: var(--panel);
  box-shadow: var(--shadow-lg);
  transition: border-color 0.3s;
}

.compass-ring.guardrail-ring-green { border-color: var(--green); }
.compass-ring.guardrail-ring-yellow { border-color: var(--yellow); }
.compass-ring.guardrail-ring-red { border-color: var(--red); }

.compass-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.energy-num {
  font-size: 2.5rem;
  line-height: 1;
  color: var(--ink);
}

.energy-label {
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}

/* Check-in pips */
.checkin-status-row {
  display: flex;
  gap: 1.5rem;
}

.checkin-pip {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.pip-dot {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid var(--accent-soft);
  background: transparent;
  transition: background 0.2s;
}

.pip-done .pip-dot {
  background: var(--green);
  border-color: var(--green);
}

.pip-label {
  font-size: 0.68rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}

/* Check-in CTA */
.btn-checkin-now {
  padding: 0.85rem 1.75rem;
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-full);
  font-family: inherit;
  font-size: 1rem;
  cursor: pointer;
  min-height: 52px;
}

/* Stat chips */
.compass-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  width: 100%;
}

.stat-chip {
  font-size: 0.82rem;
  padding: 0.3rem 0.85rem;
  border-radius: var(--radius-full);
}

.stat-chip-clear   { background: var(--green-bg); color: var(--green); }
.stat-chip-warning { background: var(--yellow-bg); color: var(--yellow); }
.stat-chip-danger  { background: var(--red-bg); color: var(--red); }
.stat-chip-info    { background: var(--blue-bg); color: var(--blue); }

/* Cottage badge */
.cottage-closed-badge {
  font-size: 0.88rem;
  color: var(--muted);
  padding: 0.3rem 0.75rem;
  background: var(--green-bg);
  border-radius: var(--radius-full);
}

/* Living World stub */
.living-world-stub {
  width: 100%;
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  padding: 1rem;
  text-align: center;
}

.stub-label {
  margin: 0 0 0.25rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent-soft);
}

.stub-note {
  margin: 0;
  font-size: 0.85rem;
  color: var(--muted);
}

/* ===== CHECK-INS ===== */

.checkin-page {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.checkin-tabs {
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
  padding-bottom: 0.25rem;
}

.tab-btn {
  flex-shrink: 0;
  padding: 0.5rem 1rem;
  border-radius: var(--radius-full);
  border: 1px solid var(--line);
  background: var(--panel);
  font-family: inherit;
  font-size: 0.9rem;
  color: var(--muted);
  cursor: pointer;
  min-height: 40px;
}

.tab-btn.tab-active { border-color: var(--accent); color: var(--accent); }
.tab-btn.tab-done { background: var(--green-bg); border-color: var(--green); color: var(--green); }

.checkin-forms {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.checkin-block {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.25rem;
  box-shadow: var(--shadow);
}

.checkin-block.checkin-done {
  background: var(--green-bg);
  border-color: var(--green);
}

.checkin-block.checkin-locked {
  opacity: 0.55;
}

.checkin-period-title {
  margin: 0 0 0.4rem;
  font-size: 1.1rem;
  font-weight: normal;
}

.checkin-prompt {
  margin: 0 0 1rem;
  color: var(--muted);
  font-size: 0.95rem;
}

.checkin-label {
  margin: 0 0 0.4rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--green);
}

/* Scale inputs */
.scale-field {
  border: none;
  padding: 0;
  margin: 0 0 1rem;
}

.scale-field legend {
  font-size: 0.9rem;
  color: var(--muted);
  margin-bottom: 0.5rem;
}

.scale-row {
  display: flex;
  gap: 0.5rem;
}

.scale-option {
  flex: 1;
  cursor: pointer;
}

.scale-option input[type="radio"] {
  display: none;
}

.scale-option span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--panel);
  font-size: 1rem;
  color: var(--muted);
  transition: background 0.15s, color 0.15s;
}

.scale-option input:checked + span {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

/* Close cottage button in checkin */
.close-cottage-btn {
  margin-top: 0.5rem;
  width: 100%;
}

/* ===== LEDGER ===== */

.ledger-page {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.ledger-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.ledger-group { }

.ledger-date {
  margin: 0 0 0.6rem;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--muted);
  letter-spacing: 0.04em;
}

.ledger-entries {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.ledger-entry {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 0.75rem 1rem;
  border-left: 3px solid var(--accent-soft);
}

.ledger-entry.entry-checkin  { border-left-color: var(--green); }
.ledger-entry.entry-red_lever { border-left-color: var(--red); }
.ledger-entry.entry-carryover { border-left-color: var(--yellow); }
.ledger-entry.entry-warden   { border-left-color: var(--blue); }

.entry-type {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 0.2rem;
}

.entry-summary {
  margin: 0;
  font-size: 0.95rem;
}

.entry-detail {
  margin: 0.3rem 0 0;
  font-size: 0.85rem;
  color: var(--muted);
}

/* ===== HEAT MAP ===== */

.heatmap-page {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.heatmap-subtitle {
  margin: -0.5rem 0 0;
  color: var(--muted);
  font-size: 0.9rem;
}

.heatmap-avg {
  margin: 0;
  font-size: 0.9rem;
  color: var(--muted);
}

.heatmap-legend {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.legend-label {
  font-size: 0.75rem;
  color: var(--muted);
  margin-left: 0.2rem;
}

.heatmap-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}

.heatmap-cell {
  aspect-ratio: 1;
  border-radius: 4px;
  min-width: 0;
}

.heatmap-empty  { background: rgba(32, 49, 38, 0.07); }
.heatmap-low    { background: rgba(196, 69, 54, 0.35); }
.heatmap-mid    { background: rgba(200, 151, 42, 0.55); }
.heatmap-high   { background: var(--green); }

.heatmap-trend {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1rem;
}

.trend-title {
  margin: 0 0 0.5rem;
  font-size: 0.9rem;
}

.heatmap-trend p {
  margin: 0.25rem 0 0;
  font-size: 0.9rem;
  color: var(--muted);
}

/* ===== WARDEN ===== */

.warden-page {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.warden-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.warden-report-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1rem;
  box-shadow: var(--shadow);
}

.report-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}

.report-date {
  margin: 0;
  font-size: 1rem;
  font-weight: normal;
}

.report-badge {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.2rem 0.65rem;
  border-radius: var(--radius-full);
}

.badge-green  { background: var(--green-bg); color: var(--green); }
.badge-yellow { background: var(--yellow-bg); color: var(--yellow); }

.report-stats {
  display: flex;
  gap: 1.25rem;
  margin-bottom: 0.75rem;
}

.stat {
  display: flex;
  flex-direction: column;
}

.stat-val {
  font-size: 1.4rem;
  line-height: 1;
  color: var(--ink);
}

.stat-label {
  font-size: 0.7rem;
  color: var(--muted);
  letter-spacing: 0.04em;
}

.report-rec {
  margin: 0;
  font-size: 0.9rem;
  color: var(--muted);
  line-height: 1.55;
}

/* ===== RED LEVER ===== */

.redlever-page {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.add-lever-form {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.form-title {
  margin: 0 0 0.25rem;
  font-size: 1rem;
  font-weight: normal;
}

.section-label {
  margin: 0 0 0.5rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
}

.lever-section {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.lever-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1rem;
  border-left: 4px solid var(--accent-soft);
}

.lever-card.lever-critical { border-left-color: var(--red); }
.lever-card.lever-high     { border-left-color: var(--yellow); }
.lever-card.lever-medium   { border-left-color: var(--accent); }
.lever-card.lever-low      { border-left-color: var(--muted); }

.lever-top {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}

.lever-badge {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 0.15rem 0.5rem;
  border-radius: var(--radius-full);
}

.lever-badge-critical { background: var(--red-bg); color: var(--red); }
.lever-badge-high     { background: var(--yellow-bg); color: var(--yellow); }
.lever-badge-medium   { background: rgba(165, 90, 42, 0.12); color: var(--accent); }
.lever-badge-low      { background: rgba(86, 107, 89, 0.1); color: var(--muted); }

.lever-status {
  font-size: 0.75rem;
  color: var(--muted);
  margin-left: auto;
}

.lever-age {
  font-size: 0.75rem;
  color: var(--muted);
}

.lever-title {
  margin: 0 0 0.3rem;
  font-size: 1rem;
}

.lever-desc {
  margin: 0 0 0.4rem;
  font-size: 0.88rem;
  color: var(--muted);
}

.lever-meta {
  margin: 0 0 0.6rem;
  font-size: 0.75rem;
  color: var(--muted);
}

.lever-resolve-row {
  margin-bottom: 0.5rem;
}

.lever-resolve-row .field-input {
  font-size: 0.85rem;
  padding: 0.4rem 0.65rem;
}

.lever-actions {
  display: flex;
  gap: 0.5rem;
}

.lever-resolution {
  margin: 0.5rem 0 0;
  font-size: 0.82rem;
  color: var(--green);
}

/* ===== CARRYOVER ===== */

.carryover-page {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.add-form {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: flex-end;
}

.carryover-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1rem;
  border-left: 3px solid var(--accent-soft);
}

.carryover-card.co-high {
  border-left-color: var(--yellow);
}

.co-text {
  margin: 0 0 0.3rem;
  font-size: 1rem;
}

.co-meta {
  margin: 0 0 0.6rem;
  font-size: 0.78rem;
  color: var(--muted);
}

.co-actions {
  display: flex;
  gap: 0.5rem;
}

/* ===== SETTINGS ===== */

.settings-title {
  margin: 0 0 0.4rem;
  font-size: 1.3rem;
  font-weight: normal;
}

.settings-description {
  margin: 0 0 1.25rem;
  font-size: 0.9rem;
  color: var(--muted);
}

.settings-subtitle {
  margin: 1.25rem 0 0.75rem;
  font-size: 1rem;
  font-weight: normal;
}

.settings-section {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.settings-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
}

.settings-label {
  font-size: 0.95rem;
  color: var(--ink);
}

.settings-input,
.settings-select {
  font-family: inherit;
  font-size: 0.9rem;
  color: var(--ink);
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 0.4rem 0.65rem;
  max-width: 160px;
}

/* Guardrails */
.guardrail-status {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9rem;
  padding: 0.6rem 0.9rem;
  border-radius: var(--radius-full);
  margin-bottom: 0.75rem;
}

.guardrail-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.guardrail-clear  .guardrail-dot { background: var(--green); }
.guardrail-caution .guardrail-dot { background: var(--yellow); }
.guardrail-clear  { background: var(--green-bg); color: var(--green); }
.guardrail-caution { background: var(--yellow-bg); color: var(--yellow); }

.guardrail-alerts {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-bottom: 0.75rem;
}

.alert {
  margin: 0;
  font-size: 0.88rem;
  padding: 0.5rem 0.75rem;
  border-radius: var(--radius-sm);
}

.alert-warning { background: var(--yellow-bg); color: var(--yellow); }
.alert-info    { background: var(--blue-bg); color: var(--blue); }

/* ===== COTTAGE ===== */

.cottage-view {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  text-align: center;
}

.cottage-icon {
  font-size: 3rem;
}

.cottage-title {
  margin: 0;
  font-size: 1.4rem;
  font-weight: normal;
}

.cottage-subtitle {
  margin: -0.5rem 0 0;
  color: var(--muted);
  font-size: 0.95rem;
}

.cottage-note {
  margin: 0;
  font-style: italic;
  color: var(--muted);
}

.cottage-checklist {
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
  text-align: left;
}

.cottage-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.7rem 0;
  border-bottom: 1px solid var(--line);
}

.item-check {
  font-size: 1.1rem;
  color: var(--muted);
  flex-shrink: 0;
}

.item-done .item-check { color: var(--green); }

.item-label {
  font-size: 0.95rem;
}

.item-hint {
  margin-left: auto;
  font-size: 0.75rem;
  color: var(--yellow);
}

.cottage-warning {
  font-size: 0.88rem;
  color: var(--yellow);
  margin: 0;
}

.cottage-close-form {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.cottage-closed .cottage-title { color: var(--green); }

/* ===== DATA IMPORT / EXPORT ===== */

.import-page {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.import-section {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.import-heading {
  margin: 0 0 0.25rem;
  font-size: 1rem;
  font-weight: normal;
  color: var(--ink);
}

.import-desc {
  margin: 0 0 0.5rem;
  font-size: 0.88rem;
  color: var(--muted);
}

.import-file-label {
  display: inline-block;
  cursor: pointer;
}

.import-banner {
  margin: 0.5rem 0 0;
  font-size: 0.88rem;
  padding: 0.5rem 0.75rem;
  border-radius: var(--radius-sm);
}

.import-ok  { background: var(--green-bg); color: var(--green); display: block !important; }
.import-err { background: var(--red-bg); color: var(--red); display: block !important; }

.import-snapshot-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.import-snapshot-label {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--blue);
}

.import-snapshot-detail {
  margin: 0;
  font-size: 0.9rem;
}

.import-snapshot-keys {
  margin: 0;
  font-size: 0.8rem;
  color: var(--muted);
  font-family: monospace;
  word-break: break-all;
}

.import-snapshot-note {
  margin: 0.25rem 0 0.5rem;
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.5;
}

.import-snapshot-note code {
  background: rgba(32, 49, 38, 0.07);
  padding: 0.1em 0.35em;
  border-radius: 3px;
  font-size: 0.78rem;
}

/* ===== RESPONSIVE ===== */

@media (min-width: 640px) {
  .haven-screen {
    padding: 1.5rem;
  }

  .compass-ring {
    width: 160px;
    height: 160px;
  }

  .heatmap-grid {
    gap: 6px;
  }

  .report-stats {
    gap: 2rem;
  }
}

@media (min-width: 1024px) {
  .haven-app {
    display: grid;
    grid-template-columns: 15rem minmax(0, 1fr);
    grid-template-rows: auto auto minmax(0, 1fr);
    width: min(calc(100% - 2rem), 1440px);
    max-width: 1440px;
    height: 100dvh;
    min-height: 100dvh;
  }

  .haven-header {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .harbormaster-shell {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .haven-main {
    grid-column: 2;
    grid-row: 3;
    min-width: 0;
    padding-bottom: 2rem;
    overflow-y: auto;
  }

  .haven-nav {
    position: relative;
    grid-column: 1;
    grid-row: 3;
    left: auto;
    bottom: auto;
    transform: none;
    width: auto;
    max-width: none;
    height: auto;
    min-height: 0;
    padding: 1rem 0.75rem;
    border-top: 0;
    border-right: 1px solid var(--line);
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.3rem;
    overflow-y: auto;
  }

  .nav-item {
    flex: 0 0 auto;
    min-height: 48px;
    flex-direction: row;
    justify-content: flex-start;
    gap: 0.75rem;
    padding: 0.7rem 0.8rem;
    text-align: left;
  }

  .nav-item.active {
    background: var(--green-bg);
  }

  .nav-icon {
    width: 1.5rem;
    font-size: 1.15rem;
    text-align: center;
  }

  .nav-label {
    font-size: 0.82rem;
  }
}


/* ===== SYNC STATUS ===== */
.header-actions { display: flex; align-items: center; gap: 0.65rem; }

.runtime-mode {
  font-size: 0.72rem;
  color: var(--muted);
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  background: rgba(255,255,255,0.55);
  white-space: nowrap;
}
.runtime-mode[data-mode="live_shared"] { color: var(--green); background: var(--green-bg); }
.runtime-mode[data-mode="preview_shared"] { color: var(--amber); }
.runtime-mode[data-mode="local_only"],
.runtime-mode[data-mode="unknown"] { color: var(--red); background: var(--red-bg); }

.sync-status {
  font-size: 0.75rem;
  color: var(--muted);
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  background: rgba(255,255,255,0.55);
  white-space: nowrap;
}
.sync-status[data-mode="synced"] { color: var(--green); background: var(--green-bg); }
.sync-status[data-mode="saving"] { color: var(--amber); }
.sync-status[data-mode="offline"],
.sync-status[data-mode="offline-pending"] { color: var(--red); background: var(--red-bg); }

.snapshot-list { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.35rem; }

.data-health-grid {
  display: grid;
  grid-template-columns: minmax(8rem, 1fr) minmax(8rem, 1.2fr);
  gap: 0.45rem 0.75rem;
  padding: 0.75rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  font-size: 0.84rem;
  margin-bottom: 0.6rem;
}
.data-health-grid span { color: var(--muted); }
.data-health-grid strong { font-weight: 600; overflow-wrap: anywhere; }

/* === HARBORMASTER SHARED SHELL + ACCESSIBILITY FOUNDATION === */
.skip-link{position:fixed;left:1rem;top:-5rem;z-index:1000;padding:.75rem 1rem;background:#fff;color:#17271d;border:2px solid currentColor;border-radius:.5rem}.skip-link:focus{top:1rem}
:focus-visible{outline:3px solid #1b6d85;outline-offset:3px}
.header-actions{display:flex;align-items:center;gap:.35rem}.shell-action,.safe-return{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:.45rem .7rem;border:1px solid var(--line);border-radius:999px;color:var(--ink);background:var(--panel);font:inherit;text-decoration:none;cursor:pointer}.shell-eyebrow{margin:0;font:700 .62rem/1.2 system-ui,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.harbormaster-shell{margin:.75rem 1rem 0;padding:1rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);box-shadow:var(--shadow)}.shell-title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}.shell-title-row h2{margin:.2rem 0;font-size:1.15rem}.authority-warning{margin:.75rem 0;font: .88rem/1.45 system-ui,sans-serif;color:var(--muted)}.harbormaster-status{position:relative}.harbor-signal{position:absolute;right:0;top:0;font-size:1rem}.harbor-signal[data-state="clear"]{color:var(--green)}.harbor-signal[data-state="stop"]{color:var(--red)}.harbormaster-status-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin:0}.harbormaster-status-grid div{padding:.55rem;background:rgba(255,255,255,.6);border-radius:.65rem}.harbormaster-status-grid dt{font:700 .62rem system-ui,sans-serif;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.harbormaster-status-grid dd{margin:.18rem 0 0;font: .78rem/1.3 system-ui,sans-serif}
html[data-presentation="boring"] body{background:#fff;font-family:system-ui,sans-serif}html[data-presentation="boring"] .harbormaster-shell,html[data-presentation="boring"] .card,html[data-presentation="boring"] .overlay-sheet{box-shadow:none;border-radius:2px;background:#fff}html[data-presentation="boring"] .nav-icon{display:none}html[data-presentation="boring"] *{animation:none!important;transition:none!important}
@media(max-width:520px){.header-actions .runtime-mode,.header-actions .sync-status{display:none}.shell-action{font-size:.75rem;padding:.4rem .55rem}.shell-title-row{display:block}.safe-return{margin-top:.5rem}.harbormaster-status-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}}

/* ===== HABIT STEWARDSHIP ===== */
.habit-summary { margin: 1rem 0; padding: 0.9rem 1rem; border: 1px solid var(--border, #d8cfbf); border-radius: 14px; background: var(--surface, #fffdf8); }
.habit-form { display: grid; gap: 0.75rem; margin: 1rem 0 1.25rem; }
.habit-form label { display: grid; gap: 0.35rem; font-weight: 600; }
.habit-form input { width: 100%; padding: 0.75rem; border: 1px solid var(--border, #d8cfbf); border-radius: 10px; background: var(--surface, #fffdf8); color: inherit; }
.habit-list { display: grid; gap: 0.8rem; }
.habit-card { display: grid; gap: 0.8rem; padding: 1rem; border: 1px solid var(--border, #d8cfbf); border-radius: 16px; background: var(--surface, #fffdf8); }
.habit-card h3 { margin: 0; }
.habit-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.paused-habits { margin-top: 1.25rem; }
.paused-row { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; padding: 0.7rem 0; }
.paused-row span { flex: 1 1 12rem; }

/* ===== APP GRADUATION: HAVEN HOME REALMS ===== */
.realm-entry{width:100%;margin-top:1.25rem;padding:1rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.realm-entry h3{margin:.25rem 0 1rem;font-size:1.1rem}.realm-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.realm-card{display:grid;grid-template-columns:auto 1fr;gap:.2rem .65rem;text-align:left;min-height:112px;padding:1rem;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.65);color:var(--ink);font:inherit;cursor:pointer}
.realm-card>span{grid-row:1/3;font-size:1.5rem}.realm-card strong{font-size:1rem}.realm-card small{color:var(--muted);line-height:1.4}.realm-card:hover{transform:translateY(-1px);box-shadow:var(--shadow)}
.realm-view{display:flex;flex-direction:column;gap:1rem;max-width:680px;margin:0 auto}.realm-back{align-self:flex-start;min-height:44px;border:0;background:transparent;color:var(--ink);font:inherit;cursor:pointer}
.realm-intro{margin:0;color:var(--muted);line-height:1.55}.realm-panel{display:grid;gap:.65rem;padding:1rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.realm-panel textarea{width:100%;resize:vertical;min-height:7rem;padding:.85rem;border:1px solid var(--line);border-radius:12px;background:#fffdf8;color:var(--ink);font:inherit;line-height:1.45}
.realm-actions{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.realm-save-status{font-size:.84rem;color:var(--muted)}.realm-link-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}
.realm-link{min-height:52px;padding:.7rem;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--ink);font:inherit;cursor:pointer}.realm-boundary{padding:.85rem 1rem;border-left:4px solid var(--yellow);background:var(--yellow-bg);font-size:.88rem;line-height:1.5}
@media(max-width:560px){.realm-grid,.realm-link-grid{grid-template-columns:1fr}.realm-card{min-height:96px}}

.harmony-catchup{display:grid;gap:1rem}.harmony-catchup label{display:grid;gap:.4rem}.harmony-catchup textarea{width:100%;padding:.85rem;border:1px solid var(--line);border-radius:12px;background:#fffdf8;color:var(--ink);font:inherit;line-height:1.45;resize:vertical}
.morning-brief{display:grid;gap:.8rem;padding:1rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.morning-brief-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.morning-brief-heading h3{margin:.2rem 0 0;font-size:1.2rem}.brief-ready-badge{padding:.3rem .6rem;border-radius:999px;background:var(--green-bg);color:var(--green);font-size:.78rem;font-weight:700}
.morning-brief-section{padding:.75rem;border-radius:12px;background:rgba(255,255,255,.58)}.morning-brief-section h3{margin:0 0 .35rem;font-size:.84rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.morning-brief-section p{margin:0;line-height:1.5;overflow-wrap:anywhere}

.launch-checklist{display:grid;gap:.55rem;padding:.85rem;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.58)}
.launch-checklist legend{padding:0 .35rem;font-weight:700}.launch-checklist label{display:flex;align-items:center;gap:.55rem;min-height:36px}.launch-checklist input{width:18px;height:18px}

.launch-progress{margin:0;color:var(--muted);font-size:.84rem}.launch-reset{justify-self:start;margin-top:.25rem}

.first-focus{display:grid;gap:.7rem;padding:.9rem;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.58)}
.first-focus h3{margin:.15rem 0 0}.first-focus input{width:100%;min-height:44px;padding:.7rem;border:1px solid var(--line);border-radius:10px;background:var(--panel)}

/* ===== WORK HUB LIVING WORLD ===== */
.workhub-world { margin-bottom: 1.5rem; }
.world-topline, .scene-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.world-topline h3, .scene-heading h4 { margin: 0; font-weight: normal; }
.world-truth-badge { border: 1px solid var(--accent-soft); border-radius: var(--radius-full); padding: .35rem .65rem; font-size: .75rem; color: var(--muted); }
.world-room-map { display: grid; grid-template-columns: repeat(3, 1fr); gap: .55rem; margin: 1rem 0; }
.world-room { min-height: 74px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--panel); color: var(--ink); font-family: inherit; padding: .65rem; cursor: pointer; display: flex; flex-direction: column; gap: .25rem; align-items: flex-start; text-align: left; }
.world-room.active { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.world-room span { font-size: 1.25rem; }
.world-scene { border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem; background: rgba(255,251,242,.72); }
.scene-icon { font-size: 2.2rem; }
.scene-heading p { margin: .3rem 0 0; color: var(--muted); }
.courier-grid, .coworker-studio, .room-packets { display: grid; gap: .75rem; margin-top: 1rem; }
.courier-card { width: 100%; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--panel); color: var(--ink); padding: .8rem; font-family: inherit; display: flex; gap: .8rem; text-align: left; cursor: pointer; }
.courier-card span:last-child { display: grid; gap: .18rem; }
.courier-card small, .courier-card em { color: var(--muted); font-style: normal; }
.courier-icon { font-size: 1.6rem; }
.coworker-desk, .room-packet { display: flex; gap: .75rem; align-items: flex-start; padding: .8rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--panel); }
.coworker-desk p, .room-packet p { margin: .2rem 0; }
.coworker-desk small, .room-packet span { color: var(--muted); }
.boring-render { display: none; }
.boring-table-wrap { overflow-x: auto; }
.boring-table { width: 100%; border-collapse: collapse; margin-top: 1rem; }
.boring-table th, .boring-table td { padding: .7rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
html[data-presentation="boring"] .living-render { display: none; }
html[data-presentation="boring"] .boring-render { display: block; }
html[data-presentation="boring"] .world-truth-badge { border-style: solid; }
@media (max-width: 520px) { .world-room-map { grid-template-columns: repeat(2, 1fr); } .world-topline { flex-direction: column; } }
.courier-actions { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .35rem; }
.courier-card[data-attention="later"] { opacity: .72; border-style: dashed; }
.courier-card .realm-link { min-height: 36px; }
html[data-presentation="boring"] .courier-actions { display: none; }
.world-controls { display:flex; flex-wrap:wrap; align-items:center; gap:.55rem; margin:.75rem 0 1rem; padding:.65rem; border:1px solid var(--line); border-radius:var(--radius-sm); background:rgba(255,255,255,.46); }
.world-controls [role="status"] { margin-left:auto; color:var(--muted); font-size:.82rem; }
.world-room small { color:var(--muted); font-size:.72rem; }
.room-summary { color:var(--muted); margin:.8rem 0 0; }
html[data-presentation="boring"] .world-controls { background:#fff; }
@media (max-width:520px) { .world-controls [role="status"] { width:100%; margin-left:0; } }
.world-filter{display:flex;flex-wrap:wrap;gap:.45rem;margin:.75rem 0}.world-filter .active{font-weight:700;text-decoration:underline}.world-history{border:1px solid var(--line);border-radius:var(--radius-sm);padding:.8rem;background:var(--panel);margin:.75rem 0}.world-history-heading{display:flex;justify-content:space-between;gap:1rem;align-items:center}.world-history h4{margin:0}.world-history ol{display:grid;gap:.4rem;margin:.7rem 0 0;padding-left:1.2rem}.world-history li{display:flex;justify-content:space-between;gap:1rem}.world-history small{color:var(--muted)}
@media(max-width:520px){.world-history li{display:grid;gap:.15rem}}

/* Work Hub — Conservatory Ledger */
.workhub-ledger{margin:1.5rem 0;padding:clamp(1rem,2.6vw,1.8rem);border:1px solid color-mix(in srgb,var(--line) 82%,#8b6f3f);border-radius:24px;background:linear-gradient(150deg,rgba(250,244,225,.96),rgba(241,232,202,.94));color:#24322b;box-shadow:0 18px 45px rgba(21,35,29,.16);position:relative;overflow:hidden}
.workhub-ledger::before{content:"";position:absolute;inset:0 auto 0 0;width:7px;background:linear-gradient(#274b39,#8e713d,#274b39)}
.ledger-mast,.folio-heading{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}.ledger-mast h2,.ledger-folio h3,.intent-pad h3{font-family:Georgia,serif;font-weight:500;margin:.1rem 0}.ledger-mast>div>p:last-child{max-width:48rem;margin:.35rem 0 0}
.work-safe-badge,.folio-count,.answer-lengths span{border:1px solid rgba(66,79,64,.25);border-radius:999px;padding:.45rem .7rem;background:rgba(255,255,255,.55);font-size:.76rem;white-space:nowrap}
.ledger-tabs{display:flex;gap:.35rem;overflow-x:auto;padding:.85rem 0 .6rem;margin:.5rem 0 .8rem;border-bottom:1px solid rgba(66,79,64,.2);scrollbar-width:thin}.ledger-tab{flex:0 0 auto;border:0;border-bottom:2px solid transparent;background:transparent;color:#405148;padding:.55rem .65rem;font:inherit;cursor:pointer}.ledger-tab.active{color:#183d2d;border-color:#9b7639;font-weight:700}
.ledger-folio,.intent-pad{border:1px solid rgba(67,75,61,.2);border-radius:18px;padding:1rem;background:rgba(255,253,245,.75);box-shadow:inset 0 1px rgba(255,255,255,.8)}
.attention-stack,.changeset,.chronicle-list,.people-grid{display:grid;gap:.55rem;margin-top:.75rem}.attention-slip,.requirement-row,.thread-row,.gap-row,.changeset article{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid rgba(67,75,61,.16);padding:.7rem .2rem}.attention-slip div,.requirement-row div,.thread-row div,.changeset article{min-width:0}.attention-slip strong,.requirement-row strong,.thread-row strong,.changeset strong,.people-grid strong{display:block}.attention-slip p,.requirement-row p,.thread-row p,.gap-row p{margin:.2rem 0;color:#59675f}.attention-slip>span,.requirement-row>span,.thread-row>span{font-size:.75rem;color:#6c5a36;white-space:nowrap}
.folio-grid,.brief-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin-top:.7rem}.folio-grid>div,.brief-columns>div,.people-grid article,.sme-guide,.context-disclosure{padding:.75rem;border-radius:14px;background:rgba(223,229,210,.42);border:1px solid rgba(67,75,61,.14)}
.answer-lengths{display:flex;gap:.35rem;flex-wrap:wrap;margin-top:.75rem}.scope-proposals,.sme-guide{margin-top:.75rem}.context-disclosure{margin-top:.75rem}.context-disclosure summary{cursor:pointer;font-weight:700}.clear-state,.parity-note{color:#617168;font-style:italic}.intent-pad{margin-top:1rem}.intent-pad textarea{width:100%;margin:.75rem 0;padding:.85rem;border:1px solid rgba(67,75,61,.3);border-radius:14px;background:#fffdf7;color:#26372e;font:inherit;resize:vertical}.changeset article{display:grid;grid-template-columns:1fr auto;align-items:center}.changeset article small{grid-column:1/-1}.changeset article[data-operation-state="ambiguous"]{border-left:4px solid #b77a32;padding-left:.65rem}.payload-preview{max-height:18rem;overflow:auto;padding:.75rem;border-radius:12px;background:#172b23;color:#f7f1dc;font-size:.75rem}.adapter-actions{display:flex;gap:.5rem;flex-wrap:wrap;margin:.8rem 0}
.workhub-failure{margin:.75rem 0;padding:.8rem 1rem;border:1px solid rgba(154,96,38,.42);border-left:4px solid #9a6026;border-radius:14px;background:rgba(255,244,224,.82)}.workhub-failure strong,.workhub-failure p,.workhub-failure small{display:block}.workhub-failure p{margin:.25rem 0}.workhub-failure small{color:#654b31}
.pond-world-projection{margin-top:1rem;padding:1rem;border:1px solid rgba(120,151,135,.28);border-radius:20px;background:radial-gradient(circle at 80% 20%,rgba(213,232,221,.35),transparent 45%),rgba(20,54,46,.06)}.pond-world-projection h4{margin:.15rem 0;font-family:Georgia,serif}.pond-swans{display:flex;gap:.6rem;overflow-x:auto;margin-top:.65rem}.pond-swan{min-width:15rem;display:flex;gap:.65rem;align-items:center;padding:.7rem;border-radius:18px;background:rgba(255,255,255,.52);border:1px solid rgba(67,75,61,.16)}.pond-swan>span{font-size:1.7rem}.pond-swan strong,.pond-swan small{display:block}.pond-swan small{color:#607168}.pond-swan[data-swan-state="at-shore"]{box-shadow:inset 0 -3px #9b7639}
html[data-presentation="boring"] .workhub-ledger{background:#fff;color:#111;border:1px solid #777;border-radius:2px;box-shadow:none}html[data-presentation="boring"] .workhub-ledger::before{display:none}html[data-presentation="boring"] .ledger-folio,html[data-presentation="boring"] .intent-pad,html[data-presentation="boring"] .folio-grid>div,html[data-presentation="boring"] .brief-columns>div,html[data-presentation="boring"] .people-grid article,html[data-presentation="boring"] .sme-guide,html[data-presentation="boring"] .context-disclosure{background:#fff;border-radius:2px;box-shadow:none}html[data-presentation="boring"] .pond-world-projection{background:#fff;border-radius:2px}
@media(max-width:820px){.folio-grid,.brief-columns{grid-template-columns:1fr}.ledger-mast,.folio-heading{align-items:flex-start}.workhub-ledger{border-radius:18px}.ledger-tabs{margin-inline:-.35rem;padding-inline:.35rem}.attention-slip,.requirement-row,.thread-row{flex-direction:column}.attention-slip>span,.requirement-row>span,.thread-row>span{white-space:normal}.changeset article{grid-template-columns:1fr}.changeset article small{grid-column:auto}}
@media(max-width:520px){.workhub-ledger{padding:.85rem}.ledger-mast{flex-direction:column}.work-safe-badge{white-space:normal}.answer-lengths span{font-size:.7rem}.pond-swan{min-width:12rem}}
@media(prefers-reduced-motion:reduce){.workhub-ledger *, .pond-world-projection *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
/* ===== EXECUTION WAYFINDER ===== */
.execution-hero { margin-bottom: 1rem; }
.execution-form, .execution-result-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem; box-shadow: var(--shadow); }
.execution-form label { display: grid; gap: .45rem; font-weight: 700; color: var(--ink); }
.execution-form textarea, .execution-form input, .execution-form select { width: 100%; border: 1px solid rgba(32,49,38,.22); border-radius: 12px; padding: .8rem; background: rgba(255,255,255,.72); color: var(--ink); font: inherit; }
.execution-form textarea:focus, .execution-form input:focus, .execution-form select:focus { outline: 3px solid rgba(58,125,68,.2); border-color: var(--green); }
.execution-fields { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; margin: .8rem 0; }
.execution-submit, .execution-actions button { border: 0; border-radius: 999px; padding: .75rem 1rem; font: inherit; font-weight: 700; cursor: pointer; }
.execution-submit { width: 100%; color: white; background: var(--green); }
.lane-guide { display: grid; gap: .7rem; margin: 1rem 0; }
.lane-guide-card { display: flex; gap: .75rem; align-items: center; padding: .8rem; border-radius: 14px; border: 1px solid var(--line); background: rgba(255,251,242,.62); }
.lane-guide-card span { font-size: 1.5rem; }
.lane-guide-card p { margin: .2rem 0 0; color: var(--muted); font-size: .9rem; }
.execution-result-card { margin-top: 1rem; }
.execution-result-heading { display: flex; gap: .9rem; align-items: flex-start; }
.execution-result-heading h3 { margin: .1rem 0 .35rem; font-size: 1.25rem; }
.execution-result-heading p { margin: 0; color: var(--muted); }
.execution-lane-icon { font-size: 2rem; }
.lane-card-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin: 1rem 0; }
.lane-card-grid div { padding: .7rem; border-radius: 12px; background: rgba(58,125,68,.07); }
.lane-card-grid dt { color: var(--muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; }
.lane-card-grid dd { margin: .2rem 0 0; font-weight: 700; }
.execution-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.execution-actions button { background: var(--ink); color: white; }
.copy-status { min-height: 1.2em; color: var(--green); font-weight: 700; }
@media (max-width: 480px) { .execution-fields, .lane-card-grid { grid-template-columns: 1fr; } }

.daily-intake,.delta-review{margin-top:1rem;padding:1rem;border:1px solid rgba(67,75,61,.18);border-radius:16px;background:rgba(255,255,255,.42)}.daily-intake textarea{width:100%;margin:.65rem 0;padding:.8rem;border:1px solid rgba(67,75,61,.3);border-radius:12px;background:#fffdf7;color:#26372e;font:inherit;resize:vertical}.daily-actions{display:flex;gap:.5rem;flex-wrap:wrap;margin:.55rem 0}.daily-captured{display:grid;gap:.4rem;margin-top:.6rem}.daily-captured article{border-left:3px solid rgba(142,113,61,.65);padding:.45rem .65rem;background:rgba(255,253,245,.62)}.daily-captured article p{margin:.15rem 0}.delta-review .changeset{margin:.7rem 0}.delta-review h4,.daily-intake h4{margin:.15rem 0}.daily-desk>.attention-stack{margin-bottom:.8rem}

.writing-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-top:1rem}.writing-grid label,.writing-body{display:grid;gap:.35rem}.writing-grid input,.writing-grid select,.writing-body textarea{width:100%;padding:.75rem;border:1px solid rgba(67,75,61,.3);border-radius:12px;background:#fffdf7;color:#26372e;font:inherit}.writing-body{margin-top:.75rem}.draft-status{margin-top:1rem;padding:.8rem;border:1px solid rgba(67,75,61,.2);border-radius:14px;background:rgba(255,255,255,.42)}.draft-status p{margin:.2rem 0}.draft-status pre{white-space:pre-wrap;overflow-wrap:anywhere;background:rgba(23,43,35,.08);padding:.7rem;border-radius:10px}.draft-list{display:grid;gap:.4rem;margin-top:.75rem}.draft-list article{display:flex;justify-content:space-between;gap:1rem;padding:.55rem;border-bottom:1px solid rgba(67,75,61,.16)}@media(max-width:700px){.writing-grid{grid-template-columns:1fr}}

/* Work Hub office presentation: practical surface first, atmosphere at the edge. */
.workhub-office-shell{display:grid;grid-template-columns:minmax(10rem,.28fr) minmax(0,1fr);gap:clamp(.75rem,2vw,1.4rem);align-items:stretch;margin:1.25rem 0;min-width:0}
.workhub-office-window{position:relative;min-height:38rem;border:1px solid rgba(71,61,46,.34);border-radius:26px;overflow:hidden;background:linear-gradient(180deg,#cad5c6 0%,#9eb2a2 35%,#657d6d 36%,#43584b 62%,#2c3c33 100%);box-shadow:inset 0 0 0 7px rgba(66,48,35,.28),0 18px 45px rgba(21,35,29,.15)}
.workhub-office-window::before{content:"";position:absolute;inset:8% 11% 28%;border:5px solid rgba(62,43,31,.5);border-radius:40% 40% 8px 8px;background:radial-gradient(circle at 72% 18%,rgba(255,240,184,.7) 0 5%,transparent 6%),linear-gradient(180deg,rgba(230,226,190,.42),rgba(137,166,139,.32) 45%,rgba(63,91,65,.55));box-shadow:inset 0 0 24px rgba(28,45,34,.26)}
.office-scenery{position:absolute;inset:0}.office-window-label{position:absolute;left:50%;top:4%;transform:translateX(-50%);font:700 .58rem/1 system-ui,sans-serif;letter-spacing:.13em;text-transform:uppercase;color:rgba(39,49,42,.65)}
.office-horizon{position:absolute;left:-10%;right:-10%;bottom:31%;height:22%;background:radial-gradient(ellipse at 20% 100%,#293f31 0 34%,transparent 35%),radial-gradient(ellipse at 65% 100%,#35513c 0 38%,transparent 39%),radial-gradient(ellipse at 92% 100%,#263d2f 0 31%,transparent 32%);opacity:.82}
.office-desk-detail{position:absolute;left:0;right:0;bottom:0;height:28%;border-top:5px solid rgba(67,45,31,.5);background:linear-gradient(90deg,rgba(49,68,56,.96),rgba(62,79,65,.96));display:flex;align-items:flex-start;justify-content:center;gap:.6rem;padding-top:1rem}.office-desk-detail span{width:1.5rem;height:2.2rem;border-radius:50% 50% 8px 8px;background:linear-gradient(#afb89b,#6c7963);box-shadow:0 1rem 0 -.55rem #2f4937}
.workhub-office-frame{position:relative;min-width:0;padding:clamp(.55rem,1.1vw,.9rem);border-radius:28px;background:linear-gradient(135deg,#473227 0%,#8a7049 15%,#4d3528 31%,#a58a5b 49%,#4a3428 67%,#866d48 85%,#3f2d25 100%);box-shadow:0 22px 55px rgba(29,22,17,.24),inset 0 0 0 3px rgba(234,211,150,.3),inset 0 0 0 8px rgba(54,38,29,.45)}
.workhub-office-frame::before{content:"";position:absolute;inset:.35rem;border:1px solid rgba(244,221,159,.46);border-radius:23px;pointer-events:none}
.frame-corner{position:absolute;width:1.1rem;height:1.1rem;border:2px solid rgba(241,214,145,.55);transform:rotate(45deg);z-index:2;pointer-events:none}.frame-corner-a{left:.55rem;top:.55rem}.frame-corner-b{right:.55rem;bottom:.55rem}
.workhub-office-frame .workhub-ledger{margin:0;border-radius:20px;box-shadow:0 14px 32px rgba(28,31,25,.16)}
html[data-presentation="boring"] .workhub-office-shell{display:block}html[data-presentation="boring"] .workhub-office-window{display:none}html[data-presentation="boring"] .workhub-office-frame{padding:0;background:none;box-shadow:none;border-radius:0}html[data-presentation="boring"] .workhub-office-frame::before,html[data-presentation="boring"] .frame-corner{display:none}
@media(max-width:1050px){.workhub-office-shell{grid-template-columns:minmax(7rem,.2fr) minmax(0,1fr)}.workhub-office-window{min-height:34rem}}
@media(max-width:820px){.workhub-office-shell{display:block}.workhub-office-window{display:none}.workhub-office-frame{padding:.5rem;border-radius:20px}.workhub-office-frame .workhub-ledger{border-radius:15px}}

.living-world-doorway{margin:1rem 0;border:1px solid rgba(71,82,69,.22);border-radius:16px;background:rgba(247,249,243,.62)}.living-world-doorway>summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 1rem;cursor:pointer;font-weight:700;color:#33483c}.living-world-doorway>summary small{font-weight:500;opacity:.72}.living-world-doorway[open]>summary{border-bottom:1px solid rgba(71,82,69,.16)}.living-world-doorway .workhub-world{margin:.8rem}.world-canonical-pulse{margin:1rem 0;padding:.8rem;border:1px solid rgba(77,94,77,.2);border-radius:14px;background:rgba(255,255,255,.38)}.world-canonical-pulse dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem}.world-canonical-pulse dl div{padding:.55rem;border-radius:10px;background:rgba(51,72,60,.07)}.world-canonical-pulse dt{font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;opacity:.68}.world-canonical-pulse dd{margin:.2rem 0 0;font-weight:750}.world-canonical-pulse p{margin:.55rem 0 0;font-size:.78rem;opacity:.72}@media(max-width:820px){.living-world-doorway>summary{align-items:flex-start;flex-direction:column}.world-canonical-pulse dl{grid-template-columns:1fr 1fr}}

/* Work Hub evidence ledger: inspectable truth without crossing restricted context. */
.evidence-stack{display:grid;gap:.75rem;margin-top:1rem}.evidence-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;padding:.9rem;border:1px solid rgba(67,75,61,.18);border-radius:14px;background:rgba(255,255,255,.4)}.evidence-row strong,.evidence-row p{display:block;margin:.2rem 0}.evidence-row dl{display:grid;gap:.45rem;min-width:11rem;margin:0}.evidence-row dl div{padding:.45rem .6rem;border-radius:10px;background:rgba(51,72,60,.07)}.evidence-row dt{font-size:.66rem;text-transform:uppercase;letter-spacing:.08em;opacity:.68}.evidence-row dd{margin:.15rem 0 0;font-weight:750;font-size:.78rem}@media(max-width:700px){.evidence-row{grid-template-columns:1fr}.evidence-row dl{grid-template-columns:1fr 1fr;min-width:0}}

/* Heart Experience — evidence-gated arrival */
.deep-view { margin: .65rem auto 0; max-width: 980px; opacity: .88; }
.deep-view > summary { cursor: pointer; list-style: none; display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:.65rem .9rem; }
.deep-view > summary::-webkit-details-marker { display:none; }
.deep-view-body { padding: 0 .9rem .9rem; }
.heart-home { display:grid; gap:1rem; margin: 1rem 0 1.25rem; }
.heart-five-second { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; }
.heart-panel, .heart-changed { border:1px solid var(--border, #d9d0bf); border-radius:18px; background:color-mix(in srgb, var(--surface, #fff) 88%, transparent); padding:1rem; box-shadow:0 8px 28px rgba(72,62,45,.05); }
.heart-panel h3 { margin:.2rem 0 .45rem; font-size:1.05rem; }
.heart-panel p, .heart-changed p { margin:.25rem 0; line-height:1.45; }
.heart-panel ul { list-style:none; padding:0; margin:.55rem 0 0; display:grid; gap:.4rem; }
.heart-panel li button { width:100%; text-align:left; border:0; border-radius:12px; padding:.65rem .7rem; background:rgba(255,255,255,.62); color:inherit; cursor:pointer; }
.heart-care-details { margin-top:.5rem; }
.visually-muted { font-size:.8rem; font-weight:500; text-align:center; margin:.25rem 0 .75rem; color:var(--muted, #756e61); }
.explore-haven { margin-top:1rem; }
.one-thing-mode .heart-panel.in-motion, .one-thing-mode .heart-panel.resume, .one-thing-mode .heart-changed, .one-thing-mode .heart-care-details, .one-thing-mode .explore-haven { display:none; }
.one-thing-mode .heart-five-second { grid-template-columns:minmax(0,620px); justify-content:center; }
@media (max-width: 720px) { .heart-five-second { grid-template-columns:1fr; } .deep-view { margin-inline:.65rem; } .haven-header .runtime-mode, .haven-header .sync-status { display:none; } }

.legacy-nav-label { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* Heart of Haven — personal context, not project state */
.heart-of-haven{display:grid;gap:1rem;max-width:980px;margin:0 auto}.heart-of-haven-header{padding:.4rem .2rem}.heart-of-haven-header h2{margin:.2rem 0 .45rem}.heart-of-haven-header p:last-child{max-width:58rem;color:var(--muted)}.heart-self-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}.heart-self-card{border:1px solid var(--border,#d9d0bf);border-radius:20px;padding:1rem;background:rgba(255,251,242,.74);box-shadow:0 8px 28px rgba(72,62,45,.05)}.heart-self-card h3{margin:.2rem 0 .7rem}.heart-self-card dl{display:grid;gap:.45rem;margin:.5rem 0}.heart-self-card dl div{display:flex;justify-content:space-between;gap:1rem;padding:.45rem .55rem;border-radius:10px;background:rgba(255,255,255,.48)}.heart-self-card dt{color:var(--muted)}.heart-self-card dd{margin:0;text-align:right;font-weight:650}.heart-intention-card{grid-column:1/-1;background:linear-gradient(135deg,rgba(244,239,220,.86),rgba(239,246,232,.82))}.heart-intention-card label{display:block;margin:.6rem 0 .35rem;font-weight:650}.heart-intention-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.55rem}.heart-intention-row input{min-width:0;padding:.7rem .8rem;border:1px solid var(--border,#d9d0bf);border-radius:12px;background:rgba(255,255,255,.76);color:inherit;font:inherit}.heart-intention-row button,.heart-self-card button,.heart-self-footer button{border:1px solid rgba(82,91,68,.25);border-radius:12px;padding:.65rem .8rem;background:rgba(255,255,255,.68);color:inherit;font:inherit;font-weight:650;cursor:pointer}.heart-source-note{font-size:.84rem;color:var(--muted);line-height:1.45}.text-button{margin-top:.5rem;background:transparent!important}.heart-permission-card{border-color:rgba(73,104,75,.3)}.heart-self-footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem .2rem}.heart-self-footer p{margin:0;color:var(--muted)}
@media(max-width:720px){.heart-self-grid{grid-template-columns:1fr}.heart-intention-card{grid-column:auto}.heart-intention-row{grid-template-columns:1fr}.heart-self-card dl div{display:block}.heart-self-card dd{text-align:left;margin-top:.1rem}.heart-self-footer{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){.heart-of-haven *{scroll-behavior:auto!important;transition:none!important}}


/* Heart of Haven — Phase 2C decision quiet + transparency */
.heart-approval-summary,.heart-source-disclosure{margin:1rem 0;padding:1rem;border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--panel) 92%,transparent)}
.heart-approval-summary{display:grid;gap:.65rem}.heart-approval-summary h3{margin:.2rem 0 .5rem}.heart-approval-summary ul{list-style:none;margin:.65rem 0;padding:0;display:grid;gap:.45rem}.heart-approval-summary li{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;padding:.65rem .75rem;border-radius:12px;background:rgba(255,255,255,.58)}.heart-approval-summary li small{text-transform:capitalize;color:var(--muted)}
.heart-source-disclosure summary{cursor:pointer;font-weight:700}.heart-source-disclosure ul{display:grid;gap:.45rem;padding-left:1.2rem}.heart-source-note{color:var(--muted);font-size:.84rem;line-height:1.45}
@media(max-width:560px){.heart-approval-summary li{display:grid;gap:.2rem}}
@media(prefers-reduced-motion:reduce){.heart-approval-summary *, .heart-source-disclosure *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.chronicle-story-list{display:grid;gap:.7rem;margin-top:.9rem}.chronicle-story-card{padding:.85rem 1rem;border:1px solid rgba(67,75,61,.16);border-radius:14px;background:rgba(255,255,255,.45)}.chronicle-story-card h4{margin:.2rem 0;font-family:Georgia,serif;font-weight:500}.chronicle-story-card p{margin:.25rem 0;color:#59675f}.chronicle-story-card details{margin-top:.55rem}.chronicle-story-card summary{cursor:pointer;color:#6c5a36}.chronicle-story-card code{display:block;margin-top:.4rem;overflow-wrap:anywhere}html[data-presentation="boring"] .chronicle-story-card{background:#fff;border-radius:2px}html[data-presentation="boring"] .chronicle-story-card summary{color:#222}@media(prefers-reduced-motion:reduce){.chronicle-story-card summary{scroll-behavior:auto}}

/* Hearth UI catch-up — approved imagery translated into usable, mobile-first product structure. */
.hearth-welcome{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(220px,.8fr);gap:1rem;padding:1.15rem;border:1px solid rgba(71,82,69,.18);border-radius:24px;background:linear-gradient(135deg,rgba(255,251,242,.96),rgba(232,239,220,.82));box-shadow:0 12px 32px rgba(52,67,48,.08)}
.hearth-welcome h2{margin:.15rem 0 .35rem;font-size:1.7rem;font-weight:500}.hearth-welcome p{margin:.2rem 0;color:var(--muted);line-height:1.5}.hearth-pulse{display:grid;gap:.5rem;align-content:center}.pulse-row{display:grid;grid-template-columns:72px minmax(70px,1fr) 38px;gap:.45rem;align-items:center;font:600 .72rem/1.2 system-ui,sans-serif;color:var(--muted)}.pulse-row strong{text-align:right;color:var(--ink)}.pulse-track{height:8px;border-radius:999px;background:rgba(32,49,38,.1);overflow:hidden}.pulse-track i{display:block;height:100%;border-radius:inherit;background:var(--green)}
.hearth-journey{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.55rem}.journey-step{position:relative;display:grid;gap:.18rem;min-height:94px;padding:.75rem .65rem;border:1px solid var(--line);border-radius:16px;background:rgba(255,251,242,.78)}.journey-step span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--green-bg);color:var(--green);font:700 .72rem system-ui,sans-serif}.journey-step strong{font-size:.86rem}.journey-step small{color:var(--muted);line-height:1.3}
.heart-five-second{grid-template-columns:repeat(3,minmax(0,1fr))}.heart-panel{border-top:3px solid rgba(58,125,68,.45)}
@media(max-width:720px){.hearth-welcome{grid-template-columns:1fr}.hearth-journey{grid-template-columns:repeat(2,minmax(0,1fr))}.journey-step{min-height:88px}.heart-home{margin-top:.35rem}}
@media(max-width:390px){.hearth-journey{grid-template-columns:1fr 1fr}.journey-step{padding:.65rem .55rem}.hearth-welcome{padding:1rem}}

/* Hearth UI catch-up slice 2 — living-world density without hiding operational truth. */
.hearth-square{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(180px,.65fr);gap:1rem;align-items:center;padding:1rem 1.1rem;border:1px solid rgba(71,82,69,.18);border-radius:22px;background:radial-gradient(circle at 78% 22%,rgba(246,219,139,.28),transparent 24%),linear-gradient(145deg,rgba(239,246,226,.92),rgba(255,247,229,.9))}
.hearth-square:after{content:"";position:absolute;inset:auto -5% -34px;width:110%;height:68px;border-radius:50%;background:rgba(96,137,80,.12);pointer-events:none}.hearth-square-copy{position:relative;z-index:1}.hearth-square-copy h3{margin:.15rem 0 .35rem;font:500 1.22rem/1.2 Georgia,serif}.hearth-square-copy p:last-child{max-width:54rem;margin:.2rem 0;color:var(--muted);line-height:1.5}.hearth-residents{position:relative;z-index:1;display:flex;justify-content:center;align-items:end;gap:.45rem;min-height:72px}.resident-token{display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(57,82,61,.2);border-radius:50% 50% 44% 44%;background:rgba(255,252,242,.9);box-shadow:0 7px 16px rgba(54,68,50,.1);font:700 .82rem system-ui,sans-serif}.resident-token:nth-child(even){transform:translateY(10px)}.resident-token.creature{font-size:1.2rem}.hearth-landmarks{position:relative;z-index:1;grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.45rem}.hearth-landmarks span{padding:.42rem .6rem;border:1px solid rgba(70,91,68,.14);border-radius:999px;background:rgba(255,255,255,.58);font:600 .72rem system-ui,sans-serif;color:#536256}
.journey-step{appearance:none;text-align:left;color:inherit;font:inherit;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.journey-step:hover,.journey-step:focus-visible{transform:translateY(-2px);border-color:rgba(58,125,68,.42);box-shadow:0 8px 20px rgba(52,67,48,.09);outline:none}.journey-step:focus-visible{box-shadow:0 0 0 3px rgba(58,125,68,.14),0 8px 20px rgba(52,67,48,.09)}
@media(max-width:720px){.hearth-square{grid-template-columns:1fr}.hearth-residents{justify-content:flex-start;min-height:54px}.hearth-landmarks{grid-column:auto}.resident-token{width:40px;height:40px}}@media(prefers-reduced-motion:reduce){.journey-step{transition:none}.journey-step:hover,.journey-step:focus-visible{transform:none}}

/* Population catch-up P2/P3 — evidence-faithful resident presence. */
.resident-population-strip{display:grid;gap:.75rem;padding:.9rem 1rem;border:1px solid rgba(71,82,69,.16);border-radius:20px;background:rgba(255,252,244,.72)}
.resident-population-heading{display:flex;justify-content:space-between;gap:1rem;align-items:end}.resident-population-heading h3{margin:.1rem 0;font:500 1.08rem/1.2 Georgia,serif}.resident-population-heading>p{margin:0;color:var(--muted);font:600 .72rem/1.3 system-ui,sans-serif}
.resident-chip-row{display:flex;flex-wrap:wrap;gap:.45rem}.resident-chip{display:inline-flex;align-items:center;gap:.4rem;padding:.42rem .6rem;border:1px solid rgba(70,91,68,.16);border-radius:999px;background:rgba(255,255,255,.65)}
.resident-chip strong{font:700 .75rem/1.2 system-ui,sans-serif}.resident-chip small{color:var(--muted);font:600 .68rem/1.2 system-ui,sans-serif}.resident-chip[data-resident-active="true"]{border-color:rgba(58,125,68,.38);box-shadow:inset 0 0 0 1px rgba(58,125,68,.08)}
.resident-card{display:grid;gap:.75rem;padding:1rem;border:1px solid var(--line);border-radius:18px;background:rgba(255,252,244,.86)}.resident-card header{display:flex;gap:.7rem;align-items:center}.resident-card header h3{margin:0;font:500 1rem/1.2 Georgia,serif}.resident-card header p{margin:.15rem 0 0;color:var(--muted);font-size:.8rem}.resident-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--green-bg)}
.resident-card dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem}.resident-card dl div{display:grid;gap:.1rem}.resident-card dt{color:var(--muted);font:700 .64rem/1.2 system-ui,sans-serif;text-transform:uppercase;letter-spacing:.04em}.resident-card dd{margin:0;font-size:.78rem}.resident-boundary{margin:0;color:var(--muted);font:600 .62rem/1.35 system-ui,sans-serif}
@media(max-width:720px){.resident-population-heading{align-items:start;flex-direction:column}.resident-card dl{grid-template-columns:1fr}}

/* Homecoming H8-A · Post Office civic doorway */
.hearth-landmarks .hearth-doorway{appearance:none;padding:.42rem .6rem;border:1px solid rgba(70,91,68,.22);border-radius:999px;background:rgba(255,255,255,.72);font:600 .72rem system-ui,sans-serif;color:#46584a;cursor:pointer}.hearth-landmarks .hearth-doorway:hover,.hearth-landmarks .hearth-doorway:focus-visible{background:rgba(255,255,255,.96);outline:2px solid rgba(70,91,68,.38);outline-offset:2px}.civic-room{display:grid;gap:1rem;max-width:980px;margin:0 auto;padding:clamp(.4rem,2vw,1.2rem)}.civic-room-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.civic-room-header h2{margin:.15rem 0 .35rem;font:500 clamp(1.8rem,5vw,2.8rem)/1.05 Georgia,serif}.civic-room-header p:last-child{max-width:46rem;color:var(--muted);line-height:1.55}.civic-room-panel{padding:1rem 1.1rem;border:1px solid rgba(70,91,68,.15);border-radius:16px;background:rgba(255,255,255,.48)}.civic-room-panel h3{margin:.15rem 0 .4rem;font:500 1.15rem/1.25 Georgia,serif}.postal-lifecycle{display:flex;flex-wrap:wrap;gap:.45rem;margin:.75rem 0 0;padding:0;list-style:none;counter-reset:postal}.postal-lifecycle li{counter-increment:postal;padding:.5rem .7rem;border:1px solid rgba(70,91,68,.14);border-radius:999px;background:rgba(255,255,255,.65)}.postal-lifecycle li:before{content:counter(postal) ". ";font-weight:700}.postal-truth-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;margin:.8rem 0 0}.postal-truth-grid>div{padding:.65rem;border-top:1px solid rgba(70,91,68,.14)}.postal-truth-grid dt{font-weight:700}.postal-truth-grid dd{margin:.18rem 0 0;color:var(--muted);line-height:1.45}.civic-room-boundary{font-size:.78rem;color:var(--muted)}html[data-presentation="boring"] .civic-room-panel,html[data-presentation="boring"] .postal-lifecycle li{background:#fff;border-radius:2px;box-shadow:none}@media(max-width:720px){.civic-room-header{display:grid}.civic-return{justify-self:start}.postal-truth-grid{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.hearth-landmarks .hearth-doorway{transition:none}}

/* Living World mobile catch-up — distinct places, not one repeated dashboard. */
html[data-presentation="living"] body {
  background:
    radial-gradient(circle at 12% 8%, rgba(227, 206, 150, .20), transparent 28rem),
    radial-gradient(circle at 90% 14%, rgba(118, 157, 131, .16), transparent 30rem),
    linear-gradient(180deg, #f8f3e8 0%, #f3ecdf 55%, #eef2e8 100%);
}
html[data-presentation="living"] .haven-app { min-height:100vh; isolation:isolate; }
html[data-presentation="living"] .haven-app::before {
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(120deg, rgba(255,255,255,.36), transparent 34%, rgba(82,112,91,.05));
}
html[data-presentation="living"] .haven-header {
  background:rgba(248,243,232,.82); backdrop-filter:blur(18px) saturate(1.15);
  border-bottom:1px solid rgba(79,96,78,.16); box-shadow:0 10px 34px rgba(61,74,58,.08);
}
html[data-presentation="living"] .shell-action,
html[data-presentation="living"] .settings-btn {
  background:rgba(255,252,244,.72); border-color:rgba(80,101,78,.18);
  box-shadow:0 4px 16px rgba(54,65,51,.05);
}
html[data-presentation="living"] .deep-view {
  overflow:hidden; border:1px solid rgba(73,92,73,.18); border-radius:24px;
  background:linear-gradient(145deg, rgba(255,252,243,.82), rgba(239,244,233,.76));
  box-shadow:0 18px 50px rgba(57,71,56,.09);
}
html[data-presentation="living"] .deep-view[data-active="true"] {
  border-color:rgba(72,108,78,.34); box-shadow:0 24px 70px rgba(39,63,47,.14);
}
html[data-active-screen="compass"][data-presentation="living"] .haven-main {
  background:radial-gradient(circle at 50% 0%, rgba(255,248,222,.45), transparent 36rem);
}
html[data-active-screen="execution"][data-presentation="living"] .haven-main {
  background:radial-gradient(circle at 50% 0%, rgba(218,231,220,.45), transparent 38rem);
}
html[data-active-screen="warden"][data-presentation="living"] body {
  background:linear-gradient(180deg,#edf2e9 0%,#e4eadf 46%,#f3ecdf 100%);
}
html[data-active-screen="warden"][data-presentation="living"] .haven-header {
  background:rgba(236,243,234,.90);
}
html[data-active-screen="warden"][data-presentation="living"] .deep-view > summary strong {
  font-size:clamp(1.35rem,4.6vw,2rem); font-family:Georgia,serif; font-weight:500;
}
html[data-active-screen="heatmap"][data-presentation="living"] body {
  background:linear-gradient(180deg,#f6f0e4,#eff0df 72%);
}
html[data-presentation="living"] .haven-nav {
  background:rgba(249,245,235,.9); backdrop-filter:blur(18px) saturate(1.1);
  border-top:1px solid rgba(77,93,74,.16); box-shadow:0 -10px 34px rgba(66,72,57,.06);
}
html[data-presentation="living"] .nav-item.active {
  color:#8c5638; background:rgba(255,249,235,.72); border-radius:14px;
}
html[data-presentation="living"] .nav-item.active .nav-icon { transform:translateY(-2px) scale(1.05); }
@media(max-width:720px){
  .haven-header{padding:.55rem .7rem;gap:.45rem;align-items:center}
  .haven-wordmark{font-size:1.7rem;line-height:.95}
  .shell-eyebrow{font-size:.55rem;letter-spacing:.16em}
  .header-actions{gap:.28rem;min-width:0}
  .header-actions .shell-action{min-height:40px;padding:.35rem .55rem;font-size:.72rem;line-height:1.05;text-align:center}
  .settings-btn{min-width:40px;min-height:40px}
  .deep-view{margin:.5rem .55rem 0}
  .deep-view>summary{padding:.72rem .8rem}
  .deep-view-body{padding:0 .8rem .85rem}
  .haven-main{padding-inline:.75rem;padding-bottom:calc(6.7rem + env(safe-area-inset-bottom))}
  .haven-nav{padding:.42rem .3rem calc(.38rem + env(safe-area-inset-bottom));gap:.12rem}
  .nav-item{min-width:0;padding:.38rem .18rem;font-size:.65rem;line-height:1.02;gap:.2rem}
  .nav-icon{font-size:1.35rem}
  .nav-label{white-space:normal;text-wrap:balance}
}
@media(max-width:390px){
  .header-actions .shell-action{padding-inline:.42rem;font-size:.68rem}
  .haven-wordmark{font-size:1.55rem}
  .nav-item{font-size:.6rem}
}

/* Deep View is a distinct operations room in Living World presentation. */
html[data-active-screen="warden"][data-presentation="living"] #screen-warden{
  max-width:980px;margin:0 auto;padding:clamp(.35rem,2vw,1rem);
}
html[data-active-screen="warden"][data-presentation="living"] .warden-page,
html[data-active-screen="warden"][data-presentation="living"] .redlever-page{
  border:1px solid rgba(66,91,69,.16);border-radius:22px;padding:1rem;
  background:rgba(250,252,246,.72);box-shadow:0 18px 48px rgba(46,68,51,.08)
}
html[data-active-screen="warden"][data-presentation="living"] .redlever-page{margin-top:1rem;background:rgba(255,249,240,.76)}
html[data-active-screen="warden"][data-presentation="living"] .warden-header{
  display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding-bottom:.8rem;
  border-bottom:1px solid rgba(66,91,69,.12)
}
html[data-active-screen="warden"][data-presentation="living"] .warden-header .screen-title,
html[data-active-screen="warden"][data-presentation="living"] .redlever-page>.screen-title{
  margin:.1rem 0;font:500 clamp(1.6rem,5vw,2.35rem)/1.05 Georgia,serif;color:#263c30
}
html[data-active-screen="warden"][data-presentation="living"] .storage-health-card,
html[data-active-screen="warden"][data-presentation="living"] .warden-report-card,
html[data-active-screen="warden"][data-presentation="living"] .add-lever-form,
html[data-active-screen="warden"][data-presentation="living"] .lever-card{
  border-color:rgba(66,91,69,.14);background:rgba(255,255,255,.62);box-shadow:none
}
html[data-active-screen="warden"][data-presentation="living"] .report-stats{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem
}
html[data-active-screen="warden"][data-presentation="living"] .report-stats .stat{
  border-radius:14px;background:rgba(71,102,78,.07);padding:.7rem
}
@media(max-width:720px){
  html[data-active-screen="warden"][data-presentation="living"] #screen-warden{padding:.25rem 0}
  html[data-active-screen="warden"][data-presentation="living"] .warden-page,
  html[data-active-screen="warden"][data-presentation="living"] .redlever-page{border-radius:18px;padding:.85rem}
  html[data-active-screen="warden"][data-presentation="living"] .warden-header{align-items:flex-start}
  html[data-active-screen="warden"][data-presentation="living"] .warden-header .btn-ghost{min-height:40px;white-space:nowrap}
  html[data-active-screen="warden"][data-presentation="living"] .report-stats{grid-template-columns:1fr 1fr}
}

/* Living Hearth catch-up — Today opens as a place before it reads as a dashboard. */
html[data-active-screen="compass"][data-presentation="living"] .compass-view{max-width:980px;margin:0 auto}
html[data-active-screen="compass"][data-presentation="living"] .compass-greeting{
  padding:.45rem .2rem .8rem;position:relative
}
html[data-active-screen="compass"][data-presentation="living"] .greeting-phase{
  color:#6f765c;letter-spacing:.12em
}
html[data-active-screen="compass"][data-presentation="living"] .greeting-text{
  font-size:clamp(2rem,7vw,3.8rem);line-height:.96;letter-spacing:-.025em;color:#24372d
}
html[data-active-screen="compass"][data-presentation="living"] .hearth-welcome{
  position:relative;overflow:hidden;min-height:250px;padding:clamp(1.15rem,4vw,2rem);
  border-color:rgba(76,103,76,.18);border-radius:30px;
  background:
    radial-gradient(circle at 86% 18%,rgba(255,224,144,.42),transparent 13rem),
    radial-gradient(circle at 18% 110%,rgba(102,151,93,.20),transparent 22rem),
    linear-gradient(142deg,rgba(255,252,242,.97),rgba(227,239,218,.9));
  box-shadow:0 26px 70px rgba(55,71,51,.12)
}
html[data-active-screen="compass"][data-presentation="living"] .hearth-welcome::before{
  content:"";position:absolute;inset:auto -8% -55px;width:116%;height:115px;border-radius:50%;
  background:linear-gradient(180deg,rgba(125,165,101,.16),rgba(88,132,78,.10));pointer-events:none
}
html[data-active-screen="compass"][data-presentation="living"] .hearth-welcome>div{position:relative;z-index:1}
html[data-active-screen="compass"][data-presentation="living"] .hearth-welcome h2{
  font:500 clamp(2.1rem,6vw,3.6rem)/.98 Georgia,serif;letter-spacing:-.025em;color:#294132;margin:.2rem 0 .55rem
}
html[data-active-screen="compass"][data-presentation="living"] .hearth-welcome>div:first-child>p:last-child{
  max-width:32rem;font-size:1rem;color:#526257
}
html[data-active-screen="compass"][data-presentation="living"] .hearth-pulse{
  align-self:center;padding:1rem;border:1px solid rgba(76,103,76,.14);border-radius:20px;
  background:rgba(255,255,255,.48);backdrop-filter:blur(8px)
}
html[data-active-screen="compass"][data-presentation="living"] .pulse-track{height:10px;background:rgba(43,70,50,.09)}
html[data-active-screen="compass"][data-presentation="living"] .hearth-square{
  margin-top:.8rem;min-height:190px;border-radius:28px;padding:clamp(1rem,3vw,1.6rem);
  background:
    radial-gradient(circle at 76% 16%,rgba(252,218,130,.34),transparent 12rem),
    linear-gradient(145deg,rgba(233,244,220,.96),rgba(255,245,223,.92));
  box-shadow:0 18px 48px rgba(58,78,53,.08)
}
html[data-active-screen="compass"][data-presentation="living"] .hearth-square-copy h3{
  font-size:clamp(1.55rem,4vw,2.1rem);line-height:1.06;color:#304838
}
html[data-active-screen="compass"][data-presentation="living"] .hearth-landmarks{gap:.55rem;margin-top:.25rem}
html[data-active-screen="compass"][data-presentation="living"] .hearth-landmarks span,
html[data-active-screen="compass"][data-presentation="living"] .hearth-landmarks .hearth-doorway{
  min-height:40px;display:inline-flex;align-items:center;padding:.48rem .72rem;
  background:rgba(255,255,255,.66);border-color:rgba(67,94,68,.15);box-shadow:0 4px 12px rgba(49,70,51,.04)
}
html[data-active-screen="compass"][data-presentation="living"] .hearth-journey{
  margin-top:.8rem;gap:.65rem
}
html[data-active-screen="compass"][data-presentation="living"] .journey-step{
  min-height:112px;border-radius:20px;background:rgba(255,252,244,.78);border-color:rgba(72,95,71,.15);
  box-shadow:0 10px 26px rgba(55,70,52,.05)
}
html[data-active-screen="compass"][data-presentation="living"] .realm-entry{
  margin-top:1rem;border-radius:26px;padding:1.1rem;background:rgba(251,248,238,.76);
  border-color:rgba(74,97,74,.16);box-shadow:0 18px 44px rgba(58,72,55,.07)
}
html[data-active-screen="compass"][data-presentation="living"] .realm-entry h3{
  font:500 clamp(1.45rem,4vw,2rem)/1.08 Georgia,serif;color:#2d4435
}
html[data-active-screen="compass"][data-presentation="living"] .realm-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}
html[data-active-screen="compass"][data-presentation="living"] .realm-card{
  display:flex;flex-direction:column;gap:.35rem;min-height:150px;border-radius:21px;padding:1rem;
  background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(238,244,231,.68));border-color:rgba(70,94,70,.15);
  box-shadow:0 12px 28px rgba(58,75,56,.06);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease
}
html[data-active-screen="compass"][data-presentation="living"] .realm-card:nth-child(2){background:linear-gradient(145deg,rgba(249,255,246,.84),rgba(224,240,219,.75))}
html[data-active-screen="compass"][data-presentation="living"] .realm-card:nth-child(3){background:linear-gradient(145deg,rgba(255,250,238,.86),rgba(241,229,207,.72))}
html[data-active-screen="compass"][data-presentation="living"] .realm-card>span{font-size:1.8rem;line-height:1}
html[data-active-screen="compass"][data-presentation="living"] .realm-card strong{font:500 1.15rem/1.15 Georgia,serif}
html[data-active-screen="compass"][data-presentation="living"] .realm-card:hover,
html[data-active-screen="compass"][data-presentation="living"] .realm-card:focus-visible{
  transform:translateY(-3px);border-color:rgba(63,107,68,.34);box-shadow:0 18px 38px rgba(58,75,56,.11)
}
@media(max-width:720px){
  html[data-active-screen="compass"][data-presentation="living"] .compass-greeting{padding:.35rem .25rem .7rem}
  html[data-active-screen="compass"][data-presentation="living"] .greeting-text{font-size:clamp(2rem,10vw,3rem)}
  html[data-active-screen="compass"][data-presentation="living"] .hearth-welcome{min-height:0;border-radius:24px;padding:1.15rem}
  html[data-active-screen="compass"][data-presentation="living"] .hearth-welcome h2{font-size:clamp(2rem,11vw,3rem)}
  html[data-active-screen="compass"][data-presentation="living"] .hearth-pulse{padding:.75rem;border-radius:16px}
  html[data-active-screen="compass"][data-presentation="living"] .hearth-square{border-radius:22px;min-height:0}
  html[data-active-screen="compass"][data-presentation="living"] .hearth-journey{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-.75rem;padding:.1rem .75rem .55rem;scrollbar-width:none}
  html[data-active-screen="compass"][data-presentation="living"] .hearth-journey::-webkit-scrollbar{display:none}
  html[data-active-screen="compass"][data-presentation="living"] .journey-step{flex:0 0 10.5rem;scroll-snap-align:start;min-height:108px}
  html[data-active-screen="compass"][data-presentation="living"] .realm-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-1.1rem;padding:.1rem 1.1rem .55rem;scrollbar-width:none}
  html[data-active-screen="compass"][data-presentation="living"] .realm-grid::-webkit-scrollbar{display:none}
  html[data-active-screen="compass"][data-presentation="living"] .realm-card{flex:0 0 min(78vw,18rem);scroll-snap-align:start;min-height:136px}
}
@media(prefers-reduced-motion:reduce){
  html[data-active-screen="compass"][data-presentation="living"] .realm-card{transition:none}
  html[data-active-screen="compass"][data-presentation="living"] .realm-card:hover,
  html[data-active-screen="compass"][data-presentation="living"] .realm-card:focus-visible{transform:none}
}

/* Tidal Wave 01 — embodiment canvas. Structural visual layers create place before data. */
.hearth-square{min-height:clamp(330px,56vw,520px);align-content:end;isolation:isolate;padding:clamp(1rem,4vw,1.5rem);background:linear-gradient(180deg,rgba(18,39,31,.06),rgba(248,241,218,.9))}
.hearth-scene-art{position:absolute;inset:0;z-index:-1;overflow:hidden;border-radius:inherit;background:linear-gradient(180deg,#b9cfcb 0%,#dce8d2 38%,#809b68 39%,#445f3d 100%)}
.hearth-scene-sky{position:absolute;inset:0 0 42%;background:radial-gradient(circle at 76% 22%,rgba(255,244,190,.95) 0 4%,rgba(255,244,190,.28) 5% 15%,transparent 28%),linear-gradient(180deg,#adc8cf,#e5e0c1)}
.hearth-scene-canopy{position:absolute;inset:8% -8% auto;height:44%;background:radial-gradient(circle at 12% 80%,#24452f 0 10%,transparent 11%),radial-gradient(circle at 29% 54%,#3b6840 0 14%,transparent 15%),radial-gradient(circle at 67% 61%,#315c38 0 15%,transparent 16%),radial-gradient(circle at 91% 76%,#21432f 0 12%,transparent 13%)}
.hearth-scene-sanctuary{position:absolute;left:50%;top:19%;width:34%;height:36%;transform:translateX(-50%);clip-path:polygon(12% 100%,12% 35%,25% 35%,25% 20%,40% 20%,50% 0,60% 20%,75% 20%,75% 35%,88% 35%,88% 100%);background:linear-gradient(90deg,#725232,#c29a5a 48%,#6b4b2e);box-shadow:0 0 34px rgba(255,205,116,.42)}
.hearth-scene-sanctuary:after{content:"";position:absolute;left:43%;bottom:8%;width:14%;height:38%;border-radius:50% 50% 0 0;background:#18342d;box-shadow:0 0 22px rgba(255,220,149,.8)}
.hearth-scene-water{position:absolute;left:42%;bottom:-10%;width:20%;height:54%;transform:perspective(180px) rotateX(58deg);border-radius:50%;background:linear-gradient(180deg,rgba(157,210,206,.9),rgba(45,105,103,.72));box-shadow:0 0 18px rgba(204,244,236,.45)}
.hearth-scene-path{position:absolute;left:20%;right:20%;bottom:-6%;height:43%;clip-path:polygon(44% 0,56% 0,88% 100%,12% 100%);background:linear-gradient(180deg,#d3b983,#806747);opacity:.78}
.hearth-scene-lantern{position:absolute;width:9px;height:9px;border-radius:50%;background:#ffd784;box-shadow:0 0 8px 3px rgba(255,190,80,.72)}.lantern-one{left:24%;bottom:23%}.lantern-two{right:24%;bottom:29%}
.hearth-square-copy,.hearth-residents,.hearth-landmarks{padding:.8rem;border-radius:16px;background:linear-gradient(180deg,rgba(250,247,235,.90),rgba(247,240,222,.76));backdrop-filter:blur(8px);box-shadow:0 8px 28px rgba(17,39,29,.16)}
.hearth-square-copy{max-width:43rem}.hearth-residents{justify-self:end;align-self:end}.hearth-landmarks{justify-self:start}
@media(max-width:720px){.hearth-square{min-height:460px}.hearth-square-copy{align-self:end}.hearth-residents{justify-self:start}.hearth-landmarks{background:rgba(250,247,235,.82)}}
html[data-presentation="boring"] .hearth-scene-art{display:none}html[data-presentation="boring"] .hearth-square{min-height:auto;background:#fff}html[data-presentation="boring"] .hearth-square-copy,html[data-presentation="boring"] .hearth-residents,html[data-presentation="boring"] .hearth-landmarks{background:#fff;box-shadow:none;backdrop-filter:none}


/* Tidal Wave 02 — Living Gate → Heart Square arrival */
.living-gate-arrival{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(360px,60vw,590px);display:grid;grid-template-columns:minmax(0,1.05fr) minmax(220px,.55fr);align-items:end;gap:1rem;padding:clamp(1rem,4vw,1.6rem);border:1px solid rgba(48,74,53,.2);border-radius:28px;background:#1f392d;box-shadow:0 22px 58px rgba(28,46,33,.18)}
.living-gate-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.living-gate-arrival:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,28,22,.02) 20%,rgba(12,27,21,.24) 58%,rgba(11,24,19,.72) 100%)}
.living-gate-copy,.living-gate-weather{border:1px solid rgba(255,245,215,.24);background:linear-gradient(180deg,rgba(24,45,34,.72),rgba(18,36,28,.88));color:#fff9e9;backdrop-filter:blur(12px);box-shadow:0 14px 34px rgba(4,18,12,.24)}
.living-gate-copy{max-width:40rem;padding:1rem 1.1rem;border-radius:20px}.living-gate-copy .stub-label{color:#d7e4bc}.living-gate-copy h2{margin:.12rem 0 .42rem;font:500 clamp(2rem,6vw,4.2rem)/.95 Georgia,serif;letter-spacing:-.04em}.living-gate-copy p{max-width:34rem;margin:.25rem 0 .85rem;line-height:1.5;color:#f2ead8}.living-gate-enter{display:inline-flex;gap:.55rem;align-items:center;padding:.68rem .9rem;border:1px solid rgba(255,228,165,.42);border-radius:999px;background:rgba(255,244,213,.12);color:#fff8e2;text-decoration:none;font:700 .82rem/1 system-ui,sans-serif}.living-gate-enter:hover,.living-gate-enter:focus-visible{background:rgba(255,244,213,.2)}
.living-gate-weather{justify-self:end;max-width:19rem;padding:.8rem .9rem;border-radius:16px}.living-gate-weather span,.living-gate-weather small{display:block}.living-gate-weather span{font:700 .72rem/1.2 system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#c9dfcf}.living-gate-weather strong{display:block;margin:.28rem 0;font:600 .96rem/1.3 system-ui,sans-serif}.living-gate-weather small{line-height:1.35;color:#e9e0cd}
#heart-square{scroll-margin-top:110px}html[data-presentation="living"] .heart-home{gap:1rem}
@media(max-width:720px){.living-gate-arrival{grid-template-columns:1fr;min-height:520px;border-radius:24px}.living-gate-weather{justify-self:start;max-width:100%}.living-gate-copy h2{font-size:clamp(2.35rem,13vw,3.7rem)}}
@media(prefers-reduced-motion:reduce){.living-gate-enter{scroll-behavior:auto}}
html[data-presentation="boring"] .living-gate-arrival{min-height:auto;display:block;padding:1rem;border-radius:18px;background:#fff;box-shadow:none;color:var(--ink)}html[data-presentation="boring"] .living-gate-art,html[data-presentation="boring"] .living-gate-arrival:after{display:none}html[data-presentation="boring"] .living-gate-copy,html[data-presentation="boring"] .living-gate-weather{max-width:none;margin:0 0 .75rem;padding:0;border:0;background:transparent;color:var(--ink);backdrop-filter:none;box-shadow:none}html[data-presentation="boring"] .living-gate-copy h2{font-size:1.6rem}html[data-presentation="boring"] .living-gate-copy p,html[data-presentation="boring"] .living-gate-weather small{color:var(--muted)}html[data-presentation="boring"] .living-gate-enter{border-color:rgba(0,0,0,.15);background:#fff;color:var(--ink)}


/* Tidal Wave 03 — scenic Commons district cards */
.commons-district{padding:1rem 0 .25rem}.commons-district-heading{max-width:44rem;margin:0 0 .8rem}.commons-district-heading h3{margin:.12rem 0 .3rem;font:500 clamp(1.5rem,4vw,2.35rem)/1.05 Georgia,serif}.commons-district-heading p:last-child{margin:.15rem 0;color:var(--muted);line-height:1.45}.commons-place-grid{display:grid;grid-template-columns:repeat(5,minmax(160px,1fr));gap:.75rem;overflow-x:auto;padding:.12rem .08rem .75rem;scroll-snap-type:x proximity}.commons-place-card{position:relative;scroll-snap-align:start;overflow:hidden;min-height:240px;padding:0;border:1px solid rgba(56,75,59,.18);border-radius:20px;background:#1e3329;color:#fff;text-align:left;box-shadow:0 12px 30px rgba(28,45,32,.12)}button.commons-place-card{cursor:pointer}.commons-place-card img{display:block;width:100%;height:155px;object-fit:cover;transition:transform .25s ease}.commons-place-card>span{display:grid;gap:.2rem;padding:.72rem .78rem .82rem;background:linear-gradient(180deg,rgba(20,40,31,.86),rgba(16,31,25,.98))}.commons-place-card strong{font:600 1rem/1.2 Georgia,serif}.commons-place-card small{color:#dce7d7;line-height:1.35}.commons-place-card em{margin-top:.2rem;color:#e7c985;font:600 .67rem/1.2 system-ui,sans-serif;font-style:normal;text-transform:uppercase;letter-spacing:.05em}.commons-place-card:hover img,.commons-place-card:focus-visible img{transform:scale(1.035)}.commons-place-card.dormant{opacity:.9}.commons-place-card.dormant:after{content:"Path forming";position:absolute;top:.6rem;right:.6rem;padding:.28rem .42rem;border-radius:999px;background:rgba(18,37,28,.75);color:#f5e5ba;font:700 .6rem/1 system-ui,sans-serif;text-transform:uppercase;letter-spacing:.06em}
@media(max-width:900px){.commons-place-grid{grid-template-columns:repeat(5,minmax(230px,74vw));margin-right:-1rem;padding-right:1rem}}@media(prefers-reduced-motion:reduce){.commons-place-card img{transition:none}.commons-place-card:hover img,.commons-place-card:focus-visible img{transform:none}}html[data-presentation="boring"] .commons-place-grid{display:grid;grid-template-columns:1fr;overflow:visible}html[data-presentation="boring"] .commons-place-card{min-height:0;display:block;border-radius:12px;background:#fff;color:var(--ink);box-shadow:none}html[data-presentation="boring"] .commons-place-card img{display:none}html[data-presentation="boring"] .commons-place-card>span{background:#fff;color:var(--ink)}html[data-presentation="boring"] .commons-place-card small{color:var(--muted)}


/* Tidal Wave 06 — resident embodiment without invented identity */
.resident-population-strip{position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(240,247,226,.88),rgba(255,247,227,.82));box-shadow:0 12px 30px rgba(41,63,43,.08)}.resident-population-strip:before{content:"";position:absolute;inset:auto -8% -32px;height:86px;background:radial-gradient(ellipse at center,rgba(83,126,71,.16),transparent 68%);pointer-events:none}.resident-chip-row{position:relative;z-index:1}.resident-chip{min-height:52px;padding:.34rem .58rem .34rem .36rem;border-radius:18px;background:rgba(255,253,245,.78);backdrop-filter:blur(8px)}.resident-chip-avatar{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;overflow:hidden;border:1px solid rgba(66,91,67,.18);border-radius:44% 44% 50% 50%;background:linear-gradient(145deg,#dfe9ce,#f4e6c5);box-shadow:0 5px 12px rgba(42,63,44,.11)}.resident-chip-avatar img,.resident-mark img{width:100%;height:100%;object-fit:cover;display:block}.resident-chip-copy{display:grid;gap:.08rem}.resident-chip-copy strong,.resident-chip-copy small{display:block}.resident-chip[data-visual-mode="admitted_embodiment"] .resident-chip-avatar{border-color:rgba(169,129,54,.42);box-shadow:0 0 0 2px rgba(221,192,123,.14),0 6px 14px rgba(42,63,44,.12)}.resident-mark{overflow:hidden;border:1px solid rgba(66,91,67,.18);background:linear-gradient(145deg,#dfe9ce,#f4e6c5);box-shadow:0 6px 14px rgba(42,63,44,.1)}.resident-mark.resident-portrait{width:54px;height:54px;border-radius:42% 42% 50% 50%}.resident-card[data-visual-mode="admitted_embodiment"]{border-color:rgba(169,129,54,.28);background:linear-gradient(145deg,rgba(255,252,242,.94),rgba(239,246,225,.88))}
html[data-presentation="boring"] .resident-chip-avatar,html[data-presentation="boring"] .resident-mark{box-shadow:none;background:#fff;border-radius:2px}html[data-presentation="boring"] .resident-population-strip{background:#fff;box-shadow:none}html[data-presentation="boring"] .resident-population-strip:before{display:none}


/* Tidal Wave 07 — Verdant + Rooted + Celestial art-direction system */
:root{--verdant-deep:#24472f;--verdant:#537c4b;--verdant-soft:#b8cca0;--rooted-wood:#76553a;--rooted-gold:#b88d48;--rooted-cream:#f5ecd7;--celestial:#625f8d;--celestial-blue:#426b7d;--lantern:#f2c574;--living-glass:rgba(249,245,231,.78)}body{background:radial-gradient(circle at 18% 4%,rgba(129,157,106,.16),transparent 30%),radial-gradient(circle at 88% 16%,rgba(92,88,135,.10),transparent 24%),linear-gradient(160deg,#f9f4e8 0%,#eef0df 54%,#f2e5d5 100%)}body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.38;background-image:radial-gradient(circle at 12px 12px,rgba(72,104,69,.12) 0 1px,transparent 1.5px),radial-gradient(circle at 38px 26px,rgba(94,88,135,.09) 0 1px,transparent 1.5px);background-size:52px 52px,66px 66px}.haven-header{height:auto;min-height:64px;padding:.45rem .8rem;background:linear-gradient(180deg,rgba(249,245,232,.96),rgba(244,239,222,.9));border-bottom-color:rgba(85,85,62,.16);box-shadow:0 6px 18px rgba(53,66,48,.06)}.haven-brand-lockup{display:flex;align-items:center;gap:.55rem;min-width:0}.haven-crest{width:34px;height:34px;flex:0 0 34px}.haven-brand-lockup>div{min-width:0}.haven-brand-lockup .shell-eyebrow{margin:0 0 .05rem;font:700 .55rem/1.05 system-ui,sans-serif;letter-spacing:.11em;color:#607260;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:19rem}.haven-wordmark{font-size:1.45rem;letter-spacing:.065em;color:var(--verdant-deep)}.haven-art-axis{margin:.02rem 0 0;font:700 .48rem/1.1 system-ui,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--rooted-gold)}.haven-art-axis span{color:var(--celestial)}.header-actions{align-items:center}.shell-action{border-color:rgba(83,95,69,.18);background:rgba(255,252,241,.62)}html[data-presentation="living"] .shell-action[aria-pressed="true"],html[data-presentation="living"] .nav-item.active{background:linear-gradient(180deg,rgba(226,235,205,.9),rgba(246,232,199,.82));color:var(--verdant-deep)}html[data-presentation="living"] .haven-main:before{content:"✦";position:fixed;right:1rem;top:5.4rem;color:rgba(98,95,141,.28);font-size:1rem;pointer-events:none}
@media(max-width:520px){.haven-brand-lockup .shell-eyebrow{max-width:8.6rem;font-size:.48rem}.haven-art-axis{font-size:.42rem;letter-spacing:.08em}.haven-crest{width:30px;height:30px;flex-basis:30px}.haven-wordmark{font-size:1.25rem}.haven-header{min-height:62px;padding:.38rem .55rem}}@media(max-width:390px){.haven-brand-lockup .shell-eyebrow{display:none}.haven-art-axis{max-width:7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}html[data-presentation="boring"] body{background:#fff}html[data-presentation="boring"] body:before,html[data-presentation="boring"] .haven-crest,html[data-presentation="boring"] .haven-art-axis,html[data-presentation="boring"] .haven-main:before{display:none}html[data-presentation="boring"] .haven-header{background:#fff;box-shadow:none}


/* Tidal Wave 08 — gentle travel and living-world motion */
@keyframes haven-screen-arrive{0%{opacity:.78;transform:translateY(10px) scale(.995)}55%{opacity:1}100%{opacity:1;transform:none}}@keyframes haven-lantern-breathe{0%,100%{filter:drop-shadow(0 0 4px rgba(243,193,100,.28))}50%{filter:drop-shadow(0 0 10px rgba(243,193,100,.62))}}@keyframes haven-water-shift{0%,100%{transform:translateX(-1%) scaleX(1.01)}50%{transform:translateX(1%) scaleX(.995)}}@keyframes haven-star-breathe{0%,100%{opacity:.28;transform:scale(.92) rotate(0deg)}50%{opacity:.6;transform:scale(1.08) rotate(8deg)}}html[data-presentation="living"] .haven-screen.active.screen-arriving{animation:haven-screen-arrive .42s cubic-bezier(.2,.8,.2,1) both}html[data-presentation="living"] .hearth-scene-lantern{animation:haven-lantern-breathe 3.8s ease-in-out infinite}html[data-presentation="living"] .hearth-scene-water{animation:haven-water-shift 7s ease-in-out infinite;transform-origin:center bottom}html[data-presentation="living"] .haven-main:before{animation:haven-star-breathe 5.5s ease-in-out infinite}.living-gate-art,.hearth-scene-art,.commons-place-card img{will-change:auto}.haven-screen{transform-origin:50% 0}
@media(prefers-reduced-motion:reduce){html[data-presentation="living"] .haven-screen.active.screen-arriving,html[data-presentation="living"] .hearth-scene-lantern,html[data-presentation="living"] .hearth-scene-water,html[data-presentation="living"] .haven-main:before{animation:none!important}.haven-screen{transform:none!important}}html[data-presentation="boring"] .screen-arriving,html[data-presentation="boring"] .hearth-scene-lantern,html[data-presentation="boring"] .hearth-scene-water{animation:none!important}


/* Tidal Wave 09 — Heart-in-Hand mobile place navigation */
.mobile-place-dock{display:none}.mobile-place-symbol{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:linear-gradient(145deg,rgba(226,237,207,.95),rgba(247,232,198,.9));color:var(--verdant-deep);font:700 1rem/1 Georgia,serif}.mobile-place-dock>span:nth-child(2){display:grid;gap:.02rem;min-width:0}.mobile-place-dock small{font:700 .55rem/1 system-ui,sans-serif;text-transform:uppercase;letter-spacing:.11em;color:#728071}.mobile-place-dock strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 .85rem/1.15 Georgia,serif}.mobile-place-water{margin-left:auto;padding:.3rem .48rem;border-radius:999px;background:rgba(74,109,104,.1);color:#436866;font:700 .58rem/1 system-ui,sans-serif;white-space:nowrap}
@media(max-width:720px){:root{--nav-height:72px}.mobile-place-dock{position:fixed;display:flex;align-items:center;gap:.55rem;left:50%;bottom:calc(var(--nav-height) + var(--safe-bottom) - 1px);transform:translateX(-50%);z-index:99;width:min(100%,600px);padding:.42rem .65rem;border-top:1px solid rgba(51,67,53,.12);border-bottom:1px solid rgba(51,67,53,.08);background:linear-gradient(180deg,rgba(248,244,230,.92),rgba(241,238,219,.96));backdrop-filter:blur(12px);box-shadow:0 -8px 22px rgba(42,57,43,.06)}.haven-main{padding-bottom:calc(var(--nav-height) + var(--safe-bottom) + 54px)}.haven-nav{height:calc(var(--nav-height) + var(--safe-bottom));overflow-x:auto;overflow-y:hidden;justify-content:flex-start;scroll-snap-type:x proximity;padding:.35rem .32rem calc(.3rem + var(--safe-bottom));gap:.18rem;scrollbar-width:none}.haven-nav::-webkit-scrollbar{display:none}.nav-item{flex:0 0 76px;min-width:76px;scroll-snap-align:center;border:1px solid transparent;border-radius:16px;padding:.42rem .25rem}.nav-item.active{flex-basis:92px;border-color:rgba(87,108,77,.16);box-shadow:0 5px 14px rgba(56,70,53,.07)}.nav-icon{font-size:1.15rem}.nav-label{font-size:.67rem;line-height:1.08}.nav-item.active .nav-label{font-weight:700}}@media(max-width:390px){.nav-item{flex-basis:72px;min-width:72px}.nav-item.active{flex-basis:86px}.mobile-place-dock{padding-inline:.5rem}}html[data-presentation="boring"] .mobile-place-dock{background:#fff;box-shadow:none}html[data-presentation="boring"] .mobile-place-symbol{background:#fff;border:1px solid #777;border-radius:2px}html[data-presentation="boring"] .mobile-place-water{background:#fff;border:1px solid #aaa;border-radius:2px;color:#333}


/* Tidal Wave 10 — civic rooms arrive as places, not documents */
.civic-arrival{position:relative;overflow:hidden;isolation:isolate;min-height:clamp(260px,42vw,430px);display:flex;align-items:end;padding:1rem 1.1rem;border:1px solid rgba(78,83,65,.18);border-radius:26px;box-shadow:0 18px 48px rgba(34,45,34,.14)}.civic-arrival>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.civic-arrival:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 25%,rgba(15,26,21,.72) 100%)}.civic-arrival>div{max-width:38rem;padding:.8rem .9rem;border:1px solid rgba(255,242,205,.22);border-radius:17px;background:rgba(26,37,31,.74);backdrop-filter:blur(10px);color:#fff8e8}.civic-arrival .stub-label{color:#d5ddb9}.civic-arrival h2{margin:.08rem 0 .3rem;font:500 clamp(1.8rem,5vw,3rem)/1 Georgia,serif}.civic-arrival p:last-child{margin:.15rem 0;color:#f0e6d2;line-height:1.4}.civic-room-panel{background:linear-gradient(145deg,rgba(255,253,244,.72),rgba(239,244,225,.64));backdrop-filter:blur(7px)}[data-civic-room="post-office"] .postal-lifecycle li{background:linear-gradient(180deg,rgba(247,232,199,.82),rgba(255,251,238,.75))}[data-civic-room="chronicle"] .civic-room-panel{border-color:rgba(102,89,129,.16);background:linear-gradient(145deg,rgba(250,247,237,.76),rgba(235,229,243,.62))}@media(max-width:720px){.civic-arrival{min-height:380px;border-radius:22px}.civic-arrival>div{width:100%}}html[data-presentation="boring"] .civic-arrival{min-height:auto;padding:0;border:0;border-radius:0;background:#fff;box-shadow:none}html[data-presentation="boring"] .civic-arrival>img,html[data-presentation="boring"] .civic-arrival:after{display:none}html[data-presentation="boring"] .civic-arrival>div{max-width:none;padding:0;border:0;border-radius:0;background:#fff;color:var(--ink);backdrop-filter:none}html[data-presentation="boring"] .civic-arrival p:last-child{color:var(--muted)}


/* Tidal Wave 11 — personal surfaces become garden places */
.garden-arrival,.wellbeing-arrival{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(220px,34vw,360px);display:flex;align-items:end;margin:0 0 1rem;padding:1rem;border:1px solid rgba(71,91,68,.16);border-radius:25px;box-shadow:0 16px 40px rgba(42,63,43,.11)}.garden-arrival>img,.wellbeing-arrival>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.garden-arrival:after,.wellbeing-arrival:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 25%,rgba(16,35,26,.68) 100%)}.garden-arrival>div,.wellbeing-arrival>div{max-width:39rem;padding:.75rem .85rem;border:1px solid rgba(255,245,211,.2);border-radius:16px;background:rgba(21,42,31,.7);backdrop-filter:blur(9px);color:#fff8e7}.garden-arrival .eyebrow,.wellbeing-arrival .eyebrow{color:#d9e2b9}.garden-arrival .screen-title,.wellbeing-arrival .screen-title{color:#fff8e8;margin:.1rem 0 .3rem;font-size:clamp(1.7rem,5vw,2.8rem)}.garden-arrival p:last-child,.wellbeing-arrival .heatmap-subtitle{margin:.15rem 0;color:#f0e8d5;line-height:1.42}.habit-card{border-left:4px solid rgba(83,124,75,.45);background:linear-gradient(145deg,rgba(255,253,244,.82),rgba(235,243,221,.68))}.habit-summary{background:linear-gradient(145deg,rgba(231,239,212,.8),rgba(250,238,211,.66));border-color:rgba(83,124,75,.18)}.heatmap-grid{padding:1rem;border:1px solid rgba(83,124,75,.14);border-radius:22px;background:linear-gradient(145deg,rgba(247,243,227,.72),rgba(225,236,214,.66));box-shadow:inset 0 0 30px rgba(68,98,67,.04)}.heatmap-cell{border-radius:9px}.heatmap-high{box-shadow:0 0 12px rgba(73,126,73,.16)}@media(max-width:720px){.garden-arrival,.wellbeing-arrival{min-height:320px;border-radius:21px}.garden-arrival>div,.wellbeing-arrival>div{width:100%}}html[data-presentation="boring"] .garden-arrival,html[data-presentation="boring"] .wellbeing-arrival{min-height:auto;padding:0;border:0;border-radius:0;box-shadow:none}html[data-presentation="boring"] .garden-arrival>img,html[data-presentation="boring"] .wellbeing-arrival>img,html[data-presentation="boring"] .garden-arrival:after,html[data-presentation="boring"] .wellbeing-arrival:after{display:none}html[data-presentation="boring"] .garden-arrival>div,html[data-presentation="boring"] .wellbeing-arrival>div{max-width:none;padding:0;border:0;border-radius:0;background:#fff;color:var(--ink);backdrop-filter:none}html[data-presentation="boring"] .garden-arrival .screen-title,html[data-presentation="boring"] .wellbeing-arrival .screen-title{color:var(--ink)}html[data-presentation="boring"] .garden-arrival p:last-child,html[data-presentation="boring"] .wellbeing-arrival .heatmap-subtitle{color:var(--muted)}


/* Tidal Wave 12 — Check-in Garden + Chronicle Path */
.checkin-garden-arrival,.history-arrival{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(220px,33vw,350px);display:flex;align-items:end;margin:0 0 1rem;padding:1rem;border:1px solid rgba(70,88,67,.16);border-radius:24px;box-shadow:0 16px 38px rgba(40,57,41,.1)}.checkin-garden-arrival>img,.history-arrival>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.checkin-garden-arrival:after,.history-arrival:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 25%,rgba(15,31,24,.72) 100%)}.checkin-garden-arrival>div,.history-arrival>div{max-width:40rem;padding:.72rem .82rem;border:1px solid rgba(255,245,210,.2);border-radius:16px;background:rgba(22,39,31,.7);backdrop-filter:blur(8px);color:#fff8e8}.checkin-garden-arrival .screen-title,.history-arrival .screen-title{margin:.1rem 0 .25rem;color:#fff8e8;font-size:clamp(1.6rem,5vw,2.7rem)}.checkin-garden-arrival .eyebrow,.history-arrival .eyebrow{color:#d8e0b9}.checkin-garden-arrival p:last-child,.history-arrival p:last-child{margin:.12rem 0;color:#ede6d4;line-height:1.42}.checkin-tabs{padding:.35rem;border:1px solid rgba(79,104,76,.14);border-radius:18px;background:rgba(242,246,229,.64)}.ledger-header h3{margin:.2rem 0;font:500 1.2rem/1.2 Georgia,serif}.ledger-entry{border-left:3px solid rgba(98,95,141,.25);background:linear-gradient(145deg,rgba(255,252,243,.82),rgba(239,235,245,.58))}@media(max-width:720px){.checkin-garden-arrival,.history-arrival{min-height:310px;border-radius:20px}.checkin-garden-arrival>div,.history-arrival>div{width:100%}}html[data-presentation="boring"] .checkin-garden-arrival,html[data-presentation="boring"] .history-arrival{min-height:auto;padding:0;border:0;border-radius:0;box-shadow:none}html[data-presentation="boring"] .checkin-garden-arrival>img,html[data-presentation="boring"] .history-arrival>img,html[data-presentation="boring"] .checkin-garden-arrival:after,html[data-presentation="boring"] .history-arrival:after{display:none}html[data-presentation="boring"] .checkin-garden-arrival>div,html[data-presentation="boring"] .history-arrival>div{max-width:none;padding:0;border:0;border-radius:0;background:#fff;color:var(--ink);backdrop-filter:none}html[data-presentation="boring"] .checkin-garden-arrival .screen-title,html[data-presentation="boring"] .history-arrival .screen-title{color:var(--ink)}

/* === OBSERVATORY — Haven room === */
body[data-active-screen="observation"] {
  --obs-cream: #f5eedf;
  --obs-paper: rgba(250, 245, 233, 0.96);
  --obs-paper-soft: rgba(247, 240, 225, 0.91);
  --obs-moss: #3d4935;
  --obs-sage: #7b866e;
  --obs-gold: #a98b55;
  --obs-walnut: #4a3527;
  --obs-rose: #a88478;
  --obs-night: #111a23;
  --obs-line: rgba(91, 72, 45, 0.18);
  background:
    radial-gradient(circle at 84% 16%, rgba(224, 185, 108, .20), transparent 18rem),
    radial-gradient(circle at 10% 85%, rgba(63, 86, 59, .38), transparent 24rem),
    linear-gradient(115deg, rgba(20, 32, 28, .98), rgba(30, 33, 38, .94) 38%, rgba(22, 32, 47, .96));
  color: #2d3329;
}

body[data-active-screen="observation"]::before,
body[data-active-screen="observation"]::after {
  content: "";
  position: fixed;
  pointer-events: none;
  z-index: -1;
}
body[data-active-screen="observation"]::before {
  inset: 0;
  background:
    linear-gradient(90deg, transparent 0 7%, rgba(191, 154, 92, .12) 7.2% 7.45%, transparent 7.7% 92%, rgba(191, 154, 92, .12) 92.2% 92.45%, transparent 92.7%),
    repeating-radial-gradient(ellipse at 50% 0%, transparent 0 10.5rem, rgba(187, 151, 88, .08) 10.6rem 10.8rem, transparent 10.9rem 18rem);
}
body[data-active-screen="observation"]::after {
  width: 11rem;
  height: 11rem;
  right: 5vw;
  top: 9vh;
  border-radius: 50%;
  background: radial-gradient(circle at 42% 40%, #fff9df 0 32%, #d9c89d 33% 41%, rgba(255,255,255,.08) 42% 48%, transparent 49%);
  opacity: .56;
  filter: drop-shadow(0 0 18px rgba(238, 211, 149, .22));
}

body[data-active-screen="observation"] .haven-app {
  display: block;
  grid-template-columns: none;
  grid-template-rows: none;
  max-width: none;
  width: 100%;
  min-height: 100dvh;
  height: auto;
}
body[data-active-screen="observation"] .haven-header,
body[data-active-screen="observation"] .deep-view,
body[data-active-screen="observation"] .haven-nav {
  display: none;
}
body[data-active-screen="observation"] .haven-main {
  overflow: visible;
  padding: 0;
}
body[data-active-screen="observation"] #screen-observation {
  padding: 1rem;
  min-height: 100dvh;
}

.observation-world {
  width: min(1500px, 100%);
  min-height: calc(100dvh - 2rem);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(220px, 270px) minmax(0, 1fr);
  gap: 1rem;
  align-items: stretch;
}

.observation-rail,
.observation-sheet,
.observation-room-nav,
.observation-home-line {
  border: 1px solid rgba(188, 158, 104, .52);
  box-shadow: 0 20px 50px rgba(5, 10, 12, .24), inset 0 1px 0 rgba(255,255,255,.7);
}
.observation-rail {
  position: sticky;
  top: 1rem;
  align-self: start;
  min-height: calc(100dvh - 2rem);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 2rem 1.25rem 1.3rem;
  border-radius: 24px 8px 8px 24px;
  background:
    linear-gradient(rgba(250, 245, 233, .94), rgba(245, 237, 220, .94)),
    repeating-linear-gradient(0deg, rgba(88,64,38,.03) 0 1px, transparent 1px 4px);
  color: #344034;
}
.observation-brand { text-align: center; padding-bottom: .8rem; border-bottom: 1px solid var(--obs-line); }
.observation-brand strong { display: block; font-size: clamp(2rem, 4vw, 3rem); font-weight: 400; letter-spacing: .14em; line-height: 1; }
.observation-brand span { display:block; margin-top:.65rem; font-style: italic; color:#665b49; }
.observation-greeting { padding: .25rem .25rem .2rem; }
.observation-greeting strong { font-size: 1rem; font-weight: 600; }
.observation-greeting p { margin: .45rem 0 0; color:#6d6557; font-size:.9rem; line-height:1.55; font-style:italic; }
.rail-card { border:1px solid var(--obs-line); border-radius:16px; padding:1rem; background:rgba(255,252,244,.48); }
.rail-card h3 { margin:0 0 .75rem; font-size:.72rem; letter-spacing:.13em; text-transform:uppercase; font-weight:600; color:#625843; }
.rail-card dl { margin:0; display:grid; gap:.5rem; }
.rail-card dl div { display:flex; justify-content:space-between; gap:1rem; font-size:.82rem; }
.rail-card dd { margin:0; font-weight:700; color:#3e4c3c; }
.rail-season strong { display:block; font-size:1.15rem; font-weight:500; }
.rail-season p { margin:.35rem 0 0; color:#6d6557; font-size:.86rem; font-style:italic; }
.observation-rail blockquote { margin:auto 0 .4rem; padding:1.1rem .65rem; border-top:1px solid var(--obs-line); border-bottom:1px solid var(--obs-line); text-align:center; color:#675f50; font-style:italic; line-height:1.6; }

.observation-stage { min-width:0; display:flex; flex-direction:column; gap:.75rem; }
.observation-room-nav {
  display:flex;
  gap:0;
  overflow-x:auto;
  scrollbar-width:thin;
  border-radius:12px;
  background:rgba(247, 239, 224, .95);
  backdrop-filter: blur(14px);
}
.observation-room-nav button {
  flex:1 0 auto;
  min-height:48px;
  padding:.65rem .9rem;
  border:0;
  border-right:1px solid var(--obs-line);
  background:transparent;
  color:#4a463d;
  font:inherit;
  font-size:.84rem;
  cursor:pointer;
}
.observation-room-nav button:last-child { border-right:0; }
.observation-room-nav button:hover,
.observation-room-nav button:focus-visible { background:rgba(197,177,137,.18); outline:none; }
.observation-room-nav button.active { background:rgba(127,139,111,.18); color:#2e4230; font-weight:700; }

.observation-sheet {
  border-radius:14px;
  padding:1.2rem;
  background:
    linear-gradient(rgba(250,246,235,.975), rgba(246,239,225,.97)),
    repeating-linear-gradient(0deg, rgba(81,59,33,.025) 0 1px, transparent 1px 4px);
}
.observation-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:.1rem .25rem 1rem; }
.observation-title-row h2 { margin:.15rem 0 .15rem; font-size:clamp(2rem, 4vw, 3.1rem); font-weight:400; line-height:1; color:#313629; }
.observation-title-row p { margin:0; color:#6d6455; font-style:italic; }
.observation-kicker { font-size:.7rem!important; letter-spacing:.14em; text-transform:uppercase; font-style:normal!important; color:#907a55!important; }
.observation-time { display:flex; align-items:center; gap:.7rem; min-width:max-content; padding:.65rem .8rem; border-radius:14px; background:rgba(255,252,243,.55); border:1px solid var(--obs-line); }
.observation-time > span { font-size:1.7rem; color:#9a8057; }
.observation-time strong,.observation-time small { display:block; }
.observation-time strong { font-size:.8rem; font-weight:600; }
.observation-time small { margin-top:.15rem; color:#756b5c; font-size:.72rem; }

.observation-grid { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:.8rem; }
.observation-panel {
  min-width:0;
  min-height:230px;
  padding:1rem;
  border:1px solid var(--obs-line);
  border-radius:12px;
  background:rgba(255,252,245,.50);
}
.observation-panel > header { display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding-bottom:.65rem; margin-bottom:.75rem; border-bottom:1px solid var(--obs-line); }
.observation-panel h3 { margin:0; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; font-weight:700; color:#5d5548; }
.observation-panel header span { color:#9b8864; font-size:.75rem; }
.observation-panel header button,.observation-text-button,.journal-quick-add button {
  border:0; background:transparent; color:#7c6643; font:inherit; cursor:pointer; padding:.25rem .35rem; text-decoration:underline; text-underline-offset:3px;
}
.condition-lead { display:grid; grid-template-columns:minmax(0,1fr) 155px; gap:1rem; align-items:center; }
.condition-lead small,.moon-copy small { display:block; text-transform:uppercase; letter-spacing:.08em; font-size:.65rem; color:#847967; }
.condition-lead strong { display:block; margin:.2rem 0; font-size:1.35rem; font-weight:500; color:#3a4337; }
.condition-lead p { margin:.15rem 0 0; color:#746b5d; font-size:.78rem; font-style:italic; line-height:1.45; }
.observation-trend { width:100%; color:#9e8455; overflow:visible; }
.observation-trend text { font-size:8px; fill:#88765a; }
.observation-empty-trend { min-height:80px; display:grid; place-items:center; color:#8a8173; font-size:.76rem; font-style:italic; border-bottom:1px solid var(--obs-line); }
.condition-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.45rem; margin-top:.9rem; }
.condition-metrics div { min-width:0; padding:.6rem .55rem; border:1px solid rgba(91,72,45,.12); border-radius:9px; background:rgba(255,255,255,.34); }
.condition-metrics span { display:block; font-size:.64rem; color:#817665; }
.condition-metrics strong { display:block; margin-top:.2rem; font-size:1rem; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.signal-list { list-style:none; padding:0; margin:0; display:grid; gap:.1rem; }
.signal-list li { display:flex; justify-content:space-between; gap:1rem; padding:.56rem .2rem; border-bottom:1px solid rgba(91,72,45,.10); font-size:.8rem; }
.signal-list strong { font-weight:500; color:#56634e; text-align:right; }
.panel-whisper { margin:.75rem 0 0; color:#746b5d; font-size:.76rem; line-height:1.45; font-style:italic; }
.moon-panel { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:auto 1fr; gap:0 .9rem; }
.moon-panel header { grid-column:1/-1; }
.moon-orbit { width:min(150px,100%); aspect-ratio:1; border:1px dashed rgba(126,103,66,.38); border-radius:50%; display:grid; place-items:center; margin:auto; position:relative; }
.moon-orbit::before,.moon-orbit::after { content:""; position:absolute; width:7px; height:7px; border-radius:50%; background:#5f624f; }
.moon-orbit::before{top:-4px;left:50%}.moon-orbit::after{bottom:-4px;right:24%}
.moon-disc { width:78%; height:78%; display:grid; place-items:center; border-radius:50%; font-size:4rem; color:#806b4e; background:radial-gradient(circle at 35% 35%,#efe4c5,#c9b58c 55%,#786b58); box-shadow:inset -13px -8px 20px rgba(31,35,38,.35); }
.moon-copy { align-self:center; display:grid; gap:.25rem; font-size:.78rem; }
.moon-copy > strong { font-size:1rem; font-weight:500; }
.moon-copy > span,.moon-copy p { color:#73695a; font-size:.76rem; }
.moon-copy hr { width:100%; border:0; border-top:1px solid var(--obs-line); }
.reflections-panel { grid-column:span 1; }
.reflection-slip { display:grid; grid-template-columns:7.4rem minmax(0,1fr); gap:.6rem; padding:.55rem 0; border-bottom:1px solid rgba(91,72,45,.10); }
.reflection-slip span { color:#8b7654; font-size:.67rem; text-transform:uppercase; letter-spacing:.08em; }
.reflection-slip p { margin:0; color:#554f45; font-size:.78rem; line-height:1.4; }
.observation-empty { color:#7c7367; font-style:italic; font-size:.82rem; line-height:1.5; }
.active-area-list { display:grid; gap:.45rem; }
.active-area-list button { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.15rem .7rem; width:100%; padding:.58rem .65rem; border:0; border-bottom:1px solid rgba(91,72,45,.10); background:transparent; text-align:left; color:#3e4639; font:inherit; cursor:pointer; }
.active-area-list button::after { content:"→"; grid-column:2; grid-row:1/3; align-self:center; color:#8f7750; }
.active-area-list button span { font-size:.85rem; font-weight:600; }
.active-area-list button small { color:#786f61; font-size:.7rem; }
.prompt-panel blockquote { margin:1.5rem .5rem; text-align:center; color:#625949; font-size:1.03rem; line-height:1.65; font-style:italic; }
.journal-quick-add { margin-top:1rem; padding:.75rem; border:1px solid rgba(91,72,45,.12); border-radius:10px; background:rgba(255,255,255,.28); }
.journal-quick-add > span { display:block; font-size:.65rem; text-transform:uppercase; letter-spacing:.11em; color:#776b59; }
.journal-quick-add p { margin:.4rem 0; color:#766e61; font-size:.74rem; line-height:1.45; }
.observation-invitation { grid-column:1/-1; display:grid; grid-template-columns:minmax(0,2fr) repeat(3,minmax(0,.65fr)); gap:.5rem; align-items:center; margin-top:.8rem; padding:.75rem; border:1px solid var(--obs-line); border-radius:10px; background:rgba(248,241,226,.75); }
.observation-invitation div { padding:.1rem .5rem; }
.observation-invitation small { display:block; text-transform:uppercase; letter-spacing:.1em; color:#89765a; font-size:.62rem; }
.observation-invitation strong { display:block; margin-top:.2rem; color:#5f574b; font-weight:400; font-style:italic; }
.observation-invitation > span { padding:.6rem .7rem; border-left:1px solid var(--obs-line); color:#625b4e; font-size:.78rem; text-align:center; }
.observation-home-line { padding:.65rem 1rem; border-radius:9px; background:rgba(40,57,43,.92); color:#dbc99f; text-align:center; font-size:1.15rem; font-style:italic; letter-spacing:.03em; }

@media (max-width: 1100px) {
  .observation-world { grid-template-columns: 210px minmax(0,1fr); }
  .observation-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .moon-panel { grid-template-columns:130px 1fr; }
  .observation-invitation { grid-template-columns:1fr repeat(3,auto); }
}
@media (max-width: 820px) {
  body[data-active-screen="observation"] #screen-observation { padding:.55rem; }
  .observation-world { display:block; min-height:100dvh; }
  .observation-rail { position:relative; top:auto; min-height:0; border-radius:18px; margin-bottom:.55rem; padding:1rem; }
  .observation-brand { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; text-align:left; }
  .observation-brand strong { font-size:1.7rem; }
  .observation-brand span { margin:0; font-size:.78rem; }
  .observation-greeting,.rail-card,.observation-rail blockquote { display:none; }
  .observation-room-nav { position:sticky; top:.35rem; z-index:20; }
  .observation-room-nav button { min-height:44px; padding:.55rem .75rem; }
  .observation-sheet { padding:.85rem; }
  .observation-title-row { display:block; }
  .observation-time { width:max-content; margin-top:.7rem; }
  .observation-grid { grid-template-columns:1fr; }
  .observation-panel,.reflections-panel { grid-column:auto; min-height:0; }
  .observation-invitation { grid-template-columns:1fr; }
  .observation-invitation > span { border-left:0; border-top:1px solid var(--obs-line); }
}
@media (max-width: 520px) {
  .observation-room-nav button { font-size:.76rem; }
  .condition-lead { grid-template-columns:1fr; }
  .condition-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .moon-panel { grid-template-columns:110px 1fr; }
  .observation-title-row h2 { font-size:2rem; }
  .observation-home-line { font-size:1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .observation-world * { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}

.observation-settings{margin-top:auto;min-height:42px;border:1px solid var(--obs-line);border-radius:10px;background:rgba(255,252,244,.42);color:#625b4e;font:inherit;cursor:pointer}.observation-settings:hover,.observation-settings:focus-visible{background:rgba(197,177,137,.18);outline:none}
@media(max-width:820px){.observation-settings{align-self:flex-end;margin-top:0}}


/* Observatory wins over the generic living-world page wash. */
html[data-presentation="living"] body[data-active-screen="observation"] {
  background:
    radial-gradient(circle at 84% 16%, rgba(222, 181, 102, .18), transparent 19rem),
    radial-gradient(circle at 8% 78%, rgba(58, 86, 61, .44), transparent 28rem),
    linear-gradient(112deg, #111b18 0%, #18231f 26%, #171923 58%, #101b2a 100%);
}
html[data-active-screen="observation"][data-presentation="living"] .haven-main { background:transparent; }
html[data-presentation="living"] body[data-active-screen="observation"] .haven-app::before {
  background:
    linear-gradient(90deg, rgba(11,19,18,.12), transparent 18%, transparent 82%, rgba(11,19,18,.18)),
    radial-gradient(ellipse at 50% -12%, rgba(206,168,95,.12), transparent 46rem);
}


/* Observation Wave 2 — environmental embodiment: greenhouse, glass, brass, living night. */
body[data-active-screen="observation"] {
  position: relative;
  background:
    radial-gradient(circle at 82% 13%, rgba(246,213,148,.20) 0 1px, transparent 2px),
    radial-gradient(circle at 70% 6%, rgba(255,246,214,.34) 0 1px, transparent 2px),
    radial-gradient(circle at 91% 27%, rgba(255,242,197,.18) 0 1.5px, transparent 2.5px),
    radial-gradient(ellipse at 86% 18%, rgba(211,166,88,.18), transparent 18rem),
    radial-gradient(ellipse at 7% 80%, rgba(56,91,65,.50), transparent 31rem),
    linear-gradient(115deg, #101d19 0%, #182620 25%, #1d1c27 58%, #0e1b2a 100%);
  background-size:auto,auto,auto,auto,auto,auto;
}
body[data-active-screen="observation"] #screen-observation::before,
body[data-active-screen="observation"] #screen-observation::after {
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
}
body[data-active-screen="observation"] #screen-observation::before {
  background:
    repeating-linear-gradient(90deg, transparent 0 10.8vw, rgba(184,144,82,.12) 10.9vw 11.05vw, transparent 11.15vw 21.7vw),
    repeating-radial-gradient(ellipse at 50% -18%, transparent 0 15.5rem, rgba(191,151,87,.11) 15.65rem 15.85rem, transparent 16rem 25rem),
    linear-gradient(180deg, rgba(14,24,24,.06), rgba(6,13,15,.30));
  opacity:.9;
}
body[data-active-screen="observation"] #screen-observation::after {
  inset:auto 1.2vw 1.2vh auto;
  width:min(25vw,360px);
  height:min(44vh,430px);
  border:2px solid rgba(190,145,74,.33);
  border-left-width:10px;
  border-radius:52% 48% 18% 18% / 38% 38% 12% 12%;
  transform:rotate(-11deg);
  transform-origin:bottom right;
  background:
    radial-gradient(circle at 50% 20%, rgba(236,192,104,.18) 0 7%, transparent 7.5%),
    linear-gradient(88deg, transparent 45%, rgba(194,145,68,.28) 46% 52%, transparent 53%),
    linear-gradient(180deg, transparent 0 72%, rgba(29,18,12,.34) 73% 100%);
  filter:drop-shadow(0 16px 18px rgba(0,0,0,.35));
  opacity:.72;
}
body[data-active-screen="observation"] .observation-world { position:relative; z-index:1; }
.observation-world::before,
.observation-world::after {
  content:"";
  position:fixed;
  pointer-events:none;
  z-index:-1;
}
.observation-world::before {
  left:0;
  bottom:0;
  width:28vw;
  height:42vh;
  background:
    radial-gradient(ellipse at 0% 100%, rgba(15,45,30,.96) 0 30%, transparent 31%),
    radial-gradient(ellipse at 24% 93%, rgba(32,68,40,.72) 0 18%, transparent 19%),
    radial-gradient(ellipse at 13% 64%, rgba(39,77,45,.55) 0 10%, transparent 11%);
  filter:blur(.2px);
}
.observation-world::after {
  right:3vw;
  top:4vh;
  width:9rem;
  height:9rem;
  border-radius:50%;
  background:radial-gradient(circle at 38% 35%, #fff8dc 0 28%, #e1cda2 29% 37%, rgba(225,205,162,.15) 38% 47%, transparent 48%);
  box-shadow:0 0 45px rgba(236,207,143,.18);
  opacity:.8;
}
.observation-rail,
.observation-sheet,
.observation-room-nav {
  backdrop-filter:blur(10px) saturate(.9);
  -webkit-backdrop-filter:blur(10px) saturate(.9);
}
.observation-rail { box-shadow:0 24px 64px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.72); }
.observation-sheet { box-shadow:0 26px 70px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.68); }
.observation-room-nav { box-shadow:0 13px 30px rgba(0,0,0,.23), inset 0 1px 0 rgba(255,255,255,.72); }
.observation-brand::before { content:"✤"; display:block; margin-bottom:.65rem; color:#9a8055; font-size:1.15rem; }
.observation-title-row > div:first-child { position:relative; padding-left:1rem; }
.observation-title-row > div:first-child::before {
  content:""; position:absolute; left:0; top:.2rem; bottom:.15rem; width:2px;
  background:linear-gradient(180deg, transparent, rgba(155,123,70,.6) 22%, rgba(111,132,93,.45) 76%, transparent);
}
.observation-panel { position:relative; overflow:hidden; }
.observation-panel::after {
  content:""; position:absolute; right:-24px; bottom:-32px; width:88px; height:88px; border-radius:50%;
  background:radial-gradient(ellipse at 25% 50%, rgba(103,121,82,.12) 0 22%, transparent 24%), radial-gradient(ellipse at 58% 25%, rgba(167,139,85,.09) 0 18%, transparent 20%);
  transform:rotate(-22deg); pointer-events:none;
}
@media(max-width:820px){
  body[data-active-screen="observation"] #screen-observation::after{display:none}
  .observation-world::before{width:55vw;height:26vh;opacity:.55}
  .observation-world::after{width:6rem;height:6rem;right:-1rem;top:3rem;opacity:.5}
}


/* Observation Wave 3 — council materiality and wayfinding convergence. */
.observation-rail {
  background:
    linear-gradient(rgba(246,237,216,.965), rgba(240,229,204,.95)),
    repeating-linear-gradient(87deg, rgba(105,75,39,.065) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(3deg, rgba(91,67,38,.04) 0 1px, transparent 1px 6px);
  border-right-color:rgba(178,135,70,.72);
  box-shadow:14px 24px 58px rgba(0,0,0,.34), inset -1px 0 0 rgba(165,121,58,.24), inset 0 1px 0 rgba(255,255,255,.78);
}
.observation-sheet {
  position:relative;
  isolation:isolate;
  background:
    linear-gradient(rgba(250,246,235,.975), rgba(246,239,225,.97)),
    repeating-linear-gradient(87deg, rgba(102,77,46,.06) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(3deg, rgba(91,68,39,.045) 0 1px, transparent 1px 6px);
}
.observation-sheet::before,
.observation-sheet::after {
  position:absolute;
  z-index:-1;
  color:rgba(146,115,65,.28);
  font-family:Georgia,serif;
  font-size:2.6rem;
  line-height:1;
  pointer-events:none;
}
.observation-sheet::before { content:"❧"; left:.45rem; top:.25rem; transform:rotate(-24deg); }
.observation-sheet::after { content:"❧"; right:.5rem; bottom:.35rem; transform:rotate(156deg); }
.observation-brand strong,
.observation-title-row h2,
.observation-greeting strong,
.moon-copy > strong,
.observation-home-line { font-family:Georgia,"Times New Roman",serif; }
.observation-brand strong { font-weight:500; text-shadow:0 1px 0 rgba(255,255,255,.55); }
.observation-panel > header {
  border-top:1px solid rgba(169,139,85,.18);
  border-bottom-color:rgba(169,139,85,.26);
  padding-top:.52rem;
}
.signal-list li,.reflection-slip { border-bottom-color:rgba(169,139,85,.20); }
.condition-metrics div { border-color:rgba(169,139,85,.20); }
.moon-orbit {
  border:1px solid rgba(157,126,76,.34);
  box-shadow:inset 0 0 26px rgba(168,138,83,.06),0 0 18px rgba(206,178,120,.08);
}
.moon-orbit::before,.moon-orbit::after { box-shadow:0 0 0 2px rgba(250,244,226,.7),0 0 8px rgba(176,140,75,.22); }
.moon-disc {
  border:1px solid rgba(154,123,72,.34);
  background:
    radial-gradient(circle at 30% 30%,rgba(255,248,216,.9) 0 8%,transparent 9%),
    radial-gradient(circle at 64% 57%,rgba(104,88,63,.18) 0 9%,transparent 10%),
    radial-gradient(circle at 35% 35%,#efe4c5,#c9b58c 54%,#766956 82%);
  box-shadow:inset -18px -10px 24px rgba(31,35,38,.42),inset 8px 5px 16px rgba(255,248,222,.18),0 0 22px rgba(206,178,120,.28);
}
.observation-room-nav { box-shadow:0 13px 30px rgba(0,0,0,.23),inset 0 2px 5px rgba(91,66,36,.08),inset 0 1px 0 rgba(255,255,255,.72); }
.observation-room-nav button { position:relative; color:#5b5142; }
.observation-room-nav button.active { background:rgba(125,139,108,.13); color:#2e4230; }
.observation-room-nav button.active::after {
  content:""; position:absolute; left:15%; right:15%; bottom:0; height:3px; border-radius:99px 99px 0 0;
  background:linear-gradient(90deg,transparent,#b3935b 18% 82%,transparent);
  box-shadow:0 -2px 8px rgba(179,147,91,.18);
}
.observation-room-nav button:hover:not(.active) { background:linear-gradient(180deg,transparent,rgba(179,147,91,.07)); }
.observation-settings:focus-visible,
.observation-room-nav button:focus-visible,
.active-area-list button:focus-visible,
.observation-panel header button:focus-visible,
.observation-text-button:focus-visible,
.journal-quick-add button:focus-visible {
  outline:2px solid rgba(169,139,85,.78);
  outline-offset:3px;
}


/* Observation Wave 5 — keep whimsy in the room, not as panel gunk. */
.observation-panel::after { display:none; }
body[data-active-screen="observation"] #screen-observation {
  background:
    radial-gradient(circle at 3.5% 18%, rgba(255,210,116,.95) 0 2px, rgba(255,184,72,.22) 3px 10px, transparent 11px),
    radial-gradient(circle at 96% 42%, rgba(255,213,125,.92) 0 2px, rgba(255,187,79,.20) 3px 11px, transparent 12px),
    radial-gradient(circle at 8% 72%, rgba(255,217,134,.70) 0 1.5px, rgba(255,190,82,.13) 2px 9px, transparent 10px);
  background-attachment:fixed;
}
.observation-world { isolation:isolate; }
.observation-stage::before,
.observation-stage::after {
  content:"";
  position:fixed;
  pointer-events:none;
  z-index:-1;
}
.observation-stage::before {
  left:2.5vw;
  top:8vh;
  width:12vw;
  min-width:105px;
  height:64vh;
  background:
    radial-gradient(ellipse at 30% 14%, rgba(67,102,68,.48) 0 11%, transparent 12%),
    radial-gradient(ellipse at 66% 26%, rgba(55,91,60,.40) 0 12%, transparent 13%),
    radial-gradient(ellipse at 36% 44%, rgba(61,101,66,.36) 0 11%, transparent 12%),
    radial-gradient(ellipse at 69% 62%, rgba(48,83,54,.34) 0 12%, transparent 13%),
    linear-gradient(82deg, transparent 46%, rgba(93,116,76,.34) 48% 51%, transparent 53%);
  filter:blur(.3px);
  opacity:.72;
}
.observation-stage::after {
  right:1.5vw;
  bottom:4vh;
  width:15vw;
  min-width:130px;
  height:28vh;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%, transparent 0 31%, rgba(183,137,67,.30) 32% 34%, transparent 35% 47%, rgba(183,137,67,.18) 48% 50%, transparent 51%),
    linear-gradient(90deg, transparent 47%, rgba(183,137,67,.26) 48% 52%, transparent 53%),
    linear-gradient(0deg, transparent 47%, rgba(183,137,67,.22) 48% 52%, transparent 53%);
  box-shadow:0 0 35px rgba(231,183,93,.08);
  opacity:.56;
}
@media(max-width:820px){
  .observation-stage::before{left:-2rem;width:6rem;height:55vh;opacity:.35}
  .observation-stage::after{display:none}
}


/* Observation Wave 5 — move whimsy from cards into the observatory room */
body[data-active-screen="observation"] .observation-panel::before,
body[data-active-screen="observation"] .observation-panel::after { content:none !important; }
body[data-active-screen="observation"] .observation-stage::before,
body[data-active-screen="observation"] .observation-stage::after { content:""; position:fixed; pointer-events:none; z-index:-1; }
body[data-active-screen="observation"] .observation-stage::before {
  left:1.2vw; bottom:-6vh; width:26vw; height:44vh; opacity:.52;
  background:radial-gradient(ellipse at 18% 88%,rgba(21,71,45,.72) 0 18%,transparent 19%),radial-gradient(ellipse at 38% 78%,rgba(35,91,55,.58) 0 13%,transparent 14%),radial-gradient(ellipse at 58% 92%,rgba(31,78,52,.64) 0 15%,transparent 16%),linear-gradient(76deg,transparent 0 43%,rgba(161,128,73,.22) 44% 45%,transparent 46%);
}
body[data-active-screen="observation"] .observation-stage::after {
  right:1.5vw; bottom:4vh; width:17vw; height:28vw; max-height:380px; border:1px solid rgba(188,151,88,.26); border-radius:52% 52% 12% 12%; opacity:.82;
  box-shadow:inset 0 0 0 1px rgba(222,194,132,.08),0 0 38px rgba(227,181,90,.13);
  background:radial-gradient(circle at 50% 68%,rgba(241,184,82,.44) 0 2%,transparent 3%),linear-gradient(90deg,transparent 49%,rgba(180,143,79,.22) 49.5% 50.5%,transparent 51%),linear-gradient(rgba(18,29,26,.05),rgba(9,14,17,.24));
}
body[data-active-screen="observation"] .observation-room-nav { box-shadow:0 10px 28px rgba(3,8,9,.18),inset 0 1px 0 rgba(255,255,255,.62),inset 0 -1px 0 rgba(128,96,48,.16); }
body[data-active-screen="observation"] .observation-room-nav button.active { box-shadow:inset 0 -3px 0 var(--obs-gold); }
body[data-active-screen="observation"] .observation-sheet,
body[data-active-screen="observation"] .observation-rail {
  background-image:linear-gradient(rgba(249,243,229,.965),rgba(245,235,215,.955)),repeating-linear-gradient(87deg,rgba(119,91,51,.028) 0 1px,transparent 1px 6px),repeating-linear-gradient(3deg,rgba(119,91,51,.022) 0 1px,transparent 1px 8px);
}
@media(max-width:820px){body[data-active-screen="observation"] .observation-stage::before,body[data-active-screen="observation"] .observation-stage::after{display:none}}


/* Observatory — canonical scene integration. */
body[data-active-screen="observation"] #screen-observation { position:relative; isolation:isolate; overflow:hidden; }
.observation-scene { position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; border-radius:inherit; }
.observation-scene::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,24,20,.08),rgba(12,24,18,.36) 72%,rgba(10,19,15,.62)); }
.observation-scene img { width:100%; height:100%; object-fit:cover; object-position:center; opacity:.9; filter:saturate(.88) brightness(.78) sepia(.05); transform:scale(1.015); }
.observation-world { position:relative; z-index:1; }
.observation-rail,.observation-room-nav,.observation-sheet,.observation-home-line { position:relative; z-index:2; }
.observation-panel::after { display:none; }
@media (max-width:820px){ .observation-scene img{object-position:58% center;opacity:.72}.observation-scene::after{background:linear-gradient(180deg,rgba(10,24,20,.2),rgba(10,19,15,.58))} }
@media (prefers-reduced-motion:reduce){ .observation-scene img{transform:none} }
html[data-presentation="boring"] .observation-scene { display:none; }

/* Observation Wave — scenic breathing room and lighter material hierarchy. */
body[data-active-screen="observation"] #screen-observation { padding:clamp(.9rem,2.4vw,2.4rem); }
.observation-world { max-width:1380px; margin:0 auto; gap:clamp(.75rem,1.5vw,1.25rem); }
.observation-stage { padding-block:clamp(.2rem,1vw,.75rem); }
.observation-rail { background:linear-gradient(rgba(249,243,229,.945),rgba(245,235,215,.93)); }
.observation-room-nav { overflow-x:auto; overscroll-behavior-inline:contain; scrollbar-width:none; background:rgba(248,241,226,.9); backdrop-filter:blur(10px); }
.observation-room-nav::-webkit-scrollbar { display:none; }
.observation-room-nav button { flex:0 0 auto; padding-inline:clamp(.65rem,1vw,1rem); }
.observation-sheet { background:rgba(248,241,226,.93); backdrop-filter:blur(9px); }
.observation-panel { background:rgba(255,252,244,.78); backdrop-filter:blur(8px); }
.observation-invitation { background:rgba(248,241,226,.72); }
.observation-home-line { backdrop-filter:blur(7px); }
@media(min-width:821px){ .observation-scene img{object-position:56% center}.observation-stage{min-width:0}.observation-sheet{box-shadow:0 30px 80px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.62)} }
@media(max-width:820px){ body[data-active-screen="observation"] #screen-observation{padding:.55rem}.observation-room-nav{margin-inline:0}.observation-sheet{background:rgba(248,241,226,.955)}.observation-panel{background:rgba(255,252,244,.86)} }

/* Observation Wave — full room strip + celestial perimeter. */
@media(min-width:1000px){
  .observation-room-nav button{font-size:.72rem;padding:.68rem .62rem;letter-spacing:-.01em}
  .observation-stage::after{content:"";position:absolute;z-index:0;right:-1.35rem;top:9rem;width:8.5rem;height:8.5rem;border:1px solid rgba(190,154,91,.22);border-radius:50%;box-shadow:0 0 0 18px rgba(190,154,91,.035),0 0 44px rgba(223,186,108,.08);pointer-events:none}
}


/* Observatory fidelity wave — flatter parchment architecture from the approved Haven concept. */
body[data-active-screen="observation"] #screen-observation { padding:clamp(.55rem,1.25vw,1rem); }
.observation-world { max-width:1536px; gap:0; }
.observation-rail {
  border-radius:6px 0 0 6px;
  border-right:0;
  padding:clamp(1.25rem,2vw,2rem) clamp(1rem,1.4vw,1.35rem);
  background:linear-gradient(rgba(248,241,226,.965),rgba(244,235,216,.955));
}
.observation-stage { gap:0; padding-block:0; }
.observation-room-nav {
  border-radius:0 6px 0 0;
  border-bottom-color:rgba(137,105,58,.28);
  background:rgba(248,241,226,.955);
}
.observation-room-nav button {
  min-height:58px;
  padding:.72rem clamp(.72rem,1.2vw,1.08rem);
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(.72rem,.78vw,.86rem);
}
.observation-room-nav button.active { background:rgba(121,135,101,.1); }
.observation-sheet {
  border-radius:0;
  border-top:0;
  padding:clamp(1rem,1.5vw,1.4rem);
  background:rgba(248,241,226,.948);
}
.observation-title-row { padding:.45rem .45rem 1.15rem; border-bottom:1px solid rgba(137,105,58,.16); margin-bottom:.85rem; }
.observation-title-row h2 { letter-spacing:.015em; }
.observation-grid { gap:.7rem; }
.observation-panel {
  border-radius:7px;
  border-color:rgba(118,89,52,.19);
  background:rgba(255,252,244,.72);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.36);
}
.observation-panel > header { padding-top:.44rem; }
.observation-home-line {
  border-radius:0 0 6px 0;
  border-top:0;
  min-height:56px;
  display:grid;
  place-items:center;
  background:rgba(36,55,42,.94);
  letter-spacing:.045em;
}
.observation-brand strong { letter-spacing:.18em; }
.rail-card { border-radius:7px; background:rgba(255,252,244,.38); }
.observation-settings { border-radius:5px; }
@media(max-width:820px){
  .observation-world{display:block}
  .observation-rail{border-radius:7px 7px 0 0;border-right:1px solid rgba(188,158,104,.52);margin-bottom:0}
  .observation-room-nav{border-radius:0}
  .observation-sheet{border-top:0}
  .observation-home-line{border-radius:0 0 7px 7px}
}

/* Observatory arrives as a room, not a fading card. */
body[data-active-screen="observation"] #screen-observation.active { animation:none; }