:root {
  --archive-bg: #040a10;
  --archive-panel: rgba(8, 15, 22, 0.92);
  --archive-panel-soft: rgba(12, 24, 35, 0.86);
  --archive-line: rgba(120, 238, 210, 0.17);
  --archive-text: #f5fbff;
  --archive-muted: rgba(226, 239, 244, 0.74);
  --archive-accent: #7eeed2;
  --archive-accent-strong: #aaf5ff;
  --archive-danger: #ffb18b;
  --archive-shadow: 0 28px 74px rgba(0, 0, 0, 0.42);
}
* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
  margin: 0;
  color: var(--archive-text);
  background:
    radial-gradient(circle at top left, rgba(126, 238, 210, 0.12), transparent 25%),
    radial-gradient(circle at 85% 10%, rgba(170, 245, 255, 0.14), transparent 22%),
    linear-gradient(160deg, #02050a 0%, #050d14 52%, #07131b 100%);
  font-family: "IBM Plex Mono", monospace;
}
.archive-shell {
  width: min(980px, calc(100vw - 32px));
  margin: 0 auto;
  padding: 32px 0 56px;
  display: grid;
  gap: 18px;
}
.shell-panel {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--archive-line);
  background: linear-gradient(180deg, rgba(10, 22, 33, 0.92), rgba(4, 10, 16, 0.96));
  box-shadow: var(--archive-shadow);
}
.shell-panel--hero { padding: 28px 24px; }
.shell-panel--unlock { padding: 24px; }
.shell-kicker {
  margin: 0 0 14px;
  color: var(--archive-accent);
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
.shell-panel h1 {
  margin: 0;
  font-family: "Noto Serif SC", serif;
  font-size: clamp(34px, 5vw, 54px);
  line-height: 1.08;
}
.shell-copy {
  max-width: 36rem;
  margin: 16px 0 0;
  color: var(--archive-muted);
  line-height: 1.8;
}
.shell-status {
  min-height: 48px;
  margin-bottom: 18px;
  padding: 12px 14px;
  border-left: 3px solid var(--archive-accent);
  background: var(--archive-panel-soft);
  color: var(--archive-muted);
  line-height: 1.7;
}
.shell-status[data-tone="danger"] {
  border-left-color: var(--archive-danger);
  color: #ffd6be;
}
.shell-status[data-tone="success"] { color: #cffff3; }
.shell-form { display: grid; gap: 10px; }
.shell-form label {
  font-size: 13px;
  color: var(--archive-accent-strong);
  letter-spacing: 0.08em;
}
.shell-form-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
}
.shell-form input,
.shell-form button,
.shell-actions button,
.shell-actions a {
  min-height: 48px;
  border-radius: 0;
  font: inherit;
}
.shell-form input {
  width: 100%;
  padding: 0 14px;
  border: 1px solid rgba(170, 245, 255, 0.18);
  background: rgba(6, 13, 19, 0.96);
  color: var(--archive-text);
}
.shell-form button,
.shell-secondary,
.shell-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border: 1px solid rgba(126, 238, 210, 0.3);
  background: linear-gradient(180deg, rgba(126, 238, 210, 0.18), rgba(126, 238, 210, 0.08));
  color: var(--archive-text);
  text-decoration: none;
  cursor: pointer;
}
.shell-secondary { background: transparent; }
.shell-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}
.shell-note {
  margin: 18px 0 0;
  color: var(--archive-muted);
  font-size: 13px;
  line-height: 1.75;
}
@media (max-width: 720px) {
  .shell-form-row { grid-template-columns: 1fr; }
}