:root {
  --ink: #ded8c7;
  --paper: #0c0d0c;
  --panel: #151612;
  --panel-2: #1d1e18;
  --line: #393a30;
  --dim: #8d8979;
  --gold: #b9a15d;
  --rust: #8f4738;
  --moss: #65745f;
  --blue: #64798a;
  --danger: #c77263;
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--paper); }
body {
  min-height: 100%;
  margin: 0;
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", serif;
  color: var(--ink);
  background:
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px) 0 0/64px 64px,
    radial-gradient(circle at 12% 20%, rgba(185,161,93,.08), transparent 28rem),
    radial-gradient(circle at 80% 88%, rgba(100,121,138,.08), transparent 32rem),
    var(--paper);
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .08;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}
a { color: inherit; text-decoration: none; }
button, .button-link {
  border: 1px solid var(--gold);
  background: #201f18;
  color: var(--ink);
  min-height: 42px;
  padding: 0 16px;
  cursor: pointer;
  font: inherit;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
button:hover, .button-link:hover { background: #29271d; }
input, textarea, select {
  width: 100%;
  border: 1px solid var(--line);
  background: #0f100e;
  color: var(--ink);
  padding: 11px 12px;
  font: 15px/1.4 ui-sans-serif, system-ui, sans-serif;
}
textarea { resize: vertical; }
label { display: grid; gap: 7px; color: var(--dim); font: 12px/1.2 ui-sans-serif, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .08em; }

.false-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}
.false-error {
  width: min(620px, 100%);
  position: relative;
  padding: 48px 0;
}
.false-error h1 {
  margin: 0;
  font: 72px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 400;
  letter-spacing: 0;
}
.protocol, .plain, .latent, .false-error dl {
  font: 13px/1.7 ui-monospace, SFMono-Regular, Menlo, monospace;
  color: #b8b3a2;
}
.protocol span { color: #575447; }
.false-error dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 42px;
}
.false-error dt { color: #555246; }
.false-error dd { margin: 0; }
.ghost-line {
  height: 1px;
  background: linear-gradient(90deg, transparent, #4d493c, transparent);
  width: 99%;
}
.ghost-line.top { margin-bottom: 31px; }
.ghost-line.bottom { margin-top: 47px; width: 96%; transform: translateX(16px); }
.quiet-point {
  position: absolute;
  right: 16.899%;
  bottom: 112px;
  width: 9px;
  height: 9px;
  min-height: 0;
  padding: 0;
  border-color: #302e27;
  background: #151511;
}
.latent { opacity: 0; transition: opacity .8s ease; }
.latent.awake, .late .latent { opacity: 1; }

.gate-wrap {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 28px;
}
.gate-panel {
  width: min(460px, 100%);
  border: 1px solid var(--line);
  background: rgba(18, 19, 16, .82);
  padding: 34px;
}
.gate-panel.wide { width: min(760px, 100%); }
.kicker { margin: 0 0 12px; color: var(--gold); font: 12px/1.2 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .12em; }
.gate-panel h1, .page-head h1 {
  margin: 0 0 20px;
  font-size: 34px;
  line-height: 1.05;
  font-weight: 400;
}
.stack { display: grid; gap: 16px; }
.notice {
  border-left: 2px solid var(--danger);
  background: rgba(199,114,99,.08);
  padding: 10px 12px;
  color: #e1b4aa;
}
.muted { color: var(--dim); }
.mfa-grid { display: grid; grid-template-columns: 240px 1fr; gap: 24px; align-items: start; }
.mfa-grid img { background: #eee; padding: 10px; width: 220px; height: 220px; }
.secret, .codes {
  display: block;
  background: #0f100e;
  border: 1px solid var(--line);
  padding: 12px;
  color: var(--gold);
  overflow-wrap: anywhere;
}
.codes { columns: 2; list-style: none; margin: 16px 0; }

.os {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 246px minmax(0, 1fr);
}
.rail {
  border-right: 1px solid var(--line);
  background: rgba(10, 11, 10, .86);
  padding: 22px 16px;
  position: sticky;
  top: 0;
  height: 100vh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 22px;
}
.mark {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border: 1px solid var(--line);
  height: 48px;
  align-items: center;
  text-align: center;
  color: var(--gold);
  font: 15px/1 ui-monospace, monospace;
}
.mark span + span { border-left: 1px solid var(--line); }
.rail nav { display: grid; align-content: start; gap: 5px; overflow: auto; }
.rail a, .rail button {
  min-height: 36px;
  padding: 9px 10px;
  border: 0;
  background: transparent;
  color: var(--dim);
  text-align: left;
  font: 13px/1.2 ui-sans-serif, system-ui, sans-serif;
}
.rail a.active, .rail a:hover, .rail button:hover { color: var(--ink); background: #171813; }
.rail-foot { border-top: 1px solid var(--line); padding-top: 12px; display: grid; gap: 5px; }
.surface { padding: 34px; max-width: 1440px; width: 100%; }
.page-head {
  border-bottom: 1px solid var(--line);
  padding-bottom: 24px;
  margin-bottom: 24px;
}
.page-head p { max-width: 720px; color: var(--dim); font: 16px/1.6 ui-sans-serif, system-ui, sans-serif; }
.page-head.compact h1 { font-size: 32px; }
.territories, .grid-list, .member-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.territories article, .area-tile, .member-grid article, .reply, .meta-panel, .records, .editor {
  border: 1px solid var(--line);
  background: rgba(21, 22, 18, .74);
}
.territories article { padding: 20px; min-height: 120px; }
.territories span, .area-tile span, .member-grid span, .class {
  color: var(--gold);
  font: 12px/1.2 ui-monospace, monospace;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.territories strong { display: block; margin-top: 16px; font-weight: 400; line-height: 1.35; }
.grid-list { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 24px 0; }
.area-tile { min-height: 172px; padding: 18px; display: grid; align-content: start; gap: 10px; }
.area-tile:hover { border-color: #6b6348; background: #191a15; }
.area-tile h2, .split h2, .member-grid h2, .meta-panel h2 { margin: 0; font-size: 19px; font-weight: 400; }
.area-tile p, .member-grid p { margin: 0; color: var(--dim); font: 14px/1.45 ui-sans-serif, system-ui, sans-serif; }
.tool-ledger {
  border: 1px solid var(--line);
  background: rgba(16, 17, 14, .72);
  padding: 18px;
  margin: 24px 0;
}
.tool-ledger header {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: end;
  margin-bottom: 14px;
}
.tool-ledger h2, .tools-panel h2 {
  margin: 0;
  font-size: 21px;
  font-weight: 400;
}
.tool-strip {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
}
.tool-chip {
  flex: 0 0 auto;
  border: 1px solid var(--line);
  background: #11120f;
  min-width: 220px;
  padding: 12px;
  color: var(--ink);
  font: 14px/1.35 ui-sans-serif, system-ui, sans-serif;
}
.tool-chip span {
  display: block;
  color: var(--gold);
  font: 11px/1.2 ui-monospace, monospace;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.tools-panel {
  border: 1px solid var(--line);
  background: rgba(12, 13, 11, .62);
  padding: 18px;
  margin-bottom: 16px;
}
.tools-panel header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 14px;
  margin-bottom: 14px;
}
.tool-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.tool-card {
  border: 1px solid var(--line);
  background: rgba(25, 26, 21, .72);
  min-height: 260px;
  padding: 16px;
  display: grid;
  gap: 12px;
  align-content: start;
}
.tool-card:hover { border-color: #706747; background: rgba(30, 31, 25, .86); }
.tool-card span {
  color: var(--gold);
  font: 11px/1.2 ui-monospace, monospace;
  text-transform: uppercase;
  letter-spacing: .08em;
  overflow-wrap: anywhere;
}
.tool-card h3 {
  margin: 0;
  font-size: 20px;
  line-height: 1.15;
  font-weight: 400;
}
.tool-card p {
  margin: 0;
  color: var(--dim);
  font: 14px/1.5 ui-sans-serif, system-ui, sans-serif;
}
.tool-card button { justify-self: start; align-self: end; }
.biz-command {
  border: 1px solid var(--line);
  background: rgba(18, 19, 15, .82);
  padding: 18px;
  margin: 0 0 16px;
  display: grid;
  grid-template-columns: minmax(260px, .38fr) minmax(0, 1fr);
  gap: 18px;
  align-items: end;
}
.biz-command h2 {
  margin: 0;
  font-size: 24px;
  font-weight: 400;
}
.biz-command p { margin: 0; color: var(--dim); line-height: 1.55; }
.biz-library {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.biz-machine {
  min-height: 246px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(26, 27, 22, .9), rgba(12, 13, 11, .86));
  padding: 16px;
  display: grid;
  gap: 12px;
  align-content: start;
  color: var(--ink);
}
.biz-machine:hover {
  border-color: rgba(185, 161, 93, .82);
  background: #1b1c16;
}
.biz-machine span, .biz-machine small, .tool-console > .kicker, .tool-instructions .kicker {
  color: var(--gold);
  font: 11px/1.2 ui-monospace, monospace;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.biz-machine h2 {
  margin: 0;
  font-size: 23px;
  line-height: 1.08;
  font-weight: 400;
}
.biz-machine p {
  margin: 0;
  color: var(--dim);
  font: 14px/1.48 ui-sans-serif, system-ui, sans-serif;
}
.biz-machine small { align-self: end; }
.tool-page {
  display: grid;
  grid-template-columns: minmax(260px, .36fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
.tool-instructions, .tool-console {
  border: 1px solid var(--line);
  background: rgba(16, 17, 14, .82);
  padding: 18px;
}
.tool-instructions {
  position: sticky;
  top: 18px;
}
.tool-instructions ol {
  margin: 14px 0 0;
  padding-left: 20px;
  color: var(--ink);
  line-height: 1.55;
}
.tool-instructions li + li { margin-top: 10px; }
.tool-boundary {
  border-top: 1px solid var(--line);
  margin-top: 18px;
  padding-top: 16px;
}
.tool-boundary p:last-child {
  margin: 8px 0 0;
  color: var(--dim);
  font: 13px/1.5 ui-sans-serif, system-ui, sans-serif;
}
.tool-console {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.tool-console > .kicker, .tool-console .full { grid-column: 1 / -1; }
.tool-console button { justify-self: start; }
.tool-result { margin-top: 16px; }
.biz-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}
.biz-tool {
  border: 1px solid var(--line);
  background: rgba(19, 20, 16, .78);
  min-height: 360px;
  padding: 18px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-content: start;
}
.biz-tool.qr-tool { border-color: rgba(185, 161, 93, .55); }
.biz-tool span {
  grid-column: 1 / -1;
  color: var(--gold);
  font: 11px/1.2 ui-monospace, monospace;
  text-transform: uppercase;
  letter-spacing: .1em;
}
.biz-tool h2 {
  grid-column: 1 / -1;
  margin: 0;
  font-size: 24px;
  line-height: 1.1;
  font-weight: 400;
}
.biz-tool p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--dim);
  font: 14px/1.5 ui-sans-serif, system-ui, sans-serif;
}
.biz-tool .full { grid-column: 1 / -1; }
.biz-tool button { justify-self: start; align-self: end; }
.result-panel {
  border: 1px solid var(--gold);
  background: rgba(30, 29, 22, .82);
  padding: 18px;
  margin: 16px 0;
}
.result-panel h2 {
  margin: 0 0 14px;
  font-size: 24px;
  font-weight: 400;
}
.qr-output {
  display: block;
  width: min(320px, 100%);
  height: auto;
  background: #f4eedf;
  padding: 12px;
  margin-bottom: 14px;
}
.mono, .result-panel pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  border: 1px solid var(--line);
  background: #0f100e;
  padding: 14px;
  color: var(--ink);
  font: 13px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace;
}
.metric-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.metric-grid p {
  margin: 0;
  border: 1px solid var(--line);
  background: #11120f;
  min-height: 92px;
  padding: 12px;
  display: grid;
  align-content: space-between;
  gap: 12px;
}
.metric-grid strong {
  color: var(--dim);
  font: 11px/1.2 ui-sans-serif, system-ui, sans-serif;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.metric-grid span {
  font: 20px/1.1 ui-monospace, SFMono-Regular, Menlo, monospace;
  color: var(--gold);
}
.biz-records { margin-top: 16px; }
.split, .record-detail, .workbench {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .5fr);
  gap: 16px;
  align-items: start;
}
.record-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.record-list li, .record-row {
  min-height: 54px;
  border-bottom: 1px solid var(--line);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 10px 0;
}
.record-list span, .record-row small { color: var(--dim); font: 12px/1.3 ui-sans-serif, system-ui, sans-serif; }
.searchbar { display: flex; gap: 8px; margin-bottom: 16px; }
.searchbar button { flex: 0 0 auto; }
.editor { padding: 18px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.editor .full { grid-column: 1 / -1; }
.editor button { justify-self: start; }
.records { padding: 8px 18px; }
.record-row { grid-template-columns: 96px minmax(0, 1fr) auto; color: var(--ink); }
.empty { color: var(--dim); }
.record-detail { grid-template-columns: minmax(0, 1fr) 280px; }
.meta-panel { padding: 18px; display: grid; gap: 12px; }
.meta-panel p { margin: 0; display: grid; gap: 5px; }
.meta-panel strong { color: var(--dim); font: 12px/1.2 ui-sans-serif, system-ui, sans-serif; text-transform: uppercase; }
.thread { display: grid; gap: 14px; }
.reply { padding: 18px; }
.reply time { color: var(--dim); margin-left: 10px; font: 12px/1 ui-sans-serif, system-ui, sans-serif; }
.reply p { white-space: pre-wrap; line-height: 1.65; }
.member-grid article { min-height: 150px; padding: 18px; }
.member-grid .vacant { opacity: .58; }

@media (max-width: 980px) {
  .os { grid-template-columns: 1fr; }
  .rail {
    position: static;
    height: auto;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .rail nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .surface { padding: 22px; }
  .grid-list, .territories, .member-grid, .split, .record-detail, .workbench, .tool-grid, .biz-grid, .metric-grid, .biz-library, .biz-command, .tool-page { grid-template-columns: 1fr; }
  .tools-panel header, .tool-ledger header { display: block; }
  .tool-instructions { position: static; }
}
@media (max-width: 620px) {
  .false-error dl, .mfa-grid, .editor { grid-template-columns: 1fr; }
  .biz-tool, .tool-console { grid-template-columns: 1fr; }
  .false-error h1 { font-size: 58px; }
  .gate-panel { padding: 24px; }
  .record-row { grid-template-columns: 1fr; gap: 6px; }
}