/* FYJ Dev V1 — founder paper family; NOT LIVE */
body.dev-v1 {
  background: #f6f5f1;
  color: #1c1b18;
  font-family: "Helvetica Neue", Helvetica, Arial, ui-sans-serif, sans-serif;
  font-size: 1.05rem;
  line-height: 1.6;
  margin: 0;
  min-height: 100vh;
}
a { color: #1a4f8b; text-underline-offset: 0.16em; }
a:hover { color: #0d2d52; }
.dev-banner {
  background: #1c1b18;
  color: #f6f5f1;
  text-align: center;
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 0.45rem 0.75rem;
  font-weight: 650;
}
.dev-chrome {
  border-bottom: 1px solid #ddd8cc;
  background: #f6f5f1;
  padding: 0.55rem 1rem 0;
}
.dev-chrome-top {
  display: flex; flex-wrap: wrap; gap: 0.5rem 1rem;
  align-items: center; justify-content: space-between;
  max-width: 52rem; margin: 0 auto;
}
.wordmark { margin: 0; font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: #6b675e; }
.peer { display: flex; border: 1px solid #cfc9bb; overflow: hidden; }
.peer a, .peer span {
  padding: 0.28rem 0.65rem; font-size: 0.72rem; letter-spacing: 0.06em;
  text-transform: uppercase; color: #6b675e; text-decoration: none;
}
.peer .here { background: #ebe7dc; color: #1c1b18; font-weight: 650; }
.dev-tabs {
  display: flex; flex-wrap: wrap; gap: 0.28rem;
  max-width: 52rem; margin: 0.55rem auto 0; padding-bottom: 0.55rem;
}
.dev-tabs a {
  border: 1px solid #cfc9bb; color: #5a574e; text-decoration: none;
  font-size: 0.68rem; letter-spacing: 0.05em; text-transform: uppercase;
  padding: 0.28rem 0.5rem; background: #faf9f6;
}
.dev-tabs a.on, .dev-tabs a:hover {
  color: #1c1b18; border-color: #1c1b18; background: #ebe7dc;
}
.wrap { width: min(44rem, calc(100% - 2rem)); margin: 0 auto; padding: 1.2rem 0 3rem; }
.mast h1 { margin: 0 0 0.4rem; font-size: clamp(1.45rem, 4.5vw, 1.9rem); font-weight: 650; letter-spacing: -0.03em; line-height: 1.2; }
.lede { margin: 0 0 1rem; color: #5a574e; font-size: 1.02rem; }
.k { margin: 0 0 0.45rem; font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: #6b675e; font-weight: 650; }
.story, .panel, .item, .bucket, .map {
  background: #fffcf7; border: 1px solid #ddd8cc; padding: 0.85rem 1rem; margin: 0 0 0.75rem;
}
.story h2, .panel h2 { margin: 0 0 0.4rem; font-size: 1.05rem; }
.story p, .panel p, .item p { margin: 0.35rem 0; color: #3d3b35; }
.now { border-left: 3px solid #6b4f9a; padding-left: 0.7rem; margin: 0.6rem 0; }
.now .tag {
  display: inline-block; font-size: 0.64rem; letter-spacing: 0.12em; text-transform: uppercase;
  color: #6b4f9a; border: 1px solid #c4b3d9; padding: 0.1rem 0.35rem; margin-bottom: 0.25rem;
}
.cards { display: grid; grid-template-columns: 1fr 1fr; gap: 0.55rem; margin: 0.5rem 0 1rem; }
@media (max-width: 640px) { .cards { grid-template-columns: 1fr; } }
.card {
  display: block; background: #fffcf7; border: 1px solid #ddd8cc;
  padding: 0.7rem 0.8rem; color: inherit; text-decoration: none;
}
.card:hover { border-color: #1a4f8b; }
.card .t { margin: 0 0 0.2rem; font-size: 0.95rem; font-weight: 650; color: #1c1b18; }
.card .m { margin: 0; font-size: 0.82rem; color: #6b675e; }
.card .n { float: right; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 0.75rem; color: #8a6d3b; }
.rings {
  position: relative; width: min(18rem, 85vw); height: min(18rem, 85vw);
  margin: 0.4rem auto 0.8rem; border-radius: 50%; border: 2px solid #6b4f9a;
  display: flex; align-items: center; justify-content: center; background: #faf7ff;
}
.rings::before { content: ""; position: absolute; inset: 18%; border-radius: 50%; border: 2px solid #2f6b4f; }
.rings::after { content: ""; position: absolute; inset: 36%; border-radius: 50%; border: 2px dashed #8a6d3b; }
.rings .core { position: relative; z-index: 1; font-size: 0.78rem; font-weight: 650; color: #8a6d3b; max-width: 6.5rem; text-align: center; }
.rings .lab { position: absolute; font-size: 0.62rem; letter-spacing: 0.08em; text-transform: uppercase; }
.rings .lab.v { top: 4%; left: 50%; transform: translateX(-50%); color: #6b4f9a; font-weight: 650; }
.rings .lab.m { top: 22%; right: 4%; color: #2f6b4f; }
.rings .lab.d { bottom: 8%; left: 50%; transform: translateX(-50%); color: #6b675e; }
.door {
  display: inline-block; margin: 0.25rem 0 0.6rem; padding: 0.15rem 0.45rem;
  border: 1px solid #2f6b4f; color: #2f6b4f; font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase;
}
.list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.45rem; }
.item h3 { margin: 0 0 0.25rem; font-size: 0.95rem; }
.meta { font-size: 0.68rem; letter-spacing: 0.06em; text-transform: uppercase; color: #6b675e; margin: 0 0 0.25rem; }
.pill {
  display: inline-block; font-size: 0.62rem; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 0.1rem 0.35rem; border: 1px solid #cfc9bb; color: #5a574e; margin: 0 0.25rem 0.2rem 0;
}
.pill.vision { border-color: #c4b3d9; color: #6b4f9a; }
.pill.thin { border-color: #d4b896; color: #8a6d3b; }
.pill.live { border-color: #9bc4b0; color: #2f6b4f; }
.pill.warn { border-color: #e0a090; color: #a04530; }
.pill.empty { border-color: #cfc9bb; color: #8a867c; border-style: dashed; }
.statrow { display: flex; flex-wrap: wrap; gap: 0.45rem; margin: 0.5rem 0; }
.stat { background: #fffcf7; border: 1px solid #ddd8cc; padding: 0.45rem 0.6rem; min-width: 5.2rem; }
.stat b { display: block; font-size: 1.05rem; color: #8a6d3b; }
.stat span { font-size: 0.66rem; color: #6b675e; letter-spacing: 0.08em; text-transform: uppercase; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 0.7rem; }
@media (max-width: 640px) { .split { grid-template-columns: 1fr; } }
.foot { margin-top: 1.2rem; font-size: 0.75rem; color: #8a867c; }
.note { font-size: 0.82rem; color: #6b675e; }
.empty-box {
  border: 1px dashed #cfc9bb; background: #faf9f6; padding: 0.85rem 1rem; color: #6b675e; margin: 0.5rem 0 1rem;
}
.bucket h3 { margin: 0 0 0.25rem; font-size: 0.9rem; }
.hold { opacity: 0.78; border-style: dashed; }
.xlink { font-size: 0.85rem; }
.filters { display: flex; flex-wrap: wrap; gap: 0.35rem; margin: 0.4rem 0 0.8rem; }
.filters button, .filters a {
  font-size: 0.68rem; letter-spacing: 0.06em; text-transform: uppercase;
  border: 1px solid #cfc9bb; background: #fffcf7; padding: 0.25rem 0.45rem; color: #5a574e; cursor: pointer;
  text-decoration: none;
}
.filters a.on, .filters button.on { border-color: #1c1b18; color: #1c1b18; background: #ebe7dc; }
.ident-block { white-space: pre-wrap; font-size: 0.92rem; color: #3d3b35; }
.pause-note { border-left: 3px solid #8a6d3b; padding: 0.5rem 0.75rem; background: #faf6eb; margin: 0.5rem 0 1rem; font-size: 0.9rem; }