:root {
  --bg: #f6f7fb;
  --panel: #ffffff;
  --panel-2: #f0f3f8;
  --text: #172033;
  --muted: #64748b;
  --line: #dbe3ef;
  --accent: #2563eb;
  --accent-2: #1d4ed8;
  --danger: #ff7b7b;
  --success: #6bda94;
}
body.theme-light {
  --bg: #f5f7fb;
  --panel: #ffffff;
  --panel-2: #eef2f8;
  --text: #182033;
  --muted: #5f6f8d;
  --line: #d9e0ec;
  --accent: #2f6feb;
  --accent-2: #4d84f0;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  background: var(--bg);
  color: var(--text);
}
a { color: var(--accent-2); text-decoration: none; }
a:hover { text-decoration: underline; }
.wrap { width: min(1100px, calc(100% - 32px)); margin: 0 auto; }
.site-header, .site-footer {
  background: rgba(0,0,0,.15);
  border-bottom: 1px solid var(--line);
}
.site-footer {
  border-top: 1px solid var(--line);
  border-bottom: 0;
  margin-top: 40px;
  padding: 24px 0;
}
.nav, .footer-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 14px 0;
}
.brand {
  font-weight: 700;
  font-size: 1.1rem;
  color: var(--text);
}
.nav-links {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.button, button {
  appearance: none;
  border: 0;
  border-radius: 10px;
  padding: 10px 14px;
  background: var(--accent);
  color: white;
  cursor: pointer;
  font-weight: 700;
}
.button-secondary {
  background: var(--panel-2);
  color: var(--text);
}
.button-small {
  padding: 7px 10px;
  font-size: .9rem;
}
.link-button {
  background: transparent;
  padding: 0;
  color: var(--accent-2);
}
.inline-form { display: inline; }
.hero {
  display: grid;
  grid-template-columns: 1.7fr 1fr;
  gap: 24px;
  padding: 40px 0 10px;
}
.hero h1 { font-size: clamp(2rem, 5vw, 3rem); margin: 10px 0 12px; }
.hero-copy p { font-size: 1.05rem; color: var(--muted); max-width: 760px; }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 22px; }
.eyebrow {
  display: inline-block;
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--panel-2);
  color: var(--accent-2);
  font-size: .85rem;
  font-weight: 700;
}
.card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 20px;
}
.narrow { max-width: 560px; margin: 30px auto; }
.stack > * + * { margin-top: 14px; }
.grid.two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 24px;
}
.top-gap { margin-top: 24px; }
.clean-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.clean-list li {
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}
.clean-list li:last-child { border-bottom: 0; }
.flash {
  margin: 18px 0 0;
  padding: 12px 14px;
  border-radius: 12px;
}
.flash.error { background: rgba(255,123,123,.12); border: 1px solid rgba(255,123,123,.45); }
.flash.success { background: rgba(107,218,148,.12); border: 1px solid rgba(107,218,148,.45); }
label { display: block; font-weight: 700; }
input[type="text"], input[type="email"], input[type="password"], input[type="number"], select, textarea, input[type="file"] {
  width: 100%;
  margin-top: 6px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--panel-2);
  color: var(--text);
}
textarea { resize: vertical; }
.checkbox {
  display: flex;
  align-items: center;
  gap: 10px;
}
.checkbox input { width: auto; margin: 0; }
.table {
  width: 100%;
  border-collapse: collapse;
}
.table th, .table td {
  border-bottom: 1px solid var(--line);
  padding: 12px 10px;
  text-align: left;
  vertical-align: top;
}
.muted, .card p.muted { color: var(--muted); }
.notification {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px;
  background: var(--panel-2);
}
.notification.read { opacity: .8; }
.notification-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 8px;
}
.avatar-preview {
  display: block;
  width: 140px;
  height: 140px;
  object-fit: cover;
  border-radius: 18px;
  border: 1px solid var(--line);
}
.avatar-placeholder {
  width: 140px;
  height: 140px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: var(--panel-2);
  border: 1px dashed var(--line);
  color: var(--muted);
}
.prose p { line-height: 1.6; }
.footer-links {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}
.admin-links {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 18px;
}
@media (max-width: 860px) {
  .hero, .grid.two {
    grid-template-columns: 1fr;
  }
  .nav, .footer-inner {
    flex-direction: column;
    align-items: flex-start;
  }
}


.small { font-size: .9rem; }
.row-between { display:flex; justify-content:space-between; align-items:center; }
.gap { gap: 14px; }
.posts-layout { grid-template-columns: minmax(0, 1.7fr) minmax(260px, .9fr) !important; }
.post-card { padding: 18px 20px; }
.post-head { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.post-author { font-weight:700; color: var(--text); }
.post-title { margin: 12px 0 8px; }
.post-title a { color: var(--text); }
.post-title-link {
  color: #ffd76a !important;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  cursor: pointer;
  transition: color 0.18s ease, text-shadow 0.18s ease, transform 0.18s ease;
}
.post-title-link:hover,
.post-title-link:focus-visible {
  color: #d7e9ff !important;
  text-shadow: 0 0 8px rgba(110, 170, 255, 0.35);
}
.post-title-link-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.15em;
  height: 1.15em;
  margin-left: 4px;
  border-radius: 999px;
  border: 1px solid rgba(110, 170, 255, 0.28);
  background: rgba(110, 170, 255, 0.08);
  color: inherit;
  font-size: 0.82em;
  line-height: 1;
  opacity: 0.9;
  transform: translateY(-1px);
  transition: transform 0.18s ease, opacity 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}
.post-title-link:hover .post-title-link-icon,
.post-title-link:focus-visible .post-title-link-icon {
  opacity: 1;
  transform: translate(2px, -1px);
  border-color: rgba(140, 190, 255, 0.45);
  background: rgba(140, 190, 255, 0.14);
}

.post-body { line-height: 1.65; white-space: pre-wrap; }
.tag-row { display:flex; gap:8px; flex-wrap:wrap; }
.tag-chip, .pill { display:inline-flex; align-items:center; gap:4px; padding:6px 10px; border-radius:999px; background:var(--panel-2); border:1px solid var(--line); }
.pill { color: var(--accent-2); font-weight:700; }
.post-actions { display:flex; gap:12px; }
.composer-wide { max-width: 860px; }
.composer-actions { display:flex; gap:12px; flex-wrap:wrap; }
.compact-grid { margin-top: 0; }
@media (max-width: 860px) { .posts-layout { grid-template-columns: 1fr !important; } .row-between { flex-direction:column; align-items:flex-start; } }


.preserve-breaks {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.post-actions {
  display: flex;
  gap: 0.85rem;
  flex-wrap: wrap;
}


.tag-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:12px; }
.tag-browser-item { display:flex; flex-direction:column; gap:8px; padding:14px; border:1px solid var(--line); border-radius:14px; background:var(--panel-2); color:var(--text); }
.tag-browser-item:hover { text-decoration:none; border-color: var(--accent); }
.tag-search-form { width:min(320px, 100%); }


.link-badge-row { display:flex; gap:.45rem; flex-wrap:wrap; align-items:center; margin-bottom:.7rem; }
.link-badge { display:inline-flex; align-items:center; padding:.2rem .5rem; border-radius:999px; background:rgba(99,102,241,.12); border:1px solid rgba(99,102,241,.2); font-weight:600; }
.link-parent-card { border-style:dashed; }
.top-gap-small { margin-top:.55rem; }
.section-heading-row { display:flex; justify-content:space-between; gap:1rem; align-items:flex-end; flex-wrap:wrap; }
.stack-tight { display:flex; flex-direction:column; gap:.35rem; }


.related-card-wrap { display: grid; gap: 0.75rem; }
.related-why-card { border-style: dashed; }
.related-why-card ul { margin: 0; padding-left: 1rem; }
.link-parent-card { background: rgba(255,255,255,0.02); }
.top-gap-small { margin-top: 0.5rem; }


.trail-summary-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; }
.trail-node { display:flex; flex-direction:column; gap:.75rem; }
.trail-connector { display:flex; justify-content:center; align-items:center; }
.trail-branch-card { display:flex; flex-direction:column; gap:.75rem; }
.trail-inline { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.trail-inline-node { padding:.45rem .7rem; border:1px solid rgba(255,255,255,.12); border-radius:999px; text-decoration:none; }
.trail-inline-node.is-current { border-color: rgba(120,190,255,.65); }
.trail-inline-link { font-size:.85rem; color: var(--muted-color, #9aa4b2); }
.trail-snapshot-card, .trail-summary-card { overflow-x:auto; }

.trail-action-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.5rem 0.9rem;
  border-radius: 999px;
  background: rgba(120,190,255,.16);
  border: 1px solid rgba(120,190,255,.3);
  color: var(--text);
}
.story-viewer-card { overflow: hidden; }
.story-viewer-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--line);
}
.story-nav { display:flex; gap:.75rem; align-items:center; }
.story-nav-btn {
  width: 2.7rem;
  height: 2.7rem;
  display: inline-grid;
  place-items: center;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--panel-2);
  color: var(--text);
  text-decoration: none;
  font-size: 1.1rem;
  font-weight: 700;
}
.story-nav-btn.is-disabled {
  opacity: .45;
  pointer-events: none;
}
.story-step-card {
  max-width: 760px;
}
.story-position {
  font-size: 1.35rem;
  font-weight: 700;
}
@media (max-width: 700px) {
  .story-viewer-header {
    flex-direction: column;
    align-items: flex-start;
  }
}


.post-card {
  border-radius: 24px;
  box-shadow: 0 0 0 1px rgba(104, 130, 255, 0.08), 0 0 26px rgba(90, 128, 255, 0.12);
}

.post-actions-wrap {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.post-actions,
.post-actions-secondary {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

.action-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 14px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--panel-2);
  color: var(--text);
  font-weight: 700;
}

.action-chip:hover,
.trail-action-pill:hover,
.story-nav-btn:hover {
  text-decoration: none;
  border-color: rgba(124, 152, 255, 0.5);
}

.action-chip-primary {
  background: var(--accent);
  color: white;
  border-color: transparent;
}

.action-chip-count {
  color: var(--muted);
  font-weight: 600;
}

.trail-action-pill {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(120, 173, 255, 0.95), rgba(92, 143, 255, 0.95));
  color: #07101f;
  font-weight: 800;
  border: 1px solid rgba(146, 183, 255, 0.7);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35);
}

.story-viewer-card {
  border-radius: 22px;
  overflow: hidden;
}

.story-viewer-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}

.story-viewer-kicker {
  font-size: 1.05rem;
}

.story-nav {
  display: flex;
  gap: 10px;
}

.story-nav-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--panel-2);
  color: var(--text);
  font-size: 1.1rem;
  font-weight: 800;
}

.story-nav-btn.is-disabled {
  opacity: 0.45;
}

.story-step-card {
  padding: 10px 0 4px;
}

.story-position {
  font-size: 1.05rem;
  font-weight: 700;
}

.trail-inline {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

.trail-inline-node {
  display: inline-flex;
  align-items: center;
  max-width: 220px;
  min-height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  background: var(--panel-2);
  border: 1px solid var(--line);
  color: var(--text);
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.trail-inline-node.is-current {
  background: rgba(96, 165, 250, 0.12);
  border-color: rgba(96, 165, 250, 0.35);
}

.trail-inline-link {
  color: var(--muted);
  font-size: .9rem;
  font-weight: 700;
}

.related-card-wrap {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.related-why-card {
  background: rgba(255,255,255,0.02);
}

@media (max-width: 640px) {
  .post-card {
    padding: 16px;
    border-radius: 20px;
  }

  .action-chip,
  .trail-action-pill {
    width: 100%;
    justify-content: center;
  }

  .story-viewer-header {
    flex-direction: column;
    align-items: stretch;
  }

  .story-nav {
    justify-content: flex-end;
  }
}

.action-inline-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.5rem;
  height: 1.5rem;
  padding: 0 .4rem;
  margin-left: .4rem;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.10);
  color: var(--muted);
  font-size: .86rem;
  font-weight: 800;
}

.related-strength-pill {
  font-size: .8rem;
  color: var(--text);
}


.inline-split{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}.inline-split input{flex:1 1 280px}.spaced-top{margin-top:1rem}.stopword-list{display:flex;flex-direction:column;gap:.75rem}.stopword-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.8rem 1rem;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.03)}.stopword-word{font-weight:600}.meta-row{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.75rem}.meta-pill{display:inline-flex;align-items:center;padding:.35rem .65rem;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);font-size:.9rem}


.graph-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(280px, .8fr);
  gap: 18px;
  align-items: start;
}

.graph-hero-row {
  align-items: start;
}

.graph-hero-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.graph-canvas-card,
.graph-side-card {
  border-radius: 22px;
}

.graph-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 12px;
}

.graph-legend,
.graph-toolbar-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

.graph-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: .92rem;
  color: var(--muted);
}

.graph-legend-dot {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  display: inline-block;
}

.graph-legend-dot.is-seed { background: #7dd3fc; box-shadow: 0 0 0 4px rgba(125, 211, 252, 0.16); }
.graph-legend-dot.is-explicit { background: #93c5fd; box-shadow: 0 0 0 4px rgba(147, 197, 253, 0.14); }
.graph-legend-dot.is-related { background: #fcd34d; box-shadow: 0 0 0 4px rgba(252, 211, 77, 0.14); }
.graph-legend-dot.is-echo { background: #c4b5fd; box-shadow: 0 0 0 4px rgba(196, 181, 253, 0.12); }

.graph-canvas-wrap {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  background:
    radial-gradient(circle at center, rgba(255,255,255,.03), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
  border: 1px solid rgba(255,255,255,.06);
}

.thought-graph-svg {
  width: 100%;
  height: auto;
  display: block;
}

.graph-ring {
  fill: none;
  stroke: rgba(255,255,255,.06);
  stroke-width: 1;
}

.graph-edge {
  stroke-linecap: round;
  opacity: .5;
  transition: opacity .16s ease, stroke-width .16s ease, filter .16s ease;
}

.graph-edge.is-explicit { stroke: rgba(147, 197, 253, .88); }
.graph-edge.is-related { stroke: rgba(252, 211, 77, .84); }
.graph-edge.is-echo { stroke: rgba(196, 181, 253, .62); }
.graph-edge.is-primary {
  opacity: 1;
  filter: drop-shadow(0 0 8px rgba(255,255,255,.12));
}
.graph-edge.is-active {
  opacity: .95;
}
.graph-edge.has-flow {
  animation: graphFlow 8s linear infinite;
}

.graph-node .graph-node-halo {
  fill: rgba(255,255,255,.04);
  transition: opacity .16s ease, transform .16s ease, fill .16s ease;
}

.graph-node .graph-node-core {
  stroke-width: 2;
  transition: transform .12s ease, opacity .12s ease, filter .16s ease;
  transform-origin: center;
}

.graph-node .graph-node-label {
  text-anchor: middle;
  fill: var(--muted);
  font-size: 12px;
  font-weight: 700;
  pointer-events: none;
}

.graph-node.is-seed .graph-node-core { fill: #7dd3fc; stroke: rgba(255,255,255,.48); }
.graph-node.is-explicit .graph-node-core { fill: #93c5fd; stroke: rgba(255,255,255,.24); }
.graph-node.is-related .graph-node-core { fill: #fcd34d; stroke: rgba(255,255,255,.18); }
.graph-node.is-echo .graph-node-core { fill: #c4b5fd; stroke: rgba(255,255,255,.16); }

.graph-node.is-hub .graph-node-halo { fill: rgba(255,255,255,.11); }
.graph-node.is-strong .graph-node-core { filter: drop-shadow(0 0 9px rgba(255,255,255,.22)); }
.graph-node.is-strong .graph-node-halo { fill: rgba(255,255,255,.09); }
.graph-node.is-weak { opacity: .72; }
.graph-node.is-selected .graph-node-core { stroke: #fff; stroke-width: 3; }
.graph-node.is-selected .graph-node-halo { fill: rgba(255,255,255,.12); }
.graph-node:hover .graph-node-core,
.graph-node:focus .graph-node-core { transform: scale(1.05); }
.graph-node:hover .graph-node-halo,
.graph-node:focus .graph-node-halo { transform: scale(1.03); }

.graph-tooltip {
  position: absolute;
  z-index: 5;
  max-width: 260px;
  border-radius: 16px;
  background: rgba(7, 12, 22, 0.96);
  border: 1px solid rgba(255,255,255,.1);
  color: var(--text);
  box-shadow: 0 18px 34px rgba(0,0,0,.26);
  pointer-events: none;
}

.graph-tooltip-card {
  padding: 12px 14px;
}

.graph-tooltip-title {
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.2;
}

.graph-tooltip-subtitle {
  font-size: .82rem;
  color: var(--muted);
  margin-top: .2rem;
}

.graph-tooltip-label {
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: rgba(255,255,255,.62);
}

.graph-tooltip-list {
  margin: .45rem 0 0;
  padding-left: 1rem;
}

.graph-tooltip-list li + li {
  margin-top: .28rem;
}

.graph-tooltip-meta {
  display: flex;
  justify-content: space-between;
  gap: .7rem;
  font-size: .8rem;
  color: rgba(255,255,255,.76);
  border-top: 1px solid rgba(255,255,255,.08);
  padding-top: .55rem;
}

.graph-selection-title {
  margin: 0;
}

.graph-insight-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

.graph-insight-card {
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  border-radius: 16px;
  padding: 12px 14px;
}

.graph-insight-value {
  font-weight: 800;
  color: var(--text);
}

.graph-why-list li + li,
.graph-reading-list li + li {
  margin-top: .6rem;
}

.graph-insight-body {
  color: var(--text);
  line-height: 1.5;
}

.graph-next-list {
  display: grid;
  gap: 10px;
}

.graph-next-item {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.06);
}

.graph-next-item a {
  color: var(--text);
  font-weight: 700;
  text-decoration: none;
}

.graph-next-item a:hover {
  color: var(--accent-2);
  text-decoration: none;
}

.graph-next-kicker {
  font-size: .78rem;
  color: var(--muted);
  font-weight: 700;
}


@keyframes graphFlow {
  to {
    stroke-dashoffset: -20;
  }
}

@media (max-width: 980px) {
  .graph-layout {
    grid-template-columns: 1fr;
  }
}


.link-type-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:12px; }
.link-type-option { display:block; border:1px solid var(--line); border-radius:16px; background:var(--panel-2); padding:14px; cursor:pointer; position:relative; }
.link-type-option input { position:absolute; opacity:0; pointer-events:none; }
.link-type-option.is-selected,
.link-type-option:has(input:checked) { border-color: rgba(106,166,255,.7); box-shadow: 0 0 0 1px rgba(106,166,255,.28) inset; background: color-mix(in srgb, var(--panel-2) 84%, var(--accent) 16%); }
.link-type-option-body { display:flex; flex-direction:column; gap:.5rem; }
.link-type-option-head { display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
.link-type-option-text { font-weight:700; color: var(--text); }


.nav-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(106,166,255,.16);
  border: 1px solid rgba(106,166,255,.28);
  color: var(--text);
  font-weight: 700;
}
.nav-cta:hover {
  text-decoration: none;
  border-color: rgba(106,166,255,.48);
}
.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  backdrop-filter: blur(8px);
}
main.wrap {
  padding-top: 24px;
}
.feed-hero-card {
  padding: 26px 24px;
}
.feed-hero-row {
  align-items: center;
}
.post-card + .post-card {
  margin-top: 18px;
}
.subtle-panel {
  padding: 14px 16px;
  background: rgba(255,255,255,.02);
}
.subtle-panel summary {
  cursor: pointer;
  font-weight: 700;
}
.subtle-panel[open] summary {
  margin-bottom: 8px;
}
.thread-post-snippet + .thread-post-snippet,
.post-compact-item + .post-compact-item {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
@media (max-width: 860px) {
  .nav-links {
    gap: 10px;
  }
  .nav-cta {
    min-height: 34px;
  }
}


.post-head-badges { display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; justify-content:flex-end; }
.match-strength-badge { font-weight:800; }
.match-strength-strong { color:#9bc2ff; border-color:rgba(120,190,255,.38); background:rgba(120,190,255,.14); }
.match-strength-medium { color:#b7d3ff; border-color:rgba(120,160,220,.28); background:rgba(120,160,220,.10); }
.match-strength-light, .match-strength-weak { color:var(--muted); }


.post-media-image,
.post-media-video {
  display: block;
  width: 100%;
  max-width: 100%;
  border-radius: 14px;
  max-height: 520px;
  object-fit: cover;
  background: rgba(255,255,255,0.03);
}

.post-media {
  overflow: hidden;
}

/* Sponsored ads: preserve the full uploaded creative without letting tall/portrait
   creatives take over the feed. Normal post images still use the 16:9 cover
   treatment above. */
.ad-media {
  display: flex;
  justify-content: center;
  overflow: hidden;
  border-radius: 14px;
  background: rgba(255,255,255,0.03);
}

.ad-media-image {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 420px;
  object-fit: contain;
  border-radius: 14px;
  background: rgba(255,255,255,0.03);
}

@media (max-width: 720px) {
  .ad-media-image {
    max-height: 340px;
  }
}

.video-embed-wrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  border-radius: 14px;
  overflow: hidden;
  background: #000;
}

.video-embed-wrap iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.button-ghost {
  background: transparent;
  color: var(--text);
  border: 1px solid var(--line);
}
.button-ghost:hover {
  background: var(--panel-2);
}
.page-head-tight {
  padding-bottom: 6px;
}
.toolbar-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: 16px 0 20px;
}
.segmented-control {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--panel-2);
  color: var(--text);
  text-decoration: none;
  font-weight: 700;
}
.chip:hover { text-decoration: none; }
.chip.active {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
}
.chip-inline {
  margin-left: 8px;
  padding: 4px 8px;
  font-size: .8rem;
}
.notifications-actions, .notification-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.notification-actions {
  margin-top: 12px;
}
@media (max-width: 860px) {
  .toolbar-row {
    align-items: flex-start;
  }
}


.no-margin { margin: 0; }
.profile-lens-count { color: var(--muted); font-size: .95rem; }
.profile-lens-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; }
.profile-lens-wide { grid-column: 1 / -1; }
.chip-cloud { display:flex; flex-wrap:wrap; gap:10px; }
.profile-lens-list { display:flex; flex-direction:column; gap:10px; }
.profile-lens-item { width:100%; text-align:left; display:flex; justify-content:space-between; gap:14px; align-items:flex-start; padding:14px; border:1px solid var(--line); border-radius:14px; background:var(--panel-2); color:var(--text); }
.profile-lens-item:hover { border-color: var(--accent); }
.profile-lens-item-main { display:flex; flex-direction:column; gap:6px; min-width:0; }
.profile-lens-item-side { white-space:nowrap; color:var(--muted); }
.profile-lens-modal[hidden] { display:none !important; }
.profile-lens-modal { position:fixed; inset:0; display:grid; place-items:center; z-index:1000; }
.profile-lens-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.55); }
.profile-lens-dialog { position:relative; width:min(760px, calc(100% - 32px)); max-height:90vh; overflow:auto; background:var(--panel); border:1px solid var(--line); border-radius:18px; padding:22px; }
.profile-lens-close { position:absolute; top:8px; right:10px; background:transparent; color:var(--text); font-size:26px; padding:4px 8px; }
.profile-lens-modal-body { white-space:pre-wrap; line-height:1.6; }
@media (max-width: 860px) { .profile-lens-grid { grid-template-columns: 1fr; } }


.post-author-row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.post-author-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.post-avatar-link {
  display: inline-flex;
  flex: 0 0 auto;
}

.post-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 0 0 2px rgba(104, 130, 255, 0.08);
  background: var(--panel-2);
}

.post-avatar-fallback {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  flex: 0 0 48px;
  font-weight: 800;
  font-size: 1rem;
  line-height: 1;
  letter-spacing: 0;
  color: #fff;
  background: linear-gradient(135deg, #4f46e5, #2563eb);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 8px 24px rgba(0,0,0,.18), 0 0 0 3px rgba(104, 130, 255, .08);
  overflow: hidden;
}

@media (max-width: 640px) {
  .post-avatar,
  .post-avatar-fallback {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
  }
}

.concept-page {
  padding: 24px 0 8px;
}

.concept-hero-card {
  padding: 24px;
}

.concept-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, .8fr);
  gap: 20px;
  align-items: start;
}

.concept-title {
  margin: 4px 0 0;
  font-size: clamp(2rem, 4vw, 3rem);
}

.concept-lead {
  color: var(--muted);
  font-size: 1.05rem;
  line-height: 1.65;
  max-width: 760px;
}

.concept-summary-panel {
  padding: 20px;
}

.concept-stat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.concept-stat-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: var(--panel-2);
}

.concept-stat-card strong {
  font-size: 1.35rem;
}

.concept-stat-card span {
  color: var(--muted);
  font-size: .92rem;
}

.concept-section-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .85fr);
  gap: 20px;
}

.concept-sidebar {
  position: sticky;
  top: 20px;
  align-self: start;
}

.concept-branch-row,
.concept-timeline-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}

.concept-branch-row:first-child,
.concept-timeline-row:first-child {
  padding-top: 4px;
}

.concept-branch-row:last-child,
.concept-timeline-row:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.concept-phrase-wrap {
  gap: 10px;
}

@media (max-width: 980px) {
  .concept-hero-grid,
  .concept-section-grid {
    grid-template-columns: 1fr;
  }

  .concept-sidebar {
    position: static;
  }
}

@media (max-width: 640px) {
  .concept-hero-card {
    padding: 18px;
  }

  .concept-stat-grid {
    grid-template-columns: 1fr;
  }
}


.concept-index-hero-grid,
.concept-discovery-grid {
  display: grid;
  gap: 1rem;
}

.concept-index-hero-grid {
  grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
  align-items: start;
}

.concept-discovery-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.concept-index-summary,
.concept-index-card {
  height: 100%;
}

.concept-list-stack {
  gap: 0.75rem;
}

.concept-list-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  padding: 0.9rem 1rem;
  border: 1px solid rgba(122, 162, 247, 0.14);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.02);
  text-decoration: none;
}

.concept-list-row:hover {
  border-color: rgba(122, 162, 247, 0.35);
  background: rgba(122, 162, 247, 0.05);
}

.concept-list-metrics {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.4rem;
}

@media (max-width: 900px) {
  .concept-index-hero-grid {
    grid-template-columns: 1fr;
  }
}


.admin-user-actions { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }


.home-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(300px, .95fr);
  gap: 28px;
  padding: 48px 0 24px;
  align-items: start;
}
.hero-lead {
  font-size: 1.08rem;
  line-height: 1.6;
  max-width: 760px;
}
.hero-mini-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 26px;
}
.mini-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 16px;
}
.mini-card strong {
  display: block;
  margin-bottom: 8px;
}
.mini-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}
.home-side-card {
  padding: 24px;
}
.process-list li {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 14px;
  align-items: start;
  padding: 14px 0;
}
.process-list li p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.5;
}
.step-num {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  font-weight: 700;
  background: rgba(106,166,255,.15);
  border: 1px solid rgba(106,166,255,.28);
  color: var(--accent-2);
}
.home-section {
  padding: 18px 0 8px;
}
.section-title {
  margin: 0;
  font-size: clamp(1.4rem, 3vw, 2rem);
}
.home-path-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 20px;
}
.feature-card {
  display: block;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 20px;
  color: var(--text);
  text-decoration: none;
  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}
.feature-card:hover {
  text-decoration: none;
  transform: translateY(-2px);
  border-color: var(--accent);
}
.feature-kicker {
  display: inline-block;
  font-size: .82rem;
  font-weight: 700;
  color: var(--accent-2);
  background: var(--panel-2);
  border-radius: 999px;
  padding: 6px 10px;
  margin-bottom: 12px;
}
.feature-card h3 {
  margin: 0 0 10px;
  font-size: 1.18rem;
  line-height: 1.35;
}
.feature-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}
.nav-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 999px;
  background: var(--panel-2);
  border: 1px solid var(--line);
  color: var(--text);
  font-weight: 700;
  text-decoration: none;
}
.nav-cta:hover {
  text-decoration: none;
  border-color: var(--accent);
}
@media (max-width: 980px) {
  .home-hero,
  .home-path-grid,
  .hero-mini-grid {
    grid-template-columns: 1fr;
  }
}


.meta-row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.meta-pill { display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px; background:var(--panel-2); border:1px solid var(--line); color:var(--text); font-size:.9rem; }
.page-head-tight { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; flex-wrap:wrap; }
.no-margin { margin:0; }
.chip { display:inline-flex; align-items:center; justify-content:center; padding:10px 14px; border-radius:999px; border:1px solid var(--line); background:var(--panel-2); color:var(--text); font-weight:700; }
.chip:hover { text-decoration:none; border-color:var(--accent); }
.card-grid { display:grid; grid-template-columns:1fr; gap:14px; }
@media (min-width: 860px) { .concept-browser-grid { grid-template-columns:1fr 1fr; } }

.topics-hero-card { align-items:center; }
.topics-hero-copy { max-width:720px; }
.topics-search-form { width:min(360px, 100%); }
.search-shell { display:flex; align-items:center; gap:10px; background:var(--panel-2); border:1px solid var(--line); border-radius:12px; padding:0 14px; }
.search-shell:focus-within { border-color:var(--accent); box-shadow:0 0 0 2px rgba(106,166,255,.12); }
.search-shell input[type="search"] { margin-top:0; border:0; background:transparent; padding:12px 0; outline:none; box-shadow:none; color:var(--text); caret-color:var(--text); }
.search-shell input[type="search"]::placeholder { color:var(--muted); opacity:1; }
.search-icon { opacity:.75; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.concept-browser-card { display:block; color:var(--text); transition:transform .15s ease, border-color .15s ease, background .15s ease; }
.concept-browser-card:hover { text-decoration:none; transform:translateY(-2px); border-color:var(--accent); background:#202b40; }
.concept-mini-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); gap:12px; }
.concept-mini-card { display:flex; flex-direction:column; gap:8px; padding:14px; border:1px solid var(--line); border-radius:14px; background:var(--panel-2); color:var(--text); }
.concept-mini-card:hover { text-decoration:none; border-color:var(--accent); background:#202b40; }
.concept-momentum-pill { font-weight:700; }
.concept-momentum-rising, .concept-momentum-new { color:var(--accent-2); }
.concept-momentum-steady { color:var(--text); }
.concept-momentum-cooling { color:var(--muted); }
.concept-momentum-quiet { color:var(--muted); }


.feed-hero-actions { display:flex; align-items:center; justify-content:flex-end; gap:12px; flex-wrap:wrap; }
/* Feed search toolbar */
.feed-search-form { width:min(620px, 100%); flex:1 1 520px; }
.feed-search-control { display:flex; align-items:center; gap:10px; width:100%; }
.feed-search-control input[type="search"] { flex:1; min-width:280px; height:58px; font-size:1.05rem; padding:0 18px; }
.feed-search-clear { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 18px; border-radius:14px; border:1px solid var(--border); background:rgba(255,255,255,.04); color:var(--text); font-weight:800; text-decoration:none; cursor:pointer; }
.feed-search-clear:hover { border-color:rgba(96,165,250,.65); background:rgba(96,165,250,.12); }
.feed-toolbar { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.pagination-card { padding-top:16px; padding-bottom:16px; }
.pagination-row { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.pagination-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
@media (max-width: 860px) {
  .feed-hero-actions { width:100%; justify-content:stretch; }
  .feed-search-form { width:100%; flex-basis:100%; }
  .feed-search-control { flex-direction:column; align-items:stretch; }
  .feed-search-control input[type="search"] { min-width:0; width:100%; }
  .feed-search-clear { width:100%; }
  .pagination-row { align-items:flex-start; }
}


/* Header navigation refresh */
.nav {
  flex-direction: row !important;
  align-items: center !important;
}
.nav-links-desktop {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.nav-mobile-actions,
.mobile-menu {
  display: none;
}
.nav-notification-link,
.nav-icon-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 38px;
}
.nav-icon-link {
  position: relative;
  min-width: 40px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--panel-2);
  color: var(--text);
  text-decoration: none;
}
.nav-icon-link:hover,
.nav-notification-link:hover {
  text-decoration: none;
}
.nav-badge,
.nav-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  line-height: 1;
}
.nav-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  padding: 0;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--panel-2);
  color: var(--text);
  font-size: 1.1rem;
}
.mobile-menu {
  margin-top: 10px;
  padding-bottom: 14px;
}
.mobile-menu-links {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel);
}
.mobile-menu-links a,
.mobile-menu-link-button {
  display: block;
  width: 100%;
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--panel-2);
  color: var(--text);
  text-align: left;
  text-decoration: none;
  border: 1px solid transparent;
}
.mobile-menu-links a:hover,
.mobile-menu-link-button:hover {
  text-decoration: none;
  border-color: var(--line);
}
.mobile-menu-form {
  margin: 0;
}
.mobile-menu-link-button {
  cursor: pointer;
}
.dashboard-flow-list {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}
.dashboard-flow-item {
  padding: 14px 0;
  border-top: 1px solid var(--line);
}
.dashboard-flow-item:first-child {
  border-top: 0;
  padding-top: 0;
}
.dashboard-flow-item strong {
  display: block;
  margin-bottom: 4px;
}
.dashboard-flow-item p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

@media (max-width: 860px) {
  .nav {
    gap: 12px;
  }
  .nav-links-desktop {
    display: none !important;
  }
  .nav-mobile-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
  }
  .mobile-menu {
    display: block;
  }
  .nav-cta-mobile {
    min-height: 38px;
    padding: 0 12px;
  }
  .brand {
    flex: 1 1 auto;
    min-width: 0;
  }
}


/* Header nav refinement */
.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  backdrop-filter: blur(12px);
}
.nav-links-desktop {
  gap: 18px;
  flex-wrap: nowrap;
}
.nav-links-desktop a,
.nav-text-link {
  color: var(--accent-2);
  font-weight: 700;
  font-size: 0.98rem;
  white-space: nowrap;
}
.nav-links-desktop a:hover,
.nav-text-link:hover {
  text-decoration: none;
  color: var(--text);
}
.nav-logout-form {
  display: inline-flex;
  align-items: center;
}
.nav-mobile-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}
.nav-mobile-actions-auth {
  flex-shrink: 0;
}
.nav-toggle {
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.02);
}
.nav-cta-mobile {
  white-space: nowrap;
}
.mobile-menu {
  display: block;
}
.mobile-menu[hidden] {
  display: none;
}
.mobile-menu-links {
  width: min(360px, 100%);
  margin-left: auto;
}
.mobile-menu-divider {
  height: 1px;
  background: var(--line);
  margin: 4px 0;
}
.mobile-only-menu-link {
  display: none !important;
}
@media (min-width: 861px) {
  .mobile-menu-links {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 860px) {
  .nav {
    gap: 10px;
  }
  .nav-links-desktop {
    display: none !important;
  }
  .nav-mobile-actions {
    display: flex;
  }
  .nav-cta-mobile {
    min-height: 38px;
    padding: 0 12px;
  }
  .mobile-only-menu-link {
    display: block !important;
  }
  .mobile-menu-form.mobile-only-menu-link {
    display: block !important;
  }
}


.feed-update-bar {
  border-color: rgba(97, 153, 255, 0.45);
  background: linear-gradient(180deg, rgba(18, 29, 54, 0.98), rgba(13, 23, 43, 0.98));
}

.feed-update-actions {
  display: flex;
  gap: 0.6rem;
  align-items: center;
  flex-wrap: wrap;
}

@media (max-width: 720px) {
  .feed-update-bar .row-between {
    align-items: flex-start;
  }
}
.avatar-fallback {
    width: 44px;
    height: 44px;
    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    font-weight: 700;
    font-size: 17px;
    letter-spacing: 0.5px;

    color: #ffffff;

    border: 1px solid rgba(255,255,255,0.08);

    user-select: none;
}

.checkbox-row {
  display: flex;
  align-items: center;
  gap: .55rem;
}

.compact-settings-block {
  padding-top: .35rem;
}

.detail-actions-bar {
  align-items: center;
}

.share-icon-row {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
}

.share-icon-row-inline {
  margin-left: auto;
}

.share-icon-button {
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.04);
  color: var(--text);
  text-decoration: none;
  font-weight: 800;
  font-size: .92rem;
  line-height: 1;
  padding: 0;
  cursor: pointer;
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}

.share-icon-button:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.18);
}

.share-icon-button span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.share-icon-x span {
  font-size: .9rem;
}

.share-icon-facebook span {
  font-size: 1rem;
}

.share-icon-linkedin span {
  font-size: .8rem;
}

.share-icon-copy span {
  font-size: .95rem;
}

.post-actions-secondary {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  flex-wrap: wrap;
}


.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.feed-hero-card {
  overflow: hidden;
}

.feed-guide {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.feed-guide-item,
.conversation-map-item,
.feed-sidebar-card {
  background: var(--panel-2);
  border: 1px solid var(--line);
  border-radius: 14px;
}

.feed-guide-item {
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.context-strong {
  color: var(--text);
}

.post-context-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.context-pill {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 700;
  border: 1px solid transparent;
}

.context-pill-start {
  background: rgba(106, 166, 255, .12);
  border-color: rgba(106, 166, 255, .25);
  color: var(--accent-2);
}

.context-pill-response {
  background: rgba(107, 218, 148, .10);
  border-color: rgba(107, 218, 148, .20);
  color: var(--success);
}


.post-context-bar-stacked {
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
}

.post-label-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.context-pill-state {
  font-weight: 800;
}

.state-starting {
  background: rgba(106, 166, 255, .12);
  border-color: rgba(106, 166, 255, .26);
  color: #9bc2ff;
}

.state-active {
  background: rgba(92, 193, 135, .12);
  border-color: rgba(92, 193, 135, .26);
  color: #86efac;
}

.state-branching {
  background: rgba(255, 173, 66, .14);
  border-color: rgba(255, 173, 66, .28);
  color: #ffd27d;
}

.state-exploring {
  background: rgba(168, 127, 255, .14);
  border-color: rgba(168, 127, 255, .28);
  color: #d7c2ff;
}

.state-needs-response {
  background: rgba(255, 117, 117, .12);
  border-color: rgba(255, 117, 117, .24);
  color: #ffb3b3;
}

.context-pill-structure {
  background: rgba(255,255,255,.045);
  border-color: rgba(255,255,255,.08);
  color: rgba(255,255,255,.82);
}

.structure-started {
  background: rgba(106, 166, 255, .08);
  border-color: rgba(106, 166, 255, .16);
}

.structure-built {
  background: rgba(107, 218, 148, .08);
  border-color: rgba(107, 218, 148, .18);
}

.structure-path {
  background: rgba(255, 173, 66, .08);
  border-color: rgba(255, 173, 66, .18);
}

.structure-related {
  background: rgba(168, 127, 255, .10);
  border-color: rgba(168, 127, 255, .18);
}

.post-author-row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.post-author-meta {
  min-width: 0;
}

.post-avatar,
.post-avatar-fallback {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  object-fit: cover;
  font-weight: 700;
  color: #fff;
}

.post-head-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.post-parent-row,
.post-parent-card {
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--panel-2);
  border: 1px solid var(--line);
}

.post-parent-card-top {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}

.post-parent-kicker {
  color: var(--muted);
  font-size: .86rem;
}

.post-parent-title {
  display: inline-block;
  font-weight: 700;
  margin-bottom: 4px;
}

.conversation-map,
.conversation-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.conversation-map-item,
.conversation-summary-item {
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--panel-2);
  border: 1px solid var(--line);
}

.conversation-map-label,
.conversation-summary-label {
  display: block;
  color: var(--muted);
  font-size: .78rem;
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.conversation-summary-item strong {
  display: block;
  font-size: 1rem;
  margin-bottom: 6px;
}

.conversation-summary-note {
  display: block;
  color: var(--muted);
  font-size: .86rem;
  line-height: 1.35;
}

.post-actions-wrap {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}

.post-actions-secondary {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.action-chip,
.trail-action-pill,
.chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--panel-2);
  color: var(--text);
  text-decoration: none;
  font-size: .92rem;
}

.action-chip:hover,
.trail-action-pill:hover,
.chip:hover {
  text-decoration: none;
  border-color: var(--accent);
}

.action-chip-primary,
.trail-action-pill {
  border-color: rgba(106, 166, 255, .28);
}

.action-inline-count {
  color: var(--muted);
}

.share-icon-row {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.share-icon-button {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line);
  background: var(--panel-2);
  color: var(--text);
}

.search-shell {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel-2);
}

.search-shell input {
  border: 0;
  background: transparent;
  margin-top: 0;
  padding-left: 0;
  padding-right: 0;
}

.search-shell input:focus {
  outline: none;
}

.feed-search-form {
  width: min(360px, 100%);
}

.feed-hero-actions {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.feed-sidebar-card {
  padding: 18px;
}

@media (max-width: 860px) {
  .feed-guide,
  .conversation-map,
  .conversation-summary {
    grid-template-columns: 1fr;
  }

  .post-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .post-head-badges {
    justify-content: flex-start;
  }

  .feed-hero-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .feed-search-form {
    width: 100%;
  }
}


/* --------------------------------------------------
   Safe feed/post-card cleanup
   Canonical post-card styles kept at the end on purpose
   so later edits do not fight earlier duplicate blocks.
-------------------------------------------------- */
.post-card {
  padding: 18px 20px;
  border-radius: 24px;
  box-shadow: 0 0 0 1px rgba(104, 130, 255, 0.08), 0 0 26px rgba(90, 128, 255, 0.12);
}

.post-actions-wrap {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}

.post-actions,
.post-actions-secondary {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.share-icon-row {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

@media (max-width: 640px) {
  .post-card {
    padding: 16px;
    border-radius: 20px;
  }

  .action-chip,
  .trail-action-pill {
    width: 100%;
    justify-content: center;
  }

  .post-actions-wrap,
  .post-actions,
  .post-actions-secondary,
  .share-icon-row {
    width: 100%;
  }
}


.conversation-details {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,0.02);
  padding: 12px 14px;
}

.conversation-details-summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.conversation-details-summary::-webkit-details-marker {
  display: none;
}

.conversation-details-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  color: var(--text);
}

.conversation-details-title::after {
  content: "▾";
  font-size: 0.9rem;
  color: var(--muted);
  transition: transform 0.18s ease;
}

.conversation-details[open] .conversation-details-title::after {
  transform: rotate(180deg);
}

.conversation-details-meta {
  color: var(--muted);
  font-size: 0.9rem;
  text-align: right;
}

@media (max-width: 860px) {
  .conversation-details-summary {
    flex-direction: column;
    align-items: flex-start;
  }

  .conversation-details-meta {
    text-align: left;
  }
}


.story-jump-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 14px;
  border: 1px solid rgba(120, 160, 255, 0.18);
  background: rgba(120, 160, 255, 0.08);
  border-radius: 14px;
}

.story-jump-kicker {
  font-size: 0.92rem;
  font-weight: 700;
  color: #dfe9ff;
}

.story-jump-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

@media (max-width: 720px) {
  .story-jump-banner {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* Dashboard phase 1 */

.dashboard-hero-single {
  margin-top: 24px;
}

.dashboard-primary-card {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.dashboard-kicker {
  color: var(--muted);
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 6px;
}
.dashboard-last-seen {
  text-align: right;
}
.dashboard-since-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.mini-stat-highlight {
  background: rgba(255,255,255,0.02);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px;
}
.dashboard-bullet-list {
  display: grid;
  gap: 10px;
}
.dashboard-bullet-item {
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255,255,255,0.02);
}

.dashboard-quick-list {
  margin: 10px 0 0;
  padding-left: 18px;
  color: var(--text);
}
.dashboard-quick-list li + li {
  margin-top: 4px;
}
.dashboard-inline-cta {
  transition: text-decoration-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}
.dashboard-inline-cta:hover,
.dashboard-inline-cta:focus-visible {
  text-decoration: underline;
  text-underline-offset: 2px;
  box-shadow: 0 0 0 1px rgba(106, 166, 255, 0.22), 0 0 14px rgba(106, 166, 255, 0.18);
  transform: translateY(-1px);
}

.dashboard-section-intro {
  margin: 4px 0 0;
}
.dashboard-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
}
.dashboard-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,0.03);
  font-size: 0.78rem;
  color: var(--muted);
}
.dashboard-pill-new {
  background: rgba(69, 144, 255, 0.12);
  color: #b8d4ff;
}
.dashboard-pill-waiting {
  background: rgba(255, 170, 70, 0.12);
  color: #ffd3a1;
}
.dashboard-pill-recommended {
  background: rgba(168, 85, 247, 0.12);
  color: #e2c7ff;
}

.dashboard-pill-heat {
  background: rgba(255,255,255,0.06);
  color: #d7e2ff;
}
.dashboard-topic-spark {
  display: inline-flex;
  align-items: center;
  margin-left: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  color: var(--muted);
  font-size: 0.76rem;
}
.dashboard-bullet-item-empty {
  background: rgba(255,255,255,0.03);
}
.dashboard-action-item + .dashboard-action-item {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.dashboard-why-list {
  margin: 10px 0 0;
  padding-left: 18px;
  color: var(--muted);
}
.dashboard-why-list li + li {
  margin-top: 4px;
}
@media (max-width: 860px) {
  .dashboard-since-grid {
    grid-template-columns: 1fr;
  }
  .dashboard-last-seen {
    text-align: left;
  }
}


.split-moment-card {
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(96, 165, 250, 0.08), rgba(255,255,255,0.02));
  border: 1px solid rgba(96, 165, 250, 0.2);
}

.split-moment-card--soft {
  background: rgba(255,255,255,0.02);
  border-color: var(--line);
}

.split-moment-kicker {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin-bottom: 6px;
}

.split-moment-title {
  margin: 0 0 6px;
}

.branch-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.branch-choice-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.015));
}

.branch-choice-top {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
}

.branch-rank-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--muted);
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
}

.branch-choice-title {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.3;
}

.branch-choice-title a {
  color: var(--text);
  text-decoration: none;
}

.branch-choice-title a:hover,
.branch-choice-title a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.branch-choice-preview {
  color: var(--muted);
  line-height: 1.5;
}

.branch-choice-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 0.86rem;
  color: var(--muted);
}

.branch-choice-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.branch-stat {
  display: inline-flex;
  align-items: center;
  padding: 0.35rem 0.65rem;
  border-radius: 999px;
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--line);
  font-size: 0.82rem;
  color: var(--muted);
}

.branch-choice-footer {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.branch-choice-note {
  color: var(--text);
  font-size: 0.92rem;
}

@media (max-width: 900px) {
  .branch-choice-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .branch-choice-footer {
    flex-direction: column;
    align-items: stretch;
  }

  .branch-choice-footer .button {
    width: 100%;
    text-align: center;
  }
}


.feed-hero-card-guided { padding-bottom: 18px; }
.feed-state-guide { display:flex; flex-wrap:wrap; gap:8px; }
.state-pill { display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.03); font-size:.85rem; }
.guided-feed-personal { border-color: rgba(255,255,255,.12); }
.guided-mini-list { display:grid; gap:10px; }
.guided-mini-item { display:block; padding:12px 14px; border-radius:14px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06); text-decoration:none; color:inherit; }
.guided-mini-item:hover { border-color: rgba(255,255,255,.14); transform: translateY(-1px); }
.guided-mini-title { font-weight:700; margin-bottom:4px; }
.guided-feed-section { display:grid; gap:10px; }
.guided-feed-section-head { margin-bottom: 2px; }
.section-kicker { font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color: var(--muted, #a0a0a0); margin-bottom:6px; }
.section-title { margin:0 0 6px; }
.feed-state-note { font-size:.82rem; font-weight:700; letter-spacing:.01em; color: #d8d8d8; margin: 6px 4px -2px; }
.guided-feed-section-waiting .guided-feed-section-head { border-left: 3px solid rgba(255,210,76,.85); }
.guided-feed-section-started .guided-feed-section-head { border-left: 3px solid rgba(95,170,255,.85); }
.guided-feed-section-splitting .guided-feed-section-head { border-left: 3px solid rgba(255,128,82,.9); }
.guided-feed-section-connected .guided-feed-section-head, .guided-feed-section-revived .guided-feed-section-head { border-left: 3px solid rgba(113,221,143,.85); }
@media (max-width: 900px) { .feed-state-guide { gap:6px; } }


.feed-v2-layout {
  grid-template-columns: minmax(0, 1fr);
}

.feed-v2-layout > aside {
  display: none;
}

.feed-hero-card-guided .feed-hero-row {
  align-items: flex-start;
}

.guided-feed-personal,
.guided-feed-section-head,
.feed-topic-pulse {
  border-color: rgba(110, 162, 255, 0.18);
}

.guided-feed-section {
  margin-top: 0.25rem;
}

.guided-feed-section .stack {
  gap: 0.85rem;
}

.guided-feed-personal .guided-mini-list {
  gap: 0.65rem;
}

.guided-mini-item {
  padding: 0.85rem 0.95rem;
  border: 1px solid rgba(110, 162, 255, 0.14);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.02);
}

.guided-mini-item:hover {
  border-color: rgba(110, 162, 255, 0.28);
  background: rgba(255, 255, 255, 0.03);
}

.feed-topic-pulse .tag-row {
  gap: 0.5rem;
}


.feed-entry-card {
  border-color: rgba(110, 162, 255, 0.16);
  padding: 1rem 1rem 1.05rem;
}
.feed-entry-topline {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:.75rem;
  flex-wrap:wrap;
}
.feed-entry-state-chip {
  display:inline-flex;
  align-items:center;
  padding:.34rem .65rem;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.03);
  font-size:.76rem;
  font-weight:700;
  line-height:1.1;
}
.feed-entry-authorline {
  font-size:.82rem;
  color:var(--muted, #a0a0a0);
}
.feed-entry-card-waiting .feed-entry-state-chip { border-color: rgba(255,210,76,.45); }
.feed-entry-card-started .feed-entry-state-chip { border-color: rgba(95,170,255,.45); }
.feed-entry-card-splitting .feed-entry-state-chip { border-color: rgba(255,128,82,.45); }
.feed-entry-card-connected .feed-entry-state-chip,
.feed-entry-card-revived .feed-entry-state-chip { border-color: rgba(113,221,143,.45); }
.feed-entry-connection {
  display:grid;
  gap:.2rem;
}
.feed-entry-connection-label {
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--muted, #a0a0a0);
}
.feed-entry-connection-title {
  color:inherit;
  text-decoration:none;
  font-size:.93rem;
}
.feed-entry-connection-title:hover,
.feed-entry-title-link:hover { text-decoration:underline; }
.feed-entry-title {
  margin:.55rem 0 .35rem;
  font-size:1.25rem;
  line-height:1.2;
}
.feed-entry-title-link {
  color:inherit;
  text-decoration:none;
}
.feed-entry-preview {
  color:rgba(255,255,255,.92);
  line-height:1.55;
}
.feed-entry-meaning {
  font-size:.95rem;
  font-weight:600;
}
.feed-entry-metrics {
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
}
.feed-entry-actions {
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  align-items:center;
}
.feed-entry-actions .button {
  min-width: 0;
}
@media (max-width: 720px) {
  .feed-entry-card {
    padding:.92rem;
  }
  .feed-entry-title {
    font-size:1.08rem;
  }
  .feed-entry-actions {
    align-items:stretch;
  }
}


/* Feed polish + media preview pass */
.guided-feed-section-head {
  padding: 1rem 1.1rem;
}
.guided-feed-section-splitting .guided-feed-section-head {
  background: linear-gradient(180deg, rgba(255,128,82,.08), rgba(255,255,255,.02));
  box-shadow: inset 0 0 0 1px rgba(255,128,82,.08);
}
.guided-feed-section-head .muted {
  max-width: 60rem;
}
.feed-entry-card {
  padding: .95rem 1rem 1rem;
  border-radius: 16px;
  box-shadow: 0 8px 28px rgba(0,0,0,.10);
}
.feed-entry-card:hover {
  border-color: rgba(110, 162, 255, 0.28);
  transform: translateY(-1px);
}
.feed-entry-card.feed-entry-card-splitting {
  border-color: rgba(255,128,82,.22);
  box-shadow: 0 8px 28px rgba(255,128,82,.06);
}
.feed-entry-topline {
  gap: .5rem 1rem;
}
.feed-entry-state-chip {
  background: rgba(255,255,255,.045);
  font-size: .74rem;
}
.feed-entry-card-splitting .feed-entry-state-chip {
  background: rgba(255,128,82,.08);
}
.feed-entry-card-waiting .feed-entry-state-chip {
  background: rgba(255,210,76,.08);
}
.feed-entry-card-started .feed-entry-state-chip {
  background: rgba(95,170,255,.08);
}
.feed-entry-card-connected .feed-entry-state-chip,
.feed-entry-card-revived .feed-entry-state-chip,
.feed-entry-card-for_you .feed-entry-state-chip,
.feed-entry-card-unfinished .feed-entry-state-chip {
  background: rgba(113,221,143,.08);
}
.feed-entry-connection {
  margin-top: .35rem;
}
.feed-entry-connection-label {
  text-transform: none;
  letter-spacing: 0;
  font-size: .73rem;
}
.feed-entry-main {
  display: grid;
  gap: .75rem;
}
.feed-entry-main-with-media {
  grid-template-columns: minmax(0, 1.2fr) minmax(220px, .8fr);
  align-items: start;
}
.feed-entry-title {
  margin: .35rem 0 .28rem;
  font-size: 1.14rem;
}
.feed-entry-preview {
  font-size: .95rem;
  color: rgba(255,255,255,.86);
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.feed-entry-meaning {
  font-size: .92rem;
  font-weight: 600;
  color: rgba(255,255,255,.96);
}
.feed-entry-media {
  min-width: 0;
}
.feed-entry-media-image,
.feed-entry-media-video {
  width: 100%;
  max-height: 220px;
  object-fit: cover;
  border-radius: 14px;
  display: block;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
}
.feed-entry-media-embed-wrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
}
.feed-entry-media-embed-wrap iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.feed-entry-footer {
  display: flex;
  justify-content: space-between;
  gap: .9rem;
  align-items: end;
  flex-wrap: wrap;
}
.feed-entry-metrics {
  margin-top: .8rem;
}
.feed-entry-actions {
  margin-top: .7rem;
}
.feed-entry-actions .action-chip {
  padding-inline: .8rem;
}
@media (max-width: 860px) {
  .feed-entry-main-with-media {
    grid-template-columns: 1fr;
  }
  .feed-entry-media-image,
  .feed-entry-media-video {
    max-height: 260px;
  }
}
@media (max-width: 720px) {
  .guided-feed-section-head {
    padding: .9rem .95rem;
  }
  .feed-entry-card {
    padding: .9rem;
  }
  .feed-entry-preview {
    -webkit-line-clamp: 5;
  }
  .feed-entry-footer {
    align-items: stretch;
  }
}


/* === Feed toolbar + update bar repair === */
.feed-shell { padding-bottom: 10px; }

.feed-page-head h1 {
  margin: 0 0 8px;
  font-size: clamp(2rem, 4vw, 3rem);
  letter-spacing: -0.02em;
}

.feed-page-head .muted {
  margin: 0 0 10px;
  font-size: 1rem;
}

.feed-toolbar {
  padding: 20px 24px;
}

.feed-toolbar-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: nowrap;
}

.feed-search-form {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 760px;
}

input[type="search"] {
  width: 100%;
  margin-top: 0;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--panel-2);
  color: var(--text);
  font-size: 1rem;
}

.feed-toolbar .button {
  flex: 0 0 auto;
  min-width: 124px;
  padding: 12px 18px;
  border-radius: 14px;
  box-shadow: 0 8px 22px rgba(106,166,255,.22);
}

.feed-update-bar {
  border-color: rgba(106,166,255,.35);
  background: linear-gradient(180deg, rgba(26,34,49,.96), rgba(23,28,39,.96));
}

.feed-update-bar-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}


.feed-update-copy {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.feed-update-summary {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.feed-update-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(106,166,255,.28);
  background: rgba(106,166,255,.10);
  color: #d9e9ff;
  font-size: .92rem;
  line-height: 1;
}

.feed-update-pill strong {
  color: #ffffff;
}

.feed-update-actions {
  display: flex;
  gap: .65rem;
  align-items: center;
  flex-wrap: wrap;
}

.feed-bucket {
  margin-top: 8px;
  padding-left: 0;
  border-left: 0;
}

.feed-bucket-head {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 6px;
}

.feed-bucket-label {
  display: inline-flex;
  align-self: flex-start;
  padding: 10px 16px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(106,166,255,.24), rgba(106,166,255,.08));
  border: 1px solid rgba(106,166,255,.42);
  color: #d9e9ff;
  font-weight: 800;
  font-size: 1rem;
  letter-spacing: .02em;
  box-shadow: 0 0 0 1px rgba(106,166,255,.06), 0 10px 24px rgba(0,0,0,.28);
}

.feed-bucket-head .muted {
  margin: 0;
  color: #a8b7d4;
  font-size: 0.98rem;
}

/* === Story line media continuity restore === */
.story-step-media {
  margin-top: 14px;
  max-width: 700px;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
}

.story-step-media-image,
.story-step-media-video {
  display: block;
  width: 100%;
  height: auto;
  max-height: 460px;
  object-fit: cover;
}

.trail-inline {
  gap: .75rem;
}

.trail-inline-node {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  max-width: 320px;
  padding: .45rem .7rem;
}

.trail-inline-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.trail-inline-thumb {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  overflow: hidden;
  flex: 0 0 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--panel-2);
  border: 1px solid rgba(255,255,255,.08);
}

.trail-inline-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.trail-inline-thumb-video {
  color: var(--accent-2);
  font-size: .95rem;
  font-weight: 800;
}

.branch-choice-media {
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
}

.branch-choice-media-image,
.branch-choice-media-video {
  display: block;
  width: 100%;
  height: auto;
  max-height: 240px;
  object-fit: cover;
}

@media (max-width: 640px) {
  .feed-toolbar {
    padding: 16px;
  }

  .feed-toolbar-row,
  .feed-update-bar-row {
    flex-wrap: wrap;
    align-items: stretch;
  }

  .feed-search-form {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .feed-toolbar .button {
    width: 100%;
    text-align: center;
  }

  .feed-bucket {
    padding-left: 10px;
  }

  .trail-inline-node {
    max-width: 100%;
  }

  .story-step-media-image,
  .story-step-media-video {
    max-height: 320px;
  }
}


/* === Feed CLS stabilization pass === */
.feed-update-slot {
  position: relative;
  min-height: 0;
}

.feed-update-bar {
  min-height: 0;
  transition: opacity .18s ease, transform .18s ease;
  will-change: opacity, transform;
}

.feed-update-bar.is-hidden {
  display: none;
  visibility: hidden;
  opacity: 0;
  transform: translateY(-6px);
  pointer-events: none;
}

.feed-update-bar:not(.is-hidden) {
  display: block;
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

.feed-entry-media-image,
.feed-entry-media-video,
.post-media-image,
.post-media-video,
.story-step-media-image,
.story-step-media-video,
.branch-choice-media-image,
.branch-choice-media-video {
  aspect-ratio: 16 / 9;
  contain-intrinsic-size: 360px 203px;
}

@media (max-width: 720px) {
  .feed-update-slot,
  .feed-update-bar {
    min-height: 0;
  }
}


/* Mobile width refinement */
@media (max-width: 640px){
  .wrap{
    width:min(100%, calc(100% - 16px));
  }

  .feed-shell,
  .feed-main{
    width:100%;
    min-width:0;
  }

  .feed-hero{
    padding-left:2px;
    padding-right:2px;
  }

  .feed-toolbar{
    padding:16px;
    border-radius:24px;
  }

  .feed-toolbar .search{
    padding:0;
  }

  .feed-toolbar .search input{
    width:100%;
  }

  .feed-bucket{
    padding-left:14px;
    margin-left:0;
  }

  .feed-bucket-redesign{
    padding-left:0;
    padding-right:0;
  }

  .feed-bucket-redesign{
    padding-left:0;
    padding-right:0;
  }

  .card{
    padding:18px;
    border-radius:24px;
  }

  .feed-card-head{
    gap:10px;
  }

  .feed-card-title{
    line-height:1.08;
  }

  .reply-chip-row{
    gap:8px;
  }
}


/* Feed redesign: server-rendered, no live JS dependency */
.feed-shell-redesign {
  gap: 18px;
}
.feed-stream-redesign,
.feed-bucket-redesign,
.feed-card-grid {
  width: 100%;
  min-width: 0;
}
.feed-bucket-redesign {
  padding: 0;
  margin: 0;
}
.feed-card-grid > .post-card {
  width: 100%;
  box-sizing: border-box;
}
.feed-stream-redesign,
.feed-bucket-redesign,
.feed-card-grid {
  width: 100%;
  min-width: 0;
}
.feed-bucket-redesign {
  padding: 0;
  margin: 0;
}
.feed-card-grid > .post-card {
  width: 100%;
  box-sizing: border-box;
}
.feed-hero-card-redesign {
  padding: 22px;
  display: grid;
  gap: 18px;
}
.feed-redesign-topline {
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: rgba(255,255,255,.72);
  font-weight: 700;
}
.feed-redesign-headline-row {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, .9fr);
  gap: 18px;
  align-items: start;
}
.feed-redesign-headline-row h1 {
  margin: 0 0 8px;
  font-size: clamp(1.8rem, 2.7vw, 2.5rem);
  line-height: 1.08;
}
.feed-toolbar-redesign {
  padding: 16px 18px;
}
.feed-hero-actions-redesign {
  align-items: stretch;
}
.feed-explain-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.feed-explain-card {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 14px;
  background: rgba(255,255,255,.03);
  display: grid;
  gap: 6px;
}
.feed-explain-card strong {
  font-size: .98rem;
}
.feed-explain-card span {
  color: rgba(255,255,255,.72);
  font-size: .92rem;
  line-height: 1.45;
}
.feed-status-strip,
.feed-rotation-row,
.feed-bucket-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.feed-status-chip,
.feed-bucket-count {
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.03);
  border-radius: 999px;
  padding: 8px 12px;
  font-size: .88rem;
}
.feed-bucket-redesign {
  padding: 18px;
}
.feed-bucket-head-redesign {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: start;
}
.feed-card-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.feed-bucket-step_in_now {
  border-color: rgba(95,170,255,.28);
}
.feed-bucket-fresh_openings {
  border-color: rgba(255,210,76,.28);
}
.feed-bucket-keep_exploring {
  border-color: rgba(113,221,143,.24);
}
@media (max-width: 980px) {
  .feed-redesign-headline-row,
  .feed-explain-grid,
  .feed-card-grid {
    grid-template-columns: 1fr;
  }
  .feed-bucket-head-redesign {
    flex-direction: column;
  }
}

/* Feed width fix: make stream cards align to Jump in shell */
.feed-stream-redesign > .feed-bucket-redesign {
  padding: 0 !important;
  margin: 0 !important;
}
.feed-stream-redesign .feed-card-grid {
  width: 100%;
}
.feed-stream-redesign .feed-card-grid > .post-card {
  width: 100%;
  margin: 0;
}


/* Feed cards: make the post content lead and metadata support it */
.post-card-content-first {
  display: grid;
  gap: 14px;
}

.post-card-content-first .post-context-bar-stacked {
  gap: 8px;
}

.post-copy-block {
  display: grid;
  gap: 10px;
}

.post-card-content-first .post-title {
  margin: 0;
}

.post-card-content-first .post-body {
  font-size: 1.05rem;
  line-height: 1.72;
}

.post-meta-block {
  margin-top: 0;
  padding-top: 2px;
}

.post-context-note {
  color: rgba(255,255,255,.72);
}

.post-card-content-first .post-parent-card,
.post-card-content-first .tag-row,
.post-card-content-first .conversation-details,
.post-card-content-first .post-actions-wrap,
.post-card-content-first .post-media {
  margin-top: 0;
}

@media (max-width: 860px) {
  .post-card-content-first {
    gap: 12px;
  }

  .post-card-content-first .post-body {
    font-size: 1rem;
    line-height: 1.68;
  }
}


/* Feed cards: social-first order so author comes first, then post, then media, then Trejji context */
.post-trejji-meta {
  display: grid;
  gap: 10px;
}

.post-card-content-first .post-head {
  align-items: center;
}

.post-card-content-first .post-head-badges {
  justify-content: flex-start;
}

.post-card-content-first .post-copy-block {
  gap: 8px;
}

.post-card-content-first .post-title {
  order: 0;
}

.post-card-content-first .post-body {
  order: 1;
}

.post-card-content-first .post-trejji-meta {
  margin-top: 0;
}

.post-card-content-first .post-context-bar-stacked {
  gap: 8px;
}

.post-card-content-first .post-context-note {
  margin-top: 0;
}

.post-card-content-first .post-parent-card,
.post-card-content-first .tag-row,
.post-card-content-first .conversation-details,
.post-card-content-first .post-actions-wrap,
.post-card-content-first .post-media,
.post-card-content-first .post-trejji-meta {
  margin-top: 0;
}

@media (max-width: 860px) {
  .post-card-content-first .post-head {
    align-items: flex-start;
  }
}


/* Feed cards: subtle separator between post copy and visual media */
.post-card-content-first .post-content-separator {
  height: 1px;
  width: 100%;
  background: linear-gradient(90deg, rgba(255,255,255,.14), rgba(255,255,255,.06));
  margin: 4px 0 0;
  border-radius: 999px;
}

.post-card-content-first .post-content-separator + .post-media {
  margin-top: 0;
}


/* Feed card text preview: show a clean 8-line excerpt, then fade at the cutoff */
.feed-shell .post-card-content-first .post-body-preview {
  --feed-preview-line-height: 1.65em;
  --feed-preview-lines: 8;
  --feed-preview-fade-height: 2.4em;
  position: relative;
  overflow: hidden;
  padding-bottom: .2em;
  max-height: calc((var(--feed-preview-line-height) * var(--feed-preview-lines)) + var(--feed-preview-fade-height));
}

.feed-shell .post-card-content-first .post-body {
  display: block;
  overflow: hidden;
  line-height: var(--feed-preview-line-height);
  max-height: calc((var(--feed-preview-line-height) * var(--feed-preview-lines)) + var(--feed-preview-fade-height));
}

.feed-shell .post-card-content-first .post-body-preview::after {
  opacity: 0;
  transition: opacity 0.18s ease;
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: var(--feed-preview-fade-height);
  pointer-events: none;
  background: linear-gradient(to bottom, rgba(15, 23, 42, 0), rgba(15, 23, 42, 0.56) 45%, rgba(15, 23, 42, 0.94) 82%, rgba(15, 23, 42, 1) 100%);
  border-radius: 0 0 12px 12px;
}

.feed-shell .post-card-content-first .post-body-read-more {
  position: absolute;
  right: 0.35rem;
  bottom: 0.15rem;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0.15rem 0.35rem;
  border-radius: 999px;
  color: #d7e9ff;
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.45);
  opacity: 0;
  transform: translateY(4px);
  pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease, color 0.18s ease;
}

.feed-shell .post-card-content-first .post-body-preview.is-truncated::after {
  opacity: 1;
}

.feed-shell .post-card-content-first .post-body-preview.is-truncated .post-body-read-more {
  opacity: 0.94;
  transform: translateY(0);
  pointer-events: auto;
}

.feed-shell .post-card-content-first .post-body-read-more:hover,
.feed-shell .post-card-content-first .post-body-read-more:focus-visible {
  color: #ffffff;
}

@media (max-width: 860px) {
  .feed-shell .post-card-content-first .post-body-preview {
    --feed-preview-line-height: 1.65em;
    --feed-preview-lines: 8;
    --feed-preview-fade-height: 2.1em;
  }

  .feed-shell .post-card-content-first .post-body-read-more {
    right: 0.2rem;
    bottom: 0.05rem;
    font-size: 0.82rem;
  }
}


.insight-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.9rem}.insight-stat-card{display:flex;flex-direction:column;gap:.25rem;padding:1rem;border:1px solid var(--line);border-radius:16px;background:var(--panel-2)}.insight-stat-card strong{font-size:1.6rem;line-height:1}.insight-stat-card span{color:var(--muted);font-size:.92rem}.insight-card-grid,.insight-list{display:grid;gap:1rem}.insight-card-grid{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.insight-item-card{display:flex;flex-direction:column;gap:.85rem;padding:1rem;border:1px solid var(--line);border-radius:18px;background:var(--panel-2)}.insight-mini-stats{display:flex;flex-wrap:wrap;gap:.75rem;color:var(--muted);font-size:.92rem}.insight-examples{display:grid;gap:.75rem}.insight-example{display:block;padding:.8rem .9rem;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03);text-decoration:none;color:inherit}.insight-example strong{display:block;margin-bottom:.3rem}.insight-example span{display:block;color:var(--muted);font-size:.94rem}.insight-actions{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}.insight-approve-form input[type="text"]{min-width:180px}.insight-approve-form input[type="number"]{width:88px}.wrap-mobile{flex-wrap:wrap}.top-gap-small{margin-top:.75rem}.insight-filter-form{display:flex;gap:.75rem;align-items:end;flex-wrap:wrap}@media (max-width:720px){.insight-actions,.insight-filter-form,.insight-approve-form{display:flex;flex-direction:column;align-items:stretch}.insight-approve-form input[type="number"]{width:100%}}

/* ThoughtDrop / Daily Question layer */
.daily-prompt-card {
  padding: 1.6rem;
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(37, 99, 235, .16), rgba(15, 23, 42, .92));
  border: 1px solid rgba(147, 197, 253, .22);
}
.daily-prompt-eyebrow {
  color: #93c5fd;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: .78rem;
  margin-bottom: .45rem;
}
.daily-prompt-card h1 {
  margin: 0 0 .55rem;
  font-size: clamp(1.85rem, 4vw, 3.1rem);
  line-height: 1.05;
}
.daily-answer-form {
  margin-top: 1rem;
}
.daily-answer-form textarea {
  width: 100%;
  min-height: 94px;
  resize: vertical;
  border-radius: 18px;
  padding: 1rem;
  font-size: 1rem;
}
.daily-prompt-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  align-items: center;
  margin-top: .85rem;
}
.daily-answer-bucket {
  margin-top: .25rem;
}
.daily-answer-bucket .feed-bucket-label::before {
  content: "💬 ";
}
.theme-light .daily-prompt-card {
  background: linear-gradient(135deg, rgba(219, 234, 254, .95), rgba(255, 255, 255, .98));
}

.daily-answer-complete {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid rgba(147, 197, 253, .24);
  border-radius: 18px;
  background: rgba(15, 23, 42, .44);
}
.daily-answer-complete-label {
  font-weight: 800;
  color: #bfdbfe;
  margin-bottom: .25rem;
}
.daily-answer-context {
  margin-bottom: .45rem;
  padding: .5rem .65rem;
  border: 1px solid rgba(147, 197, 253, .18);
  border-radius: 12px;
  background: rgba(59, 130, 246, .08);
}
.daily-answer-context a {
  color: inherit;
  text-decoration: none;
}
.daily-answer-context a:hover {
  text-decoration: underline;
}
.theme-light .daily-answer-complete {
  background: rgba(219, 234, 254, .7);
}
.theme-light .daily-answer-complete-label {
  color: #1d4ed8;
}


/* ThoughtDrop connection payoff */
.connection-hero h1{margin:.25rem 0 1rem;font-size:clamp(1.7rem,3vw,2.6rem);line-height:1.08}
.connection-answer-card{margin-top:1rem;padding:1rem;border:1px solid rgba(147,197,253,.22);border-radius:18px;background:rgba(15,23,42,.45)}
.connection-answer-card p{font-size:1.15rem;line-height:1.5;margin:.35rem 0 0}
.connection-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}
.connection-panel h2{margin-top:0}
.connection-mini{padding:.85rem;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.035)}
.connection-mini a{color:inherit;text-decoration:none}
.connection-mini a:hover{text-decoration:underline}
.connection-mini p{margin:.35rem 0;color:var(--muted);line-height:1.45}
.theme-light .connection-answer-card{background:rgba(219,234,254,.7)}
.theme-light .connection-mini{background:rgba(255,255,255,.75)}

.feed-load-more-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .55rem;
  padding: 1rem 0 1.5rem;
}
.feed-load-more-btn {
  min-width: 180px;
  justify-content: center;
}

.connection-summary-panel .connection-stat-box {
  display: flex;
  align-items: baseline;
  gap: .65rem;
  margin: 1rem 0;
  padding: .9rem 1rem;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.035);
}
.connection-stat-box strong {
  font-size: 2.1rem;
  line-height: 1;
}
.connection-stat-box span {
  color: var(--muted);
  font-weight: 700;
}
.prompt-history-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.prompt-history-card h2 {
  margin: .35rem 0 .65rem;
  font-size: 1.35rem;
  line-height: 1.2;
}
.prompt-history-card h2 a {
  color: var(--text);
  text-decoration: none;
}
.prompt-history-card h2 a:hover {
  color: var(--accent);
}
@media (max-width: 820px) {
  .prompt-history-grid {
    grid-template-columns: 1fr;
  }
}

/* Real Today page */
.today-page-shell {
  max-width: 1180px;
}
.today-hero-card {
  padding: clamp(1.4rem, 3vw, 2rem);
}
.today-user-answer {
  margin: .35rem 0 0;
  font-size: 1.15rem;
  line-height: 1.5;
  color: var(--text);
}
.today-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-top: .35rem;
}
.today-section-head h2 {
  margin: .1rem 0 0;
  font-size: clamp(1.35rem, 2.4vw, 2rem);
  line-height: 1.15;
}
.today-connection-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.today-answer-list {
  margin-top: 0;
}
.today-recent-prompts {
  margin-top: 0;
}
.today-explore-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.today-explore-card h2 {
  margin: .15rem 0 .35rem;
}
.today-compact-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.15rem;
  border-color: rgba(147,197,253,.18);
  background: rgba(15,23,42,.42);
}
.today-compact-card h2 {
  margin: .1rem 0 .2rem;
  font-size: clamp(1.05rem, 2vw, 1.45rem);
  line-height: 1.2;
}
.today-compact-actions {
  margin-top: 0;
  flex-shrink: 0;
  justify-content: flex-end;
}
.theme-light .today-compact-card {
  background: rgba(255,255,255,.78);
}
@media (max-width: 860px) {
  .today-section-head,
  .today-explore-card,
  .today-compact-card {
    align-items: stretch;
    flex-direction: column;
  }
  .today-connection-grid {
    grid-template-columns: 1fr;
  }
  .today-compact-actions {
    justify-content: flex-start;
  }
}

.danger-chip{border-color:rgba(248,113,113,.45)!important;color:#fecaca!important;background:rgba(127,29,29,.22)!important;}
.danger-chip:hover{background:rgba(127,29,29,.35)!important;}

/* Homepage daily-question positioning */
.home-hero-daily h1 {
  font-size: clamp(2.3rem, 5vw, 4rem);
  line-height: 1.03;
  letter-spacing: -0.045em;
  margin: 14px 0 14px;
}
.today-preview-card h3 {
  font-size: clamp(1.35rem, 2.4vw, 1.9rem);
  line-height: 1.25;
  margin: 4px 0 8px;
}
.compact-actions {
  margin-top: 12px;
}
.home-steps-grid .feature-card-static {
  cursor: default;
}
.home-steps-grid .feature-card-static:hover {
  transform: none;
  border-color: var(--line);
}
.home-bottom-cta {
  margin: 30px 0 12px;
  padding: 26px;
}
.home-bottom-cta p {
  max-width: 760px;
}
@media (max-width: 980px) {
  .home-hero-daily h1 {
    font-size: clamp(2rem, 12vw, 3.25rem);
  }
}

/* Trejji polish: cleaner forms, world-only timeline, and embedded media */
.ghost,
.button.ghost {
  background: var(--panel-2);
  color: var(--text);
  border: 1px solid var(--line);
}

.hero-card,
.world-section-card,
.world-content-card,
.world-empty-card,
.world-form-shell {
  margin-top: 28px;
}

.world-hero {
  padding: 28px;
  background: radial-gradient(circle at top left, rgba(106,166,255,.16), transparent 34%), var(--panel);
  border: 1px solid var(--line);
  border-radius: 24px;
}

.world-hero h1,
.world-form-heading h1 {
  margin: 8px 0 10px;
  letter-spacing: -0.03em;
}

.world-breadcrumb {
  margin-top: 0;
}

.lead {
  font-size: 1.12rem;
  color: var(--text);
}

.actions-row,
.world-actions,
.form-actions,
.pill-row {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.world-timeline {
  margin-top: 26px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.world-content-card {
  padding: 22px;
  overflow: hidden;
}

.world-content-card h3 {
  margin: 8px 0 10px;
  font-size: 1.35rem;
}

.world-content-meta {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
  color: var(--muted);
  font-size: .92rem;
}

.world-pin {
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(255, 215, 106, .14);
  border: 1px solid rgba(255, 215, 106, .34);
  color: #ffd76a;
  font-weight: 800;
}

.world-content-body {
  line-height: 1.65;
  margin: 10px 0 14px;
}

.world-form-shell {
  max-width: 980px;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--panel);
}

.world-form-heading {
  margin-bottom: 20px;
}

.stacked-form,
.world-content-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.world-content-form label {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.world-content-form label input,
.world-content-form label select,
.world-content-form label textarea {
  margin-top: 0;
}

.world-checkbox {
  flex-direction: row !important;
  align-items: center;
  gap: 10px !important;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255,255,255,.02);
}

.world-checkbox input {
  width: auto;
}

.embed-shell {
  position: relative;
  width: 100%;
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  background: #05070d;
  box-shadow: 0 18px 40px rgba(0,0,0,.22);
}

.embed-shell::before {
  content: "";
  display: block;
  padding-top: 56.25%;
}

.embed-shell iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.embed-tiktok::before,
.embed-instagram::before,
.embed-reddit::before {
  padding-top: 120%;
}

.embed-spotify::before {
  padding-top: 28%;
  min-height: 160px;
}

.embed-note {
  margin: 9px 0 0;
  font-size: .9rem;
}

.embedded-link-card {
  margin-top: 14px;
  padding: 14px;
  border-radius: 16px;
  border: 1px dashed var(--line);
  background: rgba(255,255,255,.025);
}

.embedded-link-card p {
  margin: 6px 0 8px;
}

input::placeholder,
textarea::placeholder {
  color: color-mix(in srgb, var(--muted) 82%, transparent);
}

@media (max-width: 700px) {
  .world-form-shell,
  .world-hero,
  .world-content-card {
    padding: 18px;
    border-radius: 20px;
  }

  .form-actions .button,
  .world-actions .button,
  .world-actions button {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .embed-tiktok::before,
  .embed-instagram::before,
  .embed-reddit::before {
    padding-top: 140%;
  }
}


/* Trejji embed reliability patch */
.embed-facebook {
  max-width: 734px;
  margin-left: auto;
  margin-right: auto;
  background: #fff;
}

.embed-note-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 9px;
}

.embed-note-row .embed-note {
  margin: 0;
}

.embed-source-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.04);
  color: var(--accent);
  font-size: .88rem;
  font-weight: 800;
  text-decoration: none;
}

.embed-source-link:hover {
  border-color: var(--accent);
}

/* Trejji Facebook fallback patch */
.facebook-embed-card {
  border: 1px solid var(--line);
  background: rgba(255,255,255,.035);
  border-radius: 18px;
  padding: 18px;
  margin-top: 14px;
}

.facebook-embed-card h4 {
  margin: 0 0 8px;
  color: var(--text);
}

.facebook-embed-card p {
  margin: 0 0 12px;
}

.facebook-embed-card details {
  margin-top: 12px;
}

.facebook-embed-card summary {
  cursor: pointer;
  color: var(--accent);
  font-weight: 800;
}

.facebook-embed-card .embed-shell {
  margin-top: 14px;
}

.facebook-embed-card .embed-source-link {
  margin-top: 4px;
}


/* Trejji v2: YouTube-style worlds and flexible World Studio */
body {
  background: linear-gradient(180deg, #ffffff 0%, var(--bg) 42%);
}
.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(16px);
}
.site-footer { background: #fff; }
.nav { min-height: 64px; }
.brand { font-size: 1.15rem; }
.nav-links a, .nav-text-link { font-weight: 800; }
.button, button { border-radius: 999px; box-shadow: 0 8px 18px rgba(37,99,235,.16); }
.button.ghost, .ghost { box-shadow: none; }
main.wrap { padding-top: 26px; }

.world-studio-shell { padding: 22px 0 40px; }
.studio-intro { max-width: 920px; margin-bottom: 22px; }
.studio-intro h1, .explore-hero h1 { font-size: clamp(2.1rem, 5vw, 4.2rem); line-height: .95; letter-spacing: -.06em; margin: 10px 0 12px; }
.studio-intro p:not(.eyebrow), .explore-hero p { font-size: 1.08rem; max-width: 860px; }
.world-studio-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) 420px; gap: 24px; align-items: start; }
.world-studio-form { display: flex; flex-direction: column; gap: 16px; }
.studio-panel, .world-preview-panel, .explore-search-card, .world-form-shell { background: #fff; border: 1px solid var(--line); border-radius: 24px; padding: 22px; box-shadow: 0 18px 45px rgba(15,23,42,.07); }
.studio-panel h2 { margin: 0 0 16px; font-size: 1.15rem; }
.studio-two { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.studio-panel label { margin-bottom: 14px; }
.studio-panel label:last-child { margin-bottom: 0; }
.studio-help { color: var(--muted); font-size: .92rem; margin: 6px 0 0; }
.studio-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.studio-save { min-width: 180px; }
.world-preview-panel { position: sticky; top: 90px; }
.preview-label { color: var(--muted); font-weight: 900; text-transform: uppercase; font-size: .78rem; letter-spacing: .08em; margin-bottom: 10px; }
.world-channel-preview { --world-accent: #2563eb; border: 1px solid var(--line); border-radius: 24px; overflow: hidden; background: #fff; box-shadow: 0 24px 60px rgba(15,23,42,.12); }
.preview-banner { height: 130px; background: radial-gradient(circle at 20% 20%, color-mix(in srgb, var(--world-accent) 45%, white), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--world-accent) 25%, #111827), #111827); background-size: cover; background-position: center; }
.preview-body { display: flex; gap: 16px; padding: 0 18px 18px; }
.preview-avatar { flex: 0 0 86px; width: 86px; height: 86px; margin-top: -34px; border-radius: 50%; border: 5px solid #fff; background: var(--world-accent); color: white; display: grid; place-items: center; font-size: 2rem; font-weight: 900; background-size: cover; background-position: center; }
.preview-avatar.has-image { color: transparent; }
.preview-copy h2 { margin: 10px 0 4px; }
.preview-copy p { margin: 0 0 10px; color: var(--muted); }
.preview-pills { display: flex; gap: 6px; flex-wrap: wrap; }
.preview-pills span { font-size: .78rem; padding: 5px 8px; border-radius: 999px; background: color-mix(in srgb, var(--world-accent) 12%, white); color: color-mix(in srgb, var(--world-accent) 70%, black); font-weight: 800; }
.preview-about { border-top: 1px solid var(--line); padding: 14px 18px 18px; color: var(--muted); line-height: 1.5; }
.studio-hook-card { margin-top: 16px; padding: 16px; border-radius: 18px; background: color-mix(in srgb, var(--accent) 8%, white); border: 1px solid color-mix(in srgb, var(--accent) 20%, white); }
.studio-hook-card p { margin: 6px 0 0; color: var(--muted); }

.world-channel { margin-top: 10px; }
.world-channel-banner { min-height: 220px; border-radius: 26px; background: radial-gradient(circle at 18% 24%, color-mix(in srgb, var(--world-accent) 55%, white), transparent 24%), linear-gradient(135deg, #111827, color-mix(in srgb, var(--world-accent) 34%, #111827)); background-size: cover; background-position: center; display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.82); font-size: clamp(2rem, 6vw, 5rem); font-weight: 1000; letter-spacing: -.06em; overflow: hidden; }
.world-channel-head { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 22px; align-items: start; padding: 18px 8px 8px; }
.world-channel-avatar { width: 150px; height: 150px; margin-top: -62px; border-radius: 50%; border: 7px solid var(--bg); background: var(--world-accent); color: white; display: grid; place-items: center; font-size: 3.4rem; font-weight: 1000; box-shadow: 0 16px 34px rgba(15,23,42,.22); background-size: cover; background-position: center; }
.world-channel-avatar.has-image { color: transparent; }
.world-channel-info h1 { margin: 2px 0 4px; font-size: clamp(2rem, 4vw, 3.4rem); letter-spacing: -.05em; }
.world-tagline { font-size: 1.16rem; font-weight: 700; margin: 10px 0 6px; }
.world-description { color: var(--muted); max-width: 780px; line-height: 1.55; }
.world-tabs { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }
.world-tabs a { padding: 9px 13px; border-radius: 999px; background: #fff; border: 1px solid var(--line); color: var(--text); font-weight: 800; }
.world-channel-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.world-link-strip { display: flex; gap: 10px; overflow-x: auto; margin: 18px 0 24px; padding: 12px; background: #fff; border: 1px solid var(--line); border-radius: 20px; }
.world-link-pill { padding: 10px 14px; border-radius: 999px; background: color-mix(in srgb, var(--accent) 10%, white); color: var(--accent-2); font-weight: 900; white-space: nowrap; }
.world-content-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 22px; align-items: start; }
.world-sidebar { position: sticky; top: 90px; display: flex; flex-direction: column; gap: 16px; }
.sidebar-card h3 { margin-top: 0; }
.button.full { display: block; text-align: center; margin-top: 10px; }
.world-content-card { background: #fff; box-shadow: 0 12px 35px rgba(15,23,42,.06); }

.explore-hero { padding: 28px 0 10px; }
.explore-search-card { display: grid; grid-template-columns: minmax(0, 1fr) 240px auto; gap: 12px; margin-top: 22px; }
.world-discovery-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 24px 0 40px; }
.world-discovery-card { --world-accent: #2563eb; background: #fff; border: 1px solid var(--line); border-radius: 24px; overflow: hidden; box-shadow: 0 16px 36px rgba(15,23,42,.07); transition: transform .18s ease, box-shadow .18s ease; }
.world-discovery-card:hover { transform: translateY(-3px); box-shadow: 0 22px 50px rgba(15,23,42,.11); }
.discovery-banner { height: 92px; background: linear-gradient(135deg, color-mix(in srgb, var(--world-accent) 65%, #111827), #111827); background-size: cover; background-position: center; }
.discovery-body { display: grid; grid-template-columns: 72px 1fr; gap: 14px; padding: 0 18px 18px; }
.discovery-avatar { width: 72px; height: 72px; margin-top: -28px; border-radius: 50%; border: 4px solid #fff; background: var(--world-accent); color: #fff; display: grid; place-items: center; font-weight: 1000; font-size: 1.5rem; background-size: cover; background-position: center; }
.discovery-avatar.has-image { color: transparent; }
.discovery-body h3 { margin: 12px 0 4px; }
.discovery-body p { margin: 4px 0 10px; }

@media (max-width: 1000px) {
  .world-studio-grid, .world-content-layout { grid-template-columns: 1fr; }
  .world-preview-panel, .world-sidebar { position: static; }
  .world-discovery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .world-channel-head { grid-template-columns: 110px minmax(0, 1fr); }
  .world-channel-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .world-channel-avatar { width: 110px; height: 110px; font-size: 2.4rem; margin-top: -46px; }
}
@media (max-width: 700px) {
  .studio-two, .explore-search-card, .world-discovery-grid { grid-template-columns: 1fr; }
  .world-channel-banner { min-height: 150px; border-radius: 18px; }
  .world-channel-head { grid-template-columns: 86px minmax(0, 1fr); gap: 14px; }
  .world-channel-avatar { width: 86px; height: 86px; border-width: 5px; margin-top: -34px; font-size: 2rem; }
  .world-channel-info h1 { font-size: 2rem; }
  .world-tabs { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
}

/* Trejji creator-world polish */
.site-header {
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(18px);
  position: sticky;
  top: 0;
  z-index: 50;
  box-shadow: 0 1px 0 rgba(15,23,42,.08);
}
.nav { padding: 16px 0; }
.nav-links a { font-weight: 800; }
.button.ghost, .ghost {
  background: var(--panel-2);
  color: var(--text);
  border: 1px solid var(--line);
}
.full { display:block; text-align:center; width:100%; margin-top:10px; }
.stacked-form > * + * { margin-top: 16px; }
input[type="color"] {
  width: 100%; height: 46px; padding: 6px; border-radius: 12px;
  border: 1px solid var(--line); background: var(--panel-2); cursor: pointer;
}
.world-studio-shell { width:min(1220px, calc(100% - 48px)); margin: 32px auto; }
.studio-intro h1 { font-size: clamp(3rem, 7vw, 5.2rem); letter-spacing:-.06em; margin: 6px 0 14px; line-height:.95; }
.studio-intro.compact h1 { font-size: clamp(2.2rem, 5vw, 3.5rem); }
.studio-intro > p:not(.eyebrow) { font-size: 1.08rem; max-width: 900px; }
.world-studio-grid { display:grid; grid-template-columns: minmax(0, 1.55fr) minmax(360px,.85fr); gap: 28px; align-items:start; }
.studio-card-stack { display:flex; flex-direction:column; gap:18px; }
.studio-panel, .world-preview-panel {
  background: rgba(255,255,255,.94);
  border: 1px solid var(--line);
  border-radius: 28px;
  padding: 24px;
  box-shadow: 0 18px 60px rgba(15,23,42,.08);
}
.studio-panel h2 { margin:0; font-size:1.2rem; }
.panel-title-row { display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.step-dot { width:32px; height:32px; display:grid; place-items:center; border-radius:50%; background:var(--accent); color:#fff; font-weight:900; }
.studio-two { display:grid; grid-template-columns: 1fr 1fr; gap:18px; }
.studio-panel label { margin-bottom:14px; }
.studio-help-box, .studio-help { color:var(--muted); font-size:.95rem; padding:14px; background:var(--panel-2); border-radius:14px; border:1px solid var(--line); }
.advanced-fields { margin-top: 10px; padding: 14px; border-radius: 16px; background: var(--panel-2); border:1px solid var(--line); }
.advanced-fields summary { cursor:pointer; font-weight:800; }
.sticky-actions { position: sticky; bottom: 0; background: rgba(246,247,251,.92); backdrop-filter: blur(12px); padding: 14px 0 0; }
.sticky-preview { position: sticky; top: 96px; }
.preview-label { text-transform:uppercase; color:var(--muted); font-size:.8rem; font-weight:900; letter-spacing:.12em; margin-bottom:12px; }
.world-channel-preview { --world-accent:#6aa6ff; background:#fff; border:1px solid var(--line); border-radius:28px; overflow:hidden; box-shadow: 0 16px 40px rgba(15,23,42,.08); }
.preview-banner { height:170px; background: radial-gradient(circle at 20% 20%, color-mix(in srgb, var(--world-accent) 55%, white), transparent 28%), linear-gradient(135deg, #101827, #29364c); background-size:cover; background-position:center; }
.preview-banner.has-image { background-size:cover; background-position:center; }
.preview-body { display:flex; gap:18px; padding:0 22px 18px; margin-top:-44px; align-items:flex-end; }
.preview-avatar { width:96px; height:96px; flex:0 0 auto; border-radius:50%; background:var(--world-accent); color:white; display:grid; place-items:center; font-size:2.5rem; font-weight:900; border:5px solid #fff; background-size:cover; background-position:center; }
.preview-avatar.has-image { color: transparent; }
.preview-copy h2 { margin:0; font-size:1.9rem; letter-spacing:-.04em; }
.preview-copy p { margin:4px 0 10px; color:var(--muted); }
.preview-pills { display:flex; flex-wrap:wrap; gap:8px; }
.preview-pills span { background: color-mix(in srgb, var(--world-accent) 16%, white); color: color-mix(in srgb, var(--world-accent) 72%, #111827); padding:7px 10px; border-radius:999px; font-weight:800; font-size:.85rem; }
.preview-about { border-top:1px solid var(--line); padding:18px 22px; color:var(--muted); }
.studio-hook-card { margin-top:18px; background:#eef5ff; border:1px solid #cfe1ff; border-radius:20px; padding:18px; color:#31415f; }

.world-channel { width:min(1220px, calc(100% - 48px)); margin: 28px auto; background:#fff; border:1px solid var(--line); border-radius:28px; overflow:hidden; box-shadow:0 18px 60px rgba(15,23,42,.08); }
.world-channel-banner { height:260px; background: radial-gradient(circle at 15% 20%, color-mix(in srgb, var(--world-accent) 58%, white), transparent 25%), linear-gradient(135deg, #111827, #26344f); background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.75); font-size:2rem; font-weight:900; }
.world-channel-banner.has-image { background-size:cover; background-position:center; }
.world-channel-head { display:grid; grid-template-columns:auto 1fr auto; gap:22px; align-items:start; padding:0 28px 28px; }
.world-channel-avatar { width:138px; height:138px; border-radius:50%; margin-top:-52px; background:var(--world-accent); color:#fff; display:grid; place-items:center; font-weight:900; font-size:4rem; border:6px solid #fff; box-shadow:0 12px 28px rgba(15,23,42,.18); background-size:cover; background-position:center; }
.world-channel-avatar.has-image { color:transparent; }
.world-channel-info h1 { margin:18px 0 4px; font-size: clamp(2.3rem, 5vw, 4rem); letter-spacing:-.06em; }
.world-tagline { font-weight:800; font-size:1.15rem; }
.world-description { color:var(--muted); max-width:850px; line-height:1.55; }
.world-tabs { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.world-tabs a, .world-link-pill { background: color-mix(in srgb, var(--world-accent) 12%, white); color: color-mix(in srgb, var(--world-accent) 78%, #111827); padding:9px 13px; border-radius:999px; font-weight:900; }
.world-channel-actions { display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; padding-top:24px; }
.world-link-strip { width:min(1220px, calc(100% - 48px)); margin: -12px auto 24px; display:flex; flex-wrap:wrap; gap:10px; }
.world-content-layout { width:min(1220px, calc(100% - 48px)); margin:0 auto; display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:24px; }
.section-heading-row h2 { margin-bottom:0; }
.world-content-card { margin-bottom:18px; box-shadow:0 12px 35px rgba(15,23,42,.06); }
.world-content-meta { display:flex; gap:7px; flex-wrap:wrap; color:var(--muted); font-size:.92rem; font-weight:700; }
.world-pin { color:#fff; background:var(--world-accent, var(--accent)); border-radius:999px; padding:2px 8px; }
.embed-shell { border-radius:22px; overflow:hidden; background:#0f172a; border:1px solid var(--line); margin-top:14px; }
.embed-shell iframe { display:block; width:100%; min-height:420px; border:0; }
.embed-youtube iframe { aspect-ratio:16 / 9; min-height:auto; height:auto; }
.embed-note-row { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:8px; }
.embedded-link-card, .facebook-embed-card { margin-top:14px; padding:16px; border:1px solid var(--line); border-radius:18px; background:var(--panel-2); }
.world-comments { margin-top:20px; padding-top:16px; border-top:1px solid var(--line); }
.comments-head { display:flex; justify-content:space-between; color:var(--muted); margin-bottom:10px; }
.world-comment-form { display:flex; gap:10px; align-items:flex-start; }
.world-comment-form textarea { min-height:48px; }
.comment-thread-list { margin-top:14px; display:flex; flex-direction:column; gap:12px; }
.realm-comment { background:var(--panel-2); border:1px solid var(--line); border-radius:16px; padding:12px; }
.realm-comment.reply { margin:10px 0 0 28px; background:#fff; }
.comment-meta { color:var(--muted); font-size:.86rem; font-weight:800; margin-bottom:6px; }
.reply-details summary { cursor:pointer; color:var(--accent); font-weight:800; margin-top:8px; }
.compact-reply { margin-top:8px; }
.preserve-breaks { white-space:pre-wrap; }
.world-sidebar .card { margin-bottom:16px; }
.admin-world-categories { min-height:60vh; }

@media (max-width: 980px) {
  .world-studio-grid, .world-content-layout { grid-template-columns:1fr; }
  .sticky-preview { position:static; }
  .world-channel-head { grid-template-columns:1fr; }
  .world-channel-actions { justify-content:flex-start; padding-top:0; }
}
@media (max-width: 700px) {
  .world-studio-shell, .world-channel, .world-link-strip, .world-content-layout { width:min(100% - 24px, 1220px); }
  .studio-two { grid-template-columns:1fr; }
  .studio-intro h1 { font-size:3rem; }
  .world-channel-banner { height:180px; }
  .world-channel-avatar { width:104px; height:104px; font-size:3rem; }
  .world-comment-form { flex-direction:column; }
  .world-comment-form button { width:100%; }
}

/* Trejji Phase 1: living world identity + districts */
.phase-one-studio .studio-intro { position: relative; }
.phase-one-studio .studio-intro::after {
  content:""; display:block; width: min(520px, 100%); height: 6px; margin-top: 18px; border-radius:999px;
  background: linear-gradient(90deg, var(--accent), transparent);
}
.upload-grid input[type="file"] { background:#fff; border:1px dashed color-mix(in srgb, var(--accent) 45%, var(--line)); padding: 14px; border-radius:16px; }
.districts-panel { background: linear-gradient(180deg, rgba(255,255,255,.98), color-mix(in srgb, var(--accent) 4%, white)); }
.existing-districts, .preview-districts { display:flex; flex-wrap:wrap; gap:8px; margin: 10px 0 16px; }
.existing-districts span, .preview-districts span {
  padding:8px 11px; border-radius:999px; font-weight:900; font-size:.86rem;
  background: color-mix(in srgb, var(--world-accent, var(--accent)) 12%, white);
  color: color-mix(in srgb, var(--world-accent, var(--accent)) 78%, #111827);
  border:1px solid color-mix(in srgb, var(--world-accent, var(--accent)) 22%, white);
}
.preview-type { color: var(--world-accent); font-size:.78rem; font-weight:1000; text-transform:uppercase; letter-spacing:.08em; }
.preview-entry {
  margin: 0 22px 12px; padding: 14px 16px; border-radius:18px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--world-accent) 12%, white), #fff);
  border: 1px solid color-mix(in srgb, var(--world-accent) 24%, white);
  font-weight: 900; color: #172033;
}
.world-preview-realm[data-style="sci_fi"] { background:#07111f; color:#e8f3ff; border-color: color-mix(in srgb, var(--world-accent) 55%, #0b1220); }
.world-preview-realm[data-style="sci_fi"] .preview-banner { background: radial-gradient(circle at 30% 20%, color-mix(in srgb, var(--world-accent) 75%, #0ff), transparent 18%), linear-gradient(135deg,#06101e,#101d38 55%,#04110f); }
.world-preview-realm[data-style="sci_fi"] .preview-about, .world-preview-realm[data-style="sci_fi"] .preview-copy p { color:#b7c7dc; }
.world-preview-realm[data-style="vintage"] .preview-banner { background: linear-gradient(135deg,#5c3d2e,#b88755); }
.world-preview-realm[data-style="fantasy"] .preview-banner { background: radial-gradient(circle at 70% 10%, #ffe0a3, transparent 18%), linear-gradient(135deg,#25412d,#7b5b2d); }
.world-preview-realm[data-style="professional"] .preview-banner { background: linear-gradient(135deg,#0f172a,#334155); }
.world-preview-realm[data-style="minimal"] { box-shadow:none; }
.world-preview-realm[data-style="minimal"] .preview-banner { background:#f8fafc; }

.world-entry-message {
  margin: -34px auto 0; width: min(900px, calc(100% - 48px)); position: relative; z-index: 2;
  padding: 16px 20px; border-radius: 20px; background: rgba(255,255,255,.94); border:1px solid color-mix(in srgb, var(--world-accent) 22%, var(--line));
  box-shadow:0 18px 45px rgba(15,23,42,.12); font-weight:1000; text-align:center; color:#162033;
}
.world-realm-detail[data-style="sci_fi"] { background:#07111f; color:#e8f3ff; border-color:#17304c; }
.world-realm-detail[data-style="sci_fi"] .world-channel-info .muted,
.world-realm-detail[data-style="sci_fi"] .world-description { color:#b9c7d8; }
.world-realm-detail[data-style="sci_fi"] .world-channel-banner { background: radial-gradient(circle at 20% 20%, color-mix(in srgb, var(--world-accent) 65%, #22d3ee), transparent 20%), linear-gradient(135deg,#05101e,#172554); }
.world-realm-detail[data-style="vintage"] .world-channel-banner { background: linear-gradient(135deg,#5a3828,#c8955e); }
.world-realm-detail[data-style="fantasy"] .world-channel-banner { background: radial-gradient(circle at 80% 15%, #ffd98a, transparent 15%), linear-gradient(135deg,#263f2e,#785d2f); }
.world-realm-detail[data-style="professional"] .world-channel-banner { background: linear-gradient(135deg,#0f172a,#475569); }
.world-realm-detail[data-style="minimal"] { box-shadow:none; }
.world-realm-detail[data-style="minimal"] .world-channel-banner { background:#f8fafc; color:#111827; }
.world-district-section {
  width:min(1220px, calc(100% - 48px)); margin: -4px auto 24px; padding: 24px;
  background: linear-gradient(180deg,#fff, color-mix(in srgb, var(--world-accent) 4%, white));
  border:1px solid var(--line); border-radius:28px; box-shadow:0 16px 45px rgba(15,23,42,.06);
}
.district-grid { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:14px; margin-top:16px; }
.district-card {
  display:flex; flex-direction:column; gap:8px; padding:18px; border-radius:22px; min-height:150px;
  background:#fff; border:1px solid color-mix(in srgb, var(--world-accent) 20%, var(--line)); color:var(--text);
  box-shadow:0 12px 28px rgba(15,23,42,.05); transition: transform .18s ease, box-shadow .18s ease;
}
.district-card:hover { transform:translateY(-3px); box-shadow:0 18px 38px rgba(15,23,42,.1); }
.district-icon { width:42px; height:42px; display:grid; place-items:center; border-radius:16px; background: color-mix(in srgb, var(--world-accent) 15%, white); color: color-mix(in srgb, var(--world-accent) 82%, #111827); font-weight:1000; }
.district-card strong { font-size:1.05rem; }
.district-card small { color:var(--muted); line-height:1.45; }
.world-stat-stack { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.world-stat-stack span { padding:7px 10px; border-radius:999px; background:var(--panel-2); border:1px solid var(--line); font-size:.84rem; font-weight:900; color:var(--muted); }
@media (max-width: 980px){ .district-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 640px){ .district-grid { grid-template-columns: 1fr; } .world-entry-message { width: min(100% - 24px, 900px); } }

/* Trejji Phase 2: District artifacts + trail paths */
.content-kind { padding: 3px 8px; border-radius: 999px; background: color-mix(in srgb, var(--world-accent, var(--accent)) 12%, white); color: color-mix(in srgb, var(--world-accent, var(--accent)) 78%, #111827); font-weight: 1000; }
.content-kind-artifact { background: color-mix(in srgb, #f59e0b 18%, white); color: #92400e; }
.content-kind-trail { background: color-mix(in srgb, #7c3aed 15%, white); color: #4c1d95; }

.content-kind-conversation_prompt { background: color-mix(in srgb, #2563eb 13%, white); color: #1d4ed8; }
.district-card em { margin-top:auto; font-style:normal; font-size:.78rem; font-weight:1000; color: color-mix(in srgb, var(--world-accent) 80%, #111827); }
.phase-two-content-studio .soft-panel { border-color: color-mix(in srgb, var(--world-accent) 18%, var(--line)); background: linear-gradient(180deg, #fff, color-mix(in srgb, var(--world-accent) 3%, white)); }
.phase-two-content-studio h2 { margin: 0 0 12px; }
.small-note { font-size:.9rem; margin-top: 8px; }
.district-realm-hero { width:min(1220px, calc(100% - 48px)); margin: 28px auto 22px; }
.district-hero-card { display:grid; grid-template-columns:auto 1fr; gap:20px; align-items:center; padding:28px; border-radius:30px; background: radial-gradient(circle at 16% 18%, color-mix(in srgb, var(--world-accent) 22%, white), transparent 28%), #fff; border:1px solid color-mix(in srgb, var(--world-accent) 20%, var(--line)); box-shadow:0 18px 55px rgba(15,23,42,.08); }
.district-icon.big { width:92px; height:92px; font-size:2.4rem; border-radius:28px; }
.district-hero-card h1 { margin:0 0 8px; font-size: clamp(2.2rem, 5vw, 4.2rem); letter-spacing:-.06em; }
.district-layout { margin-top: 0; }
.world-sidebar-list { display:flex; flex-direction:column; gap:8px; }
.world-sidebar-list a { display:flex; flex-direction:column; gap:4px; padding:11px 12px; border-radius:16px; background:var(--panel-2); border:1px solid var(--line); color:var(--text); }
.world-sidebar-list a:hover, .world-sidebar-list a.active { border-color: color-mix(in srgb, var(--world-accent, var(--accent)) 32%, var(--line)); background: color-mix(in srgb, var(--world-accent, var(--accent)) 7%, white); }
.world-sidebar-list a span { font-weight:900; }
.world-sidebar-list a small { color:var(--muted); font-weight:800; }
.comments-head strong { color: color-mix(in srgb, var(--world-accent, var(--accent)) 82%, #111827); }
.world-comments .button-small { white-space:nowrap; }
@media (max-width:700px){ .district-realm-hero { width:min(100% - 24px, 1220px); } .district-hero-card { grid-template-columns:1fr; } .district-icon.big { width:70px; height:70px; font-size:1.8rem; } }

/* Trejji Trejji-style realm paths */
.world-paths-panel { margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--line); }
.world-paths-head { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; margin-bottom:16px; }
.world-paths-head h3 { margin:0; font-size:1.4rem; }
.path-count-pill { display:inline-flex; align-items:center; justify-content:center; padding:8px 12px; border-radius:999px; background: color-mix(in srgb, var(--world-accent, var(--accent)) 12%, white); color: color-mix(in srgb, var(--world-accent, var(--accent)) 86%, #111827); border:1px solid color-mix(in srgb, var(--world-accent, var(--accent)) 24%, var(--line)); font-weight:1000; white-space:nowrap; }
.world-path-start-form { display:grid; grid-template-columns:1fr auto; gap:12px; align-items:start; margin:14px 0 18px; }
.world-path-start-form textarea, .world-path-branch-form textarea { width:100%; border:1px solid var(--line); border-radius:18px; background:#fff; color:var(--text); padding:14px 16px; font:inherit; resize:vertical; }
.realm-path-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.realm-path-card { padding:18px; display:flex; flex-direction:column; gap:12px; background:linear-gradient(180deg,#fff, color-mix(in srgb, var(--world-accent, var(--accent)) 4%, white)); border-color:color-mix(in srgb, var(--world-accent, var(--accent)) 18%, var(--line)); }
.path-card-top { display:flex; align-items:center; gap:10px; color:var(--muted); font-weight:900; font-size:.9rem; }
.path-play { width:32px; height:32px; display:grid; place-items:center; border-radius:50%; background:color-mix(in srgb, var(--world-accent, var(--accent)) 14%, white); color:color-mix(in srgb, var(--world-accent, var(--accent)) 86%, #111827); border:1px solid color-mix(in srgb, var(--world-accent, var(--accent)) 24%, var(--line)); }
.path-preview { font-size:1rem; line-height:1.5; color:var(--text); }
.path-card-meta { display:flex; gap:8px; flex-wrap:wrap; margin-top:auto; }
.path-card-meta span { padding:6px 10px; border-radius:999px; background:var(--panel-2); border:1px solid var(--line); color:var(--muted); font-weight:900; font-size:.8rem; }
.world-empty-paths { padding:18px; border-radius:20px; background:var(--panel-2); border:1px dashed var(--line); color:var(--muted); font-weight:800; }
.world-path-hero { width:min(1220px, calc(100% - 48px)); margin:28px auto 18px; }
.path-hero-card { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:28px; border-radius:30px; background: radial-gradient(circle at 12% 16%, color-mix(in srgb, var(--world-accent) 18%, white), transparent 24%), #fff; border:1px solid color-mix(in srgb, var(--world-accent) 22%, var(--line)); box-shadow:0 18px 50px rgba(15,23,42,.08); }
.path-hero-card h1 { margin:0 0 8px; font-size:clamp(2rem,4vw,4rem); letter-spacing:-.055em; }
.world-path-layout { width:min(1220px, calc(100% - 48px)); margin:0 auto 48px; display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:24px; align-items:start; }
.world-path-main { display:flex; flex-direction:column; gap:18px; min-width:0; }
.path-origin-card, .trejji-path-card, .current-path-step { border-color:color-mix(in srgb, var(--world-accent, var(--accent)) 16%, var(--line)); }
.world-path-stepper { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:16px; }
.world-path-step { display:inline-flex; align-items:center; gap:9px; max-width:360px; padding:10px 12px; border-radius:999px; background:var(--panel-2); border:1px solid var(--line); color:var(--text); font-weight:900; }
.world-path-step.is-current { background:color-mix(in srgb, var(--world-accent, var(--accent)) 14%, white); border-color:color-mix(in srgb, var(--world-accent, var(--accent)) 35%, var(--line)); }
.step-number { width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:#fff; border:1px solid var(--line); color:color-mix(in srgb, var(--world-accent, var(--accent)) 82%, #111827); font-size:.8rem; }
.step-text { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.step-connector { color:var(--muted); font-weight:1000; }
.path-author { color:var(--muted); font-weight:900; margin-bottom:12px; }
.path-current-body { font-size:1.1rem; line-height:1.6; padding:18px; background:linear-gradient(180deg,#fff,var(--panel-2)); border:1px solid var(--line); border-radius:22px; }
.world-path-branch-form { display:grid; grid-template-columns:1fr auto; gap:12px; align-items:start; margin-top:16px; }
.world-path-sidebar { position:sticky; top:92px; display:flex; flex-direction:column; gap:16px; }
@media (max-width: 980px) { .world-path-layout { grid-template-columns:1fr; } .world-path-sidebar { position:static; } .realm-path-grid { grid-template-columns:1fr; } }
@media (max-width: 680px) { .world-path-hero, .world-path-layout { width:min(100% - 24px, 1220px); } .path-hero-card, .world-paths-head, .world-path-start-form, .world-path-branch-form { grid-template-columns:1fr; flex-direction:column; } .world-path-start-form, .world-path-branch-form { display:flex; } }


/* Trejji Phase 3: Realm Map + Portals */
.realm-command-map, .world-portal-section { margin: 26px 0; }
.realm-command-map { border: 1px solid var(--line); border-radius: 28px; padding: 24px; background: radial-gradient(circle at 18% 10%, color-mix(in srgb, var(--world-accent) 16%, transparent), transparent 30%), #fff; box-shadow: 0 18px 48px rgba(15,23,42,.07); }
.realm-map-header { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; border-bottom:1px solid var(--line); padding-bottom:18px; margin-bottom:18px; }
.realm-map-header h2 { margin: 0 0 8px; letter-spacing:-.035em; font-size: clamp(1.5rem, 3vw, 2.4rem); max-width: 780px; }
.realm-stat-orbs { display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; min-width:260px; }
.realm-stat-orbs span { display:grid; place-items:center; min-width:88px; min-height:70px; border:1px solid color-mix(in srgb, var(--world-accent) 26%, var(--line)); border-radius:20px; background: color-mix(in srgb, var(--world-accent) 8%, #fff); color: var(--muted); font-weight:800; font-size:.78rem; text-align:center; }
.realm-stat-orbs strong { display:block; color: var(--text); font-size:1.35rem; line-height:1; }
.realm-map-grid { display:grid; grid-template-columns: minmax(0,1.6fr) repeat(2,minmax(220px,.7fr)); gap:16px; }
.realm-map-panel { border:1px solid var(--line); border-radius:22px; padding:18px; background: rgba(255,255,255,.82); }
.realm-map-panel.primary { background: linear-gradient(135deg, color-mix(in srgb, var(--world-accent) 8%, white), #fff); }
.realm-map-panel h3 { margin:0 0 12px; }
.realm-node-grid { display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap:12px; }
.realm-node { display:grid; grid-template-columns:42px 1fr; gap:8px 12px; align-items:center; padding:14px; border-radius:18px; border:1px solid var(--line); background:#fff; text-decoration:none; color:var(--text); transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
.realm-node:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--world-accent) 55%, var(--line)); box-shadow:0 14px 30px rgba(15,23,42,.08); }
.realm-node span { grid-row: span 2; width:42px; height:42px; border-radius:16px; display:grid; place-items:center; background: color-mix(in srgb, var(--world-accent) 14%, white); color: color-mix(in srgb, var(--world-accent) 80%, black); font-size:1.35rem; }
.realm-node small { color:var(--muted); }
.realm-mini-link { display:block; padding:10px 0; border-bottom:1px solid var(--line); color:var(--text); font-weight:750; text-decoration:none; }
.realm-mini-link:last-child { border-bottom:0; }
.portal-grid { display:grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); gap:16px; }
.portal-grid.compact { grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); }
.portal-card { position:relative; overflow:hidden; border:1px solid var(--line); border-radius:24px; background:#fff; box-shadow:0 16px 38px rgba(15,23,42,.07); }
.portal-card-banner { height:92px; background:linear-gradient(135deg, color-mix(in srgb, var(--world-accent) 40%, #111827), #111827); background-size:cover; background-position:center; }
.portal-card-body { display:flex; gap:14px; padding:16px; }
.portal-avatar { flex:0 0 58px; width:58px; height:58px; border-radius:20px; display:grid; place-items:center; background:var(--world-accent); color:#fff; font-weight:1000; border:4px solid #fff; margin-top:-34px; box-shadow:0 10px 22px rgba(15,23,42,.18); background-size:cover; background-position:center; }
.portal-grid.compact .portal-avatar { margin-top:0; }
.portal-avatar.has-image { color:transparent; }
.portal-card h3 { margin:2px 0 6px; }
.portal-card p { margin:0 0 12px; color:var(--muted); line-height:1.45; }
.link-button.danger { color:#b91c1c; font-weight:800; padding:0 16px 16px; background:none; box-shadow:none; border:0; cursor:pointer; }
.portal-studio-shell .portal-form { max-width:900px; }
@media (max-width: 900px){ .realm-map-header, .realm-map-grid { grid-template-columns:1fr; display:grid; } .realm-stat-orbs { justify-content:flex-start; } .realm-node-grid { grid-template-columns:1fr; } }


/* Trejji Phase 4: Realm Entry Experience */
.realm-entry-gate {
  width:min(1220px, calc(100% - 48px));
  margin: -6px auto 28px;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  gap:24px;
  align-items:stretch;
}
.realm-entry-copy {
  position:relative;
  overflow:hidden;
  padding:32px;
  border-radius:32px;
  border:1px solid color-mix(in srgb, var(--world-accent) 24%, var(--line));
  background:
    radial-gradient(circle at 8% 8%, color-mix(in srgb, var(--world-accent) 20%, transparent), transparent 30%),
    linear-gradient(135deg,#fff, color-mix(in srgb, var(--world-accent) 6%, #fff));
  box-shadow:0 22px 60px rgba(15,23,42,.08);
}
.realm-entry-copy:after {
  content:"";
  position:absolute;
  inset:auto -80px -100px auto;
  width:240px;
  height:240px;
  border-radius:50%;
  background:color-mix(in srgb, var(--world-accent) 12%, transparent);
  pointer-events:none;
}
.realm-entry-copy h2 {
  margin:0 0 12px;
  font-size:clamp(2.4rem, 6vw, 5.2rem);
  line-height:.9;
  letter-spacing:-.075em;
}
.realm-entry-line {
  max-width:720px;
  color:var(--muted);
  font-size:1.16rem;
  line-height:1.45;
}
.realm-entry-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:24px; }
.realm-entry-compass {
  position:relative;
  min-height:360px;
  border-radius:32px;
  border:1px solid color-mix(in srgb, var(--world-accent) 26%, var(--line));
  background:
    radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--world-accent) 16%, transparent), transparent 28%),
    radial-gradient(circle at 20% 20%, #fff, transparent 24%),
    linear-gradient(135deg, color-mix(in srgb, var(--world-accent) 8%, #fff), #fff);
  box-shadow:0 22px 60px rgba(15,23,42,.08);
  overflow:hidden;
}
.realm-entry-compass:before,
.realm-entry-compass:after {
  content:"";
  position:absolute;
  inset:38px;
  border:1px dashed color-mix(in srgb, var(--world-accent) 35%, var(--line));
  border-radius:50%;
}
.realm-entry-compass:after { inset:90px; opacity:.72; }
.compass-core {
  position:absolute;
  left:50%; top:50%; transform:translate(-50%,-50%);
  width:116px; height:116px;
  display:grid; place-items:center;
  border-radius:36px;
  background:linear-gradient(135deg, var(--world-accent), color-mix(in srgb, var(--world-accent) 55%, #111827));
  color:#fff;
  font-size:3.8rem;
  font-weight:1000;
  box-shadow:0 18px 44px color-mix(in srgb, var(--world-accent) 28%, rgba(15,23,42,.24));
  z-index:3;
}
.compass-node {
  position:absolute;
  z-index:4;
  width:min(210px, 42%);
  min-height:82px;
  display:grid;
  grid-template-columns:42px 1fr;
  gap:10px;
  align-items:center;
  padding:14px;
  border-radius:22px;
  border:1px solid color-mix(in srgb, var(--world-accent) 24%, var(--line));
  background:rgba(255,255,255,.92);
  box-shadow:0 16px 36px rgba(15,23,42,.09);
  color:var(--text);
  text-decoration:none;
  transition:transform .16s ease, box-shadow .16s ease;
}
.compass-node:hover { transform:translateY(-3px) scale(1.01); box-shadow:0 20px 46px rgba(15,23,42,.14); }
.compass-node span { width:42px; height:42px; display:grid; place-items:center; border-radius:16px; background:color-mix(in srgb, var(--world-accent) 14%, #fff); color:color-mix(in srgb, var(--world-accent) 80%, #111827); font-weight:1000; }
.compass-node strong { font-size:.96rem; line-height:1.15; }
.compass-node.node-1 { left:24px; top:34px; }
.compass-node.node-2 { right:24px; top:52px; }
.compass-node.node-3 { left:36px; bottom:38px; }
.compass-node.node-4 { right:34px; bottom:50px; }
.world-realm-detail { margin-bottom:18px; }
.world-channel { position:relative; }
.world-channel:before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--world-accent) 16%, transparent);
}
.world-tabs a { border-color:color-mix(in srgb, var(--world-accent) 20%, var(--line)); }
.world-tabs a:hover { background:color-mix(in srgb, var(--world-accent) 10%, #fff); }
@media (max-width: 980px){
  .realm-entry-gate { grid-template-columns:1fr; }
  .realm-entry-compass { min-height:330px; }
}
@media (max-width: 620px){
  .realm-entry-gate { width:min(100% - 24px, 1220px); }
  .realm-entry-copy { padding:24px; border-radius:24px; }
  .realm-entry-compass { min-height:auto; padding:18px; display:grid; gap:12px; }
  .realm-entry-compass:before,.realm-entry-compass:after { display:none; }
  .compass-core,.compass-node { position:static; transform:none; width:auto; }
  .compass-core { height:88px; border-radius:24px; font-size:2.5rem; }
  .compass-node { width:auto; min-height:0; }
}


/* Trejji Phase 5: Chronicle + Lore Memory Layer */
.world-chronicle-section {
  width:min(1220px, calc(100% - 48px)); margin: 0 auto 24px; padding: 24px;
  border-radius: 28px; border:1px solid color-mix(in srgb, var(--world-accent) 20%, var(--line));
  background: linear-gradient(135deg, color-mix(in srgb, var(--world-accent) 8%, white), #fff);
  box-shadow:0 14px 42px rgba(15,23,42,.06);
}
.chronicle-rail { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:14px; margin-top:16px; }
.chronicle-node {
  display:block; padding:16px; border-radius:20px; background:#fff; border:1px solid var(--line);
  box-shadow:0 10px 28px rgba(15,23,42,.05); color:var(--text);
}
.chronicle-node:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--world-accent) 40%, var(--line)); }
.chronicle-node strong { display:block; font-size:1.02rem; margin:5px 0; }
.chronicle-node small, .chronicle-type { color:var(--muted); font-weight:800; font-size:.82rem; }
.chronicle-type { color: color-mix(in srgb, var(--world-accent) 72%, #111827); text-transform:uppercase; letter-spacing:.08em; }
.chronicle-page-hero { width:min(1220px, calc(100% - 48px)); margin:32px auto 22px; padding:36px; border-radius:32px; background: radial-gradient(circle at 18% 10%, color-mix(in srgb, var(--world-accent) 28%, white), transparent 30%), #fff; border:1px solid var(--line); box-shadow:0 18px 60px rgba(15,23,42,.08); }
.chronicle-page-hero h1 { font-size:clamp(2.4rem, 6vw, 5rem); letter-spacing:-.06em; line-height:.96; margin:.15em 0; }
.chronicle-page-hero p:not(.eyebrow):not(.world-breadcrumb) { max-width:820px; color:var(--muted); font-size:1.08rem; }
.chronicle-page-layout { width:min(1220px, calc(100% - 48px)); margin:0 auto 40px; display:grid; grid-template-columns:280px minmax(0,1fr); gap:24px; align-items:start; }
.chronicle-district-index { position:sticky; top:96px; background:#fff; border:1px solid var(--line); border-radius:24px; padding:18px; box-shadow:0 12px 35px rgba(15,23,42,.06); }
.chronicle-district-index a { display:flex; justify-content:space-between; gap:10px; padding:10px 0; border-top:1px solid var(--line); color:var(--text); font-weight:800; }
.chronicle-timeline { position:relative; padding-left:28px; }
.chronicle-timeline::before { content:""; position:absolute; left:8px; top:0; bottom:0; width:3px; border-radius:999px; background:linear-gradient(180deg, var(--world-accent), transparent); }
.chronicle-entry { position:relative; margin-bottom:18px; }
.chronicle-marker { position:absolute; left:-28px; top:22px; width:18px; height:18px; border-radius:50%; background:var(--world-accent); border:4px solid #fff; box-shadow:0 0 0 2px color-mix(in srgb, var(--world-accent) 35%, white); }
.chronicle-entry-card { background:#fff; border:1px solid var(--line); border-radius:24px; padding:20px; box-shadow:0 12px 35px rgba(15,23,42,.06); }
.chronicle-entry-card h2 { margin:.25em 0; letter-spacing:-.03em; }
.content-kind-lore { background: color-mix(in srgb, var(--world-accent, var(--accent)) 14%, white); color: color-mix(in srgb, var(--world-accent, var(--accent)) 80%, #111827); padding:2px 8px; border-radius:999px; font-weight:900; }
@media (max-width: 900px) { .chronicle-rail { grid-template-columns:1fr; } .chronicle-page-layout { grid-template-columns:1fr; } .chronicle-district-index { position:static; } }

/* Phase 6 — Explorer System / Realm Passport / Constellations */
.passport-hero,
.constellation-preview,
.passport-log-section,
.recent-realm-strip {
  margin: 28px 0;
  border: 1px solid var(--line);
  border-radius: 28px;
  padding: clamp(22px, 4vw, 42px);
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(245,248,255,.92));
  box-shadow: 0 22px 55px rgba(15,23,42,.08);
}
.passport-hero h1 { margin: 4px 0 10px; font-size: clamp(2rem, 5vw, 4rem); letter-spacing: -.055em; }
.passport-hero p { max-width: 850px; color: var(--muted); line-height: 1.6; }
.passport-stat-grid,
.passport-mini-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px,1fr));
  gap: 14px;
  margin-top: 22px;
}
.passport-stat-grid div,
.passport-mini-grid span,
.realm-passport-callout {
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fff;
  padding: 16px;
  box-shadow: 0 12px 28px rgba(15,23,42,.06);
}
.passport-stat-grid strong,
.passport-mini-grid strong { display:block; font-size: clamp(1.5rem, 3vw, 2.4rem); letter-spacing: -.04em; }
.passport-stat-grid span,
.passport-mini-grid span span { color: var(--muted); font-size: .86rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.passport-compact {
  display:grid;
  grid-template-columns: minmax(240px, .9fr) minmax(420px, 1.4fr);
  align-items:start;
  gap: clamp(22px, 5vw, 48px);
}
.passport-compact > div:first-child { min-width: 0; }
.passport-compact .button { white-space: nowrap; }
.passport-compact p:last-child { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.passport-mini-grid { grid-template-columns: repeat(4, minmax(120px,1fr)); min-width: 0; margin-top: 0; width:100%; }
.passport-log-list { display:grid; gap:12px; }
.passport-stamp,
.passport-stamp-row .passport-stamp {
  display:flex;
  align-items:center;
  gap:14px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  padding:14px;
  text-decoration:none;
  color:var(--text);
  transition: transform .18s ease, box-shadow .18s ease;
}
.passport-stamp:hover { transform: translateY(-2px); box-shadow:0 18px 36px rgba(15,23,42,.1); }
.passport-stamp.small { display:block; min-width: 180px; }
.passport-stamp.small strong { display:block; }
.passport-stamp.small span { color:var(--muted); font-size:.85rem; }
.passport-stamp-avatar {
  width:54px; height:54px; border-radius:18px;
  display:grid; place-items:center; flex:0 0 auto;
  background:linear-gradient(135deg,#111827,#2563eb); color:#fff; font-weight:1000;
  background-size:cover; background-position:center;
}
.passport-stamp-avatar.has-image { color:transparent; }
.passport-stamp strong { display:block; }
.passport-stamp span, .passport-stamp small { display:block; color:var(--muted); line-height:1.45; }
.passport-stamp-row { display:flex; gap:12px; overflow:auto; padding-bottom:4px; }
.explorer-inline-passport { margin-top: 12px; font-weight: 800; }
.explorer-inline-passport a { color: inherit; }
.constellation-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap:14px; }
.constellation-card {
  position:relative; overflow:hidden;
  display:block; min-height:140px;
  border:1px solid var(--line); border-radius:24px;
  background: radial-gradient(circle at top left, color-mix(in srgb, var(--world-accent, #6aa6ff) 20%, white), #fff 60%);
  padding:18px; text-decoration:none; color:var(--text);
  box-shadow:0 14px 32px rgba(15,23,42,.07);
}
.constellation-card span:first-child {
  display:grid; place-items:center;
  width:46px; height:46px; border-radius:16px;
  background:#111827; color:#fff; font-weight:1000; margin-bottom:14px;
}
.constellation-card strong { display:block; font-size:1.08rem; }
.constellation-card small { display:block; margin-top:8px; color:var(--muted); line-height:1.4; }
.constellation-card.expanded { min-height:160px; }
.world-constellation-grid { margin-bottom: 20px; }
.realm-passport-callout {
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  margin: 0 0 18px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--world-accent) 10%, white), #fff);
}
.realm-passport-callout strong, .realm-passport-callout span { display:block; }
.realm-passport-callout span { color:var(--muted); margin-top:4px; }
@media (max-width: 760px) {
  .passport-compact, .realm-passport-callout { display:block; }
  .passport-stat-grid, .passport-mini-grid { grid-template-columns:1fr; min-width:0; }
  .realm-passport-callout .button { margin-top:14px; }
}


/* Phase 7: Realm Pulse / Living Districts */
.realm-pulse-section,.pulse-map-section{margin:26px 0;padding:24px;border:1px solid color-mix(in srgb,var(--world-accent,var(--accent)) 22%,var(--line));border-radius:28px;background:radial-gradient(circle at 12% 10%,color-mix(in srgb,var(--world-accent,var(--accent)) 14%,transparent),transparent 32%),#fff;box-shadow:0 18px 48px rgba(15,23,42,.07)}
.pulse-grid,.pulse-map-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}.pulse-card,.pulse-map-card{display:flex;gap:14px;align-items:center;padding:16px;border:1px solid var(--line);border-radius:22px;background:#fff;color:var(--text);box-shadow:0 10px 26px rgba(15,23,42,.05);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.pulse-card:hover,.pulse-map-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--world-accent,var(--accent)) 45%,var(--line));box-shadow:0 18px 36px rgba(15,23,42,.09)}.pulse-orb{width:48px;height:48px;flex:0 0 48px;border-radius:18px;display:grid;place-items:center;background:color-mix(in srgb,var(--world-accent,var(--accent)) 13%,white);color:color-mix(in srgb,var(--world-accent,var(--accent)) 88%,#111827);font-size:1.35rem;font-weight:1000;border:1px solid color-mix(in srgb,var(--world-accent,var(--accent)) 28%,var(--line))}.pulse-card strong,.pulse-map-card strong{display:block;font-weight:1000}.pulse-card em,.pulse-map-card em{display:block;font-style:normal;color:color-mix(in srgb,var(--world-accent,var(--accent)) 84%,#111827);font-weight:1000;font-size:.85rem;text-transform:uppercase;letter-spacing:.06em}.pulse-card small,.pulse-map-card small{display:block;color:var(--muted);font-weight:750;margin-top:3px}.pulse-hero{width:min(1220px,calc(100% - 48px));margin:28px auto}.pulse-hero-card{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:30px;border-radius:32px;color:#fff;background:radial-gradient(circle at 14% 16%,color-mix(in srgb,var(--world-accent) 70%,white),transparent 28%),linear-gradient(135deg,#0f172a,color-mix(in srgb,var(--world-accent) 42%,#0f172a));box-shadow:0 24px 70px rgba(15,23,42,.18)}.pulse-hero-card h1{margin:.1rem 0 .4rem;font-size:clamp(2.2rem,5vw,4.6rem);letter-spacing:-.06em}.pulse-hero-card p{max-width:760px;color:rgba(255,255,255,.86)}.pulse-score-orb{width:142px;height:142px;border-radius:50%;display:grid;place-items:center;text-align:center;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(8px);flex:0 0 142px}.pulse-score-orb strong{font-size:3rem;line-height:1}.pulse-score-orb span{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:rgba(255,255,255,.82)}.pulse-map-card{display:flex;align-items:stretch;flex-direction:column}.pulse-map-top{display:flex;gap:13px;align-items:center}.pulse-map-card p{margin:.2rem 0;color:var(--muted);font-weight:700}.pulse-meter{height:9px;border-radius:999px;background:var(--panel-2);overflow:hidden;border:1px solid var(--line)}.pulse-meter span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,color-mix(in srgb,var(--world-accent,var(--accent)) 58%,#38bdf8),color-mix(in srgb,var(--world-accent,var(--accent)) 80%,#a78bfa))}.pulse-stat-row{display:flex;flex-wrap:wrap;gap:7px}.pulse-stat-row span{font-size:.78rem;font-weight:900;padding:6px 8px;border-radius:999px;background:color-mix(in srgb,var(--world-accent,var(--accent)) 8%,#fff);border:1px solid color-mix(in srgb,var(--world-accent,var(--accent)) 18%,var(--line));color:color-mix(in srgb,var(--world-accent,var(--accent)) 80%,#111827)}.district-pulse-strip{margin:18px 0 24px;padding:20px;border:1px solid color-mix(in srgb,var(--world-accent,var(--accent)) 22%,var(--line));border-radius:24px;background:linear-gradient(135deg,#fff,color-mix(in srgb,var(--world-accent,var(--accent)) 7%,#fff));display:flex;justify-content:space-between;gap:18px;align-items:center}.district-pulse-strip h2{margin:.1rem 0}.district-pulse-stats{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}.district-pulse-stats span{min-width:86px;padding:10px 12px;border-radius:16px;background:#fff;border:1px solid var(--line);text-align:center;color:var(--muted);font-weight:800}.district-pulse-stats strong{display:block;color:var(--text);font-size:1.35rem}@media(max-width:760px){.pulse-hero{width:min(100% - 24px,1220px)}.pulse-hero-card,.district-pulse-strip{flex-direction:column;align-items:flex-start}.pulse-score-orb{width:110px;height:110px;flex-basis:110px}.district-pulse-stats{justify-content:flex-start}}

/* Phase 8: World Architect / Blueprints */
.architect-hero{width:min(1220px,calc(100% - 48px));margin:28px auto 18px;display:flex;align-items:stretch;justify-content:space-between;gap:22px;padding:34px;border-radius:34px;border:1px solid var(--line);background:radial-gradient(circle at 10% 10%,rgba(106,166,255,.20),transparent 28%),linear-gradient(135deg,#fff,#f8fbff);box-shadow:0 24px 72px rgba(15,23,42,.09)}
.architect-hero h1{font-size:clamp(2.3rem,5vw,5rem);letter-spacing:-.07em;line-height:.95;margin:.2rem 0 .8rem}.architect-hero p{max-width:760px}.architect-passport-mini{min-width:180px;border-radius:28px;background:#111827;color:#fff;display:grid;place-items:center;text-align:center;padding:24px}.architect-passport-mini strong{font-size:3rem;line-height:1}.architect-passport-mini span{text-transform:uppercase;letter-spacing:.08em;font-size:.75rem;font-weight:900;color:rgba(255,255,255,.75)}
.architect-principle-card,.architect-bottom-note,.architect-selected-blueprint{width:min(1220px,calc(100% - 48px));margin:0 auto 20px;padding:18px 22px;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:0 12px 30px rgba(15,23,42,.055)}.architect-principle-card{display:flex;gap:8px;align-items:center}.architect-principle-card span,.architect-bottom-note p,.architect-selected-blueprint p{color:var(--muted);font-weight:700;line-height:1.55}.architect-selected-blueprint span{display:block;color:var(--muted);font-size:.78rem;font-weight:1000;text-transform:uppercase;letter-spacing:.08em}.architect-selected-blueprint strong{display:block;font-size:1.45rem;margin:.2rem 0}.architect-selected-blueprint{background:radial-gradient(circle at 8% 8%,color-mix(in srgb,var(--world-accent,#6aa6ff) 14%,transparent),transparent 30%),#fff}
.blueprint-grid{width:min(1220px,calc(100% - 48px));margin:22px auto 34px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}.blueprint-card{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:14px;min-height:420px;padding:24px;border:1px solid var(--line);border-radius:30px;background:#fff;box-shadow:0 18px 50px rgba(15,23,42,.075);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.blueprint-card:before{content:"";position:absolute;inset:-40% -20% auto auto;width:220px;height:220px;border-radius:50%;background:rgba(106,166,255,.18);pointer-events:none}.blueprint-card:hover{transform:translateY(-4px);box-shadow:0 28px 70px rgba(15,23,42,.13);border-color:rgba(37,99,235,.25)}.blueprint-card h2{font-size:1.6rem;margin:.2rem 0;letter-spacing:-.04em}.blueprint-card p{color:var(--muted);font-weight:700;line-height:1.55;flex:1}.blueprint-topline{display:flex;justify-content:space-between;gap:10px}.blueprint-topline span,.blueprint-topline em{font-style:normal;font-size:.72rem;font-weight:1000;text-transform:uppercase;letter-spacing:.08em;padding:7px 9px;border-radius:999px;background:#f1f5f9;color:#475569}.blueprint-districts{display:flex;flex-wrap:wrap;gap:8px}.blueprint-districts span{font-size:.82rem;font-weight:900;padding:8px 10px;border-radius:999px;border:1px solid var(--line);background:#fafafa}.blueprint-card .button.full{width:100%;text-align:center;justify-content:center}.blueprint-sci_fi{background:radial-gradient(circle at top right,rgba(56,189,248,.18),transparent 32%),#fff}.blueprint-fantasy{background:radial-gradient(circle at top right,rgba(168,85,247,.16),transparent 34%),#fff}.blueprint-vintage{background:radial-gradient(circle at top right,rgba(217,119,6,.14),transparent 34%),#fff}.blueprint-professional{background:radial-gradient(circle at top right,rgba(15,23,42,.10),transparent 34%),#fff}.blueprint-creator{background:radial-gradient(circle at top right,rgba(236,72,153,.13),transparent 34%),#fff}.blueprint-minimal{background:linear-gradient(135deg,#fff,#f8fafc)}
@media(max-width:760px){.architect-hero{width:min(100% - 24px,1220px);display:block;padding:24px}.architect-passport-mini{margin-top:18px}.blueprint-grid,.architect-principle-card,.architect-bottom-note,.architect-selected-blueprint{width:min(100% - 24px,1220px)}.architect-principle-card{display:block}.blueprint-card{min-height:auto}}

/* Trejji Phase 10: District Experience */
.district-experience-hero {
  width:min(1220px, calc(100% - 48px));
  margin: 28px auto 22px;
}
.district-experience-gate {
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) minmax(260px,.38fr);
  gap:24px;
  align-items:center;
  padding:32px;
  border:1px solid color-mix(in srgb, var(--world-accent) 24%, var(--line));
  border-radius:34px;
  background:
    radial-gradient(circle at 14% 22%, color-mix(in srgb, var(--world-accent) 24%, transparent), transparent 28%),
    linear-gradient(135deg, #fff, color-mix(in srgb, var(--world-accent) 5%, white));
  box-shadow:0 24px 70px rgba(15,23,42,.09);
}
.district-experience-gate::after {
  content:"";
  position:absolute;
  inset:auto -80px -120px auto;
  width:320px;
  height:320px;
  border-radius:999px;
  background:color-mix(in srgb, var(--world-accent) 14%, transparent);
  filter:blur(2px);
  pointer-events:none;
}
.district-symbol {
  position:relative;
  z-index:1;
  width:112px;
  height:112px;
  display:grid;
  place-items:center;
  border-radius:34px;
  background:color-mix(in srgb, var(--world-accent) 16%, #fff);
  border:1px solid color-mix(in srgb, var(--world-accent) 32%, var(--line));
  color:color-mix(in srgb, var(--world-accent) 82%, #111827);
  font-size:3rem;
  font-weight:1000;
  box-shadow:0 18px 36px rgba(15,23,42,.08);
}
.district-intro-copy { position:relative; z-index:1; min-width:0; }
.district-intro-copy h1 {
  margin:0 0 10px;
  font-size:clamp(2.6rem, 6vw, 5.4rem);
  letter-spacing:-.075em;
  line-height:.93;
}
.district-signal {
  max-width:800px;
  margin:0;
  color:var(--muted);
  font-size:1.08rem;
  line-height:1.55;
  font-weight:750;
}
.district-action-row { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.district-presence-panel {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.district-presence-panel span {
  min-height:74px;
  display:grid;
  place-items:center;
  text-align:center;
  padding:12px;
  border-radius:20px;
  background:rgba(255,255,255,.78);
  border:1px solid color-mix(in srgb, var(--world-accent) 22%, var(--line));
  color:var(--muted);
  font-size:.82rem;
  font-weight:900;
}
.district-presence-panel strong { display:block; color:var(--text); font-size:1.6rem; line-height:1; }
.district-core-grid {
  width:min(1220px, calc(100% - 48px));
  margin:0 auto 24px;
  display:grid;
  grid-template-columns:1.1fr .95fr .95fr;
  gap:16px;
}
.district-core-card {
  padding:22px;
  border-radius:28px;
  background:#fff;
  border:1px solid color-mix(in srgb, var(--world-accent) 18%, var(--line));
  box-shadow:0 16px 42px rgba(15,23,42,.06);
}
.district-core-card.primary {
  background:linear-gradient(135deg, color-mix(in srgb, var(--world-accent) 12%, white), #fff);
}
.district-core-card h2, .district-core-card h3 { margin:0 0 8px; letter-spacing:-.03em; }
.district-core-card p { color:var(--muted); line-height:1.5; margin:0 0 14px; }
.text-link { color:color-mix(in srgb, var(--world-accent, var(--accent)) 84%, #0f172a); font-weight:1000; text-decoration:none; }
.text-link:hover { text-decoration:underline; }
.district-explore-layout {
  width:min(1220px, calc(100% - 48px));
  margin:0 auto 52px;
  display:grid;
  grid-template-columns:310px minmax(0,1fr);
  gap:22px;
  align-items:start;
}
.district-navigation-panel { position:sticky; top:92px; display:flex; flex-direction:column; gap:16px; }
.district-side-card,
.district-section-block {
  border:1px solid color-mix(in srgb, var(--world-accent) 14%, var(--line));
  background:#fff;
  border-radius:28px;
  box-shadow:0 14px 38px rgba(15,23,42,.055);
}
.district-side-card { padding:18px; }
.district-side-card h3 { margin:0 0 12px; }
.district-compass-link {
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:12px 13px;
  margin-bottom:8px;
  border-radius:18px;
  background:var(--panel-2);
  border:1px solid var(--line);
  text-decoration:none;
  color:var(--text);
  font-weight:900;
}
.district-compass-link small { color:var(--muted); font-weight:850; white-space:nowrap; }
.district-compass-link.active,
.district-compass-link:hover {
  background:color-mix(in srgb, var(--world-accent) 10%, white);
  border-color:color-mix(in srgb, var(--world-accent) 35%, var(--line));
}
.nearby-district-link {
  display:grid;
  grid-template-columns:42px 1fr;
  gap:12px;
  padding:12px 0;
  border-top:1px solid var(--line);
  text-decoration:none;
  color:var(--text);
}
.nearby-district-link:first-of-type { border-top:0; }
.nearby-district-link > span {
  width:42px;
  height:42px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:color-mix(in srgb, var(--world-accent) 12%, white);
}
.nearby-district-link small { display:block; color:var(--muted); margin-top:3px; line-height:1.35; }
.district-main-stage { min-width:0; display:flex; flex-direction:column; gap:18px; }
.district-section-block { padding:22px; }
.district-stream-block { background:linear-gradient(180deg,#fff,color-mix(in srgb, var(--world-accent) 3%, white)); }
.district-mini-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:14px; }
.district-mini-card {
  display:flex;
  flex-direction:column;
  gap:8px;
  min-height:124px;
  padding:16px;
  border-radius:22px;
  background:linear-gradient(180deg,#fff,var(--panel-2));
  border:1px solid var(--line);
  color:var(--text);
  text-decoration:none;
}
.district-mini-card:hover { border-color:color-mix(in srgb, var(--world-accent) 42%, var(--line)); transform:translateY(-1px); }
.district-mini-card.artifact { background:linear-gradient(180deg,#fff,color-mix(in srgb, #f59e0b 7%, white)); }
.district-mini-card strong { font-size:1.02rem; }
.district-mini-card span { color:var(--muted); line-height:1.45; }
.district-lore-list { display:flex; flex-direction:column; gap:10px; margin-top:14px; }
.district-lore-list a {
  padding:14px 16px;
  border-radius:18px;
  background:var(--panel-2);
  border:1px solid var(--line);
  color:var(--text);
  text-decoration:none;
}
.district-lore-list span { display:block; color:var(--muted); margin-top:4px; line-height:1.45; }
@media (max-width:1050px){
  .district-experience-gate { grid-template-columns:auto 1fr; }
  .district-presence-panel { grid-column:1 / -1; grid-template-columns:repeat(4,1fr); }
  .district-core-grid { grid-template-columns:1fr; }
  .district-explore-layout { grid-template-columns:1fr; }
  .district-navigation-panel { position:static; order:2; }
}
@media (max-width:680px){
  .district-experience-hero,
  .district-core-grid,
  .district-explore-layout { width:min(100% - 24px, 1220px); }
  .district-experience-gate { grid-template-columns:1fr; padding:22px; }
  .district-symbol { width:84px; height:84px; font-size:2.2rem; }
  .district-presence-panel { grid-template-columns:1fr 1fr; }
  .district-mini-grid { grid-template-columns:1fr; }
}

/* Phase 11 - Explorer Guide */
.realm-guide-preview, .realm-guide-page { --guide-accent: var(--world-accent, var(--accent)); }
.realm-guide-preview { width:min(1220px, calc(100% - 48px)); margin:24px auto; display:grid; grid-template-columns:1.1fr 1.4fr auto; gap:18px; align-items:center; padding:22px; border:1px solid color-mix(in srgb, var(--guide-accent) 20%, var(--line)); border-radius:28px; background:linear-gradient(135deg, color-mix(in srgb, var(--guide-accent) 9%, #fff), #fff 58%); box-shadow:0 18px 42px rgba(15,23,42,.07); }
.guide-preview-copy h2, .realm-guide-hero h1 { margin:.1rem 0 .5rem; letter-spacing:-.045em; }
.guide-progress { height:10px; border-radius:999px; background:color-mix(in srgb, var(--guide-accent) 12%, #e5e7eb); overflow:hidden; margin:12px 0 8px; }
.guide-progress span { display:block; height:100%; border-radius:999px; background:linear-gradient(90deg, var(--guide-accent), color-mix(in srgb, var(--guide-accent) 55%, #111827)); }
.guide-preview-steps { display:grid; gap:10px; }
.guide-preview-step { display:grid; grid-template-columns:44px 1fr; gap:12px; align-items:center; padding:12px; border:1px solid var(--line); border-radius:18px; background:#fff; color:var(--text); text-decoration:none; }
.guide-preview-step > span { width:44px; height:44px; display:grid; place-items:center; border-radius:16px; background:color-mix(in srgb, var(--guide-accent) 12%, #fff); color:color-mix(in srgb, var(--guide-accent) 75%, #111827); font-size:1.25rem; }
.guide-preview-step.empty { opacity:.72; border-style:dashed; }
.guide-preview-step small { display:block; color:var(--muted); margin-top:2px; }
.realm-guide-page { width:min(1120px, calc(100% - 48px)); margin:30px auto 60px; }
.realm-guide-hero { display:grid; grid-template-columns:1fr 150px; gap:24px; align-items:center; padding:30px; border:1px solid color-mix(in srgb, var(--guide-accent) 22%, var(--line)); border-radius:32px; background:radial-gradient(circle at 16% 10%, color-mix(in srgb, var(--guide-accent) 18%, transparent), transparent 34%), #fff; box-shadow:0 22px 60px rgba(15,23,42,.08); }
.realm-guide-hero h1 { font-size:clamp(2rem, 5vw, 4.2rem); line-height:.95; max-width:820px; }
.guide-orb { width:140px; height:140px; border-radius:999px; display:grid; place-items:center; align-content:center; border:1px solid color-mix(in srgb, var(--guide-accent) 35%, var(--line)); background:linear-gradient(145deg, color-mix(in srgb, var(--guide-accent) 18%, #fff), #fff); }
.guide-orb strong { font-size:2.2rem; line-height:1; }
.guide-orb span { color:var(--muted); font-weight:800; }
.realm-guide-path { position:relative; display:grid; gap:18px; margin-top:24px; }
.realm-guide-path:before { content:""; position:absolute; left:36px; top:18px; bottom:18px; width:2px; background:linear-gradient(var(--guide-accent), transparent); opacity:.35; }
.guide-step-card { position:relative; display:grid; grid-template-columns:72px 1fr; gap:18px; padding:22px; border:1px solid var(--line); border-radius:28px; background:#fff; box-shadow:0 14px 32px rgba(15,23,42,.055); }
.guide-step-icon { position:relative; z-index:1; width:72px; height:72px; display:grid; place-items:center; border-radius:24px; background:color-mix(in srgb, var(--guide-accent) 13%, #fff); color:color-mix(in srgb, var(--guide-accent) 75%, #111827); font-size:1.6rem; border:1px solid color-mix(in srgb, var(--guide-accent) 24%, var(--line)); }
.guide-step-card.empty { background:linear-gradient(135deg,#fff, color-mix(in srgb, var(--guide-accent) 4%, #fff)); border-style:dashed; }
.guide-step-body span { color:var(--muted); font-size:.78rem; font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.guide-step-body h2 { margin:.25rem 0 .45rem; letter-spacing:-.025em; }
.guide-step-body p { color:var(--muted); max-width:760px; }
@media (max-width:900px){ .realm-guide-preview { grid-template-columns:1fr; width:min(100% - 24px,1220px); } .realm-guide-hero { grid-template-columns:1fr; } .guide-orb { width:110px; height:110px; } .realm-guide-page { width:min(100% - 24px,1120px); } }


/* Phase 12: World Codex */
.realm-codex-page{--codex-accent:var(--world-accent,var(--accent));width:min(1180px,calc(100% - 48px));margin:30px auto 70px}.realm-codex-hero{display:grid;grid-template-columns:1fr 170px;gap:26px;align-items:center;padding:32px;border:1px solid color-mix(in srgb,var(--codex-accent) 22%,var(--line));border-radius:34px;background:radial-gradient(circle at 14% 8%,color-mix(in srgb,var(--codex-accent) 18%,transparent),transparent 34%),linear-gradient(135deg,#fff,#f8fafc);box-shadow:0 24px 70px rgba(15,23,42,.09);overflow:hidden;position:relative}.realm-codex-hero:after{content:"";position:absolute;inset:auto -80px -120px auto;width:260px;height:260px;border-radius:999px;border:1px solid color-mix(in srgb,var(--codex-accent) 30%,transparent);background:radial-gradient(circle,color-mix(in srgb,var(--codex-accent) 12%,transparent),transparent 62%)}.realm-codex-hero h1{font-size:clamp(2.2rem,5.2vw,4.5rem);line-height:.92;letter-spacing:-.06em;margin:.15rem 0 .7rem;max-width:850px}.realm-codex-hero p{font-size:1.06rem;color:var(--muted);max-width:760px}.codex-seal{width:154px;height:154px;border-radius:44px;display:grid;place-items:center;text-align:center;background:linear-gradient(135deg,var(--codex-accent),color-mix(in srgb,var(--codex-accent) 55%,#111827));color:#fff;box-shadow:0 20px 50px color-mix(in srgb,var(--codex-accent) 32%,transparent);transform:rotate(3deg)}.codex-seal strong{display:block;font-size:4.4rem;line-height:.8}.codex-seal span{text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;font-weight:900}.codex-progress,.codex-progress span{height:10px;border-radius:99px;display:block}.codex-progress{margin:18px 0 8px;background:#e5e7eb;overflow:hidden;max-width:520px}.codex-progress span{background:linear-gradient(90deg,var(--codex-accent),color-mix(in srgb,var(--codex-accent) 35%,#111827))}.codex-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:18px}.codex-grid-top{grid-template-columns:1.5fr .75fr}.codex-panel{padding:22px;border:1px solid color-mix(in srgb,var(--codex-accent) 14%,var(--line));border-radius:28px;background:#fff;box-shadow:0 16px 42px rgba(15,23,42,.06)}.codex-large{min-height:250px}.codex-panel h2{margin:.1rem 0 .5rem;letter-spacing:-.035em}.codex-panel-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:12px}.codex-panel-head a{font-size:.88rem;font-weight:800;color:var(--codex-accent);text-decoration:none}.codex-term-cloud{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding-top:10px}.codex-term-cloud span{font-size:calc(.82rem * var(--weight));font-weight:900;letter-spacing:-.03em;border:1px solid color-mix(in srgb,var(--codex-accent) 24%,var(--line));background:color-mix(in srgb,var(--codex-accent) 8%,#fff);border-radius:999px;padding:9px 13px}.codex-term-cloud em,.source-orbit em{font-style:normal;opacity:.6;font-size:.74em;margin-left:4px}.codex-list{display:grid;gap:10px}.codex-list a{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;text-decoration:none;color:inherit;padding:12px;border:1px solid var(--line);border-radius:18px;background:#f8fafc;transition:transform .15s ease,border-color .15s ease,background .15s ease}.codex-list.compact a{grid-template-columns:auto 1fr}.codex-list a:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--codex-accent) 42%,var(--line));background:#fff}.codex-list a span{width:34px;height:34px;display:grid;place-items:center;border-radius:12px;background:color-mix(in srgb,var(--codex-accent) 12%,#fff);color:var(--codex-accent);font-weight:900}.codex-list a strong{font-size:.98rem}.codex-list a small{color:var(--muted)}.source-orbit{display:flex;flex-wrap:wrap;gap:10px}.source-orbit span,.source-orbit a{display:inline-flex;align-items:center;gap:4px;padding:10px 13px;border-radius:999px;border:1px solid color-mix(in srgb,var(--codex-accent) 18%,var(--line));background:#f8fafc;text-decoration:none;color:inherit;font-weight:800}@media(max-width:900px){.realm-codex-page{width:min(100% - 24px,1180px)}.realm-codex-hero,.codex-grid,.codex-grid-top{grid-template-columns:1fr}.codex-seal{width:120px;height:120px;border-radius:34px}.codex-seal strong{font-size:3.2rem}.codex-list a{grid-template-columns:auto 1fr}}


/* Trejji media + tightened content studio pass */
.world-content-form input[type="text"],
.world-content-form input[type="url"],
.world-content-form input:not([type]),
.world-content-form select,
.world-content-form textarea,
.world-form-shell input[type="text"],
.world-form-shell input[type="url"],
.world-form-shell input:not([type]),
.world-form-shell select,
.world-form-shell textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #f8fbff;
  color: var(--text);
  padding: 13px 15px;
  font-size: 1rem;
}
.world-content-form textarea { min-height: 170px; resize: vertical; }
.world-form-shell { box-shadow: 0 22px 70px rgba(15,23,42,.08); }
.world-form-heading { border-bottom: 1px solid var(--line); padding-bottom: 18px; }
.content-media-grid { display:grid; grid-template-columns:minmax(0,1fr) 240px; gap:18px; align-items:start; }
.form-help { display:block; color:var(--muted); font-size:.92rem; line-height:1.35; margin-top:6px; }
.current-world-image { background:#fff; border:1px solid var(--line); border-radius:18px; padding:10px; }
.current-world-image img { width:100%; aspect-ratio:16/10; object-fit:cover; display:block; border-radius:14px; }
.compact-check { display:flex !important; flex-direction:row !important; align-items:center; gap:8px !important; margin-top:10px; font-size:.92rem; }
.compact-check input { width:auto !important; }
.world-content-card { border-radius: 24px; border:1px solid var(--line); }
.world-content-card h3,
.world-content-card h2 { letter-spacing:-.025em; }
.world-content-body { max-width: 76ch; }
.world-item-image-frame { margin:16px 0; border-radius:24px; overflow:hidden; border:1px solid var(--line); background:#f8fafc; box-shadow:0 14px 35px rgba(15,23,42,.08); }
.world-item-image-frame img { width:100%; display:block; max-height:620px; object-fit:cover; }
.source-preview-card { margin-top:16px; border:1px solid var(--line); border-radius:22px; background:#f8fbff; padding:16px; overflow:hidden; }
.source-preview-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:10px; }
.source-preview-head strong { font-size:1.05rem; }
.source-preview-head span { color:var(--muted); font-weight:800; font-size:.86rem; background:#eef4ff; border-radius:999px; padding:6px 10px; }
.source-url-text { color:var(--muted); overflow-wrap:anywhere; font-size:.92rem; margin:8px 0 12px; }
.source-preview-frame-wrap { border:1px solid var(--line); border-radius:18px; overflow:hidden; background:#fff; min-height:360px; }
.source-preview-frame-wrap iframe { width:100%; height:420px; border:0; display:block; background:#fff; }
.compact-source-note { justify-content:flex-start; }
.embed-note-row .embed-source-link { display:none; }
.world-item-owner-tools a { color:#ef4444; font-weight:900; }
.content-title-link { color:inherit; text-decoration:none; }
.content-title-link:hover { color:var(--accent); }
.district-main-stage .world-content-card { padding:26px; }
.district-stream-block .section-heading-row { margin-bottom:16px; }
@media (max-width: 760px) {
  .content-media-grid { grid-template-columns:1fr; }
  .source-preview-frame-wrap iframe { height:300px; }
  .district-main-stage .world-content-card { padding:18px; }
}


/* Trejji native website preview cards */
.native-source-card {
  background: linear-gradient(135deg, #ffffff 0%, #f7fbff 100%);
  border-color: #d7e3f5;
}
.native-source-image {
  margin: 12px 0 14px;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid var(--line);
  background: #eef4ff;
}
.native-source-image img {
  display: block;
  width: 100%;
  max-height: 380px;
  object-fit: cover;
}
.native-source-body h4 {
  margin: 8px 0 6px;
  font-size: 1.22rem;
  letter-spacing: -0.025em;
}
.native-source-body p {
  margin: 0 0 10px;
  color: var(--muted);
  line-height: 1.45;
}
.native-source-card .source-url-text {
  padding: 10px 12px;
  border-radius: 12px;
  background: #eef4ff;
  color: #42526b;
  font-size: .88rem;
}

/* =========================================================
   Trejji Studio CSS Tightening Pass
   Fixes cramped form fields and preview layout on world create/edit.
   ========================================================= */
.world-studio-shell.phase-one-studio{
  width:min(1320px, calc(100% - 48px));
  margin:34px auto 56px;
  padding:0;
}
.world-studio-shell .studio-intro{
  margin:0 0 24px;
  max-width:900px;
}
.world-studio-shell .studio-intro h1{
  font-size:clamp(2.5rem, 5.8vw, 5.8rem);
  letter-spacing:-.075em;
  line-height:.88;
  margin:.2rem 0 .8rem;
}
.world-studio-grid{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) minmax(360px, 430px) !important;
  gap:32px !important;
  align-items:start;
}
.world-studio-form.studio-card-stack{
  display:flex;
  flex-direction:column;
  gap:22px;
  min-width:0;
}
.studio-panel{
  background:#fff;
  border:1px solid #d9e3f2;
  border-radius:28px;
  padding:28px;
  box-shadow:0 20px 60px rgba(15,23,42,.07);
  overflow:hidden;
}
.panel-title-row{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:22px;
}
.panel-title-row h2{
  margin:0;
  font-size:1.55rem;
  line-height:1.15;
  letter-spacing:-.03em;
}
.step-dot{
  width:42px;
  height:42px;
  border-radius:999px;
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  background:#2563eb;
  color:#fff;
  font-weight:1000;
  font-size:1.15rem;
  box-shadow:0 12px 24px rgba(37,99,235,.22);
}
.studio-two{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:20px 22px;
  align-items:start;
  margin-bottom:18px;
}
.world-studio-form label{
  display:flex;
  flex-direction:column;
  gap:8px;
  color:#0f172a;
  font-weight:900;
  font-size:.98rem;
}
.world-studio-form input[type="text"],
.world-studio-form input[type="url"],
.world-studio-form input[type="file"],
.world-studio-form input:not([type]),
.world-studio-form select,
.world-studio-form textarea{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box;
  border:1px solid #d6e0ee;
  border-radius:16px;
  background:#f8fbff;
  color:#0f172a;
  padding:14px 16px;
  min-height:52px;
  font:inherit;
  font-weight:700;
  outline:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
}
.world-studio-form input[type="color"]{
  width:100% !important;
  max-width:100% !important;
  height:54px;
  border:1px solid #d6e0ee;
  border-radius:16px;
  background:#f8fbff;
  padding:6px;
  cursor:pointer;
}
.world-studio-form input[type="file"]{
  border-style:dashed;
  background:#fff;
  min-height:64px;
  display:block;
  padding:18px;
}
.world-studio-form textarea{
  min-height:150px;
  line-height:1.55;
  resize:vertical;
}
.world-studio-form select{
  appearance:auto;
}
.world-studio-form input:focus,
.world-studio-form select:focus,
.world-studio-form textarea:focus{
  border-color:#6aa6ff;
  box-shadow:0 0 0 4px rgba(106,166,255,.16);
  background:#fff;
}
.advanced-fields{
  margin-top:10px;
  padding:18px;
  border:1px solid #d9e3f2;
  border-radius:22px;
  background:#f5f8fc;
}
.advanced-fields summary{
  cursor:pointer;
  font-weight:1000;
  font-size:1.05rem;
  color:#0f172a;
}
.advanced-fields label{margin-top:14px;}
.existing-districts,
.preview-districts{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.existing-districts span,
.preview-districts span{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:8px 12px;
  background:#eef5ff;
  color:#4776b9;
  font-weight:1000;
}
.sticky-actions{
  position:sticky;
  bottom:0;
  z-index:10;
  display:flex;
  gap:12px;
  align-items:center;
  padding:16px 0 0;
  background:linear-gradient(to top,#f7faff 68%,rgba(247,250,255,0));
}
.studio-save{
  min-width:220px;
  justify-content:center;
  border-radius:18px !important;
  box-shadow:0 18px 34px rgba(37,99,235,.25);
}
.world-preview-panel{
  background:#fff;
  border:1px solid #d9e3f2;
  border-radius:30px;
  padding:24px;
  box-shadow:0 22px 70px rgba(15,23,42,.08);
}
.sticky-preview{
  position:sticky;
  top:96px;
}
.preview-label{
  margin:0 0 16px;
  color:#64748b;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.78rem;
  font-weight:1000;
}
.world-channel-preview{
  overflow:hidden;
  border:1px solid #d9e3f2;
  border-radius:28px;
  background:#fff;
}
.preview-banner{
  min-height:168px;
  background:radial-gradient(circle at 18% 15%, color-mix(in srgb, var(--world-accent,#6aa6ff) 48%, #fff), transparent 28%),linear-gradient(135deg,#1e293b,#0f172a);
  background-position:center;
  background-size:cover;
}
.preview-body{
  display:grid;
  grid-template-columns:104px 1fr;
  gap:18px;
  align-items:start;
  padding:0 26px 18px;
  margin-top:-48px;
}
.preview-avatar{
  width:104px;
  height:104px;
  border-radius:999px;
  border:6px solid #fff;
  display:grid;
  place-items:center;
  background:var(--world-accent,#6aa6ff);
  color:#fff;
  font-size:2.6rem;
  font-weight:1000;
  background-size:cover;
  background-position:center;
  box-shadow:0 16px 30px rgba(15,23,42,.16);
}
.preview-avatar.has-image{font-size:0;}
.preview-copy{padding-top:52px;min-width:0;}
.preview-type{
  color:var(--world-accent,#2563eb);
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.72rem;
}
.preview-copy h2{
  margin:4px 0 4px;
  font-size:clamp(1.6rem, 3vw, 2.2rem);
  line-height:1.02;
  letter-spacing:-.055em;
  word-break:break-word;
}
.preview-copy p{
  margin:0;
  color:#64748b;
  font-weight:800;
  line-height:1.3;
}
.preview-entry{
  margin:0 26px 18px;
  padding:16px 18px;
  border:1px solid #d9e3f2;
  border-radius:18px;
  background:linear-gradient(135deg,#f8fbff,#fff);
  font-weight:1000;
  color:#0f172a;
}
.preview-districts{padding:0 26px 22px;}
.preview-about{
  border-top:1px solid #d9e3f2;
  padding:22px 26px 26px;
  color:#64748b;
  font-weight:800;
  line-height:1.45;
}
.studio-hook-card{
  margin-top:18px;
  padding:18px 20px;
  border-radius:22px;
  background:#eef5ff;
  border:1px solid #cfe0fb;
}
.studio-hook-card strong{display:block;color:#0f172a;margin-bottom:6px;}
.studio-hook-card p{margin:0;color:#64748b;font-weight:800;line-height:1.4;}
@media(max-width:980px){
  .world-studio-grid{grid-template-columns:1fr !important;}
  .sticky-preview{position:relative;top:auto;}
}
@media(max-width:680px){
  .world-studio-shell.phase-one-studio{width:min(100% - 24px, 1320px);margin-top:20px;}
  .studio-panel,.world-preview-panel{padding:20px;border-radius:22px;}
  .studio-two{grid-template-columns:1fr !important;}
  .preview-body{grid-template-columns:78px 1fr;padding:0 18px 16px;margin-top:-38px;}
  .preview-avatar{width:78px;height:78px;font-size:2rem;border-width:4px;}
  .preview-copy{padding-top:42px;}
  .preview-entry,.preview-districts,.preview-about{margin-left:18px;margin-right:18px;padding-left:0;padding-right:0;}
}

/* World Studio district manager */
.district-manager-list{
  display:flex;
  flex-direction:column;
  gap:14px;
  margin:18px 0;
}
.district-manager-row{
  display:grid;
  grid-template-columns:74px minmax(160px,1fr) minmax(220px,1.4fr) auto auto;
  gap:12px;
  align-items:end;
  padding:14px;
  border:1px solid #cfe0ff;
  border-radius:20px;
  background:linear-gradient(135deg,#ffffff,#f7fbff);
  box-shadow:0 14px 30px rgba(38,99,235,.06);
}
.district-manager-row.inactive{
  opacity:.62;
  background:#f4f7fb;
}
.district-manager-row.inactive .name-field input{
  text-decoration:line-through;
}
.district-mini-field{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:#64748b;
  font-size:.82rem;
  font-weight:800;
}
.district-mini-field input{
  width:100%;
  border:1px solid #cbdaf5;
  background:#fff;
  border-radius:12px;
  padding:10px 12px;
  font-weight:800;
  color:#0f172a;
}
.district-mini-field.icon-field input{
  text-align:center;
  font-size:1.15rem;
}
.district-toggle-pill,
.district-delete-pill{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:44px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid #cfe0ff;
  background:#eff6ff;
  color:#1d4ed8;
  font-weight:900;
  white-space:nowrap;
  cursor:pointer;
}
.district-delete-pill{
  border-color:#fecaca;
  background:#fff5f5;
  color:#ef4444;
}
.district-toggle-pill input,
.district-delete-pill input{
  width:16px;
  height:16px;
  accent-color:#2563eb;
}
.district-delete-pill input{ accent-color:#ef4444; }
.small-help{font-size:.95rem;margin-top:-4px;}
@media (max-width: 980px){
  .district-manager-row{
    grid-template-columns:70px 1fr;
  }
  .district-manager-row .desc-field,
  .district-toggle-pill,
  .district-delete-pill{
    grid-column:1 / -1;
  }
}

/* District management layout fix — keep active/delete controls inside the studio panel */
.district-manager-row{
  grid-template-columns:64px minmax(0,1fr) minmax(0,1.15fr) 88px !important;
  align-items:end !important;
  overflow:hidden;
}
.district-manager-row .district-mini-field,
.district-manager-row .district-mini-field input{
  min-width:0;
}
.district-manager-row .district-toggle-pill{
  width:88px;
  min-width:0;
  padding:8px 10px;
  font-size:.82rem;
  justify-self:end;
  box-sizing:border-box;
}
.district-manager-row .district-delete-pill{
  grid-column:1 / -1;
  justify-self:start;
  width:auto;
  min-height:36px;
  padding:7px 12px;
  font-size:.82rem;
  margin-top:2px;
  box-sizing:border-box;
}
.district-manager-row .district-delete-pill::after{
  content:" — removes empty districts, hides districts that already contain discoveries";
  color:#94a3b8;
  font-weight:700;
}
.district-manager-row .name-field input,
.district-manager-row .desc-field input{
  overflow:hidden;
  text-overflow:ellipsis;
}
@media (max-width: 1180px){
  .district-manager-row{
    grid-template-columns:64px minmax(0,1fr) !important;
  }
  .district-manager-row .desc-field,
  .district-manager-row .district-toggle-pill,
  .district-manager-row .district-delete-pill{
    grid-column:1 / -1;
    justify-self:stretch;
    width:100%;
  }
  .district-manager-row .district-delete-pill::after{content:"";}
}

/* Trejji path explorer cleanup: scalable branch navigation */
.path-branch-workspace {
  overflow: hidden;
  padding: 0;
  background:
    radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--world-accent, #6aa6ff) 14%, transparent), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(245,249,255,.92));
}
.branch-workspace-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: start;
  padding: 28px;
  border-bottom: 1px solid var(--line);
}
.branch-workspace-head h2 { margin: 6px 0 8px; font-size: clamp(1.7rem, 2.6vw, 2.7rem); letter-spacing: -.04em; }
.branch-workspace-stats { display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.branch-workspace-stats span {
  min-width: 116px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.78);
  color: var(--muted);
  font-weight: 800;
  text-align: center;
}
.branch-workspace-stats strong { display:block; font-size:1.45rem; color:var(--text); line-height:1; }
.branch-tools {
  display:grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  gap: 14px;
  align-items:center;
  padding: 18px 28px 0;
}
.branch-tools input[type="search"] {
  width:100%;
  border:1px solid var(--line);
  border-radius: 999px;
  padding: 14px 18px;
  background: rgba(255,255,255,.88);
  color: var(--text);
  font: inherit;
  font-weight: 750;
}
.branch-filter-pills { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.branch-filter {
  border:1px solid var(--line);
  border-radius:999px;
  padding:10px 14px;
  background:rgba(255,255,255,.72);
  color:var(--muted);
  font-weight:900;
  cursor:pointer;
}
.branch-filter.active,
.branch-filter:hover { background: color-mix(in srgb, var(--world-accent, #2f6df6) 16%, white); color: var(--text); border-color: color-mix(in srgb, var(--world-accent, #2f6df6) 35%, var(--line)); }
.branch-choice-grid--realm {
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 16px;
  padding: 22px 28px 28px;
}
.branch-choice-card--realm {
  position:relative;
  display:grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 14px;
  min-height: 0;
  padding: 18px;
  border:1px solid color-mix(in srgb, var(--world-accent, #6aa6ff) 22%, var(--line));
  border-radius: 24px;
  background: rgba(255,255,255,.8);
  box-shadow: 0 18px 45px rgba(15,23,42,.06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.branch-choice-card--realm:hover { transform: translateY(-2px); box-shadow: 0 24px 60px rgba(15,23,42,.10); border-color: color-mix(in srgb, var(--world-accent, #2f6df6) 48%, var(--line)); }
.branch-node-mark { display:flex; align-items:flex-start; justify-content:center; padding-top: 2px; }
.branch-node-mark span {
  width: 34px; height: 34px; border-radius: 14px;
  background: color-mix(in srgb, var(--world-accent, #2f6df6) 14%, white);
  border: 1px solid color-mix(in srgb, var(--world-accent, #2f6df6) 28%, var(--line));
  position:relative;
}
.branch-node-mark span::after { content:'↳'; position:absolute; inset:0; display:grid; place-items:center; font-weight:1000; color: color-mix(in srgb, var(--world-accent, #2f6df6) 75%, #0f172a); }
.branch-node-mark i { display:block; width:2px; height:52px; margin-top:34px; margin-left:-18px; background: linear-gradient(to bottom, color-mix(in srgb, var(--world-accent, #2f6df6) 40%, transparent), transparent); }
.branch-card-main { min-width:0; }
.branch-choice-card--realm .branch-choice-top { display:flex; gap:8px; align-items:center; justify-content:space-between; margin-bottom:10px; }
.path-label { display:inline-flex; align-items:center; border-radius:999px; padding:6px 10px; background:var(--panel-2); color:var(--muted); font-weight:1000; font-size:.82rem; }
.branch-choice-card--realm .branch-choice-preview { color:var(--text); font-size:1.02rem; line-height:1.45; margin: 6px 0 12px; }
.branch-choice-card--realm .branch-choice-meta { color:var(--muted); font-weight:750; font-size:.9rem; }
.mini-constellation { display:flex; align-items:center; gap:5px; margin-top:14px; opacity:.9; }
.mini-constellation .dot { width:10px; height:10px; border-radius:999px; background:var(--world-accent, #2f6df6); box-shadow:0 0 0 5px color-mix(in srgb, var(--world-accent, #2f6df6) 12%, transparent); }
.mini-constellation .dot.child { width:13px; height:13px; }
.mini-constellation .dot.faint { opacity:.35; }
.mini-constellation .line { flex:0 0 42px; height:2px; background:linear-gradient(to right, var(--world-accent, #2f6df6), color-mix(in srgb, var(--world-accent, #2f6df6) 20%, transparent)); }
.mini-constellation .line.faint { opacity:.35; }
.branch-choice-card--realm .branch-choice-footer {
  grid-column: 1 / -1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding-top: 14px;
  border-top:1px dashed var(--line);
}
.branch-enter-button { white-space:nowrap; }
.empty-branch-state {
  margin: 22px 28px 28px;
  display:flex;
  gap:14px;
  align-items:center;
  border:1px dashed color-mix(in srgb, var(--world-accent, #2f6df6) 35%, var(--line));
  border-radius:22px;
  padding:20px;
  background:rgba(255,255,255,.66);
}
.empty-branch-icon { width:48px; height:48px; border-radius:18px; display:grid; place-items:center; background:color-mix(in srgb, var(--world-accent, #2f6df6) 14%, white); color:var(--world-accent, #2f6df6); font-size:1.6rem; font-weight:1000; }
.empty-branch-state h3 { margin:0 0 4px; }
.empty-branch-state p { margin:0; color:var(--muted); }
.path-quick-branch-card {
  display:grid;
  grid-template-columns: minmax(220px, .8fr) minmax(0, 1.2fr);
  gap:18px;
  align-items:start;
  background:linear-gradient(135deg, rgba(255,255,255,.96), color-mix(in srgb, var(--world-accent, #6aa6ff) 8%, white));
}
.world-path-branch-form--large { margin:0; }
.world-path-branch-form--large textarea { min-height: 130px; }
.world-sidebar-list a small { white-space:nowrap; }
@media (max-width: 860px) {
  .branch-workspace-head, .branch-tools, .path-quick-branch-card { grid-template-columns:1fr; }
  .branch-workspace-stats, .branch-filter-pills { justify-content:flex-start; }
  .branch-choice-grid--realm { grid-template-columns:1fr; padding:18px; }
  .branch-workspace-head { padding:22px; }
  .branch-tools { padding:16px 22px 0; }
  .branch-choice-card--realm .branch-choice-footer { flex-direction:column; align-items:stretch; }
  .branch-enter-button { width:100%; justify-content:center; }
}

/* Smart long-path navigator: keeps 100+ step trails readable */
.path-navigator-summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:14px 16px;
  margin:14px 0 4px;
  border:1px solid color-mix(in srgb, var(--world-accent, var(--accent)) 18%, var(--line));
  border-radius:20px;
  background:linear-gradient(135deg,#fff,color-mix(in srgb,var(--world-accent, var(--accent)) 7%,white));
}
.path-navigator-summary strong { display:block; font-size:1rem; }
.path-navigator-summary span { display:block; color:var(--muted); font-weight:800; font-size:.88rem; margin-top:2px; }
.path-nav-actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.mini-button { display:inline-flex; align-items:center; justify-content:center; padding:8px 12px; border-radius:999px; background:var(--panel-2); border:1px solid var(--line); color:var(--text); font-weight:1000; text-decoration:none; }
.mini-button:hover { border-color:color-mix(in srgb,var(--world-accent, var(--accent)) 35%,var(--line)); background:color-mix(in srgb,var(--world-accent, var(--accent)) 10%,white); }
.world-path-stepper--smart { align-items:center; padding:8px 0 2px; }
.world-path-stepper--smart .world-path-step { max-width:min(360px, 100%); }
.path-compressed-gap { display:inline-flex; align-items:center; justify-content:center; padding:8px 12px; border-radius:999px; border:1px dashed color-mix(in srgb,var(--world-accent, var(--accent)) 35%,var(--line)); background:rgba(255,255,255,.72); color:var(--muted); font-weight:1000; font-size:.82rem; white-space:nowrap; }
.full-path-drawer { margin-top:14px; border:1px solid var(--line); border-radius:20px; background:var(--panel-2); overflow:hidden; }
.full-path-drawer summary { cursor:pointer; padding:14px 16px; font-weight:1000; color:color-mix(in srgb,var(--world-accent, var(--accent)) 86%,#111827); list-style:none; }
.full-path-drawer summary::-webkit-details-marker { display:none; }
.full-path-list { max-height:360px; overflow:auto; display:grid; gap:6px; padding:0 12px 12px; }
.full-path-row { display:grid; grid-template-columns:42px minmax(0,1fr); gap:10px; align-items:center; padding:10px 12px; border-radius:14px; background:#fff; border:1px solid var(--line); text-decoration:none; color:var(--text); }
.full-path-row span { width:30px; height:30px; border-radius:50%; display:grid; place-items:center; background:var(--panel-2); border:1px solid var(--line); font-weight:1000; }
.full-path-row em { font-style:normal; color:var(--muted); font-weight:850; line-height:1.35; }
.full-path-row.is-current { border-color:color-mix(in srgb,var(--world-accent, var(--accent)) 45%,var(--line)); background:color-mix(in srgb,var(--world-accent, var(--accent)) 10%,white); }
@media (max-width:760px){ .path-navigator-summary{align-items:flex-start; flex-direction:column;} .path-nav-actions{justify-content:flex-start;} .world-path-stepper--smart{align-items:flex-start;} .step-connector{display:none;} .path-compressed-gap{width:100%;} }

/* Trejji Path Reader: book-like trail navigation */
.path-reader-shell {
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--world-accent, var(--accent)) 12%, transparent), transparent 34%),
    linear-gradient(135deg, #ffffff, #f7fbff 58%, #eef5ff);
}
.path-reader-head {
  display:flex;
  justify-content:space-between;
  gap:22px;
  align-items:flex-start;
  padding-bottom:16px;
}
.path-reader-head h2 { margin:0; font-size:clamp(2rem, 4vw, 4rem); letter-spacing:-.05em; line-height:.95; }
.path-reader-count {
  min-width:96px;
  text-align:center;
  border:1px solid color-mix(in srgb, var(--world-accent, var(--accent)) 35%, var(--line));
  background:color-mix(in srgb, var(--world-accent, var(--accent)) 10%, white);
  border-radius:999px;
  padding:10px 16px;
  font-weight:1000;
  color:var(--accent);
  box-shadow:0 12px 28px rgba(37,99,235,.10);
}
.path-reader-progress { height:9px; border-radius:999px; background:#e8eef8; overflow:hidden; margin:4px 0 20px; }
.path-reader-progress span { display:block; width:0; height:100%; background:linear-gradient(90deg, var(--world-accent, var(--accent)), #69d2ff); border-radius:inherit; transition:width .25s ease; }
.path-reader-stage {
  position:relative;
  min-height:280px;
  border:1px solid var(--line);
  border-radius:28px;
  background:#fff;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.8), 0 26px 60px rgba(15,23,42,.08);
  overflow:hidden;
}
.path-reader-stage:before {
  content:"";
  position:absolute;
  inset:0 auto 0 50%;
  width:1px;
  background:linear-gradient(transparent, rgba(148,163,184,.35), transparent);
  pointer-events:none;
}
.path-reader-page {
  display:none;
  min-height:280px;
  padding:34px;
  background:
    radial-gradient(circle at 100% 100%, color-mix(in srgb, var(--world-accent, var(--accent)) 10%, transparent), transparent 30%),
    linear-gradient(90deg, #fff, #fbfdff);
}
.path-reader-page.is-active { display:block; animation:readerPageIn .18s ease-out; }
@keyframes readerPageIn { from { opacity:0; transform:translateX(10px); } to { opacity:1; transform:translateX(0); } }
.reader-page-topline { display:flex; justify-content:space-between; gap:10px; align-items:center; color:var(--muted); font-weight:900; margin-bottom:22px; }
.reader-page-topline strong { color:var(--accent); background:var(--panel-2); border:1px solid var(--line); border-radius:999px; padding:7px 12px; }
.reader-page-body { font-size:clamp(1.25rem, 2.2vw, 2rem); line-height:1.32; color:var(--text); font-weight:800; letter-spacing:-.02em; max-width:900px; }
.reader-page-meta { margin-top:20px; display:flex; gap:8px; flex-wrap:wrap; color:var(--muted); font-weight:900; }
.reader-page-actions { margin-top:22px; display:flex; gap:14px; flex-wrap:wrap; align-items:center; }
.inline-delete-form { margin:0; }
.reader-branch-drawer { margin-top:24px; border:1px dashed color-mix(in srgb, var(--world-accent, var(--accent)) 35%, var(--line)); border-radius:20px; padding:12px 14px; background:rgba(255,255,255,.72); }
.reader-branch-drawer summary { cursor:pointer; font-weight:1000; color:var(--accent); }
.reader-branch-form { display:grid; grid-template-columns:1fr auto; gap:12px; margin-top:12px; align-items:start; }
.reader-branch-form textarea { width:100%; border:1px solid var(--line); border-radius:18px; padding:14px 16px; font:inherit; resize:vertical; background:#fff; }
.reader-login-hint { margin-top:18px; color:var(--muted); font-weight:800; }
.path-reader-controls { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; padding-top:18px; }
.path-reader-controls button:disabled { opacity:.45; cursor:not-allowed; transform:none; }
.reader-index-drawer { margin-top:16px; border-top:1px solid var(--line); padding-top:12px; }
.reader-index-drawer summary { cursor:pointer; font-weight:1000; color:var(--accent); }
.reader-index-list { display:grid; gap:8px; max-height:340px; overflow:auto; margin-top:12px; padding-right:4px; }
.reader-index-row { display:grid; grid-template-columns:44px 1fr; gap:12px; align-items:center; text-align:left; border:1px solid var(--line); background:#fff; border-radius:16px; padding:10px 12px; cursor:pointer; color:var(--text); }
.reader-index-row span { display:grid; place-items:center; width:30px; height:30px; border-radius:999px; background:var(--panel-2); font-weight:1000; color:var(--accent); }
.reader-index-row em { font-style:normal; color:var(--muted); font-weight:800; }
.reader-index-row.is-current { border-color:color-mix(in srgb, var(--world-accent, var(--accent)) 45%, var(--line)); background:color-mix(in srgb, var(--world-accent, var(--accent)) 8%, white); }
.path-current-compact { display:none; }
@media (max-width:760px){
  .path-reader-head { flex-direction:column; }
  .path-reader-page { padding:22px; }
  .reader-branch-form { grid-template-columns:1fr; }
  .path-reader-stage:before { display:none; }
}



/* Path Reader v2: one intuitive conversation reader */
.living-reader,
.living-directions {
  overflow: hidden;
  border-color: rgba(96, 165, 250, .34);
  background:
    radial-gradient(circle at 10% 0%, rgba(96, 165, 250, .14), transparent 30%),
    linear-gradient(145deg, #ffffff 0%, #f8fbff 100%);
}

.living-reader-top,
.living-directions-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.25rem;
  padding-bottom: 1.15rem;
  border-bottom: 1px solid rgba(148, 163, 184, .24);
}

.living-reader-top h2,
.living-directions-head h2 {
  margin: .15rem 0 .45rem;
  font-size: clamp(1.75rem, 3vw, 3.1rem);
  line-height: .95;
  letter-spacing: -.055em;
}

.living-reader-count {
  flex: 0 0 auto;
  padding: .65rem 1rem;
  border: 1px solid rgba(96, 165, 250, .42);
  border-radius: 999px;
  background: rgba(239, 246, 255, .92);
  color: var(--world-accent, #2563eb);
  font-weight: 900;
  box-shadow: 0 10px 24px rgba(37, 99, 235, .08);
}

.living-reader-rail {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .8rem;
  padding-top: 1rem;
}

.reader-nav-btn {
  width: 3.1rem;
  height: 3.1rem;
  border-radius: 999px;
  border: 1px solid rgba(96, 165, 250, .42);
  background: #fff;
  color: var(--world-accent, #2563eb);
  font-size: 1.35rem;
  font-weight: 900;
  box-shadow: 0 12px 26px rgba(37, 99, 235, .10);
  cursor: pointer;
}

.reader-nav-btn:disabled {
  opacity: .38;
  cursor: not-allowed;
  box-shadow: none;
}

.living-reader-book {
  min-width: 0;
  border: 1px solid rgba(191, 219, 254, .92);
  border-radius: 1.45rem;
  background: rgba(255, 255, 255, .86);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 18px 45px rgba(15, 23, 42, .06);
  padding: 1rem;
}

.living-reader-progress {
  height: .38rem;
  border-radius: 999px;
  background: rgba(226, 232, 240, .92);
  overflow: hidden;
  margin-bottom: 1rem;
}

.living-reader-progress span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--world-accent, #2563eb), #60a5fa);
  transition: width .25s ease;
}

.living-reader-pages {
  position: relative;
  min-height: 17rem;
}

.living-reader-page {
  display: none;
  min-height: 17rem;
  padding: clamp(1rem, 2.4vw, 2rem);
  border-radius: 1.25rem;
  background:
    radial-gradient(circle at 100% 100%, rgba(96, 165, 250, .12), transparent 36%),
    #fff;
  border: 1px solid rgba(226, 232, 240, .95);
}

.living-reader-page.is-active {
  display: block;
  animation: livingReaderFade .18s ease-out;
}

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

.reader-page-topline {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  color: #64748b;
  font-weight: 900;
  font-size: .88rem;
  margin-bottom: 1rem;
}

.reader-page-topline strong {
  color: var(--world-accent, #2563eb);
  background: rgba(239, 246, 255, .95);
  border: 1px solid rgba(191, 219, 254, .9);
  padding: .35rem .7rem;
  border-radius: 999px;
}

.reader-page-body {
  color: #0f172a;
  font-size: clamp(1.35rem, 2.2vw, 2.2rem);
  line-height: 1.18;
  letter-spacing: -.035em;
  font-weight: 900;
  margin: .4rem 0 1.35rem;
}

.reader-page-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  color: #64748b;
  font-weight: 800;
  margin-bottom: 1rem;
}

.reader-action-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  align-items: center;
  padding-top: 1rem;
  border-top: 1px dashed rgba(148, 163, 184, .38);
}

.reader-reply-toggle {
  box-shadow: 0 14px 34px rgba(37, 99, 235, .18);
}

.reader-inline-reply {
  display: none;
  margin-top: 1rem;
  border: 1px dashed rgba(96, 165, 250, .55);
  background: rgba(239, 246, 255, .58);
  border-radius: 1.15rem;
  padding: 1rem;
}

.reader-inline-reply.is-open {
  display: block;
}

.reader-inline-reply label {
  display: block;
  font-weight: 900;
  margin-bottom: .55rem;
  color: #0f172a;
}

.reader-inline-reply textarea {
  width: 100%;
  border-radius: 1rem;
  border: 1px solid rgba(191, 219, 254, .95);
  padding: .9rem 1rem;
  resize: vertical;
}

.reader-form-actions {
  display: flex;
  gap: .6rem;
  align-items: center;
  margin-top: .75rem;
}

.living-reader-controls {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: 1rem;
}

.living-reader-index {
  margin-top: 1rem;
  border: 1px solid rgba(191, 219, 254, .8);
  border-radius: 1rem;
  padding: .75rem 1rem;
  background: rgba(248, 250, 252, .88);
}

.living-reader-index summary {
  cursor: pointer;
  font-weight: 900;
  color: var(--world-accent, #2563eb);
}

.living-directions {
  margin-top: 1rem;
}

.living-directions-toolbar {
  display: flex;
  align-items: center;
  gap: .8rem;
  flex-wrap: wrap;
  margin: 1rem 0;
}

.living-directions-toolbar input[type="search"] {
  flex: 1 1 18rem;
  min-height: 3.1rem;
  border-radius: 999px;
  border: 1px solid rgba(191, 219, 254, .95);
  padding: 0 1.1rem;
  background: #fff;
}

.living-direction-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
  gap: 1rem;
}

.living-direction-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .9rem;
  align-items: start;
  border: 1px solid rgba(191, 219, 254, .95);
  border-radius: 1.2rem;
  background: rgba(255,255,255,.9);
  padding: 1rem;
  box-shadow: 0 18px 40px rgba(15, 23, 42, .05);
}

.direction-signal {
  width: 2.5rem;
  display: grid;
  justify-items: center;
  gap: .18rem;
}

.direction-signal span,
.direction-signal b {
  width: 1.15rem;
  height: 1.15rem;
  border-radius: 999px;
  background: #dbeafe;
  border: 1px solid #bfdbfe;
}

.direction-signal i {
  width: 2px;
  height: 2.4rem;
  background: linear-gradient(#93c5fd, transparent);
  display: block;
}

.direction-copy {
  min-width: 0;
}

.branch-choice-preview {
  color: #0f172a;
  font-size: 1.05rem;
  line-height: 1.35;
  margin: .5rem 0 .7rem;
}

.living-direction-card .branch-enter-button {
  grid-column: 1 / -1;
  justify-self: end;
}

.living-empty-direction {
  margin-top: 1rem;
}

.path-current-compact,
.path-quick-branch-card {
  display: none !important;
}

/* Make old path grids less dominant when old classes appear beside the new reader */
.path-branch-workspace .branch-choice-grid--realm {
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}

@media (max-width: 820px) {
  .living-reader-top,
  .living-directions-head {
    flex-direction: column;
  }

  .living-reader-rail {
    grid-template-columns: 1fr;
  }

  .reader-nav-btn {
    display: none;
  }

  .living-reader-page,
  .living-reader-pages {
    min-height: 14rem;
  }

  .reader-page-body {
    font-size: 1.35rem;
  }

  .living-direction-list {
    grid-template-columns: 1fr;
  }
}

/* Trejji Trail Reader v3: single, book-like conversation reader */
.path-reader-hero { margin-bottom: 1rem; }
.compact-path-hero { align-items: center; }
.path-reader-layout { align-items: start; }
.trail-source-card { margin-bottom: 1rem; }
.trail-reader-suite {
  padding: 0;
  overflow: hidden;
  border-color: rgba(96, 165, 250, .32);
  background:
    radial-gradient(circle at 0% 0%, rgba(96,165,250,.12), transparent 28%),
    linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
}
.trail-reader-header {
  display:flex;
  justify-content:space-between;
  gap:1.5rem;
  align-items:flex-start;
  padding: clamp(1.2rem, 3vw, 2rem);
  border-bottom: 1px solid rgba(148, 163, 184, .22);
}
.trail-reader-header h2 {
  margin:.15rem 0 .45rem;
  font-size: clamp(2rem, 4vw, 4.1rem);
  line-height:.9;
  letter-spacing:-.065em;
}
.trail-reader-position {
  flex:0 0 auto;
  display:flex;
  gap:.25rem;
  align-items:center;
  padding:.7rem 1rem;
  border:1px solid rgba(96,165,250,.42);
  border-radius:999px;
  color: var(--world-accent, #2563eb);
  background:rgba(239,246,255,.92);
  font-weight:1000;
  box-shadow:0 14px 34px rgba(37,99,235,.08);
}
.trail-reader-position em { font-style:normal; opacity:.65; }
.trail-reader-body {
  display:grid;
  grid-template-columns: minmax(13rem, .72fr) minmax(0, 1.65fr);
  gap:1rem;
  padding: clamp(1rem, 2vw, 1.4rem);
}
.trail-map-panel,
.trail-book-panel {
  min-width:0;
}
.trail-mini-map,
.trail-book-panel,
.trail-direction-dock {
  border:1px solid rgba(191,219,254,.9);
  border-radius:1.35rem;
  background:rgba(255,255,255,.86);
  box-shadow:0 18px 46px rgba(15,23,42,.055);
}
.trail-mini-map { padding:1rem; position:sticky; top:5.5rem; }
.trail-map-title { display:flex; justify-content:space-between; gap:.75rem; align-items:center; margin-bottom:.85rem; }
.trail-map-title span { color:var(--world-accent,#2563eb); font-weight:1000; background:rgba(239,246,255,.95); border-radius:999px; padding:.35rem .7rem; }
.trail-map-title strong { color:#64748b; font-weight:1000; }
.trail-map-window { display:grid; gap:.55rem; max-height:25rem; overflow:auto; padding-right:.2rem; }
.trail-map-step {
  display:grid;
  grid-template-columns:2rem 1fr;
  align-items:center;
  gap:.7rem;
  width:100%;
  text-align:left;
  border:1px solid rgba(203,213,225,.8);
  background:#fff;
  border-radius:999px;
  padding:.45rem .65rem;
  cursor:pointer;
  color:#0f172a;
  transition:.16s ease;
}
.trail-map-step span { display:grid; place-items:center; width:1.65rem; height:1.65rem; border-radius:999px; background:#eff6ff; color:#2563eb; font-weight:1000; }
.trail-map-step em { font-style:normal; font-weight:900; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.trail-map-step.is-current,
.trail-map-step:hover { border-color:rgba(96,165,250,.75); background:rgba(239,246,255,.95); transform:translateX(2px); }
.trail-full-index { margin-top:.8rem; padding-top:.8rem; border-top:1px dashed rgba(148,163,184,.32); }
.trail-full-index summary { color:var(--world-accent,#2563eb); cursor:pointer; font-weight:1000; }
.trail-book-panel { padding:1rem; }
.trail-reader-progress { height:.42rem; border-radius:999px; background:#e2e8f0; overflow:hidden; margin-bottom:1rem; }
.trail-reader-progress span { display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--world-accent,#2563eb),#60a5fa); transition:width .2s ease; }
.trail-pages { position:relative; min-height:24rem; }
.trail-page { display:none; min-height:24rem; padding:clamp(1.1rem,2.5vw,2.2rem); border:1px solid rgba(226,232,240,.95); border-radius:1.2rem; background:radial-gradient(circle at 100% 100%,rgba(96,165,250,.13),transparent 34%),#fff; }
.trail-page.is-active { display:block; animation:trailPageIn .18s ease-out; }
@keyframes trailPageIn { from{opacity:0; transform:translateY(5px)} to{opacity:1; transform:none} }
.trail-page-labels { display:flex; justify-content:space-between; gap:1rem; color:#64748b; font-size:.88rem; font-weight:1000; margin-bottom:1.2rem; }
.trail-page-labels strong { color:var(--world-accent,#2563eb); background:#eff6ff; border:1px solid #bfdbfe; padding:.35rem .75rem; border-radius:999px; }
.trail-page-text { font-size:clamp(1.55rem,3vw,3rem); line-height:1.05; letter-spacing:-.055em; font-weight:1000; color:#0f172a; margin:.4rem 0 1.3rem; }
.trail-page-meta { display:flex; flex-wrap:wrap; gap:.35rem; align-items:center; color:#64748b; font-weight:850; margin-bottom:1rem; }
.trail-reader-actions { display:flex; align-items:center; flex-wrap:wrap; gap:.65rem; padding-top:1rem; border-top:1px dashed rgba(148,163,184,.36); }
.trail-reader-actions [data-reader-prev]:disabled,
.trail-reader-actions [data-reader-next]:disabled,
.trail-reader-footer [data-reader-prev]:disabled,
.trail-reader-footer [data-reader-next]:disabled { opacity:.42; cursor:not-allowed; box-shadow:none; }
.trail-reader-footer { display:flex; justify-content:center; gap:.6rem; flex-wrap:wrap; padding:0 1.4rem 1.35rem; }
.reader-inline-reply { margin-top:1rem; border:1px dashed rgba(96,165,250,.58); background:rgba(239,246,255,.64); border-radius:1.15rem; padding:1rem; }
.reader-branch-form-v3 { display:block; }
.reader-branch-form-v3 label { display:block; font-weight:1000; margin-bottom:.55rem; }
.reader-branch-form-v3 textarea { width:100%; border:1px solid #bfdbfe; border-radius:1rem; padding:1rem; background:#fff; font:inherit; resize:vertical; }
.trail-direction-dock { margin:0 1.4rem 1.4rem; padding:clamp(1rem,2.4vw,1.6rem); }
.direction-dock-head { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; border-bottom:1px solid rgba(148,163,184,.22); padding-bottom:1rem; margin-bottom:1rem; }
.direction-dock-head h2 { font-size:clamp(1.65rem,3vw,3rem); line-height:.98; letter-spacing:-.055em; margin:.15rem 0 .4rem; }
.direction-tools-row { display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; margin-bottom:1rem; }
.direction-tools-row input[type="search"] { flex:1 1 18rem; min-height:3.1rem; border-radius:999px; border:1px solid #bfdbfe; padding:0 1.1rem; background:#fff; }
.direction-step-group { display:none; }
.direction-step-group.is-active { display:block; }
.trail-direction-card { position:relative; overflow:hidden; }
.trail-direction-card:before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:linear-gradient(var(--world-accent,#2563eb),#93c5fd); opacity:.55; }
.trail-direction-card .branch-enter-button { align-self:end; }
.reader-index-list { max-height:22rem; overflow:auto; }
.trail-reader-sidebar { position:sticky; top:5.5rem; }
@media (max-width: 980px) {
  .trail-reader-body { grid-template-columns:1fr; }
  .trail-mini-map { position:static; }
  .trail-map-window { max-height:15rem; }
  .direction-dock-head, .trail-reader-header { flex-direction:column; }
  .trail-page-text { font-size:1.65rem; }
}
@media (max-width: 720px) {
  .trail-reader-actions .button, .trail-reader-footer .button, .trail-reader-footer .mini-button { width:100%; justify-content:center; }
  .trail-direction-dock { margin:0 1rem 1rem; }
  .trail-pages, .trail-page { min-height:auto; }
}

/* Trejji Path Reader v4: book-style forward/back/branch UI */
.reader-v4-hero { margin-bottom: 1rem; }
.reader-v4-titlecard { display:flex; justify-content:space-between; align-items:flex-end; gap:1rem; padding:1.35rem; border:1px solid rgba(147,197,253,.55); border-radius:28px; background:linear-gradient(135deg,#fff,#f3f8ff); box-shadow:0 24px 60px rgba(15,23,42,.08); }
.reader-v4-titlecard h1 { margin:.15rem 0 .35rem; letter-spacing:-.045em; line-height:.95; }
.reader-v4-layout { align-items:start; }
.reader-v4-shell { overflow:hidden; padding:0; border-radius:30px; background:linear-gradient(145deg,#fff,#f6faff); }
.reader-v4-head { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; padding:1.35rem 1.5rem 1rem; }
.reader-v4-head h2 { margin:0; font-size:clamp(2.1rem,4.8vw,4.8rem); line-height:.9; letter-spacing:-.065em; }
.reader-v4-count { font-weight:900; color:var(--world-accent,#2563eb); border:1px solid rgba(37,99,235,.24); background:#eef6ff; border-radius:999px; padding:.65rem 1rem; white-space:nowrap; }
.reader-v4-progress { height:.42rem; background:#e5edf8; overflow:hidden; margin:0 1.5rem 1rem; border-radius:999px; }
.reader-v4-progress span { display:block; height:100%; width:0; border-radius:inherit; background:linear-gradient(90deg,var(--world-accent,#2563eb),#7dd3fc); transition:width .2s ease; }
.reader-v4-rail { display:flex; gap:.55rem; overflow-x:auto; padding:.25rem 1.5rem 1.1rem; scrollbar-width:thin; }
.reader-v4-rail-step { display:none; align-items:center; gap:.45rem; min-width:max-content; max-width:280px; border:1px solid rgba(148,163,184,.28); background:#f8fbff; border-radius:999px; padding:.45rem .75rem; font-weight:900; cursor:pointer; color:#0f172a; }
.reader-v4-rail-step.is-near, .reader-v4-rail-step.is-current { display:flex; }
.reader-v4-rail-step span { display:grid; place-items:center; width:1.55rem; height:1.55rem; border-radius:999px; background:#fff; color:var(--world-accent,#2563eb); border:1px solid rgba(37,99,235,.18); }
.reader-v4-rail-step em { font-style:normal; overflow:hidden; text-overflow:ellipsis; }
.reader-v4-rail-step.is-current { background:#eaf3ff; border-color:rgba(37,99,235,.42); box-shadow:0 12px 25px rgba(37,99,235,.12); }
.reader-v4-index { margin:0 1.5rem 1rem; }
.reader-v4-index summary { cursor:pointer; font-weight:900; color:var(--world-accent,#2563eb); }
.reader-v4-index-grid { display:grid; gap:.5rem; margin-top:.75rem; max-height:320px; overflow:auto; }
.reader-v4-index-row { display:flex; align-items:center; gap:.55rem; text-align:left; border:1px solid rgba(148,163,184,.22); background:#fff; border-radius:14px; padding:.6rem .75rem; cursor:pointer; }
.reader-v4-index-row span { font-weight:900; color:var(--world-accent,#2563eb); }
.reader-v4-index-row em { font-style:normal; }
.reader-v4-stage { position:relative; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:1rem; padding:0 1.2rem 1rem; }
.reader-v4-side { width:3rem; height:3rem; border-radius:999px; border:1px solid rgba(147,197,253,.65); background:#f8fbff; color:var(--world-accent,#2563eb); font-size:1.35rem; font-weight:900; cursor:pointer; box-shadow:0 18px 35px rgba(15,23,42,.06); }
.reader-v4-side:disabled { opacity:.35; cursor:not-allowed; }
.reader-v4-pages { min-height:260px; display:grid; }
.reader-v4-page { display:none; grid-area:1/1; margin:auto; width:min(100%,720px); border:1px solid rgba(147,197,253,.68); border-radius:28px; background:linear-gradient(145deg,#fff,#f4f8ff); padding:1.6rem; box-shadow:0 30px 80px rgba(37,99,235,.12); }
.reader-v4-page.is-active { display:block; animation:readerV4In .18s ease-out; }
@keyframes readerV4In { from { opacity:0; transform:translateY(8px) scale(.99); } to { opacity:1; transform:none; } }
.reader-v4-page-top { display:flex; justify-content:space-between; gap:1rem; align-items:center; color:#64748b; font-weight:900; font-size:.92rem; }
.reader-v4-page-top strong { color:var(--world-accent,#2563eb); background:#eaf3ff; border-radius:999px; padding:.35rem .65rem; }
.reader-v4-page-body { font-size:clamp(1.4rem,2.4vw,2.35rem); line-height:1.12; letter-spacing:-.04em; font-weight:950; color:#0f172a; margin:1.4rem 0; }
.reader-v4-page-meta { display:flex; gap:.45rem; flex-wrap:wrap; color:#64748b; font-weight:800; border-top:1px dashed rgba(148,163,184,.42); padding-top:1rem; }
.reader-v4-step-signal { margin-top:1rem; display:flex; flex-wrap:wrap; gap:.5rem; }
.reader-v4-step-signal span { border:1px solid rgba(147,197,253,.55); background:#f8fbff; color:#47617f; border-radius:999px; padding:.4rem .7rem; font-weight:850; }
.reader-v4-actions { display:flex; justify-content:center; gap:.65rem; flex-wrap:wrap; padding:1rem 1.5rem 1.25rem; border-top:1px solid rgba(148,163,184,.18); }
.reader-v4-actions button:disabled { opacity:.4; cursor:not-allowed; box-shadow:none; }
.reader-v4-respond { box-shadow:0 18px 38px rgba(37,99,235,.22); }
.reader-v4-composers { padding:0 1.5rem 1.4rem; }
.reader-v4-composer { display:none; grid-template-columns:minmax(170px,.75fr) 1.25fr; gap:1rem; align-items:start; border:1px dashed rgba(37,99,235,.28); background:#f8fbff; border-radius:24px; padding:1rem; }
.reader-v4-composer.is-active { display:grid; }
.reader-v4-composer.is-open { border-style:solid; box-shadow:0 20px 50px rgba(37,99,235,.1); }
.reader-v4-composer h3 { margin:.15rem 0 .35rem; }
.reader-v4-form { display:grid; gap:.75rem; }
.reader-v4-form textarea { width:100%; border:1px solid rgba(147,197,253,.72); border-radius:18px; padding:1rem; background:#fff; font:inherit; resize:vertical; }
.reader-v4-branches { border-top:1px solid rgba(148,163,184,.22); padding:1.35rem 1.5rem 1.6rem; background:linear-gradient(180deg,rgba(239,246,255,.6),rgba(255,255,255,.4)); }
.reader-v4-branches-head { display:flex; justify-content:space-between; gap:1rem; align-items:flex-end; margin-bottom:1rem; }
.reader-v4-branches-head h2 { margin:.2rem 0 .3rem; font-size:clamp(1.7rem,3vw,3rem); letter-spacing:-.05em; line-height:.95; }
.reader-v4-branch-group { display:none; }
.reader-v4-branch-group.is-active { display:block; }
.reader-v4-branch-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.85rem; }
.reader-v4-branch-card { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.8rem; text-decoration:none; color:#0f172a; border:1px solid rgba(147,197,253,.58); background:#fff; border-radius:22px; padding:.9rem; box-shadow:0 14px 34px rgba(15,23,42,.05); transition:.16s ease; }
.reader-v4-branch-card:hover { transform:translateY(-2px); box-shadow:0 22px 45px rgba(37,99,235,.12); }
.reader-v4-branch-icon { display:grid; place-items:center; width:2.5rem; height:2.5rem; border-radius:16px; background:#eaf3ff; color:var(--world-accent,#2563eb); font-weight:950; border:1px solid rgba(37,99,235,.18); }
.reader-v4-branch-copy { display:grid; gap:.2rem; }
.reader-v4-branch-copy strong { font-size:1.05rem; line-height:1.12; }
.reader-v4-branch-copy em { font-style:normal; color:#64748b; font-weight:800; }
.reader-v4-branch-card b { color:var(--world-accent,#2563eb); white-space:nowrap; }
.reader-v4-empty-branches { border:1px dashed rgba(37,99,235,.28); background:#fff; border-radius:22px; padding:1rem; display:grid; gap:.25rem; }
.reader-v4-empty-branches span { color:#64748b; }
.reader-v4-sidebar { position:sticky; top:5.5rem; }
@media (max-width: 980px) {
  .reader-v4-titlecard, .reader-v4-head, .reader-v4-branches-head { flex-direction:column; align-items:flex-start; }
  .reader-v4-stage { grid-template-columns:1fr; }
  .reader-v4-side { display:none; }
  .reader-v4-composer { grid-template-columns:1fr; }
  .reader-v4-branch-list { grid-template-columns:1fr; }
  .reader-v4-page-body { font-size:1.65rem; }
}

/* Trejji Living Trail Reader: one comprehensive book-like unit */
.path-reader-book-hero { width:min(100% - 2rem, 1280px); margin:1rem auto .5rem; }
.path-reader-book-layout {
  width:min(100% - 2rem, 1280px);
  margin:0 auto 3rem;
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:1.25rem;
  align-items:start;
}
.path-reader-book {
  border:1px solid rgba(147,197,253,.7);
  border-radius:34px;
  background:
    radial-gradient(circle at 6% 0%, color-mix(in srgb, var(--world-accent,#2563eb) 10%, transparent), transparent 34%),
    linear-gradient(145deg,#fff,#f7fbff);
  box-shadow:0 32px 90px rgba(15,23,42,.09);
  overflow:hidden;
}
.book-reader-top {
  display:flex;
  justify-content:space-between;
  gap:1.25rem;
  align-items:flex-start;
  padding:clamp(1.25rem,3vw,2.25rem) clamp(1.25rem,3vw,2.5rem) 1rem;
}
.book-reader-top h1 {
  margin:.2rem 0 .55rem;
  max-width:820px;
  font-size:clamp(2.6rem,6vw,6.4rem);
  line-height:.86;
  letter-spacing:-.078em;
}
.book-reader-count {
  display:flex;
  align-items:center;
  gap:.28rem;
  flex:0 0 auto;
  padding:.75rem 1rem;
  border:1px solid color-mix(in srgb, var(--world-accent,#2563eb) 30%, #dbeafe);
  border-radius:999px;
  background:#eff6ff;
  color:var(--world-accent,#2563eb);
  font-weight:1000;
  font-size:1.2rem;
  box-shadow:0 16px 40px rgba(37,99,235,.1);
}
.book-reader-count em { font-style:normal; opacity:.62; }
.book-progress { height:.45rem; margin:0 clamp(1.25rem,3vw,2.5rem) 1.05rem; background:#e5edf8; border-radius:999px; overflow:hidden; }
.book-progress span { display:block; height:100%; width:0; border-radius:inherit; background:linear-gradient(90deg,var(--world-accent,#2563eb),#7dd3fc); transition:width .18s ease; }
.book-step-rail {
  display:flex;
  align-items:center;
  gap:.55rem;
  padding:0 clamp(1.25rem,3vw,2.5rem) 1.2rem;
  overflow-x:auto;
  scrollbar-width:thin;
}
.book-rail-step {
  display:none;
  align-items:center;
  gap:.45rem;
  min-width:max-content;
  border:1px solid rgba(147,197,253,.55);
  border-radius:999px;
  background:rgba(255,255,255,.86);
  color:#0f172a;
  padding:.44rem .7rem;
  cursor:pointer;
  font-weight:950;
  box-shadow:0 8px 22px rgba(15,23,42,.035);
}
.book-rail-step.is-near,
.book-rail-step.is-current { display:flex; }
.book-rail-step span { display:grid; place-items:center; width:1.55rem; height:1.55rem; border-radius:999px; background:#eff6ff; color:var(--world-accent,#2563eb); border:1px solid rgba(147,197,253,.7); }
.book-rail-step em { font-style:normal; max-width:190px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.book-rail-step.is-current { background:#eaf3ff; transform:translateY(-1px); box-shadow:0 14px 34px rgba(37,99,235,.12); }
.book-stage {
  display:grid;
  grid-template-columns:3.35rem minmax(0,1fr) 3.35rem;
  gap:1rem;
  align-items:center;
  padding:0 clamp(1rem,2vw,1.5rem) 1.2rem;
}
.book-page-arrow {
  width:3.25rem;
  height:3.25rem;
  border-radius:999px;
  border:1px solid rgba(147,197,253,.75);
  background:#f8fbff;
  color:var(--world-accent,#2563eb);
  font-size:1.4rem;
  font-weight:1000;
  cursor:pointer;
  box-shadow:0 18px 38px rgba(15,23,42,.07);
}
.book-page-arrow:disabled { opacity:.28; cursor:not-allowed; box-shadow:none; }
.book-pages { min-height:28rem; display:grid; }
.book-page {
  grid-area:1/1;
  display:none;
  width:min(100%,780px);
  min-height:28rem;
  margin:auto;
  padding:clamp(1.35rem,3vw,2.4rem);
  border:1px solid rgba(147,197,253,.75);
  border-radius:30px;
  background:
    radial-gradient(circle at 100% 100%, color-mix(in srgb, var(--world-accent,#2563eb) 12%, transparent), transparent 34%),
    #fff;
  box-shadow:0 34px 90px rgba(37,99,235,.12);
}
.book-page.is-active { display:block; animation:bookPageIn .16s ease-out; }
@keyframes bookPageIn { from{opacity:0; transform:translateY(8px) scale(.992)} to{opacity:1; transform:none} }
.book-page-labels { display:flex; justify-content:space-between; gap:1rem; align-items:center; color:#64748b; font-weight:950; margin-bottom:1.3rem; }
.book-page-labels strong { color:var(--world-accent,#2563eb); background:#eff6ff; border:1px solid #bfdbfe; border-radius:999px; padding:.38rem .7rem; }
.book-page-text {
  margin:0 0 1.45rem;
  color:#0f172a;
  font-size:clamp(1.9rem,4.5vw,4.25rem);
  line-height:.98;
  letter-spacing:-.07em;
  font-weight:1000;
}
.book-page-meta { display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; color:#64748b; font-weight:850; border-top:1px dashed rgba(148,163,184,.45); padding-top:1rem; }
.book-step-actions { display:flex; gap:.65rem; flex-wrap:wrap; align-items:center; margin-top:1.1rem; }
.book-step-actions .button,
.book-step-actions .mini-button { min-height:2.35rem; }
.branch-alert-button { background:linear-gradient(135deg,#2563eb,#60a5fa); }
.book-branch-alert {
  margin-top:1rem;
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:center;
  border:1px dashed color-mix(in srgb, var(--world-accent,#2563eb) 35%, #bfdbfe);
  border-radius:20px;
  padding:.9rem 1rem;
  background:color-mix(in srgb, var(--world-accent,#2563eb) 7%, #fff);
}
.book-branch-alert div { display:grid; gap:.15rem; }
.book-branch-alert span { color:#64748b; font-weight:750; }
.book-reader-bar {
  position:sticky;
  bottom:0;
  z-index:6;
  display:flex;
  justify-content:center;
  gap:.65rem;
  flex-wrap:wrap;
  padding:1rem 1.2rem;
  background:rgba(255,255,255,.88);
  border-top:1px solid rgba(148,163,184,.22);
  backdrop-filter:blur(14px);
}
.book-reader-bar button:disabled { opacity:.38; cursor:not-allowed; box-shadow:none; }
.book-reply-drawer,
.book-branch-drawer {
  margin:0 clamp(1rem,2vw,1.5rem) 1.4rem;
  border:1px solid rgba(147,197,253,.72);
  border-radius:28px;
  background:linear-gradient(145deg,#fff,#f6faff);
  box-shadow:0 24px 60px rgba(37,99,235,.1);
  padding:clamp(1rem,2.4vw,1.5rem);
}
.book-reply-drawer[hidden], .book-branch-drawer[hidden] { display:none; }
.book-drawer-head { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; border-bottom:1px solid rgba(148,163,184,.22); padding-bottom:1rem; margin-bottom:1rem; }
.book-drawer-head h2 { margin:.15rem 0 .3rem; font-size:clamp(1.55rem,3vw,2.7rem); letter-spacing:-.05em; line-height:.95; }
.book-reply-panel,
.book-branch-panel { display:none; }
.book-reply-panel.is-active,
.book-branch-panel.is-active { display:block; }
.book-reply-form { display:grid; gap:.8rem; }
.book-reply-form textarea { width:100%; min-height:9rem; border:1px solid rgba(147,197,253,.75); border-radius:20px; padding:1rem; background:#fff; font:inherit; resize:vertical; }
.book-branch-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.85rem; }
.book-branch-choice {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:.8rem;
  align-items:center;
  text-decoration:none;
  color:#0f172a;
  border:1px solid rgba(147,197,253,.65);
  border-radius:22px;
  background:#fff;
  padding:.95rem;
  box-shadow:0 14px 36px rgba(15,23,42,.055);
  transition:.16s ease;
}
.book-branch-choice:hover { transform:translateY(-2px); box-shadow:0 22px 46px rgba(37,99,235,.12); }
.book-branch-mark { display:grid; place-items:center; width:2.5rem; height:2.5rem; border-radius:16px; background:#eff6ff; color:var(--world-accent,#2563eb); border:1px solid rgba(147,197,253,.75); font-weight:1000; }
.book-branch-choice span:not(.book-branch-mark) { display:grid; gap:.18rem; min-width:0; }
.book-branch-choice strong { font-size:1.05rem; line-height:1.12; }
.book-branch-choice em { font-style:normal; color:#64748b; font-weight:850; }
.book-branch-choice b { color:var(--world-accent,#2563eb); white-space:nowrap; }
.book-empty-branches { border:1px dashed rgba(147,197,253,.7); background:#fff; border-radius:22px; padding:1rem; display:grid; gap:.2rem; }
.book-empty-branches span { color:#64748b; }
.path-reader-book-side { position:sticky; top:5.25rem; display:grid; gap:1rem; }
.book-reader-help p { color:#64748b; line-height:1.45; margin:.4rem 0 0; }
@media (max-width:1050px) {
  .path-reader-book-layout { grid-template-columns:1fr; }
  .path-reader-book-side { position:static; }
}
@media (max-width:780px) {
  .book-reader-top, .book-drawer-head, .book-branch-alert { flex-direction:column; align-items:flex-start; }
  .book-stage { grid-template-columns:1fr; }
  .book-page-arrow { display:none; }
  .book-pages, .book-page { min-height:auto; }
  .book-branch-grid { grid-template-columns:1fr; }
  .book-reader-bar .button, .book-reader-bar .mini-button { width:100%; justify-content:center; }
  .book-page-text { font-size:2rem; }
}

/* Trejji Living Trail Reader v6: reading-first, response-always-available */
.path-book-shell{width:min(100% - 2rem,1180px);margin:1rem auto 3rem;--reader-border:rgba(147,197,253,.72)}
.path-book-breadcrumb{margin:.25rem 0 1rem;font-size:.95rem;font-weight:900;color:#64748b}
.path-book-reader{border:1px solid var(--reader-border);border-radius:30px;background:linear-gradient(145deg,#fff,#f7fbff);box-shadow:0 30px 85px rgba(15,23,42,.08);overflow:hidden}
.path-book-header{display:flex;justify-content:space-between;gap:1.5rem;align-items:flex-start;padding:2rem 2rem 1rem;background:radial-gradient(circle at 0 0,color-mix(in srgb,var(--world-accent,#2563eb) 9%,transparent),transparent 36%)}
.path-book-header h1{margin:.25rem 0 .5rem;font-size:clamp(2.35rem,5vw,4.6rem);line-height:.95;letter-spacing:-.065em;color:#111827}
.path-book-header .muted{max-width:760px;font-size:1.05rem;line-height:1.35}
.path-book-count{display:flex;align-items:center;gap:.25rem;border:1px solid color-mix(in srgb,var(--world-accent,#2563eb) 35%,#bfdbfe);border-radius:999px;background:#eff6ff;color:var(--world-accent,#2563eb);font-size:1.05rem;font-weight:1000;padding:.7rem 1rem;white-space:nowrap}
.path-book-count em{font-style:normal;opacity:.55}.path-book-progress{height:.35rem;background:#e5edf8;margin:0 2rem 1rem;border-radius:999px;overflow:hidden}.path-book-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--world-accent,#2563eb),#7dd3fc);border-radius:inherit;transition:width .15s ease}
.path-book-rail{display:flex;gap:.55rem;align-items:center;overflow-x:auto;padding:0 2rem 1rem;scrollbar-width:thin}.path-rail-step{display:none;align-items:center;gap:.45rem;border:1px solid rgba(147,197,253,.65);background:#fff;border-radius:999px;padding:.45rem .7rem;font-weight:1000;cursor:pointer;box-shadow:0 10px 28px rgba(15,23,42,.04)}.path-rail-step.is-near,.path-rail-step.is-current{display:flex}.path-rail-step span{display:grid;place-items:center;width:1.55rem;height:1.55rem;border-radius:999px;background:#eff6ff;color:var(--world-accent,#2563eb);border:1px solid rgba(147,197,253,.75)}.path-rail-step em{font-style:normal;max-width:210px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.path-rail-step.is-current{background:#eaf3ff;box-shadow:0 12px 30px rgba(37,99,235,.12)}
.path-book-stage{display:grid;grid-template-columns:3rem minmax(0,1fr) 3rem;gap:1rem;align-items:center;padding:0 1.25rem 1.25rem}.path-page-arrow{width:2.85rem;height:2.85rem;border:1px solid rgba(147,197,253,.75);border-radius:999px;background:#fff;color:var(--world-accent,#2563eb);font-weight:1000;font-size:1.25rem;cursor:pointer;box-shadow:0 15px 34px rgba(15,23,42,.055)}.path-page-arrow:disabled{opacity:.3;cursor:not-allowed;box-shadow:none}.path-pages{display:grid;min-height:22rem}.path-page{grid-area:1/1;display:none;max-width:760px;width:100%;margin:auto;border:1px solid rgba(147,197,253,.75);border-radius:28px;background:#fff;padding:1.65rem;box-shadow:0 22px 60px rgba(37,99,235,.09)}.path-page.is-active{display:block;animation:pathPageIn .14s ease-out}@keyframes pathPageIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.path-page-topline{display:flex;justify-content:space-between;gap:1rem;align-items:center;color:#64748b;font-weight:950;margin-bottom:1.15rem}.path-page-topline strong{background:#eff6ff;border:1px solid #bfdbfe;color:var(--world-accent,#2563eb);border-radius:999px;padding:.35rem .65rem}.path-page-text{font-size:clamp(1.7rem,3.5vw,3.25rem);line-height:1.03;letter-spacing:-.055em;font-weight:1000;color:#0f172a;margin-bottom:1.2rem}.path-page-meta{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap;border-top:1px dashed rgba(148,163,184,.45);padding-top:.9rem;color:#64748b;font-weight:850}.path-page-signal{display:flex;gap:.55rem;flex-wrap:wrap;margin-top:1rem}.path-signal-chip{display:inline-flex;align-items:center;gap:.25rem;border:1px solid rgba(147,197,253,.75);border-radius:999px;background:#eff6ff;color:#2563eb;font-weight:950;padding:.4rem .7rem}.path-signal-chip.quiet{color:#64748b;background:#f8fafc}.path-signal-button{cursor:pointer}.path-page-delete{margin-top:.9rem}.path-reader-controls{display:flex;justify-content:center;gap:.65rem;flex-wrap:wrap;padding:1rem;border-top:1px solid rgba(148,163,184,.22);background:rgba(255,255,255,.78);backdrop-filter:blur(12px);position:sticky;bottom:0;z-index:5}.path-reader-controls button:disabled{opacity:.38;cursor:not-allowed;box-shadow:none}
.path-response-panel{display:grid;grid-template-columns:minmax(220px,.42fr) minmax(0,1fr);gap:1.2rem;border-top:1px solid rgba(148,163,184,.22);padding:1.35rem 2rem;background:linear-gradient(135deg,#f8fbff,#fff)}.path-response-copy h2{font-size:clamp(1.45rem,2.3vw,2.4rem);line-height:1;letter-spacing:-.045em;margin:.2rem 0 .45rem}.path-response-form{display:grid;gap:.8rem}.path-response-form textarea{width:100%;min-height:8.5rem;border:1px solid rgba(147,197,253,.78);border-radius:22px;background:#fff;padding:1rem;font:inherit;resize:vertical;box-shadow:inset 0 1px 0 rgba(255,255,255,.85)}.path-login-card{border:1px dashed rgba(147,197,253,.75);border-radius:20px;background:#fff;padding:1rem;font-weight:900}
.path-branch-panel{border-top:1px solid rgba(148,163,184,.22);padding:1.35rem 2rem 1.6rem;background:#fff}.path-branch-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-end;margin-bottom:1rem}.path-branch-head h2{font-size:clamp(1.45rem,2.4vw,2.55rem);line-height:.98;letter-spacing:-.05em;margin:.2rem 0 .35rem}.path-branch-tools input{min-width:min(320px,70vw);border:1px solid rgba(147,197,253,.75);border-radius:999px;padding:.8rem 1rem;background:#fff}.path-branch-list{display:none}.path-branch-list.is-active{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.path-branch-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.75rem;align-items:center;border:1px solid rgba(147,197,253,.7);border-radius:20px;background:#f8fbff;text-decoration:none;color:#0f172a;padding:.9rem;transition:.15s ease}.path-branch-row:hover{transform:translateY(-1px);box-shadow:0 16px 36px rgba(37,99,235,.1)}.path-branch-icon{display:grid;place-items:center;width:2.35rem;height:2.35rem;border-radius:15px;background:#eff6ff;border:1px solid rgba(147,197,253,.8);color:var(--world-accent,#2563eb);font-weight:1000}.path-branch-main{display:grid;gap:.2rem;min-width:0}.path-branch-main strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1rem}.path-branch-main em{font-style:normal;color:#64748b;font-weight:850}.path-branch-row b{color:var(--world-accent,#2563eb);white-space:nowrap}.path-empty-branches{grid-column:1/-1;border:1px dashed rgba(147,197,253,.7);border-radius:20px;background:#f8fbff;padding:1rem;display:grid;gap:.25rem}.path-empty-branches span{color:#64748b}.path-starting-panel{padding:0 2rem 1.5rem;background:#fff}.path-starting-panel details{border-top:1px solid rgba(148,163,184,.22);padding-top:1rem}.path-starting-panel summary{cursor:pointer;color:var(--world-accent,#2563eb);font-weight:1000}.path-starting-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin-top:.85rem}.path-starting-grid a{border:1px solid rgba(147,197,253,.65);border-radius:18px;background:#f8fbff;text-decoration:none;color:#0f172a;padding:.8rem;display:grid;gap:.2rem}.path-starting-grid a.active{background:#eaf3ff}.path-starting-grid span{color:#64748b;font-weight:850}
@media(max-width:860px){.path-book-header,.path-branch-head{flex-direction:column;align-items:flex-start}.path-book-stage{grid-template-columns:1fr}.path-page-arrow{display:none}.path-response-panel{grid-template-columns:1fr;padding:1.1rem}.path-branch-panel{padding:1.1rem}.path-branch-list.is-active,.path-starting-grid{grid-template-columns:1fr}.path-book-header{padding:1.35rem}.path-book-progress{margin-left:1.35rem;margin-right:1.35rem}.path-book-rail{padding-left:1.35rem;padding-right:1.35rem}.path-page-text{font-size:2rem}}

/* Trejji Living Trail Reader v7: compact, single-unit book reader */
.trail-book-shell {
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 18px 48px;
}
.trail-book-breadcrumb { margin: 0 0 12px; font-weight: 900; }
.trail-reader {
  border: 1px solid var(--line);
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(245,249,255,.92));
  box-shadow: 0 24px 70px rgba(15, 23, 42, .08);
  overflow: hidden;
}
.trail-reader-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px 26px 14px;
  border-bottom: 1px solid var(--line);
}
.trail-reader-topbar h1 {
  margin: 4px 0 0;
  font-size: clamp(1.8rem, 3.3vw, 3.1rem);
  line-height: .98;
  letter-spacing: -.055em;
  color: var(--text);
}
.trail-page-pill {
  flex: 0 0 auto;
  border: 1px solid color-mix(in srgb, var(--world-accent, var(--accent)) 38%, var(--line));
  color: var(--accent);
  background: rgba(255,255,255,.78);
  border-radius: 999px;
  padding: 11px 16px;
  font-weight: 1000;
  font-size: 1.05rem;
}
.trail-progress { height: 5px; background: #e8eef8; }
.trail-progress span { display:block; width:0; height:100%; background: linear-gradient(90deg, var(--world-accent, var(--accent)), #6fd6ff); transition: width .18s ease; }
.trail-reader-grid {
  display: grid;
  grid-template-columns: 270px minmax(0, 1fr);
  min-height: 520px;
}
.trail-sidebar {
  border-right: 1px solid var(--line);
  background: rgba(239,246,255,.56);
  padding: 18px;
}
.trail-sidebar-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom: 12px;
  color: var(--text);
}
.trail-sidebar-head span { color: var(--muted); font-weight:900; }
.trail-step-list { display:grid; gap:9px; }
.trail-step-link {
  display:grid;
  grid-template-columns: 34px 1fr auto;
  gap: 9px;
  align-items:center;
  width:100%;
  padding: 9px 10px;
  text-align:left;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  color:var(--text);
  cursor:pointer;
}
.trail-step-link span {
  display:grid; place-items:center;
  width:28px; height:28px;
  border-radius:999px;
  background:var(--panel-2);
  border:1px solid var(--line);
  color:var(--accent);
  font-weight:1000;
}
.trail-step-link em {
  min-width:0;
  font-style:normal;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-weight:1000;
}
.trail-step-link b {
  display:grid; place-items:center;
  min-width:24px; height:24px;
  border-radius:999px;
  background: color-mix(in srgb, var(--world-accent, var(--accent)) 12%, white);
  color: var(--accent);
  font-size:.8rem;
}
.trail-step-link.is-current {
  border-color: color-mix(in srgb, var(--world-accent, var(--accent)) 58%, var(--line));
  background: color-mix(in srgb, var(--world-accent, var(--accent)) 10%, white);
  box-shadow: 0 10px 24px rgba(37,99,235,.08);
}
.trail-step-link.is-hidden-gap { display:none; }
.trail-starts { margin-top:14px; padding-top:12px; border-top:1px solid var(--line); }
.trail-starts summary { cursor:pointer; color:var(--accent); font-weight:1000; }
.trail-starts div { display:grid; gap:8px; margin-top:10px; }
.trail-starts a { padding:8px 10px; border:1px solid var(--line); border-radius:12px; background:#fff; font-weight:900; }
.trail-starts a.active { background:var(--panel-2); }
.trail-reading-pane { padding: 18px; }
.trail-page-stage {
  position:relative;
  display:grid;
  grid-template-columns: 42px minmax(0,1fr) 42px;
  gap:12px;
  align-items:center;
}
.trail-nav-side {
  width:42px; height:42px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--accent);
  font-weight:1000;
  cursor:pointer;
}
.trail-nav-side:disabled { opacity:.35; cursor:not-allowed; }
.trail-pages { min-height: 260px; display:grid; align-items:center; }
.trail-page {
  display:none;
  border:1px solid color-mix(in srgb, var(--world-accent, var(--accent)) 35%, var(--line));
  border-radius:24px;
  background:rgba(255,255,255,.86);
  padding:24px 26px;
  box-shadow:0 18px 50px rgba(15,23,42,.06);
}
.trail-page.is-active { display:block; }
.trail-page-meta-top { display:flex; justify-content:space-between; align-items:center; gap:12px; color:var(--muted); font-weight:1000; margin-bottom:16px; }
.trail-page-meta-top strong { color:var(--accent); background:var(--panel-2); border:1px solid var(--line); border-radius:999px; padding:7px 12px; }
.trail-page-body {
  font-size: clamp(1.45rem, 2.6vw, 2.55rem);
  line-height:1.12;
  letter-spacing:-.04em;
  color:var(--text);
  font-weight:1000;
  margin-bottom:18px;
}
.trail-page-author { display:flex; gap:8px; flex-wrap:wrap; color:var(--muted); font-weight:900; border-top:1px dashed var(--line); padding-top:14px; }
.trail-page-signals { margin-top:14px; display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.trail-page-signals span,
.trail-page-signals button {
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--panel-2);
  color:var(--accent);
  padding:7px 11px;
  font-weight:1000;
  font:inherit;
}
.trail-page-signals button { cursor:pointer; }
.trail-delete-form { margin-top:10px; }
.trail-controls {
  display:flex;
  justify-content:center;
  gap:9px;
  flex-wrap:wrap;
  padding:14px 0 16px;
  border-bottom:1px solid var(--line);
}
.trail-controls button:disabled { opacity:.45; cursor:not-allowed; transform:none; }
.trail-response-card {
  display:grid;
  grid-template-columns: minmax(190px, 260px) 1fr;
  gap:18px;
  align-items:start;
  padding:18px 6px 10px;
}
.trail-response-card h2 { margin:4px 0 8px; font-size:1.65rem; line-height:1.05; letter-spacing:-.04em; }
.trail-response-form { display:grid; gap:10px; }
.trail-response-form textarea {
  width:100%;
  min-height:92px;
  border:1px solid color-mix(in srgb, var(--world-accent, var(--accent)) 30%, var(--line));
  border-radius:18px;
  background:#fff;
  padding:14px 16px;
  resize:vertical;
  font:inherit;
}
.trail-login-card { border:1px dashed var(--line); border-radius:18px; padding:18px; background:#fff; font-weight:900; }
.trail-branch-drawer {
  margin-top:14px;
  border:1px solid color-mix(in srgb, var(--world-accent, var(--accent)) 34%, var(--line));
  border-radius:22px;
  background: rgba(246,250,255,.95);
  padding:18px;
}
.trail-branch-head { display:flex; justify-content:space-between; gap:12px; align-items:start; margin-bottom:12px; }
.trail-branch-head h2 { margin:3px 0 4px; font-size:1.5rem; letter-spacing:-.035em; }
.trail-branch-list { display:none; gap:10px; }
.trail-branch-list.is-active { display:grid; }
.trail-branch-option {
  display:grid;
  grid-template-columns:34px 1fr auto;
  gap:10px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  padding:10px 12px;
  color:var(--text);
}
.trail-branch-option span { display:grid; place-items:center; width:30px; height:30px; border-radius:999px; background:var(--panel-2); color:var(--accent); font-weight:1000; }
.trail-branch-option strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.trail-branch-option em { color:var(--muted); font-style:normal; font-weight:800; }
.trail-branch-option b { color:var(--accent); white-space:nowrap; }
.trail-empty-branches { border:1px dashed var(--line); border-radius:16px; padding:14px; color:var(--muted); font-weight:900; background:#fff; }

@media (max-width: 860px) {
  .trail-book-shell { padding:12px 10px 32px; }
  .trail-reader-topbar { padding:18px; align-items:flex-start; }
  .trail-reader-topbar h1 { font-size:2rem; }
  .trail-reader-grid { grid-template-columns:1fr; }
  .trail-sidebar { border-right:0; border-bottom:1px solid var(--line); }
  .trail-step-list { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .trail-reading-pane { padding:12px; }
  .trail-page-stage { grid-template-columns:1fr; }
  .trail-nav-side { display:none; }
  .trail-pages { min-height:auto; }
  .trail-page { padding:18px; }
  .trail-page-body { font-size:1.65rem; }
  .trail-response-card { grid-template-columns:1fr; }
  .trail-branch-option { grid-template-columns:34px 1fr; }
  .trail-branch-option b { grid-column:2; }
}

/* Living Trail Reader: branch drawer navigation */
.trail-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: rgba(15, 23, 42, .24);
  backdrop-filter: blur(3px);
}
.trail-drawer-backdrop[hidden] { display: none !important; }
.trail-branch-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(430px, 92vw);
  margin: 0;
  z-index: 90;
  border: 0;
  border-left: 1px solid color-mix(in srgb, var(--world-accent, var(--accent)) 34%, var(--line));
  border-radius: 26px 0 0 26px;
  background: rgba(248, 251, 255, .98);
  box-shadow: -28px 0 80px rgba(15, 23, 42, .18);
  padding: 24px;
  overflow: auto;
  transform: translateX(102%);
  transition: transform .18s ease;
}
.trail-branch-drawer.is-open { transform: translateX(0); }
.trail-branch-drawer[hidden] { display: none !important; }
.trail-branch-head {
  position: sticky;
  top: -24px;
  z-index: 2;
  background: linear-gradient(180deg, rgba(248,251,255,.98), rgba(248,251,255,.92));
  padding: 0 0 16px;
  border-bottom: 1px solid var(--line);
}
.trail-branch-list.is-active { display: grid; gap: 12px; padding: 16px 0; }
.trail-branch-option {
  grid-template-columns: 36px 1fr auto;
  padding: 14px;
  border-radius: 18px;
  box-shadow: 0 12px 34px rgba(15,23,42,.06);
}
.trail-drawer-create {
  margin-top: 12px;
  border: 1px dashed color-mix(in srgb, var(--world-accent, var(--accent)) 40%, var(--line));
  border-radius: 18px;
  padding: 16px;
  background: #fff;
}
.trail-drawer-create strong { display:block; font-size: 1.05rem; margin-bottom: 4px; }
.trail-drawer-create p { color: var(--muted); margin: 0 0 12px; font-weight: 700; }
.trail-page-signals button {
  background: color-mix(in srgb, var(--world-accent, var(--accent)) 12%, white);
  box-shadow: 0 8px 22px rgba(37,99,235,.08);
}
.trail-page-signals button:hover { transform: translateY(-1px); }
@media (max-width: 680px) {
  .trail-branch-drawer {
    top: auto;
    left: 0;
    width: auto;
    height: min(78vh, 640px);
    border-left: 0;
    border-top: 1px solid color-mix(in srgb, var(--world-accent, var(--accent)) 34%, var(--line));
    border-radius: 26px 26px 0 0;
    transform: translateY(104%);
  }
  .trail-branch-drawer.is-open { transform: translateY(0); }
}

/* C28 district simplification: make districts feel like rooms with content, not admin panels */
.district-room-gate {
  grid-template-columns:auto minmax(0,1fr) minmax(270px,.42fr);
}
.district-start-card {
  position:relative;
  z-index:1;
  padding:20px;
  border-radius:24px;
  background:rgba(255,255,255,.86);
  border:1px solid color-mix(in srgb, var(--world-accent) 25%, var(--line));
  box-shadow:0 18px 40px rgba(15,23,42,.06);
}
.district-start-card h3 { margin:2px 0 8px; letter-spacing:-.03em; }
.district-start-card p { color:var(--muted); line-height:1.45; margin:0 0 14px; font-weight:750; }
.district-overview-strip {
  width:min(1220px, calc(100% - 48px));
  margin:0 auto 24px;
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:16px;
}
.district-counts-soft { background:linear-gradient(180deg,#fff,var(--panel-2)); }
.district-soft-stats {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.district-soft-stats span {
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:74px;
  padding:12px;
  border:1px solid color-mix(in srgb, var(--world-accent) 18%, var(--line));
  border-radius:18px;
  background:#fff;
  color:var(--muted);
  font-weight:900;
  text-align:center;
}
.district-soft-stats strong { color:var(--text); font-size:1.55rem; line-height:1; }
.district-start-section { background:linear-gradient(180deg,#fff,color-mix(in srgb, var(--world-accent) 4%, white)); }
.world-conversation-panel .world-paths-head h3 { letter-spacing:-.03em; }
.world-conversation-panel .world-path-start-form textarea { min-height:78px; }
.world-conversation-panel .world-empty-paths { color:var(--text); background:color-mix(in srgb, var(--world-accent) 5%, white); }
@media (max-width:1050px){
  .district-room-gate { grid-template-columns:auto 1fr; }
  .district-start-card { grid-column:1 / -1; }
  .district-overview-strip { grid-template-columns:1fr; }
}
@media (max-width:680px){
  .district-overview-strip { width:min(100% - 24px, 1220px); }
  .district-soft-stats { grid-template-columns:1fr; }
}


/* C33: make branch drawer selections reliable */
.trail-drawer-backdrop {
  z-index: 9990 !important;
  pointer-events: auto;
}
.trail-drawer-backdrop[hidden] {
  pointer-events: none !important;
}
.trail-branch-drawer {
  z-index: 10000 !important;
  pointer-events: none;
}
.trail-branch-drawer.is-open {
  pointer-events: auto;
}
.trail-branch-drawer .trail-branch-option,
.trail-branch-drawer button,
.trail-branch-drawer a {
  position: relative;
  z-index: 10001;
  pointer-events: auto;
}

/* Trejji discovery thread polish */
.discovery-thread-card { border-color: color-mix(in srgb, var(--world-accent, #6aa6ff) 35%, #d8e5ff); }
.attached-item-timeline { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #d9e5f8; display: grid; gap: .75rem; }
.attached-item-card { padding: .9rem 1rem; border: 1px solid #dbe7f8; border-radius: 18px; background: linear-gradient(180deg, #fff, #f8fbff); }
.attached-item-card.detail { padding: 1rem; }
.attached-item-card h4 { margin: .35rem 0 .45rem; font-size: 1.05rem; }
.discovery-open-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-top: 1rem; flex-wrap: wrap; }
.attached-discovery-section { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid #d9e5f8; }
.section-heading-row.compact { margin-bottom: .8rem; }

/* C35: district discovery index + inline conversation restore */
.district-discovery-index {
  max-height: 360px;
  overflow: auto;
  padding-right: .35rem;
  scroll-padding-top: 90px;
}
.discovery-index-card {
  position: relative;
  min-height: 122px;
}
.discovery-index-card strong a {
  color: inherit;
  text-decoration: none;
}
.discovery-index-card strong a:hover { color: var(--world-accent, #2563eb); }
.discovery-index-jump {
  position: absolute;
  right: .85rem;
  bottom: .75rem;
  font-size: .78rem;
  font-weight: 900;
  color: var(--world-accent, #2563eb);
  text-decoration: none;
  background: color-mix(in srgb, var(--world-accent, #2563eb) 8%, white);
  border: 1px solid color-mix(in srgb, var(--world-accent, #2563eb) 22%, #dbe7ff);
  border-radius: 999px;
  padding: .35rem .55rem;
}
.discovery-index-jump:hover { transform: translateY(-1px); }
.attached-item-card .world-paths-panel,
.discovery-thread-card > .world-paths-panel,
.world-content-detail-card > .world-paths-panel {
  margin-top: 1rem;
}
.attached-item-card .world-paths-panel {
  padding: 1rem;
  border-radius: 18px;
  background: color-mix(in srgb, var(--world-accent, #2563eb) 3%, white);
}
.attached-item-card .world-paths-head,
.discovery-thread-card .world-paths-head {
  align-items: center;
}
.attached-item-card .world-path-start-form {
  grid-template-columns: 1fr auto;
}
html { scroll-behavior: smooth; }
:target { scroll-margin-top: 96px; }
@media (max-width: 720px) {
  .district-discovery-index { max-height: 420px; }
  .attached-item-card .world-path-start-form { grid-template-columns: 1fr; }
}


/* C37 conversation navigation fix: keep side arrows as arrows and make one-reply links behave like normal links */
.trail-page-signals a.trail-signal-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: color-mix(in srgb, var(--world-accent, var(--accent)) 12%, white);
  color: var(--accent);
  padding: 7px 11px;
  font-weight: 1000;
  text-decoration: none;
  box-shadow: 0 8px 22px rgba(37,99,235,.08);
}
.trail-page-signals a.trail-signal-link:hover { transform: translateY(-1px); }
.trail-nav-side.right,
.trail-nav-side.left {
  display: inline-grid;
  place-items: center;
  min-width: 42px;
  max-width: 42px;
  overflow: hidden;
  white-space: nowrap;
  line-height: 1;
}

/* Trejji inside-source preview modal */
.source-title-button {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 900;
  padding: 0;
  text-align: left;
  cursor: pointer;
}
.source-title-button:hover { color: var(--blue); text-decoration: underline; }
.native-source-image.source-preview-open {
  display:block;
  width:100%;
  border:0;
  padding:0;
  margin:0;
  background:transparent;
  cursor:pointer;
  text-align:left;
}
.native-source-image.source-preview-open:hover img { transform: scale(1.01); }
.native-source-image img { transition: transform .18s ease; }
.source-action-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:12px; }
.source-modal-open { overflow:hidden; }
.source-modal { position:fixed; inset:0; z-index:9999; display:none; }
.source-modal.is-open { display:block; }
.source-modal-backdrop { position:absolute; inset:0; background:rgba(15,23,42,.48); backdrop-filter: blur(4px); }
.source-modal-panel {
  position:absolute;
  inset:34px;
  display:flex;
  flex-direction:column;
  background:#f8fbff;
  border:1px solid #b8d2ff;
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 30px 90px rgba(15,23,42,.28);
}
.source-modal-header {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:20px 24px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(135deg,#fff,#eef6ff);
}
.source-modal-header h2 { margin:.15rem 0 0; font-size:clamp(1.3rem,2vw,2rem); }
.source-modal-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.source-modal-note { padding:10px 24px; color:var(--muted); font-weight:700; background:#fff; border-bottom:1px solid var(--line); }
.source-modal-frame-wrap { flex:1; min-height:0; background:#fff; }
.source-modal-frame { width:100%; height:100%; min-height:420px; border:0; display:block; background:#fff; }
.source-modal-reader-wrap { flex:1; min-height:0; background:#f8fbff; overflow:auto; }
.source-modal-reader { min-height:420px; }
.source-modal-loading { padding:28px; color:var(--muted); font-weight:900; }
.source-modal-error { margin:28px; border:1px dashed #9ec5ff; border-radius:18px; background:#fff; padding:18px; color:var(--muted); font-weight:800; }
@media (max-width: 760px) {
  .source-modal-panel { inset:10px; border-radius:20px; }
  .source-modal-header { padding:14px; flex-direction:column; }
  .source-modal-actions { width:100%; }
  .source-modal-actions .button { flex:1; justify-content:center; }
  .source-modal-note { padding:10px 14px; }
}

/* Trejji source-specific cards */
.platform-source-card {
  position: relative;
  overflow: hidden;
  padding: 18px;
  border-radius: 22px;
  border: 1px solid #d6e4fb;
  background: linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
}
.platform-source-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 6px;
  background: #2563eb;
  opacity: .85;
}
.platform-source-topline {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}
.platform-source-icon {
  display: inline-flex;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  background: #eff6ff;
  color: #2563eb;
  font-weight: 1000;
  font-size: 1rem;
}
.platform-source-topline strong {
  display:block;
  font-size: 1.02rem;
  letter-spacing: -0.02em;
}
.platform-source-topline p {
  margin: 2px 0 0;
  color: var(--muted);
  font-weight: 800;
  font-size: .9rem;
}
.platform-source-pill {
  margin-left: auto;
  padding: 8px 12px;
  border-radius: 999px;
  background: #eef4ff;
  color: #587095;
  font-weight: 1000;
  font-size: .82rem;
  white-space: nowrap;
}
.platform-source-body h4 { margin-top: 6px; }
.platform-source-body p { font-size: 1rem; }
.platform-source-card .source-url-text { display: none; }
.source-reddit::before { background: #ff4500; }
.source-reddit .platform-source-icon { background: #fff1ec; color: #ff4500; }
.source-x::before { background: #111827; }
.source-x .platform-source-icon { background: #f3f4f6; color: #111827; }
.source-facebook::before { background: #1877f2; }
.source-facebook .platform-source-icon { background: #e8f1ff; color: #1877f2; }
.source-instagram::before { background: linear-gradient(#f97316, #db2777); }
.source-instagram .platform-source-icon { background: #fdf2f8; color: #db2777; }
.source-youtube::before { background: #ff0000; }
.source-youtube .platform-source-icon { background: #fff1f1; color: #ff0000; }
.source-blog::before { background: #7c3aed; }
.source-blog .platform-source-icon { background: #f3e8ff; color: #7c3aed; }
.source-web::before { background: #2563eb; }


.source-modal-fallback[hidden],
.source-modal-loading[hidden],
.source-modal-frame[hidden] {
  display: none !important;
}

.source-modal-fallback {
  display: grid;
  min-height: 420px;
  place-items: center;
  padding: 32px;
  background: linear-gradient(135deg, #f8fbff, #eef6ff);
}
.source-fallback-card {
  max-width: 560px;
  padding: 28px;
  border: 1px solid #bfdbfe;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 24px 60px rgba(15, 23, 42, .12);
  text-align: center;
}
.source-fallback-card h3 {
  margin: 8px 0 10px;
  font-size: 28px;
  line-height: 1.1;
}
.source-fallback-card p {
  color: #64748b;
  font-weight: 650;
}
.source-title-static {
  font: inherit;
  color: inherit;
}


/* C46 cleanup: Discoveries remain the main world container; remove old Active Paths footprint */
.living-prime-layer { grid-template-columns: 1fr !important; }
.living-prime-layer .discovery-live-card { min-height: 0; }
.living-prime-layer .living-discovery-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.district-soft-stats { grid-template-columns: repeat(3, minmax(110px, 1fr)); }
.district-soft-stats span { min-height: 86px; padding: 14px 10px; line-height: 1.12; word-break: normal; overflow-wrap: anywhere; }
.district-soft-stats strong { display:block; margin-bottom: 6px; font-size: clamp(1.35rem, 3vw, 1.85rem); }
.district-action-row .button { white-space: nowrap; }
#district-conversations { scroll-margin-top: 90px; }
@media (max-width: 560px) { .district-action-row .button { width:100%; justify-content:center; } }

/* C50: keep room stats readable and wire conversation cards to real comments */
.district-overview-strip {
  grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr);
  align-items: stretch;
}
.district-counts-soft { min-width: 0; }
.district-soft-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px;
}
.district-soft-stats span {
  min-width: 0;
  min-height: 92px;
  padding: 14px 8px;
  font-size: clamp(.82rem, 1.35vw, 1rem);
  line-height: 1.15;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none;
}
.district-soft-stats strong {
  font-size: clamp(1.45rem, 2.5vw, 1.95rem) !important;
}
.district-conversation-card small {
  display:block;
  color: var(--muted);
  font-weight: 750;
  line-height: 1.35;
  margin-top: 8px;
}
@media (max-width: 1050px){
  .district-overview-strip { grid-template-columns: 1fr; }
}
@media (max-width: 520px){
  .district-soft-stats { grid-template-columns: 1fr !important; }
  .district-soft-stats span { min-height: 72px; }
}

/* C51: scalable discovery and conversation activity polish */
.district-counts-soft .district-soft-stats {
  grid-template-columns: repeat(3, minmax(120px, 1fr)) !important;
}
.district-counts-soft .district-soft-stats span {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  white-space: normal;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
  min-width: 120px;
}
.district-counts-soft .district-soft-stats strong {
  display: block;
  margin-bottom: 8px;
}
.district-discovery-index,
.district-conversation-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.district-discovery-index .district-mini-card,
.district-conversation-grid .district-mini-card {
  min-height: 136px;
}
.district-conversation-card {
  position: relative;
  gap: 10px;
  background: linear-gradient(180deg, #fff, color-mix(in srgb, var(--world-accent) 4%, var(--panel-2)));
}
.conversation-card-topline {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
}
.conversation-card-topline strong {
  line-height: 1.15;
}
.conversation-card-topline em {
  flex: 0 0 auto;
  font-style: normal;
  color: var(--muted);
  font-size: .74rem;
  font-weight: 850;
  white-space: nowrap;
  margin-top: 2px;
}
.district-conversation-card b {
  margin-top: auto;
  color: color-mix(in srgb, var(--world-accent) 78%, #111827);
  font-size: .88rem;
}
.district-more-note {
  margin: 12px 2px 0;
}
.world-conversation-panel {
  scroll-margin-top: 92px;
}
.realm-path-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 12px;
}
.realm-path-card {
  min-width: 0;
}
.path-preview {
  overflow-wrap: anywhere;
}
@media (max-width: 760px) {
  .district-counts-soft .district-soft-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .district-counts-soft .district-soft-stats span {
    min-width: 0;
    font-size: .82rem;
    padding-inline: 6px;
  }
  .conversation-card-topline {
    display: block;
  }
  .conversation-card-topline em {
    display: block;
    margin-top: 5px;
  }
}
@media (max-width: 520px) {
  .district-counts-soft .district-soft-stats {
    grid-template-columns: 1fr !important;
  }
}

/* Performance cleanup: make the hero banner an actual prioritized image instead
   of a CSS background so the browser can discover it early for LCP. */
.world-channel-banner.has-image {
  position: relative;
  overflow: hidden;
  background-image: none !important;
}
.world-channel-banner .world-banner-img {
  width: 100%;
  height: 100%;
  min-height: inherit;
  display: block;
  object-fit: cover;
  object-position: center;
}


/* LCP hardening: reserve the hero image box and keep uploaded banners cheap to paint. */
.world-channel-banner {
  aspect-ratio: 10 / 3;
  contain: paint;
}
.world-channel-banner.has-image {
  height: auto !important;
  min-height: 0 !important;
}
.world-channel-banner .world-banner-img {
  aspect-ratio: 10 / 3;
  min-height: 0 !important;
  background: #172033;
}
@media (max-width: 760px) {
  .world-channel-banner,
  .world-channel-banner .world-banner-img {
    aspect-ratio: 16 / 7;
  }
}

/* Trejji district feed pagination/performance cleanup */
.district-feed-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 1.5rem 0 0;
  padding: 1rem;
  border: 1px solid rgba(96, 165, 250, 0.28);
  border-radius: 1.25rem;
  background: rgba(248, 251, 255, 0.86);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.06);
}
.district-feed-pagination-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .6rem;
}
.page-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.35rem;
  padding: .55rem .85rem;
  border: 1px solid rgba(96, 165, 250, 0.28);
  border-radius: 999px;
  background: rgba(239, 246, 255, .9);
  color: #334155;
  font-weight: 800;
  white-space: nowrap;
}
@media (max-width: 720px) {
  .district-feed-pagination {
    align-items: stretch;
    flex-direction: column;
  }
  .district-feed-pagination-actions {
    justify-content: flex-start;
  }
}

/* c66: world entrance/link/studio cleanup */
.world-channel-banner{
  aspect-ratio: 4 / 1 !important;
  max-height: 330px;
  min-height: 190px;
  width: 100%;
}
.world-channel-banner .world-banner-img{
  aspect-ratio: 4 / 1 !important;
  max-height: 330px;
  min-height: 190px !important;
  object-fit: cover;
  object-position: center center;
}
.official-links-panel{
  width:min(100% - 48px, 1180px);
  margin:18px auto 28px;
  padding:22px;
  border:1px solid #cfe0ff;
  border-radius:26px;
  background:linear-gradient(135deg,#ffffff,#f8fbff);
  box-shadow:0 18px 45px rgba(37,99,235,.06);
}
.official-links-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;}
.official-links-head h2{margin:4px 0 0;font-size:clamp(1.25rem,2vw,1.8rem);}
.official-links-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;}
.official-link-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid #d8e5fb;border-radius:18px;background:#fff;}
.official-link-card > a{display:flex;align-items:center;gap:10px;text-decoration:none;color:#0f172a;min-width:0;}
.official-link-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:color-mix(in srgb,var(--world-accent) 16%,white);color:#1d4ed8;font-weight:1000;flex:0 0 auto;}
.official-link-card strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px;}
.official-link-card small{display:block;color:#64748b;font-weight:800;font-size:.82rem;}
.official-link-tools{display:flex;align-items:center;gap:8px;font-size:.82rem;font-weight:900;}
.official-link-tools form{display:inline;margin:0;}
.official-link-tools button{border:0;background:transparent;color:#ef4444;font:inherit;cursor:pointer;padding:0;}
.link-studio-shell{width:min(100% - 48px, 1120px);margin:36px auto;}
.link-studio-card{padding:28px;border:1px solid #cfe0ff;border-radius:26px;background:#fff;box-shadow:0 18px 45px rgba(37,99,235,.07);}
.official-link-form{display:grid;gap:18px;margin-top:22px;}
.official-link-form label{display:grid;gap:8px;font-weight:900;color:#0f172a;}
.official-link-form input,.official-link-form select{width:100%;border:1px solid #cbdaf5;border-radius:16px;padding:14px 16px;background:#f8fbff;font-weight:800;color:#0f172a;box-sizing:border-box;}
.split-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;}
.media-remove-row{display:flex;gap:12px;flex-wrap:wrap;margin:14px 0 0;}
.media-remove-row label{display:flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid #fecaca;border-radius:999px;background:#fff5f5;color:#b91c1c;font-weight:900;}
.district-manager-row{
  grid-template-columns:76px minmax(220px,1fr) minmax(320px,1.7fr) 110px !important;
  gap:14px !important;
  overflow:visible !important;
}
.district-manager-row .district-mini-field input{padding:14px 16px;border-radius:16px;}
.district-manager-row .district-delete-pill{justify-self:stretch !important;justify-content:center;width:100% !important;}
.district-manager-row .district-delete-pill::after{content:"" !important;}
.district-manager-row .district-toggle-pill{width:110px !important;font-size:.9rem !important;}
@media(max-width:1100px){
  .district-manager-row{grid-template-columns:76px 1fr !important;}
  .district-manager-row .desc-field,.district-manager-row .district-toggle-pill,.district-manager-row .district-delete-pill{grid-column:1/-1;width:100% !important;justify-self:stretch !important;}
}
@media(max-width:760px){
  .world-channel-banner,.world-channel-banner .world-banner-img{aspect-ratio:16/7 !important;min-height:150px !important;}
  .official-links-panel,.link-studio-shell{width:min(100% - 24px, 1180px);}
  .official-links-head{align-items:flex-start;flex-direction:column;}
}


/* c70 final studio cleanup: keep world media and district editing stable */
.world-channel-banner {
  width: 100%;
  max-height: 360px;
  min-height: 220px;
  border-radius: 26px;
}
.world-channel-banner.has-image {
  display: block;
}
.world-channel-banner .world-banner-img {
  width: 100%;
  height: 100%;
  max-height: 360px;
  object-fit: cover;
  object-position: center;
  border-radius: inherit;
}
.world-channel-avatar.has-image {
  background-size: cover !important;
  background-position: center !important;
  color: transparent !important;
}
.media-remove-safe {
  margin: 12px 0 14px;
  padding: 12px 14px;
  border: 1px solid #fecaca;
  border-radius: 16px;
  background: #fff7f7;
}
.media-remove-safe summary {
  cursor: pointer;
  font-weight: 900;
  color: #991b1b;
}
.media-remove-safe .media-remove-row {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
}
.media-remove-safe label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-weight: 800;
  color: #7f1d1d;
}

/* Replace the cramped district grid with a clean card layout. */
.district-manager-list {
  gap: 18px !important;
}
.district-manager-row {
  display: grid !important;
  grid-template-columns: 82px minmax(220px, 1fr) !important;
  grid-template-areas:
    "icon name"
    "desc desc"
    "controls controls" !important;
  gap: 14px !important;
  align-items: start !important;
  overflow: visible !important;
  padding: 18px !important;
}
.district-manager-row .icon-field { grid-area: icon; }
.district-manager-row .name-field { grid-area: name; }
.district-manager-row .desc-field { grid-area: desc; }
.district-manager-row .district-controls-row {
  grid-area: controls;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding-top: 4px;
}
.district-manager-row .district-mini-field {
  min-width: 0 !important;
  width: 100%;
}
.district-manager-row .district-mini-field input,
.district-manager-row .district-mini-field textarea {
  width: 100% !important;
  box-sizing: border-box;
  border: 1px solid #cbdaf5;
  background: #fff;
  border-radius: 14px;
  padding: 12px 14px;
  font-weight: 800;
  color: #0f172a;
  font: inherit;
}
.district-manager-row .district-mini-field textarea {
  min-height: 78px;
  resize: vertical;
  line-height: 1.35;
}
.district-manager-row .icon-field input {
  text-align: center;
  min-height: 52px;
  font-size: 1.2rem;
}
.district-manager-row .district-toggle-pill,
.district-manager-row .district-delete-pill {
  width: auto !important;
  min-width: 128px !important;
  justify-self: start !important;
  grid-column: auto !important;
  min-height: 42px;
  padding: 9px 14px;
  box-sizing: border-box;
}
.district-manager-row .district-delete-pill::after {
  content: "" !important;
}
.district-manager-row.inactive {
  opacity: .78;
}
@media (max-width: 720px) {
  .district-manager-row {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "icon"
      "name"
      "desc"
      "controls" !important;
  }
  .district-manager-row .district-controls-row {
    flex-direction: column;
    align-items: stretch;
  }
  .district-manager-row .district-toggle-pill,
  .district-manager-row .district-delete-pill {
    width: 100% !important;
  }
}


/* c71b: keep the profile/avatar below the banner and add portal management controls */
.living-entry-hero .world-channel-head,
.world-realm-detail .world-channel-head {
  padding-top: 26px !important;
}
.living-entry-hero .world-channel-avatar,
.world-realm-detail .world-channel-avatar {
  margin-top: 0 !important;
  align-self: start;
}
.living-entry-hero .world-channel-banner,
.world-realm-detail .world-channel-banner {
  position: relative;
  z-index: 1;
}
.living-entry-hero .world-channel-head,
.world-realm-detail .world-channel-head {
  position: relative;
  z-index: 2;
}
@media (max-width: 760px) {
  .living-entry-hero .world-channel-head,
  .world-realm-detail .world-channel-head {
    padding-top: 18px !important;
  }
}
.constellation-card-wrap {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.constellation-card-wrap .constellation-card {
  width: 100%;
  box-sizing: border-box;
}
.portal-card-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}
.portal-delete-form {
  margin: 0;
}
.portal-delete-form button {
  border: 1px solid #fecaca;
  background: #fff7f7;
  color: #b91c1c;
  border-radius: 999px;
  padding: 9px 13px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: none;
}
.portal-delete-form button:hover {
  background: #fee2e2;
}
.portal-delete-form.inline button {
  min-height: 40px;
}

/* Explore cleanup: worlds are searched by destination, not global categories. */
.explore-search-card.explore-search-simple {
  grid-template-columns: minmax(0, 1fr) auto;
}
.studio-single-row {
  grid-template-columns: minmax(0, 1fr);
}
@media (max-width: 700px) {
  .explore-search-card.explore-search-simple { grid-template-columns: 1fr; }
}

.discovery-card-label-row { margin-bottom: 6px; display: flex; align-items: center; gap: 6px; }
.discovery-thread-card .content-kind-trail, .discovery-index-card .content-kind-trail { background: color-mix(in srgb, #7c3aed 16%, white); color: #4c1d95; }

/* c78/c1 futuristic World page command center */
.world-command-hero {
  position: relative;
  width: min(1220px, calc(100% - 48px));
  margin: 34px auto 22px;
  padding: 0;
  overflow: hidden;
  border-radius: 34px;
  border: 1px solid color-mix(in srgb, var(--world-accent, #2563eb) 24%, #d8e0ef);
  background:
    radial-gradient(circle at 82% 18%, color-mix(in srgb, var(--world-accent, #2563eb) 24%, transparent), transparent 30%),
    radial-gradient(circle at 12% 18%, rgba(255,255,255,.88), transparent 26%),
    linear-gradient(135deg, #f8fbff 0%, #ffffff 47%, color-mix(in srgb, var(--world-accent, #2563eb) 8%, #f7fbff) 100%);
  box-shadow: 0 32px 90px rgba(15, 23, 42, .12);
}
.world-command-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(color-mix(in srgb, var(--world-accent, #2563eb) 10%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--world-accent, #2563eb) 9%, transparent) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(90deg, transparent, #000 22%, #000 82%, transparent);
  opacity: .32;
  pointer-events: none;
}
.command-ambient {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .16;
}
.command-ambient.has-image { opacity: .18; }
.command-ambient .world-banner-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(1.05) contrast(1.08);
}
.command-ambient::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(255,255,255,.96), rgba(255,255,255,.82) 46%, rgba(255,255,255,.92));
}
.command-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, .96fr) minmax(420px, 1.04fr);
  gap: 28px;
  padding: clamp(24px, 4vw, 44px);
  align-items: center;
}
.command-identity-panel { min-width: 0; }
.command-title-row {
  display: grid;
  grid-template-columns: 92px minmax(0,1fr);
  gap: 18px;
  align-items: center;
  margin-top: 18px;
}
.command-title-row h1 {
  margin: 0;
  font-size: clamp(2.8rem, 6vw, 6.5rem);
  line-height: .86;
  letter-spacing: -.075em;
  color: #101827;
}
.command-avatar.world-channel-avatar {
  width: 92px;
  height: 92px;
  margin: 0 !important;
  border-radius: 28px;
  box-shadow: 0 24px 60px color-mix(in srgb, var(--world-accent, #2563eb) 22%, transparent);
}
.command-message {
  margin-top: 22px;
  max-width: 660px;
  padding: 18px 20px;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--world-accent, #2563eb) 17%, #d8e0ef);
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(12px);
  box-shadow: 0 16px 42px rgba(15,23,42,.05);
}
.command-message strong { display:block; margin-bottom: 6px; font-size: 1.06rem; }
.command-message p { margin: 0; color: #53647c; line-height: 1.48; }
.command-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 18px;
}
.command-actions form { margin: 0; }
.command-tabs { margin-top: 18px; }
.command-core-panel {
  min-height: 520px;
  display: grid;
  align-content: end;
  gap: 18px;
}
.command-core-rings {
  position: relative;
  min-height: 430px;
  border-radius: 34px;
  background:
    radial-gradient(circle at center, color-mix(in srgb, var(--world-accent, #2563eb) 18%, #fff), #fff 38%, color-mix(in srgb, var(--world-accent, #2563eb) 6%, #fff));
  border: 1px solid color-mix(in srgb, var(--world-accent, #2563eb) 14%, #d8e0ef);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), inset 0 -48px 80px rgba(255,255,255,.72), 0 22px 70px rgba(15,23,42,.08);
  overflow: hidden;
}
.command-core-rings::before {
  content: "";
  position: absolute;
  inset: -40%;
  background: conic-gradient(from 120deg, transparent, color-mix(in srgb, var(--world-accent, #2563eb) 14%, transparent), transparent 30%);
  animation: worldHubScan 18s linear infinite;
  opacity: .85;
}
.command-ring {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  border: 1px dashed color-mix(in srgb, var(--world-accent, #2563eb) 34%, #b7cdf6);
  border-radius: 999px;
  pointer-events: none;
}
.command-ring.ring-a { width: 42%; height: 34%; }
.command-ring.ring-b { width: 66%; height: 52%; }
.command-ring.ring-c { width: 88%; height: 72%; }
.command-core {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 132px;
  height: 132px;
  border-radius: 38px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  text-align: center;
  color: #fff;
  font-weight: 1000;
  font-size: 3.2rem;
  background: linear-gradient(135deg, var(--world-accent, #2563eb), color-mix(in srgb, var(--world-accent, #2563eb) 62%, #0f172a));
  background-size: cover;
  background-position: center;
  box-shadow: 0 24px 68px color-mix(in srgb, var(--world-accent, #2563eb) 36%, transparent);
  z-index: 3;
}
.command-core.has-image span { display:none; }
.command-core small {
  max-width: 116px;
  font-size: .68rem;
  line-height: 1.05;
  color: rgba(255,255,255,.9);
  text-transform: uppercase;
  letter-spacing: .09em;
}
.command-satellite {
  position: absolute;
  z-index: 4;
  width: 178px;
  min-height: 82px;
  padding: 12px;
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 8px;
  align-items: center;
  border-radius: 20px;
  border: 1px solid color-mix(in srgb, var(--world-accent, #2563eb) 22%, #d8e0ef);
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(14px);
  color: #111827;
  text-decoration: none;
  box-shadow: 0 18px 42px rgba(15,23,42,.09);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.command-satellite:hover {
  transform: translateY(-4px) scale(1.015);
  border-color: color-mix(in srgb, var(--world-accent, #2563eb) 55%, #d8e0ef);
  box-shadow: 0 26px 60px rgba(15,23,42,.14);
}
.command-satellite span {
  width: 34px;
  height: 34px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  color: color-mix(in srgb, var(--world-accent, #2563eb) 82%, #111827);
  background: color-mix(in srgb, var(--world-accent, #2563eb) 12%, #f5f8ff);
  font-weight: 1000;
}
.command-satellite strong { line-height: 1.04; font-size: .92rem; }
.command-satellite small { grid-column: 2; color: #64748b; font-weight: 900; font-size: .72rem; }
.command-satellite.sat-1 { left: 7%; top: 12%; }
.command-satellite.sat-2 { right: 7%; top: 14%; }
.command-satellite.sat-3 { left: 8%; bottom: 12%; }
.command-satellite.sat-4 { right: 8%; bottom: 13%; }
.command-satellite.sat-5 { left: 50%; top: 5%; transform: translateX(-50%); }
.command-satellite.sat-5:hover { transform: translateX(-50%) translateY(-4px) scale(1.015); }
.command-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 10px;
}
.command-stat-grid span {
  padding: 13px 12px;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--world-accent, #2563eb) 16%, #d8e0ef);
  background: rgba(255,255,255,.78);
  box-shadow: 0 12px 30px rgba(15,23,42,.045);
}
.command-stat-grid strong { display:block; font-size: 1.45rem; line-height: 1; color: #111827; }
.command-stat-grid small { color: #64748b; font-weight: 900; }
.realm-map-centerpiece {
  margin-top: 22px;
  background:
    radial-gradient(circle at 76% 20%, color-mix(in srgb, var(--world-accent,#2563eb) 16%, transparent), transparent 28%),
    linear-gradient(135deg,#ffffff,color-mix(in srgb,var(--world-accent,#2563eb) 5%,#f8fbff));
}
.realm-map-centerpiece .realm-map-copy h2::after {
  content: "";
  display: block;
  width: 72px;
  height: 5px;
  margin-top: 18px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--world-accent,#2563eb), transparent);
}
.enhanced-discovery-card {
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.enhanced-discovery-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 26px 62px rgba(15,23,42,.12);
}
.enhanced-discovery-card em {
  display: inline-flex;
  margin-top: 14px;
  border-radius: 999px;
  padding: 7px 10px;
  background: color-mix(in srgb, var(--world-accent,#2563eb) 10%, #fff);
  color: color-mix(in srgb, var(--world-accent,#2563eb) 88%, #111827);
  font-style: normal;
  font-weight: 1000;
}
@keyframes worldHubScan {
  to { transform: rotate(360deg); }
}
@media (max-width: 1050px) {
  .command-grid { grid-template-columns: 1fr; }
  .command-core-panel { min-height: auto; }
  .command-core-rings { min-height: 500px; }
}
@media (max-width: 720px) {
  .world-command-hero { width: min(100% - 24px, 1220px); border-radius: 26px; }
  .command-grid { padding: 20px; }
  .command-title-row { grid-template-columns: 72px 1fr; gap: 14px; }
  .command-title-row h1 { font-size: clamp(2.45rem, 15vw, 4rem); }
  .command-avatar.world-channel-avatar { width: 72px; height: 72px; border-radius: 22px; }
  .command-core-rings { min-height: auto; display: grid; gap: 10px; padding: 16px; }
  .command-core-rings::before, .command-ring, .command-core { display: none; }
  .command-satellite { position: static; width: auto; min-height: auto; }
  .command-satellite.sat-5 { transform: none; }
  .command-satellite.sat-5:hover { transform: translateY(-4px) scale(1.015); }
  .command-stat-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}


/* c3 visitor world flow: hero -> map -> start here -> more discoveries -> activity */
.world-command-hero.visitor-view .command-grid {
  grid-template-columns: minmax(0, 1fr);
}
.world-command-hero.visitor-view .command-identity-panel {
  max-width: 920px;
}
.world-command-hero.visitor-view .command-title-row {
  grid-template-columns: 92px minmax(0, 1fr);
  align-items: start;
}
.world-command-hero.visitor-view .command-message {
  max-width: 760px;
}
.world-start-here .compact-more-heading {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid color-mix(in srgb, var(--world-accent,#2563eb) 14%, #e5e7eb);
}
.featured-discovery-panel {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(240px, .88fr);
  gap: 20px;
  align-items: stretch;
  padding: clamp(18px, 3vw, 28px);
  border-radius: 28px;
  text-decoration: none;
  color: #101827;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--world-accent,#2563eb) 28%, #d8e0ef);
  background:
    radial-gradient(circle at 88% 10%, color-mix(in srgb, var(--world-accent,#2563eb) 18%, transparent), transparent 34%),
    linear-gradient(135deg, #ffffff, color-mix(in srgb, var(--world-accent,#2563eb) 7%, #f8fbff));
  box-shadow: 0 26px 72px rgba(15,23,42,.095);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.featured-discovery-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(color-mix(in srgb, var(--world-accent,#2563eb) 8%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--world-accent,#2563eb) 7%, transparent) 1px, transparent 1px);
  background-size: 34px 34px;
  opacity: .28;
  pointer-events: none;
}
.featured-discovery-panel:hover {
  transform: translateY(-5px);
  border-color: color-mix(in srgb, var(--world-accent,#2563eb) 55%, #d8e0ef);
  box-shadow: 0 34px 86px rgba(15,23,42,.15);
}
.featured-discovery-copy {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}
.featured-discovery-copy h3 {
  margin: 10px 0 10px;
  font-size: clamp(1.7rem, 4vw, 3.2rem);
  line-height: .95;
  letter-spacing: -.055em;
  color: #0f172a;
}
.featured-discovery-copy p {
  margin: 0;
  max-width: 680px;
  color: #52637a;
  line-height: 1.52;
  font-weight: 760;
}
.featured-discovery-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
.featured-discovery-meta span {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 8px 11px;
  border: 1px solid color-mix(in srgb, var(--world-accent,#2563eb) 18%, #d8e0ef);
  background: rgba(255,255,255,.72);
  color: #475569;
  font-weight: 1000;
  font-size: .86rem;
}
.featured-discovery-copy em {
  width: fit-content;
  margin-top: 18px;
  border-radius: 999px;
  padding: 10px 14px;
  background: linear-gradient(135deg, var(--world-accent,#2563eb), color-mix(in srgb, var(--world-accent,#2563eb) 68%, #0f172a));
  color: #fff;
  font-style: normal;
  font-weight: 1000;
  box-shadow: 0 14px 34px color-mix(in srgb, var(--world-accent,#2563eb) 24%, transparent);
}
.featured-discovery-panel > img,
.featured-discovery-orb {
  position: relative;
  z-index: 2;
  width: 100%;
  min-height: 240px;
  max-height: 340px;
  object-fit: cover;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--world-accent,#2563eb) 16%, #d8e0ef);
  box-shadow: 0 18px 50px rgba(15,23,42,.12);
  background: color-mix(in srgb, var(--world-accent,#2563eb) 12%, #f8fbff);
}
.featured-discovery-orb {
  display: grid;
  place-items: center;
}
.featured-discovery-orb span {
  width: 112px;
  height: 112px;
  display: grid;
  place-items: center;
  border-radius: 32px;
  color: #fff;
  font-size: 3.2rem;
  font-weight: 1000;
  background: linear-gradient(135deg, var(--world-accent,#2563eb), color-mix(in srgb, var(--world-accent,#2563eb) 62%, #0f172a));
  box-shadow: 0 20px 50px color-mix(in srgb, var(--world-accent,#2563eb) 28%, transparent);
}
.realm-memory-layer.quiet-memory-layer {
  align-items: start;
}
@media (max-width: 760px) {
  .world-command-hero.visitor-view .command-title-row {
    grid-template-columns: 72px 1fr;
  }
  .featured-discovery-panel {
    grid-template-columns: 1fr;
  }
  .featured-discovery-panel > img,
  .featured-discovery-orb {
    min-height: 190px;
  }
  .featured-discovery-copy h3 {
    font-size: clamp(1.8rem, 12vw, 2.7rem);
  }
}


.featured-discovery-preview{position:relative;display:flex;align-items:center;justify-content:center;min-height:220px;border-radius:20px;overflow:hidden;background:linear-gradient(135deg,#eef5ff,#dce8ff)}
.featured-discovery-preview img{width:100%;height:220px;object-fit:cover;display:block}
.preview-type{position:absolute;bottom:12px;left:12px;background:rgba(255,255,255,.92);padding:6px 10px;border-radius:999px;font-size:12px;font-weight:600}
.artifact-preview{flex-direction:column;gap:12px}


/* c1 district v1: make district pages feel like exploration rooms instead of repeated profile sections */
.district-status-strip {
  grid-template-columns: minmax(0, .92fr) minmax(280px, .72fr);
  align-items: stretch;
}
.district-status-card,
.district-latest-card {
  background:
    radial-gradient(circle at 90% 0%, color-mix(in srgb, var(--world-accent,#2563eb) 12%, transparent), transparent 34%),
    rgba(255,255,255,.86);
}
.district-latest-card h3 {
  margin: 0 0 8px;
  font-size: clamp(1.15rem, 2vw, 1.55rem);
  letter-spacing: -.035em;
  color: #0f172a;
}
.district-latest-card p { margin: 0; color: #64748b; font-weight: 780; }
.district-featured-section {
  background:
    radial-gradient(circle at 84% 12%, color-mix(in srgb, var(--world-accent,#2563eb) 10%, transparent), transparent 38%),
    linear-gradient(180deg,#fff,color-mix(in srgb, var(--world-accent,#2563eb) 4%, white));
}
.district-featured-section .featured-discovery-panel {
  margin-top: 18px;
}
.district-more-heading {
  margin-top: 26px;
  padding-top: 22px;
  border-top: 1px solid color-mix(in srgb, var(--world-accent,#2563eb) 14%, #e5e7eb);
}
.first-explorer-empty {
  border-style: dashed;
  background: linear-gradient(135deg, rgba(255,255,255,.95), color-mix(in srgb, var(--world-accent,#2563eb) 5%, #f8fbff));
}
.first-explorer-empty strong { color: #0f172a; }
@media (max-width: 860px) {
  .district-status-strip { grid-template-columns: 1fr; }
}

/* c2 district constellation v1: spatial discovery navigation without replacing the readable feed */
.district-constellation-section {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 42%, color-mix(in srgb, var(--world-accent,#2563eb) 15%, transparent), transparent 32%),
    radial-gradient(circle at 86% 14%, color-mix(in srgb, var(--world-accent,#2563eb) 10%, transparent), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.96), color-mix(in srgb, var(--world-accent,#2563eb) 5%, #fff));
}
.constellation-heading-row {
  align-items: flex-start;
  gap: 18px;
}
.district-view-switcher {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--world-accent,#2563eb) 18%, #dbe6f7);
  background: rgba(255,255,255,.78);
  box-shadow: 0 16px 38px rgba(15,23,42,.07);
  flex-shrink: 0;
}
.district-view-switcher a {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 13px;
  border-radius: 999px;
  color: #52637a;
  text-decoration: none;
  font-weight: 1000;
  font-size: .86rem;
}
.district-view-switcher a.active,
.district-view-switcher a:hover {
  color: #fff;
  background: linear-gradient(135deg, var(--world-accent,#2563eb), color-mix(in srgb, var(--world-accent,#2563eb) 62%, #0f172a));
}
.district-constellation-shell {
  position: relative;
  min-height: 520px;
  margin-top: 22px;
  border-radius: 34px;
  border: 1px solid color-mix(in srgb, var(--world-accent,#2563eb) 14%, #dbe6f7);
  background:
    radial-gradient(circle at center, rgba(255,255,255,.88), rgba(248,251,255,.78) 42%, rgba(255,255,255,.92)),
    linear-gradient(135deg, color-mix(in srgb, var(--world-accent,#2563eb) 4%, #fff), #fff);
  overflow: hidden;
  box-shadow: inset 0 0 80px color-mix(in srgb, var(--world-accent,#2563eb) 8%, transparent), 0 22px 70px rgba(15,23,42,.08);
}
.district-constellation-shell:before,
.district-constellation-shell:after {
  content: "";
  position: absolute;
  inset: 28px;
  border-radius: 42px;
  background-image: radial-gradient(color-mix(in srgb, var(--world-accent,#2563eb) 38%, transparent) 1px, transparent 1px);
  background-size: 34px 34px;
  opacity: .15;
  pointer-events: none;
}
.district-constellation-shell:after {
  inset: 0;
  background: radial-gradient(circle at 50% 50%, transparent 0 20%, color-mix(in srgb, var(--world-accent,#2563eb) 6%, transparent) 21%, transparent 22% 100%);
  opacity: .65;
}
.constellation-orbit {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  border: 2px dashed color-mix(in srgb, var(--world-accent,#2563eb) 28%, transparent);
  border-radius: 50%;
  pointer-events: none;
}
.orbit-one { width: 220px; height: 150px; }
.orbit-two { width: 420px; height: 290px; }
.orbit-three { width: 620px; height: 410px; max-width: 88%; }
.district-center-node {
  position: absolute;
  z-index: 4;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 150px;
  min-height: 150px;
  border-radius: 36px;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 18px;
  color: #fff;
  background: linear-gradient(135deg, var(--world-accent,#2563eb), color-mix(in srgb, var(--world-accent,#2563eb) 58%, #0f172a));
  box-shadow: 0 22px 60px color-mix(in srgb, var(--world-accent,#2563eb) 30%, transparent);
}
.district-center-node span { font-size: 2.1rem; line-height: 1; }
.district-center-node strong { display:block; font-size: 1rem; line-height: 1.05; letter-spacing: -.02em; }
.district-center-node small { color: rgba(255,255,255,.82); font-weight: 900; }
.discovery-node {
  --node-x: 50%;
  --node-y: 50%;
  position: absolute;
  z-index: 5;
  left: var(--node-x);
  top: var(--node-y);
  transform: translate(-50%,-50%);
  display: grid;
  grid-template-columns: 34px minmax(0,1fr);
  grid-template-rows: auto auto;
  column-gap: 10px;
  align-items: center;
  width: 190px;
  min-height: 82px;
  padding: 12px;
  border-radius: 22px;
  text-decoration: none;
  color: #0f172a;
  background: rgba(255,255,255,.88);
  border: 1px solid color-mix(in srgb, var(--world-accent,#2563eb) 22%, #dbe6f7);
  box-shadow: 0 18px 45px rgba(15,23,42,.10);
  backdrop-filter: blur(10px);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.discovery-node:hover {
  transform: translate(-50%,-50%) translateY(-4px) scale(1.02);
  border-color: color-mix(in srgb, var(--world-accent,#2563eb) 52%, #dbe6f7);
  box-shadow: 0 26px 70px rgba(15,23,42,.16);
}
.node-pulse {
  position: absolute;
  left: 20px;
  top: 20px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--world-accent,#2563eb);
  box-shadow: 0 0 0 7px color-mix(in srgb, var(--world-accent,#2563eb) 13%, transparent);
}
.node-icon {
  grid-row: 1 / span 2;
  width: 34px;
  height: 34px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 1000;
  background: linear-gradient(135deg, var(--world-accent,#2563eb), color-mix(in srgb, var(--world-accent,#2563eb) 60%, #0f172a));
}
.discovery-node strong {
  display: block;
  font-size: .92rem;
  line-height: 1.05;
  letter-spacing: -.025em;
  max-height: 2.2em;
  overflow: hidden;
}
.discovery-node small {
  color: #64748b;
  font-weight: 900;
  font-size: .76rem;
  margin-top: 4px;
}
.discovery-node.large { width: 224px; min-height: 94px; }
.discovery-node.medium { width: 205px; }
.discovery-node.small { width: 178px; min-height: 74px; }
.discovery-node-1 { --node-x: 50%; --node-y: 18%; }
.discovery-node-2 { --node-x: 76%; --node-y: 32%; }
.discovery-node-3 { --node-x: 75%; --node-y: 68%; }
.discovery-node-4 { --node-x: 50%; --node-y: 82%; }
.discovery-node-5 { --node-x: 24%; --node-y: 68%; }
.discovery-node-6 { --node-x: 23%; --node-y: 32%; }
.discovery-node-7 { --node-x: 35%; --node-y: 22%; }
.discovery-node-8 { --node-x: 65%; --node-y: 22%; }
.discovery-node-9 { --node-x: 83%; --node-y: 50%; }
.discovery-node-10 { --node-x: 65%; --node-y: 78%; }
.discovery-node-11 { --node-x: 35%; --node-y: 78%; }
.discovery-node-12 { --node-x: 17%; --node-y: 50%; }
.constellation-footer-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 16px;
}
.constellation-footer-row p { margin: 0; }
@media (max-width: 860px) {
  .constellation-heading-row,
  .constellation-footer-row { flex-direction: column; align-items: stretch; }
  .district-view-switcher { width: fit-content; }
  .district-constellation-shell { min-height: auto; padding: 24px 16px; display: grid; gap: 12px; }
  .constellation-orbit,
  .district-constellation-shell:before,
  .district-constellation-shell:after { display: none; }
  .district-center-node,
  .discovery-node {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    width: auto;
    min-height: 0;
  }
  .district-center-node { border-radius: 26px; min-height: 96px; }
  .discovery-node:hover { transform: translateY(-2px); }
}


/* C8: Real district universe graph — draggable map with expandable discovery connections */
.wh-universe-section {
  background:
    radial-gradient(circle at 50% 42%, color-mix(in srgb, var(--world-accent,#2563eb) 10%, transparent), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.98), color-mix(in srgb, var(--world-accent,#2563eb) 4%, #fff));
}
.wh-universe-controls {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin: 10px 0 12px;
}
.wh-universe-controls button {
  border:0;
  border-radius:999px;
  padding:10px 16px;
  font-weight:1000;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(135deg,var(--world-accent,#2563eb),color-mix(in srgb,var(--world-accent,#2563eb) 64%,#0f172a));
  box-shadow:0 12px 26px color-mix(in srgb,var(--world-accent,#2563eb) 20%,transparent);
}
.wh-universe-shell {
  position:relative;
  cursor:grab;
  min-height:620px;
  margin-top:18px;
  border:1px solid color-mix(in srgb,var(--world-accent,#2563eb) 17%,#dbe6f7);
  border-radius:34px;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.96), rgba(248,251,255,.86) 42%, rgba(255,255,255,.96)),
    radial-gradient(color-mix(in srgb,var(--world-accent,#2563eb) 30%,transparent) 1px, transparent 1px);
  background-size:auto, 34px 34px;
  box-shadow:inset 0 0 90px color-mix(in srgb,var(--world-accent,#2563eb) 8%,transparent), 0 24px 72px rgba(15,23,42,.08);
  touch-action:none;
}
.wh-universe-canvas {
  position:absolute;
  left:0;
  top:0;
  width:1600px;
  height:1000px;
  transform-origin:0 0;
  will-change:transform;
  cursor:grab;
}
.wh-universe-shell.is-dragging, .wh-universe-shell.is-dragging .wh-universe-canvas { cursor:grabbing; }
.wh-universe-lines {
  position:absolute;
  inset:0;
  width:1600px;
  height:1000px;
  overflow:visible;
  pointer-events:none;
  z-index:1;
}
.wh-universe-lines line {
  stroke: color-mix(in srgb,var(--world-accent,#2563eb) 52%,#8fb8ff);
  stroke-width:2.4;
  stroke-linecap:round;
  opacity:.64;
}
.wh-universe-lines line[data-line-type="attached"] {
  stroke-dasharray:7 8;
  opacity:.74;
  stroke-width:2;
}
.wh-universe-node {
  position:absolute;
  z-index:4;
  left:800px;
  top:500px;
  transform:translate(-50%,-50%);
  border:1px solid color-mix(in srgb,var(--world-accent,#2563eb) 22%,#dbe6f7);
  background:rgba(255,255,255,.92);
  color:#0f172a;
  box-shadow:0 18px 44px rgba(15,23,42,.10);
  text-decoration:none;
  user-select:none;
}
.wh-universe-center {
  width:158px;
  height:158px;
  border-radius:38px;
  display:grid;
  place-items:center;
  text-align:center;
  padding:18px;
  color:#fff;
  background:linear-gradient(135deg,var(--world-accent,#2563eb),color-mix(in srgb,var(--world-accent,#2563eb) 58%,#0f172a));
  box-shadow:0 22px 60px color-mix(in srgb,var(--world-accent,#2563eb) 26%,transparent);
}
.wh-universe-center .wh-node-mark { font-size:2.3rem; background:transparent; box-shadow:none; width:auto; height:auto; }
.wh-universe-center strong { display:block; font-size:1.05rem; line-height:1.05; }
.wh-universe-center small { display:block; color:rgba(255,255,255,.82); font-weight:950; }

.wh-discovery-node,
.wh-attached-node {
  display:flex;
  align-items:center;
  gap:10px;
  min-width:190px;
  max-width:230px;
  border-radius:999px;
  padding:10px 14px 10px 10px;
  cursor:pointer;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}
.wh-attached-node {
  z-index:3;
  min-width:150px;
  max-width:195px;
  padding:8px 12px 8px 8px;
  background:rgba(255,255,255,.86);
}
.wh-discovery-node:hover,
.wh-discovery-node.is-selected,
.wh-attached-node:hover {
  transform:translate(-50%,-50%) scale(1.055);
  border-color:color-mix(in srgb,var(--world-accent,#2563eb) 58%,#dbe6f7);
  box-shadow:0 24px 64px rgba(15,23,42,.16);
  background:#fff;
}
.wh-node-mark {
  width:36px;
  height:36px;
  flex:0 0 36px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  font-weight:1000;
  background:linear-gradient(135deg,var(--world-accent,#2563eb),color-mix(in srgb,var(--world-accent,#2563eb) 58%,#0f172a));
  box-shadow:0 0 0 7px color-mix(in srgb,var(--world-accent,#2563eb) 12%,transparent);
}
.wh-attached-node .wh-node-mark { width:28px; height:28px; flex-basis:28px; font-size:.78rem; }
.wh-kind-trail .wh-node-mark { background:linear-gradient(135deg,#7c3aed,#4c1d95); }
.wh-kind-thought .wh-node-mark { background:linear-gradient(135deg,#60a5fa,#2563eb); }
.wh-kind-video .wh-node-mark { background:linear-gradient(135deg,#ef4444,#991b1b); }
.wh-kind-article .wh-node-mark,
.wh-kind-website .wh-node-mark,
.wh-kind-link .wh-node-mark { background:linear-gradient(135deg,#a855f7,#6d28d9); }
.wh-kind-image .wh-node-mark { background:linear-gradient(135deg,#10b981,#047857); }
.wh-node-text { min-width:0; display:block; }
.wh-node-text strong {
  display:block;
  font-size:.88rem;
  line-height:1.05;
  letter-spacing:-.02em;
  max-height:2.2em;
  overflow:hidden;
}
.wh-attached-node .wh-node-text strong { font-size:.78rem; }
.wh-node-text small {
  display:block;
  color:#64748b;
  font-weight:950;
  font-size:.72rem;
  margin-top:3px;
}
.wh-universe-drawer {
  position:absolute;
  right:18px;
  bottom:18px;
  z-index:8;
  width:min(320px, calc(100% - 36px));
  border:1px solid color-mix(in srgb,var(--world-accent,#2563eb) 18%,#dbe6f7);
  border-radius:24px;
  padding:18px;
  background:rgba(255,255,255,.92);
  box-shadow:0 22px 60px rgba(15,23,42,.12);
  backdrop-filter:blur(14px);
}
.wh-universe-drawer h3 { margin:4px 0 8px; font-size:1.25rem; line-height:1.1; }
.wh-universe-drawer p { color:#52637a; margin:0 0 12px; line-height:1.35; }
.wh-drawer-stats {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin:12px 0;
}
.wh-drawer-stats span {
  border:1px solid #dbe6f7;
  border-radius:16px;
  padding:10px;
  background:#f8fbff;
  font-size:.82rem;
  font-weight:850;
  color:#52637a;
}
.wh-drawer-stats strong { display:block; color:#0f172a; font-size:1.1rem; }
@media (max-width: 760px) {
  .wh-universe-shell { min-height:560px; }
  .wh-universe-drawer { position:absolute; left:12px; right:12px; bottom:12px; width:auto; }
  .wh-discovery-node { min-width:170px; max-width:200px; }
  .wh-attached-node { min-width:136px; max-width:170px; }
}

/* Trejji universe cleanup: connections are visible nodes, no obstructive drawer */
.wh-universe-hint {
  position:absolute;
  left:18px;
  bottom:18px;
  z-index:7;
  display:flex;
  flex-direction:column;
  gap:3px;
  max-width:min(420px, calc(100% - 36px));
  border:1px solid color-mix(in srgb,var(--world-accent,#2563eb) 14%,#dbe6f7);
  border-radius:18px;
  padding:10px 14px;
  background:rgba(255,255,255,.84);
  box-shadow:0 14px 42px rgba(15,23,42,.08);
  backdrop-filter:blur(12px);
  color:#52637a;
  pointer-events:none;
}
.wh-universe-hint strong { color:#0f172a; font-size:.88rem; }
.wh-universe-hint span { font-size:.78rem; line-height:1.25; }
.wh-attached-node {
  transform:translate(-50%,-50%) scale(.86);
  opacity:.94;
}
.wh-attached-node:hover {
  transform:translate(-50%,-50%) scale(.94);
}
.wh-discovery-node .wh-node-text small,
.wh-attached-node .wh-node-text small {
  text-transform:none;
}
.wh-universe-lines line[data-line-type="attached"] {
  stroke-dasharray:5 7;
  opacity:.9;
}
@media (max-width: 760px) {
  .wh-universe-hint { left:10px; right:10px; bottom:10px; max-width:none; }
}


/* C2 universe interaction fix: real graph controls, draggable nodes, cleaner spacing */
.wh-universe-controls button[data-universe-action="zoom-in"],
.wh-universe-controls button[data-universe-action="zoom-out"] {
  width:42px;
  height:42px;
  padding:0;
  font-size:1.25rem;
  line-height:1;
}
.wh-universe-node {
  touch-action:none;
  -webkit-tap-highlight-color: transparent;
}
.wh-discovery-node,
.wh-attached-node {
  min-width:132px;
  max-width:190px;
  padding:8px 12px 8px 8px;
}
.wh-discovery-node .wh-node-mark {
  width:30px;
  height:30px;
  flex-basis:30px;
  box-shadow:0 0 0 5px color-mix(in srgb,var(--world-accent,#2563eb) 11%,transparent);
}
.wh-attached-node {
  min-width:112px;
  max-width:158px;
  transform:translate(-50%,-50%) scale(.82);
  border-style:dashed;
  background:rgba(255,255,255,.76);
}
.wh-attached-node .wh-node-mark {
  width:24px;
  height:24px;
  flex-basis:24px;
  font-size:.7rem;
}
.wh-node-text strong {
  font-size:.72rem;
  line-height:1.05;
}
.wh-node-text small {
  font-size:.62rem;
}
.wh-attached-node .wh-node-text strong {
  font-size:.66rem;
}
.wh-universe-node.is-active {
  border-color: color-mix(in srgb,var(--world-accent,#2563eb) 68%,#dbe6f7);
  box-shadow:0 26px 72px rgba(15,23,42,.18), 0 0 0 5px color-mix(in srgb,var(--world-accent,#2563eb) 10%,transparent);
}
.wh-universe-shell {
  min-height:680px;
}
.wh-universe-lines line {
  vector-effect: non-scaling-stroke;
}
.wh-universe-hint {
  font-size:.9rem;
}
@media (max-width: 760px) {
  .wh-universe-shell { min-height:620px; }
  .wh-discovery-node {
    min-width:122px;
    max-width:164px;
  }
  .wh-attached-node {
    min-width:98px;
    max-width:138px;
  }
  .wh-node-text strong { font-size:.64rem; }
  .wh-node-text small { font-size:.56rem; }
}

/* C3: expandable discovery universe nodes */
.wh-attached-node[hidden] {
  display:none !important;
}
.wh-discovery-node.is-expanded {
  border-color:color-mix(in srgb,var(--world-accent,#2563eb) 74%,#dbe6f7);
  background:#fff;
  box-shadow:0 26px 72px rgba(15,23,42,.18), 0 0 0 8px color-mix(in srgb,var(--world-accent,#2563eb) 10%,transparent);
}
.wh-discovery-node.is-expanded .wh-node-mark {
  box-shadow:0 0 0 8px color-mix(in srgb,var(--world-accent,#2563eb) 17%,transparent);
}
.wh-attached-node.is-visible {
  display:flex;
  animation:whNodeAppear .18s ease-out both;
}
@keyframes whNodeAppear {
  from { opacity:0; transform:translate(-50%,-50%) scale(.6); }
  to { opacity:.94; transform:translate(-50%,-50%) scale(.82); }
}
.wh-universe-shell {
  cursor:grab;
}
.wh-universe-shell.is-dragging {
  cursor:grabbing;
}
.wh-universe-lines line[data-line-type="attached"] {
  stroke:color-mix(in srgb,var(--world-accent,#2563eb) 62%,#7c3aed);
  stroke-dasharray:6 8;
}

/* C5 universe pan fix: allow the center node to act as a graph drag handle */
.wh-universe-center[data-pan-handle="1"] {
  cursor: grab;
}
.wh-universe-shell.is-dragging .wh-universe-center[data-pan-handle="1"] {
  cursor: grabbing;
}

/* District Chronicle clean timeline update */
.district-chronicle-clean{
  overflow:hidden;
}
.district-chronicle-clean .district-chronicle-heading{
  align-items:flex-start;
  gap:18px;
}
.district-chronicle-list{
  position:relative;
  display:grid;
  gap:12px;
  margin-top:22px;
  padding-left:18px;
}
.district-chronicle-list:before{
  content:"";
  position:absolute;
  left:18px;
  top:42px;
  bottom:18px;
  width:2px;
  border-radius:999px;
  background:linear-gradient(180deg, rgba(84,132,210,.42), rgba(84,132,210,.08));
}
.district-chronicle-date{
  position:relative;
  z-index:2;
  width:max-content;
  margin:4px 0 2px;
  padding:7px 12px;
  border:1px solid rgba(117,166,240,.32);
  border-radius:999px;
  background:#f4f8ff;
  color:#2563eb;
  font-size:.78rem;
  font-weight:950;
  letter-spacing:.01em;
}
.district-chronicle-card{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:44px minmax(0, 1fr) auto;
  align-items:center;
  gap:14px;
  margin-left:22px;
  padding:14px 16px;
  border:1px solid rgba(117,166,240,.34);
  border-radius:20px;
  background:rgba(255,255,255,.92);
  color:#14213d;
  text-decoration:none;
  box-shadow:0 12px 30px rgba(23,74,145,.065);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.district-chronicle-card:before{
  content:"";
  position:absolute;
  left:-28px;
  top:50%;
  width:11px;
  height:11px;
  transform:translateY(-50%);
  border-radius:999px;
  background:#5b91e8;
  box-shadow:0 0 0 5px rgba(91,145,232,.14);
}
.district-chronicle-card:hover{
  transform:translateY(-2px);
  border-color:rgba(76,126,215,.58);
  box-shadow:0 20px 46px rgba(23,74,145,.14);
}
.district-chronicle-icon{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:16px;
  color:#fff;
  font-weight:1000;
  background:linear-gradient(135deg,#60a5fa,#2563eb);
  box-shadow:0 10px 24px rgba(37,99,235,.20);
}
.district-chronicle-card.content-kind-trail .district-chronicle-icon{
  background:linear-gradient(135deg,#a78bfa,#6d28d9);
}
.district-chronicle-card.content-kind-video .district-chronicle-icon{
  background:linear-gradient(135deg,#fb7185,#dc2626);
}
.district-chronicle-card.content-kind-article .district-chronicle-icon,
.district-chronicle-card.content-kind-link .district-chronicle-icon,
.district-chronicle-card.content-kind-website .district-chronicle-icon{
  background:linear-gradient(135deg,#fbbf24,#d97706);
}
.district-chronicle-card.is-attached .district-chronicle-icon{
  background:linear-gradient(135deg,#38bdf8,#2563eb);
}
.district-chronicle-body{
  display:grid;
  min-width:0;
  gap:3px;
}
.district-chronicle-label{
  width:max-content;
  max-width:100%;
  padding:4px 8px;
  border-radius:999px;
  background:#eef5ff;
  color:#2563eb;
  font-size:.68rem;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.district-chronicle-body strong{
  display:block;
  overflow:hidden;
  color:#0f172a;
  font-size:1.04rem;
  line-height:1.16;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.district-chronicle-body small{
  color:#61708a;
  font-weight:750;
}
.district-chronicle-arrow{
  padding:8px 12px;
  border-radius:999px;
  background:#f2f7ff;
  color:#2563eb;
  font-size:.82rem;
  font-weight:950;
  white-space:nowrap;
}
@media (max-width:760px){
  .district-chronicle-list{padding-left:10px;}
  .district-chronicle-list:before{left:10px;}
  .district-chronicle-card{
    grid-template-columns:38px minmax(0,1fr);
    margin-left:14px;
    padding:12px;
  }
  .district-chronicle-card:before{left:-20px;}
  .district-chronicle-icon{width:38px;height:38px;border-radius:14px;}
  .district-chronicle-arrow{grid-column:2;width:max-content;margin-top:4px;}
  .district-chronicle-body strong{white-space:normal;}
}

/* My Worlds command-center facelift */
.my-worlds-page{
  width:min(1180px, calc(100% - 48px));
  margin:34px auto 72px;
  display:grid;
  gap:24px;
}
.my-worlds-command{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr);
  gap:clamp(22px,4vw,46px);
  align-items:center;
  padding:clamp(28px,5vw,56px);
  border:1px solid #cfe0ff;
  border-radius:34px;
  background:
    radial-gradient(circle at 78% 18%, rgba(96,165,250,.22), transparent 34%),
    radial-gradient(circle at 10% 8%, rgba(37,99,235,.10), transparent 28%),
    linear-gradient(135deg,#fff,#f7fbff);
  box-shadow:0 28px 80px rgba(33,86,155,.10);
}
.my-worlds-command:after{
  content:"TREJJI";
  position:absolute;
  right:-16px;
  bottom:-24px;
  color:rgba(37,99,235,.045);
  font-size:clamp(5rem,14vw,13rem);
  font-weight:1000;
  letter-spacing:-.08em;
  pointer-events:none;
}
.my-worlds-copy{position:relative;z-index:1;}
.my-worlds-copy h1{
  margin:.12em 0 .12em;
  font-size:clamp(3rem,8vw,7rem);
  line-height:.88;
  letter-spacing:-.075em;
}
.my-worlds-lede{
  max-width:650px;
  color:#4f627d;
  font-size:clamp(1rem,1.4vw,1.18rem);
  line-height:1.55;
}
.my-worlds-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;}
.my-worlds-stat-orbit{
  position:relative;z-index:1;
  display:grid;
  grid-template-columns:repeat(2,minmax(130px,1fr));
  gap:14px;
}
.my-worlds-stat-card{
  padding:20px;
  min-height:118px;
  display:grid;
  align-content:center;
  border:1px solid #d5e3ff;
  border-radius:24px;
  background:rgba(255,255,255,.82);
  box-shadow:0 16px 38px rgba(33,86,155,.08);
  backdrop-filter: blur(8px);
}
.my-worlds-stat-card strong{
  display:block;
  font-size:clamp(2rem,4vw,3.4rem);
  line-height:.9;
  letter-spacing:-.06em;
}
.my-worlds-stat-card span{
  margin-top:8px;
  color:#5f7089;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.075em;
  font-size:.8rem;
}
.my-worlds-panel{
  padding:clamp(22px,3.5vw,36px);
  border:1px solid #cfe0ff;
  border-radius:30px;
  background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(248,251,255,.94));
  box-shadow:0 22px 60px rgba(33,86,155,.075);
}
.my-worlds-section-head{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:flex-start;
  margin-bottom:20px;
}
.my-worlds-section-head h2{
  margin:.15em 0 .2em;
  font-size:clamp(1.7rem,3vw,2.6rem);
  letter-spacing:-.055em;
}
.owned-worlds-grid,.followed-worlds-grid-v2{display:grid;gap:18px;}
.owned-world-tile,.followed-world-tile{
  position:relative;
  overflow:hidden;
  border:1px solid color-mix(in srgb, var(--world-accent,#6aa6ff) 28%, #d7e6ff);
  border-radius:28px;
  background:#fff;
  box-shadow:0 18px 46px rgba(33,86,155,.07);
}
.owned-world-banner,.followed-world-banner{
  display:block;
  min-height:160px;
  background:
    radial-gradient(circle at 15% 15%, color-mix(in srgb, var(--world-accent,#6aa6ff) 26%, white), transparent 34%),
    linear-gradient(135deg,#eaf3ff,#ffffff);
  background-size:cover;
  background-position:center;
  text-decoration:none;
  color:transparent;
}
.owned-world-banner.has-image,.followed-world-banner.has-image{background-size:cover;background-position:center;}
.owned-world-banner.has-image:after,.followed-world-banner.has-image:after{
  content:"";position:absolute;left:0;right:0;top:0;height:160px;
  background:linear-gradient(180deg,rgba(15,23,42,.04),rgba(15,23,42,.18));
  pointer-events:none;
}
.owned-world-ghost{
  position:absolute;left:24px;bottom:calc(100% - 132px);
  color:rgba(255,255,255,.55);
  font-size:clamp(2.8rem,7vw,6rem);
  line-height:.8;
  font-weight:1000;
  letter-spacing:-.08em;
  text-transform:uppercase;
  max-width:85%;
  text-shadow:0 10px 30px rgba(15,23,42,.16);
}
.owned-world-body,.followed-world-content{
  position:relative;
  display:grid;
  grid-template-columns:86px minmax(0,1fr);
  gap:18px;
  padding:0 24px 24px;
  margin-top:-42px;
}
.owned-world-avatar,.followed-world-avatar,.recent-entry-avatar{
  width:86px;height:86px;
  border-radius:26px;
  display:grid;place-items:center;
  background:linear-gradient(135deg,var(--world-accent,#6aa6ff),#2563eb);
  color:#fff;
  font-weight:1000;
  font-size:2rem;
  border:5px solid #fff;
  box-shadow:0 18px 38px rgba(15,23,42,.16);
  text-decoration:none;
  background-size:cover;background-position:center;
}
.owned-world-avatar.has-image,.followed-world-avatar.has-image,.recent-entry-avatar.has-image{color:transparent;}
.owned-world-main,.followed-world-content > div:last-child{padding-top:48px;}
.owned-world-type{
  color:#2563eb;
  font-size:.74rem;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin:0 0 4px;
}
.owned-world-main h3,.followed-world-content h3{margin:0 0 4px;font-size:clamp(1.45rem,2.2vw,2rem);letter-spacing:-.045em;}
.owned-world-main h3 a,.followed-world-content h3 a{text-decoration:none;color:var(--text);}
.owned-world-main p:not(.owned-world-type),.followed-world-content p:not(.owned-world-type){color:#546783;line-height:1.5;max-width:760px;}
.owned-world-metrics{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0;}
.owned-world-metrics span{
  padding:8px 12px;
  border:1px solid #d7e6ff;
  border-radius:999px;
  background:#f8fbff;
  color:#526781;
  font-weight:800;
}
.owned-world-metrics strong{color:#111827;}
.owned-world-actions,.followed-world-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;}
.my-worlds-empty-state{
  padding:34px;
  border:1px dashed #b9d3ff;
  border-radius:24px;
  background:#f8fbff;
}
.my-worlds-empty-state h3{font-size:2rem;letter-spacing:-.04em;margin:.2em 0;}
.recent-entry-strip{display:flex;gap:12px;overflow:auto;padding-bottom:4px;}
.recent-entry-pill{
  min-width:230px;
  display:flex;
  gap:12px;
  align-items:center;
  padding:12px;
  border:1px solid #d7e6ff;
  border-radius:22px;
  background:#fff;
  color:var(--text);
  text-decoration:none;
  box-shadow:0 12px 26px rgba(33,86,155,.055);
}
.recent-entry-avatar{width:54px;height:54px;border-radius:18px;border-width:3px;font-size:1.1rem;box-shadow:0 10px 24px rgba(15,23,42,.12);}
.recent-entry-pill strong,.recent-entry-pill small{display:block;}
.recent-entry-pill small{color:#64748b;font-weight:800;margin-top:2px;}
.followed-worlds-grid-v2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));}
.followed-world-tile .followed-world-banner{min-height:140px;}
.followed-world-content{grid-template-columns:70px 1fr;padding:0 20px 22px;margin-top:-35px;}
.followed-world-avatar{width:70px;height:70px;border-radius:22px;font-size:1.45rem;}
.followed-world-content > div:last-child{padding-top:40px;}
@media (max-width:860px){
  .my-worlds-page{width:min(100% - 24px,1180px);margin-top:20px;}
  .my-worlds-command{grid-template-columns:1fr;padding:26px;}
  .my-worlds-stat-orbit{grid-template-columns:repeat(2,minmax(0,1fr));}
  .owned-world-body{grid-template-columns:1fr;margin-top:-56px;}
  .owned-world-main{padding-top:0;}
  .owned-world-avatar{width:82px;height:82px;}
  .my-worlds-section-head{display:block;}
  .my-worlds-section-head .button{margin-top:10px;}
}
@media (max-width:520px){
  .my-worlds-stat-orbit{grid-template-columns:1fr;}
  .owned-world-banner{min-height:132px;}
  .owned-world-banner.has-image:after{height:132px;}
  .owned-world-body,.followed-world-content{padding-left:16px;padding-right:16px;}
  .followed-worlds-grid-v2{grid-template-columns:1fr;}
}

/* C52: Conversation launcher + trail reader polish */
.conversation-launcher {
  margin-top: 1.2rem;
  padding: 1.25rem;
  border: 1px solid color-mix(in srgb, var(--world-accent, #2563eb) 20%, #dbe7ff);
  border-radius: 24px;
  background: linear-gradient(180deg, #fff, color-mix(in srgb, var(--world-accent, #2563eb) 3%, white));
}
.conversation-launcher-head {
  align-items: center;
  margin-bottom: 1rem;
}
.conversation-launcher-head h3 {
  font-size: clamp(1.45rem, 2vw, 2.05rem);
  letter-spacing: -.045em;
}
.conversation-start-form {
  grid-template-columns: minmax(0,1fr) auto;
  align-items: stretch;
  gap: .75rem;
}
.conversation-start-form textarea {
  min-height: 92px;
  border-radius: 20px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75);
}
.conversation-start-form .button {
  align-self: end;
  min-height: 48px;
  white-space: nowrap;
}
.conversation-trail-grid {
  grid-template-columns: 1fr;
  gap: .75rem;
}
.conversation-trail-card {
  padding: .8rem;
  gap: .6rem;
  border-radius: 20px;
}
.conversation-trail-main {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr);
  gap: .75rem;
  align-items: center;
  color: inherit;
  text-decoration: none;
}
.conversation-trail-main strong {
  display: block;
  color: var(--text);
  font-size: 1.02rem;
  line-height: 1.15;
  letter-spacing: -.025em;
}
.conversation-trail-main em {
  display: block;
  margin-top: .25rem;
  color: var(--muted);
  font-style: normal;
  font-weight: 850;
  font-size: .84rem;
}
.conversation-trail-card .path-card-meta {
  padding-left: 50px;
  align-items: center;
}
.conversation-trail-card .path-card-meta a {
  color: var(--accent);
  font-weight: 1000;
  text-decoration: none;
}
.conversation-empty-state {
  display: grid;
  gap: .25rem;
  background: color-mix(in srgb, var(--world-accent, #2563eb) 4%, white);
  color: var(--text);
}
.conversation-empty-state span { color: var(--muted); font-weight: 800; }
.trail-reader-subtitle {
  margin: .55rem 0 0;
  color: var(--muted);
  font-weight: 850;
  max-width: 62ch;
}
.trail-reader {
  border-radius: 30px;
  background:
    radial-gradient(circle at 82% 0%, color-mix(in srgb, var(--world-accent, #2563eb) 8%, transparent), transparent 35%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(247,250,255,.95));
}
.trail-reader-grid {
  grid-template-columns: 250px minmax(0, 1fr);
  min-height: 0;
}
.trail-sidebar {
  background: linear-gradient(180deg, color-mix(in srgb, var(--world-accent, #2563eb) 5%, white), #fff);
}
.trail-reading-pane { padding: 1.35rem; }
.trail-page-stage {
  grid-template-columns: 40px minmax(0,1fr) 40px;
}
.trail-pages { min-height: 0; }
.trail-page {
  max-width: 760px;
  margin: 0 auto;
  padding: clamp(1.1rem, 2.4vw, 2rem);
}
.trail-page-body {
  font-size: clamp(1.55rem, 2.35vw, 2.35rem);
  line-height: 1.08;
}
.trail-controls {
  border-bottom: 0;
  padding: 1rem 0 .6rem;
}
.trail-response-card {
  max-width: 860px;
  margin: 0 auto;
  padding: 1rem;
  border: 1px solid color-mix(in srgb, var(--world-accent, #2563eb) 16%, #dbe7ff);
  border-radius: 24px;
  background: rgba(255,255,255,.72);
  grid-template-columns: minmax(180px, 260px) 1fr;
}
.trail-response-card h2 {
  font-size: clamp(1.35rem, 2vw, 1.8rem);
}
.trail-response-form .button {
  justify-self: stretch;
}
.trail-branch-drawer.is-open { transform: translateX(0) !important; }
.trail-branch-drawer[hidden] { display: none !important; }
@media (max-width: 860px) {
  .conversation-launcher { padding: 1rem; }
  .conversation-start-form { grid-template-columns: 1fr; }
  .conversation-start-form .button { width: 100%; }
  .trail-reader-grid { grid-template-columns: 1fr; }
  .trail-sidebar { padding: .9rem; }
  .trail-step-list { display: flex; overflow-x: auto; gap: .65rem; padding-bottom: .25rem; }
  .trail-step-link { min-width: 220px; }
  .trail-reading-pane { padding: .9rem; }
  .trail-response-card { grid-template-columns: 1fr; padding: 1rem; }
  .trail-controls .button, .trail-controls .mini-button { flex: 1 1 44%; justify-content: center; }
}
@media (max-width: 520px) {
  .conversation-trail-card .path-card-meta { padding-left: 0; }
  .trail-reader-topbar { flex-direction: column; }
  .trail-page-meta-top { align-items: flex-start; flex-direction: column; }
  .trail-controls .button, .trail-controls .mini-button { flex-basis: 100%; }
}


/* Conversation reader no-jump polish */
.trail-pages {
  align-items: start !important;
  transition: min-height .12s ease;
}

.trail-page {
  width: 100%;
}

.trail-controls .button,
.trail-controls .mini-button {
  min-width: 8.5rem;
}

.trail-nav-side {
  min-width: 40px;
  min-height: 40px;
}

.trail-reading-pane {
  overflow-anchor: none;
}

.trail-reader {
  overflow-anchor: none;
}

/* Content studio tightening: compact parent discovery picker */
.world-studio-narrow {
  width: min(100% - 28px, 960px);
}
.world-form-shell .studio-panel.soft-panel {
  padding: 18px;
  border-radius: 22px;
}
.world-form-shell .studio-panel h2 {
  margin: 2px 0 10px;
  font-size: clamp(1.08rem, 2.2vw, 1.35rem);
  letter-spacing: -.02em;
}
.world-content-form {
  gap: 14px;
}
.step-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}
.compact-button {
  padding: 8px 12px;
  font-size: .86rem;
  white-space: nowrap;
}
.parent-picker-panel[hidden] {
  display: none !important;
}
.parent-picker-panel.is-active {
  border-color: color-mix(in srgb, var(--world-accent, var(--accent)) 28%, var(--line));
  box-shadow: 0 18px 48px rgba(15, 23, 42, .07);
}
.parent-search-label {
  margin: 0 0 10px;
}
.parent-picker-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  margin-bottom: 10px;
  border: 1px solid color-mix(in srgb, var(--world-accent, var(--accent)) 22%, var(--line));
  border-radius: 16px;
  background: linear-gradient(135deg, #fff, color-mix(in srgb, var(--world-accent, var(--accent)) 7%, #fff));
}
.parent-picker-summary strong {
  font-size: .98rem;
}
.parent-picker-summary span {
  color: var(--muted);
  font-weight: 800;
  font-size: .86rem;
  text-align: right;
}
.parent-discovery-list {
  display: grid;
  gap: 8px;
  max-height: 292px;
  overflow: auto;
  padding: 2px 4px 2px 0;
  overscroll-behavior: contain;
}
.parent-discovery-option {
  appearance: none;
  width: 100%;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 11px;
  align-items: center;
  text-align: left;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  color: var(--text);
  cursor: pointer;
  transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.parent-discovery-option:hover,
.parent-discovery-option:focus-visible {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--world-accent, var(--accent)) 34%, var(--line));
  box-shadow: 0 12px 26px rgba(15, 23, 42, .07);
  outline: none;
}
.parent-discovery-option.selected {
  background: color-mix(in srgb, var(--world-accent, var(--accent)) 9%, #fff);
  border-color: color-mix(in srgb, var(--world-accent, var(--accent)) 55%, var(--line));
  box-shadow: 0 14px 32px color-mix(in srgb, var(--world-accent, var(--accent)) 13%, transparent);
}
.parent-node-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: #fff;
  background: linear-gradient(135deg, var(--world-accent, var(--accent)), color-mix(in srgb, var(--world-accent, var(--accent)) 62%, #111827));
  font-weight: 900;
}
.parent-node-copy {
  min-width: 0;
}
.parent-node-copy strong,
.parent-node-copy small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.parent-node-copy strong {
  font-size: .96rem;
  letter-spacing: -.01em;
}
.parent-node-copy small {
  color: var(--muted);
  font-size: .82rem;
  margin-top: 2px;
}
.parent-node-state {
  padding: 6px 10px;
  border-radius: 999px;
  background: #eef4ff;
  color: color-mix(in srgb, var(--world-accent, var(--accent)) 76%, #111827);
  font-size: .78rem;
  font-weight: 900;
}
.parent-discovery-option.selected .parent-node-state {
  background: var(--world-accent, var(--accent));
  color: #fff;
}
.parent-picker-empty {
  padding: 14px;
  border: 1px dashed var(--line);
  border-radius: 16px;
  color: var(--muted);
  background: #f8fbff;
  font-weight: 700;
}
@media (max-width: 720px) {
  .step-panel-head,
  .parent-picker-summary {
    flex-direction: column;
    align-items: stretch;
  }
  .parent-picker-summary span {
    text-align: left;
  }
  .parent-discovery-option {
    grid-template-columns: 38px minmax(0, 1fr);
  }
  .parent-node-state {
    grid-column: 2;
    width: fit-content;
  }
}


/* === Trejji homepage + dashboard polish v2 === */
.landing-v2,
.creator-dashboard-v2{
  width:min(1180px, calc(100% - 44px));
  margin:36px auto 74px;
  display:grid;
  gap:26px;
}
.landing-hero-v2,
.creator-hero-v2{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  gap:clamp(26px,5vw,58px);
  align-items:center;
  padding:clamp(34px,6vw,70px);
  border:1px solid #cfe0ff;
  border-radius:36px;
  background:
    radial-gradient(circle at 82% 12%, rgba(96,165,250,.25), transparent 34%),
    radial-gradient(circle at 8% 16%, rgba(37,99,235,.10), transparent 28%),
    linear-gradient(135deg,#fff,#f7fbff);
  box-shadow:0 30px 90px rgba(33,86,155,.12);
}
.landing-hero-v2:after,
.creator-hero-v2:after{
  content:"TREJJI";
  position:absolute;
  right:-28px;
  bottom:-30px;
  color:rgba(37,99,235,.045);
  font-size:clamp(5rem,14vw,13rem);
  font-weight:1000;
  letter-spacing:-.08em;
  pointer-events:none;
}
.landing-copy-v2,
.creator-hero-copy-v2,
.landing-universe-card-v2,
.creator-stat-grid-v2{position:relative;z-index:1}
.landing-copy-v2 h1,
.creator-hero-copy-v2 h1{
  margin:.1em 0 .18em;
  font-size:clamp(3.3rem,9vw,8rem);
  line-height:.86;
  letter-spacing:-.075em;
  color:#101827;
  max-width:820px;
}
.creator-hero-copy-v2 h1{font-size:clamp(3rem,7vw,6.6rem)}
.landing-lede-v2,
.creator-hero-copy-v2 p{
  max-width:720px;
  color:#52657f;
  font-size:clamp(1.05rem,1.6vw,1.25rem);
  line-height:1.55;
}
.landing-actions-v2,
.creator-actions-v2,
.creator-next-actions-v2{
  display:flex;
  gap:.7rem;
  flex-wrap:wrap;
  align-items:center;
  margin-top:1.35rem;
}
.landing-proof-row{
  display:flex;
  gap:.6rem;
  flex-wrap:wrap;
  margin-top:1.2rem;
}
.landing-proof-row span{
  display:inline-flex;
  align-items:center;
  padding:.5rem .7rem;
  border:1px solid #d5e5ff;
  border-radius:999px;
  background:rgba(255,255,255,.72);
  color:#52657f;
  font-weight:800;
  font-size:.86rem;
}
.landing-universe-card-v2{
  min-height:430px;
  border:1px solid #cfe0ff;
  border-radius:32px;
  background:
    radial-gradient(circle at 50% 50%, rgba(96,165,250,.20), transparent 23%),
    linear-gradient(135deg,rgba(255,255,255,.88),rgba(244,249,255,.9));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.65),0 28px 75px rgba(33,86,155,.10);
}
.landing-orbit{
  position:absolute;
  inset:14%;
  border:2px dashed rgba(96,165,250,.35);
  border-radius:50%;
}
.landing-orbit-two{inset:26%;opacity:.72}
.landing-core-v2{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:154px;
  height:154px;
  border-radius:34px;
  display:grid;
  place-items:center;
  text-align:center;
  align-content:center;
  gap:.18rem;
  color:#fff;
  background:linear-gradient(145deg,#6aa6ff,#3973d1);
  box-shadow:0 24px 55px rgba(37,99,235,.24);
  font-weight:950;
}
.landing-core-v2 span{font-size:2.1rem}
.landing-core-v2 small{opacity:.9;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}
.landing-node-v2{
  position:absolute;
  width:172px;
  padding:1rem;
  border:1px solid #bfd8ff;
  border-radius:22px;
  background:rgba(255,255,255,.92);
  box-shadow:0 22px 52px rgba(33,86,155,.11);
}
.landing-node-v2 b{display:block;color:#101827}
.landing-node-v2 small{display:block;color:#60718c;margin-top:.25rem;font-weight:750}
.landing-node-a{left:7%;top:18%}
.landing-node-b{right:7%;top:30%}
.landing-node-c{left:32%;bottom:9%}
.landing-grid-v2,
.creator-dashboard-grid-v2{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.landing-feature-v2,
.creator-panel-v2,
.creator-focus-v2,
.creator-path-v2,
.landing-path-v2,
.landing-cta-v2{
  border:1px solid #cfe0ff;
  border-radius:28px;
  background:linear-gradient(135deg,#fff,#f8fbff);
  box-shadow:0 22px 65px rgba(33,86,155,.08);
}
.landing-feature-v2{padding:24px}
.landing-step-v2{
  display:inline-grid;
  place-items:center;
  width:44px;
  height:34px;
  border-radius:999px;
  background:#eef5ff;
  color:#2563eb;
  font-weight:950;
  margin-bottom:1rem;
}
.landing-feature-v2 h2{font-size:1.25rem;margin:.25rem 0 .45rem}
.landing-feature-v2 p{margin:0;color:#52657f;line-height:1.5}
.landing-path-v2,
.landing-cta-v2,
.creator-path-v2{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);
  gap:1.25rem;
  align-items:center;
  padding:clamp(24px,4vw,42px);
}
.landing-path-v2 h2,
.landing-cta-v2 h2,
.creator-path-v2 h2{font-size:clamp(2rem,4vw,4rem);line-height:1;letter-spacing:-.055em;margin:.15em 0}
.landing-path-v2 p,
.landing-cta-v2 p,
.creator-path-v2 p{color:#52657f;line-height:1.55;max-width:680px}
.landing-path-chain{
  display:grid;
  gap:.7rem;
}
.landing-path-chain span{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:58px;
  border:1px solid #bfd8ff;
  border-radius:18px;
  background:#fff;
  color:#1f4d96;
  font-weight:950;
  box-shadow:0 12px 30px rgba(37,99,235,.07);
}
.landing-cta-v2{display:block;text-align:center}
.landing-cta-v2 p{margin-left:auto;margin-right:auto}
.creator-stat-grid-v2{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.creator-stat-grid-v2 div{
  min-height:122px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:1.2rem;
  border:1px solid #bfd8ff;
  border-radius:24px;
  background:rgba(255,255,255,.80);
  box-shadow:0 18px 50px rgba(37,99,235,.08);
}
.creator-stat-grid-v2 strong{font-size:clamp(2.3rem,5vw,4.2rem);line-height:1;color:#101827;letter-spacing:-.06em}
.creator-stat-grid-v2 span{color:#52657f;font-weight:900;text-transform:uppercase;letter-spacing:.06em;font-size:.78rem}
.creator-focus-v2,
.creator-panel-v2,
.creator-path-v2{padding:clamp(22px,3.4vw,34px)}
.creator-section-head-v2{
  display:flex;
  gap:1rem;
  justify-content:space-between;
  align-items:flex-start;
  margin-bottom:1rem;
}
.creator-section-head-v2 h2{margin:.15rem 0;font-size:clamp(1.6rem,3vw,2.6rem);line-height:1;letter-spacing:-.04em}
.creator-section-head-v2 p{margin:.2rem 0 0;color:#52657f}
.creator-section-head-v2.compact h2{font-size:1.7rem}
.creator-build-grid-v2{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.creator-build-card-v2{
  padding:1rem;
  border:1px solid #d5e5ff;
  border-radius:22px;
  background:#fff;
}
.creator-world-title-v2,
.creator-world-row-v2{
  display:flex;
  align-items:center;
  gap:.85rem;
  text-decoration:none;
  color:inherit;
}
.creator-world-title-v2 small,
.creator-world-row-v2 small{display:block;color:#60718c;margin-top:.18rem;line-height:1.3}
.creator-dashboard-grid-v2{grid-template-columns:repeat(2,minmax(0,1fr))}
.creator-world-row-v2{
  position:relative;
  padding:.86rem;
  border:1px solid #d5e5ff;
  border-radius:18px;
  background:#fff;
  margin:.65rem 0;
  transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.creator-world-row-v2:hover{
  transform:translateY(-2px);
  border-color:#8bbcff;
  box-shadow:0 14px 35px rgba(37,99,235,.09);
}
.creator-world-row-v2 em{
  margin-left:auto;
  padding:.42rem .64rem;
  border-radius:999px;
  background:#eef5ff;
  color:#2563eb;
  font-style:normal;
  font-weight:950;
  font-size:.78rem;
}
@media (max-width: 980px){
  .landing-hero-v2,
  .creator-hero-v2,
  .landing-path-v2,
  .creator-path-v2{
    grid-template-columns:1fr;
  }
  .landing-grid-v2,
  .creator-build-grid-v2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .creator-dashboard-grid-v2{grid-template-columns:1fr}
}
@media (max-width: 640px){
  .landing-v2,
  .creator-dashboard-v2{width:min(100% - 22px,1180px);margin-top:18px}
  .landing-hero-v2,
  .creator-hero-v2{padding:26px;border-radius:28px}
  .landing-copy-v2 h1,
  .creator-hero-copy-v2 h1{font-size:clamp(3rem,16vw,5rem)}
  .landing-universe-card-v2{min-height:340px}
  .landing-node-v2{width:145px;padding:.8rem}
  .landing-grid-v2,
  .creator-build-grid-v2,
  .creator-stat-grid-v2{grid-template-columns:1fr}
  .creator-section-head-v2{display:block}
  .creator-section-head-v2 .button{margin-top:.85rem}
}

/* WYSIWYG rich-text editor */
.wysiwyg-editor {
  border: 1px solid var(--border, #d7dce5);
  border-radius: 12px;
  background: var(--surface, #fff);
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}
.wysiwyg-editor:focus-within {
  border-color: var(--accent, #2563eb);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent, #2563eb) 14%, transparent);
}
.wysiwyg-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 3px;
  min-height: 46px;
  padding: 6px 8px;
  border-bottom: 1px solid var(--border, #d7dce5);
  background: var(--surface-soft, #f8fafc);
}
.wysiwyg-format-wrap {
  display: inline-flex;
  align-items: center;
  margin: 0;
  line-height: normal;
}
.wysiwyg-format {
  width: auto;
  min-width: 122px;
  height: 36px;
  margin: 0;
  padding: 6px 32px 6px 11px;
  border: 1px solid transparent;
  border-radius: 7px;
  background-color: transparent;
  color: inherit;
  font: inherit;
  font-size: .9rem;
  line-height: 1.25;
  vertical-align: middle;
  cursor: pointer;
}
.wysiwyg-format:hover,
.wysiwyg-format:focus {
  border-color: var(--border, #cbd5e1);
  background-color: var(--surface, #fff);
  outline: none;
}
.wysiwyg-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  width: 34px;
  height: 34px;
  min-width: 34px;
  min-height: 34px;
  margin: 0;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: var(--text, #172033);
  font: inherit;
  line-height: 1;
  cursor: pointer;
  box-shadow: none;
}
.wysiwyg-button:hover,
.wysiwyg-button:focus-visible {
  border-color: var(--border, #cbd5e1);
  background: var(--surface, #fff);
  outline: none;
}
.wysiwyg-button.is-active {
  border-color: color-mix(in srgb, var(--accent, #2563eb) 35%, var(--border, #cbd5e1));
  background: color-mix(in srgb, var(--accent, #2563eb) 12%, var(--surface, #fff));
  color: var(--accent, #2563eb);
}
.wysiwyg-button-wide { width: 44px; }
.wysiwyg-clear { width: auto; padding: 0 9px; font-size: .84rem; }
.wysiwyg-lines { font-size: .62rem; transform: scaleX(.85); opacity: .8; }
.wysiwyg-separator {
  width: 1px;
  height: 22px;
  margin: 0 4px;
  background: var(--border, #d7dce5);
}
.wysiwyg-surface {
  min-height: 220px;
  padding: 16px 18px;
  background: var(--surface, #fff);
  color: var(--text, #172033);
  font: inherit;
  font-size: 1rem;
  line-height: 1.65;
  outline: none;
  overflow-wrap: anywhere;
  white-space: normal;
}
.wysiwyg-surface.has-error { box-shadow: inset 0 0 0 2px #dc2626; }
.wysiwyg-surface:empty::before {
  content: attr(data-placeholder);
  color: var(--muted, #758095);
  pointer-events: none;
}
.wysiwyg-surface p { margin: 0 0 .8em; }
.wysiwyg-surface p:last-child { margin-bottom: 0; }
.wysiwyg-surface h2 {
  margin: .9em 0 .4em;
  font-size: 1.55rem;
  line-height: 1.25;
  font-weight: 750;
}
.wysiwyg-surface h3 {
  margin: .8em 0 .35em;
  font-size: 1.25rem;
  line-height: 1.3;
  font-weight: 700;
}
.wysiwyg-surface ul,
.wysiwyg-surface ol { margin: .7em 0; padding-left: 1.55rem; }
.wysiwyg-surface li { margin: .25em 0; }
.wysiwyg-surface blockquote {
  margin: .85em 0;
  padding: .65rem 1rem;
  border-left: 4px solid var(--accent, #2563eb);
  border-radius: 0 8px 8px 0;
  background: var(--surface-soft, #f8fafc);
  color: var(--muted-dark, #475569);
}
.wysiwyg-surface a { color: var(--accent, #2563eb); text-decoration: underline; }
.wysiwyg-source { display: none !important; }
.rich-text-content p:first-child,
.rich-text-content h2:first-child,
.rich-text-content h3:first-child,
.rich-text-content blockquote:first-child { margin-top: 0; }
.rich-text-content p:last-child,
.rich-text-content ul:last-child,
.rich-text-content ol:last-child,
.rich-text-content blockquote:last-child { margin-bottom: 0; }
.rich-text-content h2 { font-size: 1.45rem; margin: 1.1em 0 .45em; }
.rich-text-content h3 { font-size: 1.18rem; margin: 1em 0 .4em; }
.rich-text-content ul, .rich-text-content ol { padding-left: 1.5rem; }
.rich-text-content blockquote {
  margin: 1rem 0;
  padding: .65rem 1rem;
  border-left: 4px solid var(--accent, #6aa6ff);
  background: var(--surface-soft, #f6f8fb);
}
.rich-text-content a { text-decoration: underline; overflow-wrap: anywhere; }
@media (max-width: 640px) {
  .wysiwyg-toolbar { padding: 5px; gap: 2px; }
  .wysiwyg-format { min-width: 110px; }
  .wysiwyg-separator { margin: 0 2px; }
  .wysiwyg-surface { min-height: 190px; padding: 14px; }
}

/* Rich-text toolbar alignment correction */
.wysiwyg-toolbar .wysiwyg-format-wrap {
  display: inline-flex;
  align-items: center;
  height: 38px;
  margin: 0;
}
.wysiwyg-toolbar .wysiwyg-format {
  box-sizing: border-box;
  display: block;
  width: 164px;
  min-width: 164px;
  height: 38px;
  min-height: 38px;
  margin: 0;
  padding: 0 34px 0 12px;
  border: 1px solid var(--border, #cbd5e1);
  border-radius: 12px;
  background-color: var(--surface, #fff);
  color: var(--text, #0f172a);
  font-family: inherit;
  font-size: .92rem;
  font-weight: 700;
  line-height: 38px;
  vertical-align: middle;
  appearance: auto;
  -webkit-appearance: menulist;
}
.wysiwyg-toolbar .wysiwyg-format:hover,
.wysiwyg-toolbar .wysiwyg-format:focus {
  border-color: var(--accent, #2563eb);
  background-color: var(--surface, #fff);
}
@media (max-width: 640px) {
  .wysiwyg-toolbar .wysiwyg-format {
    width: 146px;
    min-width: 146px;
  }
}

/* District manager ordering */
.district-manager-list {
  display: grid;
  gap: 14px;
}
.district-manager-row {
  position: relative;
  padding-left: 72px;
  transition: transform .16s ease, box-shadow .16s ease, opacity .16s ease;
}
.district-manager-row.is-dragging {
  opacity: .62;
  transform: scale(.995);
  box-shadow: 0 14px 34px rgba(31, 56, 104, .16);
}
.district-sort-controls {
  position: absolute;
  left: 14px;
  top: 14px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
  width: 44px;
}
.district-drag-handle,
.district-move-button {
  border: 1px solid color-mix(in srgb, var(--accent) 24%, #d9e1ee);
  background: color-mix(in srgb, var(--accent) 7%, #fff);
  color: #243654;
  border-radius: 9px;
  min-height: 30px;
  padding: 0;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.district-drag-handle {
  grid-column: 1 / -1;
  cursor: grab;
  letter-spacing: -2px;
}
.district-drag-handle:active { cursor: grabbing; }
.district-move-button:hover,
.district-drag-handle:hover {
  background: color-mix(in srgb, var(--accent) 14%, #fff);
}
@media (max-width: 700px) {
  .district-manager-row { padding-left: 58px; }
  .district-sort-controls { left: 8px; top: 10px; width: 40px; }
  .district-drag-handle { display: none; }
  .district-sort-controls { grid-template-columns: 1fr; }
  .district-move-button { min-height: 34px; }
}

/* Related Space connection management */
.portal-card-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 0 14px 14px;
}
.portal-edit-link {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 7px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--text);
  background: #fff;
  font-size: .86rem;
  font-weight: 800;
  text-decoration: none;
}
.portal-edit-link:hover { border-color: var(--world-accent); color: var(--world-accent); }
.portal-card-actions .portal-delete-form { margin: 0; }


/* Creator-selected Related Spaces: public, useful destination cards */
.related-space-card-wrap {
  min-width: 0;
}
.related-space-card {
  display: block;
  overflow: hidden;
  height: 100%;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #fff;
  color: var(--text);
  text-decoration: none;
  box-shadow: 0 16px 38px rgba(15, 23, 42, .07);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.related-space-card:hover {
  transform: translateY(-3px);
  border-color: color-mix(in srgb, var(--world-accent) 45%, var(--line));
  box-shadow: 0 20px 44px rgba(15, 23, 42, .11);
}
.related-space-banner {
  height: 104px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--world-accent) 42%, #111827), #111827);
  background-position: center;
  background-size: cover;
}
.related-space-body {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 16px;
  padding: 0 20px 22px;
}
.related-space-avatar {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  margin-top: -28px;
  border: 4px solid #fff;
  border-radius: 20px;
  background: var(--world-accent);
  background-position: center;
  background-size: cover;
  color: #fff;
  font-size: 1.25rem;
  font-weight: 900;
  box-shadow: 0 10px 22px rgba(15, 23, 42, .17);
}
.related-space-avatar.has-image { color: transparent; }
.related-space-copy { padding-top: 17px; min-width: 0; }
.related-space-kicker {
  display: block;
  margin-bottom: 5px;
  color: var(--world-accent);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.related-space-card h3 { margin: 0 0 4px; font-size: 1.2rem; }
.related-space-card p { margin: 0 0 14px; color: var(--muted); line-height: 1.5; }
.related-space-card .related-space-name { margin-bottom: 8px; color: var(--text); font-size: .9rem; font-weight: 750; }
.related-space-cta { color: var(--world-accent); font-weight: 850; }
.related-space-card:hover .related-space-cta span { display: inline-block; transform: translateX(3px); }
@media (max-width: 620px) {
  .related-space-body { grid-template-columns: 52px minmax(0, 1fr); gap: 12px; padding: 0 16px 18px; }
  .related-space-avatar { width: 52px; height: 52px; border-radius: 16px; }
  .related-space-banner { height: 88px; }
}

/* Related Space connection picker */
.field-help { margin: 8px 0 0; color: var(--muted); font-size: .9rem; }
.is-hidden { display: none !important; }
.space-picker-results { display: grid; gap: 8px; margin-top: 10px; max-height: 360px; overflow-y: auto; }
.space-picker-result { display: grid; grid-template-columns: 44px minmax(0,1fr); gap: 12px; align-items: center; width: 100%; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); color: var(--text); text-align: left; cursor: pointer; }
.space-picker-result:hover { border-color: var(--world-accent); transform: translateY(-1px); }
.space-picker-result strong, .space-picker-result small { display: block; }
.space-picker-result small { margin-top: 3px; color: var(--muted); }
.space-picker-avatar { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: color-mix(in srgb, var(--world-accent) 16%, var(--panel)); color: var(--world-accent); font-weight: 900; }
.selected-space-card { margin-top: 12px; padding: 16px; border: 1px solid color-mix(in srgb, var(--world-accent) 35%, var(--line)); border-radius: 15px; background: color-mix(in srgb, var(--world-accent) 7%, var(--panel)); }
.selected-space-card span, .selected-space-card strong, .selected-space-card small { display: block; }
.selected-space-label { color: var(--world-accent); font-size: .74rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.selected-space-card strong { margin-top: 3px; font-size: 1.05rem; }
.selected-space-card small { margin-top: 3px; color: var(--muted); }
.text-button { margin-top: 10px; padding: 0; border: 0; background: none; color: var(--world-accent); font: inherit; font-weight: 750; cursor: pointer; }
.district-related-spaces .constellation-grid { margin-top: 22px; }