﻿    :root {
      --black: #080807;
      --ink: #11110f;
      --panel: #191915;
      --panel-2: #22221d;
      --line: rgba(244, 238, 224, 0.12);
      --line-strong: rgba(244, 238, 224, 0.22);
      --text: #f4eee0;
      --muted: rgba(244, 238, 224, 0.66);
      --dim: rgba(244, 238, 224, 0.42);
      --gold: #d4ad68;
      --mint: #bcd7c3;
      --rose: #e3b7b0;
      --blue: #aebfdc;
      --warning: #f0ca85;
      --danger: #f0a7a0;
      --success: #b8d8a6;
      --serif: "Cormorant Garamond", Georgia, serif;
      --mono: "DM Mono", "Courier New", monospace;
      --sans: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      background: var(--black);
      color: var(--text);
      font-family: var(--sans);
      overflow-x: hidden;
    }
    button, input, select, textarea { font: inherit; }
    button { cursor: pointer; }
    a { color: inherit; }

    .app-shell {
      min-height: 100vh;
      background:
        linear-gradient(120deg, rgba(188, 215, 195, 0.08), transparent 26%),
        linear-gradient(240deg, rgba(227, 183, 176, 0.07), transparent 30%),
        var(--black);
    }

    nav {
      position: sticky;
      top: 0;
      z-index: 50;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      padding: 1rem clamp(1rem, 4vw, 3rem);
      background: rgba(8, 8, 7, 0.82);
      border-bottom: 1px solid var(--line);
      backdrop-filter: blur(14px);
    }
    .brand {
      display: flex;
      flex-direction: column;
      text-decoration: none;
    }
    .brand strong {
      font-family: var(--serif);
      font-size: 1.45rem;
      font-weight: 500;
      letter-spacing: 0.05em;
      text-transform: uppercase;
    }
    .brand span {
      color: var(--dim);
      font-family: var(--mono);
      font-size: 0.62rem;
      letter-spacing: 0.16em;
      text-transform: uppercase;
    }
    .nav-links {
      display: flex;
      align-items: center;
      gap: 1rem;
      color: var(--muted);
      font-family: var(--mono);
      font-size: 0.7rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .nav-links a {
      text-decoration: none;
      transition: color 160ms ease;
    }
    .nav-links a:hover { color: var(--text); }
    .language-control {
      display: inline-flex;
      align-items: center;
      gap: 0.45rem;
      color: var(--dim);
    }
    .language-control select {
      min-height: 34px;
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 0 0.65rem;
      color: var(--text);
      background: rgba(244, 238, 224, 0.06);
      font-family: var(--mono);
      font-size: 0.72rem;
      text-transform: uppercase;
    }

    main { width: 100%; }
    .hero {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(320px, 520px);
      gap: clamp(2rem, 6vw, 5rem);
      align-items: center;
      min-height: calc(100vh - 78px);
      padding: clamp(3rem, 8vw, 6rem) clamp(1rem, 5vw, 5rem);
    }
    .eyebrow,
    .section-kicker {
      margin: 0 0 1rem;
      color: var(--gold);
      font-family: var(--mono);
      font-size: 0.72rem;
      font-weight: 400;
      letter-spacing: 0.18em;
      text-transform: uppercase;
    }
    h1, h2, h3, p { margin-top: 0; }
    h1 {
      max-width: 820px;
      margin-bottom: 1.4rem;
      font-family: var(--serif);
      font-size: clamp(4rem, 9vw, 8.4rem);
      font-weight: 400;
      line-height: 0.9;
      letter-spacing: 0;
    }
    h1 em,
    h2 em {
      color: var(--gold);
      font-style: italic;
    }
    .hero-copy {
      max-width: 650px;
      color: var(--muted);
      font-family: var(--serif);
      font-size: clamp(1.3rem, 2.4vw, 2rem);
      line-height: 1.28;
    }
    .legal-asterisk {
      display: inline-block;
      margin-left: 0.18em;
      color: var(--gold);
      font-family: var(--mono);
      font-size: 0.72em;
      text-decoration: none;
      vertical-align: super;
    }
    .hero-disclaimer {
      max-width: 640px;
      margin-top: 1rem;
      color: var(--dim);
      font-size: 0.92rem;
      line-height: 1.55;
    }
    .hero-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 0.8rem;
      margin-top: 2rem;
    }
    .button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 46px;
      border: 1px solid var(--line-strong);
      padding: 0.78rem 1.15rem;
      color: var(--text);
      background: transparent;
      text-decoration: none;
      transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
    }
    .button:hover {
      transform: translateY(-1px);
      border-color: rgba(244, 238, 224, 0.34);
      background: rgba(244, 238, 224, 0.04);
    }
    .button.primary {
      border-color: transparent;
      color: #17130c;
      background: var(--gold);
      font-weight: 700;
    }
    .button.secondary {
      color: var(--muted);
      font-family: var(--mono);
      font-size: 0.72rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .button.small {
      min-height: 38px;
      padding: 0.58rem 0.82rem;
      font-size: 0.82rem;
    }
    .button.full { width: 100%; }
    .button:disabled {
      cursor: not-allowed;
      opacity: 0.45;
      transform: none;
    }

    .moment-panel {
      border: 1px solid var(--line);
      background: rgba(25, 25, 21, 0.84);
      box-shadow: 0 22px 80px rgba(0, 0, 0, 0.28);
    }
    .moment-live {
      padding: 1.2rem;
      border-bottom: 1px solid var(--line);
      background: rgba(255, 255, 255, 0.02);
    }
    .clock {
      font-family: var(--mono);
      font-size: clamp(2.2rem, 7vw, 4.5rem);
      letter-spacing: 0.04em;
    }
    .clock-meta {
      color: var(--dim);
      font-family: var(--mono);
      font-size: 0.74rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .claim-card { padding: 1.2rem; }
    .field-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.8rem;
    }
    .field { display: grid; gap: 0.4rem; }
    .field.full { grid-column: 1 / -1; }
    .field-grid > .full { grid-column: 1 / -1; }
    .field-meta {
      display: flex;
      justify-content: space-between;
      gap: 1rem;
      color: var(--dim);
      font-family: var(--mono);
      font-size: 0.68rem;
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }
    .phrase-picker {
      display: grid;
      gap: 0.45rem;
      margin-top: 0.7rem;
    }
    .phrase-picker-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 0.55rem;
      align-items: stretch;
    }
    .phrase-picker-row select {
      min-height: 38px;
      color: var(--muted);
      font-size: 0.84rem;
    }
    label {
      color: var(--dim);
      font-family: var(--mono);
      font-size: 0.68rem;
      letter-spacing: 0.11em;
      text-transform: uppercase;
    }
    input, select, textarea {
      width: 100%;
      border: 1px solid var(--line);
      border-radius: 0;
      padding: 0.78rem 0.82rem;
      color: var(--text);
      background: rgba(8, 8, 7, 0.7);
      outline: none;
    }
    textarea {
      min-height: 92px;
      resize: vertical;
    }
    input:focus, select:focus, textarea:focus { border-color: var(--gold); }
    .status {
      margin-top: 1rem;
      padding: 0.85rem;
      border: 1px solid var(--line);
      color: var(--muted);
      font-size: 0.9rem;
      line-height: 1.45;
    }
    .status.ok {
      border-color: rgba(184, 216, 166, 0.38);
      color: var(--success);
      background: rgba(184, 216, 166, 0.08);
    }
    .status.warn {
      border-color: rgba(240, 202, 133, 0.42);
      color: var(--warning);
      background: rgba(240, 202, 133, 0.08);
    }
    .status.bad {
      border-color: rgba(240, 167, 160, 0.42);
      color: var(--danger);
      background: rgba(240, 167, 160, 0.08);
    }
    #availabilityActions {
      margin-top: 0.9rem;
    }

    .band {
      border-top: 1px solid var(--line);
      padding: clamp(3rem, 7vw, 5.5rem) clamp(1rem, 5vw, 5rem);
    }
    .section-head {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 1.5rem;
      margin-bottom: 2rem;
    }
    h2 {
      margin-bottom: 0;
      font-family: var(--serif);
      font-size: clamp(2.4rem, 6vw, 5.8rem);
      font-weight: 400;
      line-height: 0.96;
    }
    .section-note {
      max-width: 560px;
      color: var(--muted);
      line-height: 1.65;
    }
    .flow-grid,
    .tier-grid,
    .registry-grid,
    .policy-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      border: 1px solid var(--line);
    }
    .flow-step,
    .tier-card,
    .policy-card {
      min-width: 0;
      padding: 1.4rem;
      border-right: 1px solid var(--line);
    }
    .flow-step:last-child,
    .tier-card:last-child,
    .policy-card:last-child { border-right: 0; }
    .step-num {
      display: inline-flex;
      margin-bottom: 1rem;
      color: var(--gold);
      font-family: var(--mono);
      font-size: 0.76rem;
    }
    h3 {
      margin-bottom: 0.6rem;
      font-size: 1.05rem;
      line-height: 1.25;
    }
    .flow-step p,
    .tier-card p,
    .policy-card p {
      color: var(--muted);
      font-size: 0.92rem;
      line-height: 1.55;
    }

    .tier-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .tier-card {
      position: relative;
      display: flex;
      flex-direction: column;
      gap: 1rem;
      min-height: 360px;
    }
    .tier-card.active {
      background: rgba(212, 173, 104, 0.07);
      outline: 1px solid rgba(212, 173, 104, 0.38);
      outline-offset: -1px;
    }
    .tier-kind {
      width: fit-content;
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 0.28rem 0.55rem;
      color: var(--gold);
      font-family: var(--mono);
      font-size: 0.62rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }
    .tier-name {
      color: var(--dim);
      font-family: var(--mono);
      font-size: 0.72rem;
      letter-spacing: 0.16em;
      text-transform: uppercase;
    }
    .price {
      font-family: var(--serif);
      font-size: 4rem;
      line-height: 0.9;
    }
    .price.discounted {
      color: var(--gold);
    }
    .price span {
      font-family: var(--sans);
      font-size: 1rem;
      color: var(--dim);
    }
    .compare-price {
      margin-top: -0.35rem;
      color: var(--gold);
      font-family: var(--mono);
      font-size: 0.72rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .billing-toggle {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.35rem;
    }
    .billing-toggle button {
      min-height: 38px;
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 0.45rem 0.55rem;
      color: var(--muted);
      background: rgba(244, 238, 224, 0.04);
      font-family: var(--mono);
      font-size: 0.66rem;
      text-transform: uppercase;
    }
    .billing-toggle button.active {
      border-color: transparent;
      color: #17130c;
      background: var(--gold);
      font-weight: 700;
    }
    .features {
      display: grid;
      gap: 0.7rem;
      margin: 0;
      padding: 0;
      list-style: none;
      color: var(--muted);
      font-size: 0.9rem;
    }
    .features li::before {
      content: "/";
      margin-right: 0.5rem;
      color: var(--gold);
    }
    .tier-card .button { margin-top: auto; }

    .checkout {
      display: grid;
      grid-template-columns: minmax(0, 1.05fr) minmax(300px, 0.95fr);
      gap: 1rem;
      align-items: start;
    }
    .checkout-panel,
    .summary-panel,
    .certificate-panel,
    .registry-panel,
    .disclosure-panel {
      border: 1px solid var(--line);
      background: rgba(25, 25, 21, 0.74);
    }
    .panel-title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      padding: 1rem 1.15rem;
      border-bottom: 1px solid var(--line);
    }
    .panel-title h3 { margin: 0; }
    .panel-body { padding: 1.15rem; }
    .segmented {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      border: 1px solid var(--line);
      margin-bottom: 1rem;
    }
    .segment {
      min-height: 44px;
      border: 0;
      border-right: 1px solid var(--line);
      color: var(--muted);
      background: transparent;
    }
    .segment:last-child { border-right: 0; }
    .segment.active {
      color: #17130c;
      background: var(--gold);
      font-weight: 700;
    }
    .summary-list {
      display: grid;
      gap: 0.75rem;
      margin: 0;
      padding: 0;
      list-style: none;
    }
    .summary-list li {
      display: flex;
      justify-content: space-between;
      gap: 1rem;
      border-bottom: 1px solid var(--line);
      padding-bottom: 0.75rem;
      color: var(--muted);
    }
    .summary-list strong {
      color: var(--text);
      text-align: right;
      word-break: break-word;
    }
    .fine-print {
      color: var(--dim);
      font-size: 0.8rem;
      line-height: 1.55;
    }

    .admin-detail {
      margin-top: 1rem;
      border: 1px solid var(--line);
      background: rgba(25, 25, 21, 0.74);
    }

    .registry-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0;
    }
    .auction-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      border: 1px solid var(--line);
    }
    .auction-card {
      min-width: 0;
      min-height: 230px;
      padding: 1.15rem;
      border-right: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
      background:
        linear-gradient(140deg, rgba(212, 173, 104, 0.08), transparent 42%),
        rgba(25, 25, 21, 0.58);
    }
    .auction-card:nth-child(3n) { border-right: 0; }
    .auction-card h3 {
      margin-top: 0.75rem;
      font-family: var(--serif);
      font-size: 1.55rem;
      font-weight: 400;
      line-height: 1.05;
    }
    .registry-item {
      min-height: 190px;
      padding: 1.1rem;
      border-right: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
    }
    .registry-item:nth-child(3n) { border-right: 0; }
    .registry-id {
      color: var(--gold);
      font-family: var(--mono);
      font-size: 0.72rem;
      letter-spacing: 0.08em;
    }
    .registry-second {
      margin: 0.7rem 0;
      font-family: var(--mono);
      font-size: 1rem;
      line-height: 1.5;
      word-break: break-word;
    }
    .registry-meta {
      color: var(--muted);
      font-size: 0.9rem;
      line-height: 1.45;
    }
    .tag-row {
      display: flex;
      flex-wrap: wrap;
      gap: 0.5rem;
      margin-top: 0.85rem;
    }
    .tag {
      border: 1px solid var(--line);
      padding: 0.28rem 0.45rem;
      color: var(--dim);
      font-family: var(--mono);
      font-size: 0.64rem;
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }
    .tag.ok { color: var(--success); border-color: rgba(184, 216, 166, 0.3); }
    .tag.pending { color: var(--warning); border-color: rgba(240, 202, 133, 0.3); }

    .timeline-shell {
      border: 1px solid var(--line);
      background: rgba(25, 25, 21, 0.7);
      overflow: hidden;
    }
    .timeline-toolbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      border-bottom: 1px solid var(--line);
      padding: 1rem;
    }
    .timeline-range {
      flex: 1;
      color: var(--muted);
      font-family: var(--mono);
      font-size: 0.8rem;
      overflow-wrap: anywhere;
    }
    .timeline-track {
      min-height: 260px;
      display: flex;
      gap: 1.2rem;
      align-items: center;
      overflow-x: auto;
      scroll-behavior: smooth;
      padding: 1.35rem;
    }
    .timeline-bucket {
      width: var(--bubble-slot, 78px);
      min-width: var(--bubble-slot, 78px);
      min-height: calc(var(--bubble-size, 64px) + 54px);
      display: grid;
      place-items: center;
      position: relative;
      overflow: visible;
      border: 0;
      background: transparent;
      padding: 0;
      color: var(--text);
      text-align: center;
      cursor: pointer;
    }
    .timeline-bubble {
      position: relative;
      z-index: 2;
      width: var(--bubble-size, 64px);
      height: var(--bubble-size, 64px);
      border-radius: 999px;
      display: grid;
      place-items: center;
      align-content: center;
      gap: 0.28rem;
      border: 1px solid rgba(212, 173, 104, var(--bubble-border, 0.24));
      background:
        radial-gradient(circle at 34% 28%, rgba(244, 238, 224, 0.16), transparent 34%),
        radial-gradient(circle, rgba(212, 173, 104, var(--bubble-fill, 0.16)), rgba(212, 173, 104, 0.04) 62%, rgba(8, 8, 7, 0.62));
      box-shadow:
        inset 0 0 0 1px rgba(244, 238, 224, 0.04),
        0 0 var(--bubble-glow, 0) rgba(212, 173, 104, 0.7);
      transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease, opacity 160ms ease;
    }
    .timeline-bucket:hover .timeline-bubble,
    .timeline-bucket.active .timeline-bubble {
      border-color: rgba(212, 173, 104, 0.86);
      transform: translateY(-2px) scale(1.04);
      box-shadow:
        inset 0 0 0 1px rgba(244, 238, 224, 0.08),
        0 0 var(--bubble-active-glow, 18px) rgba(212, 173, 104, 0.72);
    }
    .timeline-bucket.empty {
      cursor: default;
    }
    .timeline-bucket.empty .timeline-bubble {
      opacity: 0.42;
    }
    .timeline-bucket.has-historic:not(.has-issued) .timeline-bubble {
      border-style: dashed;
      background:
        radial-gradient(circle at 34% 28%, rgba(244, 238, 224, 0.1), transparent 34%),
        radial-gradient(circle, rgba(141, 130, 109, var(--bubble-fill, 0.08)), rgba(8, 8, 7, 0.5) 66%);
    }
    .timeline-orbit {
      position: absolute;
      z-index: 1;
      left: 50%;
      top: 50%;
      width: var(--orbit-size, 0);
      height: var(--orbit-size, 0);
      border-radius: 999px;
      border: 1px solid rgba(212, 173, 104, 0.08);
      pointer-events: none;
      transform: translate(-50%, -50%);
      opacity: 0.95;
    }
    .timeline-orbit-node {
      position: absolute;
      left: 50%;
      top: 50%;
      width: var(--orbit-dot-size, 8px);
      height: var(--orbit-dot-size, 8px);
      border-radius: 999px;
      background: rgba(244, 238, 224, var(--orbit-dot-alpha, 0.68));
      border: 1px solid rgba(212, 173, 104, 0.72);
      box-shadow:
        0 0 10px rgba(212, 173, 104, 0.42),
        inset 0 0 4px rgba(255, 255, 255, 0.22);
      transform: rotate(var(--orbit-angle, 0deg)) translateX(var(--orbit-radius, 0)) translate(-50%, -50%);
      transform-origin: 0 0;
      animation: timeline-orbit-node var(--orbit-node-duration, var(--orbit-duration, 18s)) linear infinite;
      animation-delay: var(--orbit-node-delay, 0s);
      will-change: transform;
    }
    .timeline-bucket.active .timeline-orbit-node,
    .timeline-bucket:hover .timeline-orbit-node {
      background: rgba(255, 246, 219, var(--orbit-dot-alpha, 0.82));
      box-shadow:
        0 0 14px rgba(212, 173, 104, 0.6),
        inset 0 0 4px rgba(255, 255, 255, 0.28);
    }
    .timeline-bucket-label {
      font-family: var(--mono);
      font-size: 0.76rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      max-width: 82%;
      overflow-wrap: anywhere;
    }
    .timeline-count {
      color: var(--muted);
      font-family: var(--mono);
      font-size: 0.62rem;
      line-height: 1.25;
      max-width: 84%;
      overflow-wrap: anywhere;
    }
    @keyframes timeline-orbit-node {
      from {
        transform: rotate(var(--orbit-angle, 0deg)) translateX(var(--orbit-radius, 0)) translate(-50%, -50%);
      }
      to {
        transform: rotate(var(--orbit-target-angle, 360deg)) translateX(var(--orbit-radius, 0)) translate(-50%, -50%);
      }
    }
    .timeline-detail {
      min-height: 120px;
      border-top: 1px solid var(--line);
      padding: 1rem;
    }
    .timeline-detail-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0;
    }
    .timeline-detail-card {
      min-height: 120px;
      border-right: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
      padding: 1rem;
    }
    .timeline-detail-card:nth-child(3n) {
      border-right: 0;
    }
    .timeline-detail-card h3 {
      margin: 0 0 0.5rem;
      font-family: var(--serif);
      font-size: 1.35rem;
      font-weight: 400;
      line-height: 1.1;
    }
    .timeline-detail-card p {
      margin: 0.25rem 0;
      color: var(--muted);
      font-size: 0.88rem;
      line-height: 1.45;
      overflow-wrap: anywhere;
    }

    .certificate-wrap {
      display: grid;
      grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
      gap: 1rem;
    }
    .certificate {
      min-height: 500px;
      border: 1px solid rgba(212, 173, 104, 0.5);
      padding: clamp(1.2rem, 4vw, 2.4rem);
      background:
        linear-gradient(135deg, rgba(212, 173, 104, 0.14), transparent 42%),
        linear-gradient(240deg, rgba(174, 191, 220, 0.12), transparent 36%),
        #f4eee0;
      color: #17130c;
    }
    .cert-top {
      display: flex;
      justify-content: space-between;
      gap: 1rem;
      color: rgba(23, 19, 12, 0.58);
      font-family: var(--mono);
      font-size: 0.68rem;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }
    .cert-title {
      margin: 3rem 0 1rem;
      font-family: var(--serif);
      font-size: clamp(3rem, 8vw, 6rem);
      font-weight: 500;
      line-height: 0.9;
    }
    .cert-title em { color: #8f6a30; }
    .cert-sub {
      max-width: 680px;
      color: rgba(23, 19, 12, 0.72);
      font-family: var(--serif);
      font-size: 1.45rem;
      line-height: 1.35;
    }
    .cert-second {
      margin: 2.4rem 0;
      border-top: 1px solid rgba(23, 19, 12, 0.18);
      border-bottom: 1px solid rgba(23, 19, 12, 0.18);
      padding: 1.5rem 0;
      font-family: var(--mono);
      font-size: clamp(1.5rem, 5vw, 3rem);
      line-height: 1.15;
      word-break: break-word;
    }
    .cert-note {
      margin: -1rem 0 2rem;
      border-left: 3px solid #8f6a30;
      padding-left: 1rem;
      color: rgba(23, 19, 12, 0.72);
      font-family: var(--serif);
      font-size: 1.3rem;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }
    .cert-footer {
      display: flex;
      justify-content: space-between;
      gap: 1rem;
      color: rgba(23, 19, 12, 0.72);
    }
    .cert-footer strong {
      overflow-wrap: anywhere;
    }
    .nft-link {
      display: inline-flex;
      margin-top: 0.35rem;
      color: #8f6a30;
      font-family: var(--mono);
      font-size: 0.72rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      text-decoration: none;
    }
    .cert-disclaimer {
      margin-top: 2rem;
      color: rgba(23, 19, 12, 0.58);
      font-family: var(--mono);
      font-size: 0.62rem;
      line-height: 1.55;
    }

    .gift-page {
      display: grid;
      grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
      gap: 1rem;
      align-items: stretch;
    }
    .gift-preview,
    .universe-panel {
      border: 1px solid var(--line);
      background: rgba(25, 25, 21, 0.74);
    }
    .gift-hero {
      min-height: 540px;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      gap: 1rem;
      padding: clamp(1.4rem, 4vw, 3rem);
      background:
        linear-gradient(180deg, transparent 12%, rgba(8, 8, 7, 0.88) 100%),
        radial-gradient(circle at 22% 20%, rgba(212, 173, 104, 0.28), transparent 24%),
        radial-gradient(circle at 74% 26%, rgba(174, 191, 220, 0.26), transparent 28%),
        #101015;
    }
    .gift-hero h3 {
      max-width: 760px;
      margin: 0;
      font-family: var(--serif);
      font-size: clamp(2.7rem, 7vw, 6rem);
      font-weight: 400;
      line-height: 0.92;
    }
    .gift-hero p {
      max-width: 720px;
      color: var(--muted);
      line-height: 1.6;
    }
    .gift-hero blockquote {
      max-width: 720px;
      margin: 0;
      border-left: 3px solid var(--gold);
      padding-left: 1rem;
      color: var(--text);
      font-family: var(--serif);
      font-size: 1.35rem;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }
    .universe-visual {
      min-height: 390px;
      border-bottom: 1px solid var(--line);
      background: #05060a;
    }
    .universe-visual svg {
      display: block;
      width: 100%;
      height: auto;
      min-height: 390px;
    }
    .gift-line {
      color: var(--text);
      font-family: var(--serif);
      font-size: 1.25rem;
      line-height: 1.4;
    }
    .public-page-shell {
      border: 1px solid var(--line);
      background: rgba(25, 25, 21, 0.74);
    }
    .public-hero {
      min-height: 460px;
      display: flex;
      align-items: end;
      padding: clamp(1.4rem, 5vw, 4rem);
      background:
        linear-gradient(180deg, transparent 10%, rgba(8, 8, 7, 0.9) 100%),
        #07090f;
    }
    .public-hero h2 {
      max-width: 900px;
      margin-bottom: 1rem;
    }
    .public-hero p {
      max-width: 760px;
      color: var(--muted);
      line-height: 1.65;
    }
    .public-hero blockquote {
      max-width: 760px;
      margin: 1rem 0 0;
      border-left: 3px solid var(--gold);
      padding-left: 1rem;
      color: var(--text);
      font-family: var(--serif);
      font-size: 1.45rem;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }
    .public-content {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(320px, 0.78fr);
      gap: 1rem;
      padding: 1rem;
    }
    .owner-tools-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 1rem;
    }
    .owner-tools .tier-card {
      min-height: 0;
      gap: 0.9rem;
    }
    .nft-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 0.7rem;
      align-items: center;
    }
    .nft-actions .button {
      margin-top: 0;
    }
    .nasa-image {
      width: 100%;
      min-height: 390px;
      object-fit: cover;
      display: block;
      background: #05060a;
    }
    .nasa-video-link {
      min-height: 390px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 1rem;
      color: var(--gold);
      background: #05060a;
      text-align: center;
    }

    .policy-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .disclosure-panel {
      margin-top: 2rem;
      border-color: rgba(240, 202, 133, 0.3);
      background: rgba(240, 202, 133, 0.08);
    }
    .disclosure-panel p {
      margin: 0;
      color: var(--warning);
      line-height: 1.65;
    }
    .checkbox-row {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 0.7rem;
      align-items: start;
      margin-top: 1rem;
      color: var(--text);
      font-family: var(--sans);
      font-size: 0.9rem;
      letter-spacing: 0;
      line-height: 1.5;
      text-transform: none;
    }
    .checkbox-row input {
      width: 18px;
      height: 18px;
      margin-top: 0.15rem;
      accent-color: var(--gold);
    }
    .legal-link-row,
    .footer-links {
      display: flex;
      flex-wrap: wrap;
      gap: 0.7rem;
    }
    .legal-link-row {
      margin-top: 0.85rem;
      font-family: var(--mono);
      font-size: 0.7rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .legal-link-row a,
    .footer-links a,
    .text-link {
      color: var(--gold);
      text-decoration: none;
    }
    .legal-link-row a:hover,
    .footer-links a:hover,
    .text-link:hover {
      text-decoration: underline;
    }
    .text-link {
      display: inline-flex;
      margin-top: 0.7rem;
      font-family: var(--mono);
      font-size: 0.7rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .legal-page {
      max-width: 980px;
      margin: 0 auto;
      padding: clamp(2rem, 6vw, 5rem) clamp(1rem, 4vw, 2rem);
    }
    .legal-page h1 {
      margin-bottom: 1rem;
      font-size: clamp(3rem, 8vw, 6.2rem);
    }
    .legal-page h2 {
      margin-top: 2rem;
      margin-bottom: 0.75rem;
      font-size: clamp(1.8rem, 4vw, 3rem);
    }
    .legal-page p,
    .legal-page li {
      color: var(--muted);
      line-height: 1.7;
    }
    .legal-page ul {
      display: grid;
      gap: 0.45rem;
      margin: 0;
      padding-left: 1.25rem;
    }
    .legal-notice {
      border: 1px solid rgba(240, 202, 133, 0.3);
      padding: 1rem;
      color: var(--warning);
      background: rgba(240, 202, 133, 0.08);
      line-height: 1.6;
    }
    footer {
      display: flex;
      justify-content: space-between;
      gap: 1rem;
      flex-wrap: wrap;
      border-top: 1px solid var(--line);
      padding: 1.4rem clamp(1rem, 5vw, 5rem);
      color: var(--dim);
      font-family: var(--mono);
      font-size: 0.72rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .modal {
      position: fixed;
      inset: 0;
      z-index: 100;
      display: none;
      place-items: center;
      padding: 1rem;
      background: rgba(0, 0, 0, 0.72);
    }
    .modal.open { display: grid; }
    .modal-card {
      width: min(720px, 100%);
      max-height: min(760px, 92vh);
      overflow: auto;
      border: 1px solid var(--line-strong);
      background: var(--panel);
    }
    .checkout-progress-modal {
      background:
        radial-gradient(circle at 50% 40%, rgba(212, 173, 104, 0.18), transparent 34%),
        rgba(0, 0, 0, 0.78);
    }
    .checkout-progress-card {
      width: min(560px, 100%);
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 1rem;
      padding: 1.2rem;
      box-shadow: 0 24px 70px rgba(0, 0, 0, 0.36);
    }
    .checkout-loader {
      width: 44px;
      height: 44px;
      border: 2px solid rgba(244, 238, 224, 0.18);
      border-top-color: var(--gold);
      border-radius: 50%;
      animation: checkout-spin 0.9s linear infinite;
    }
    .checkout-progress-card h3 {
      margin: 0.15rem 0 0.45rem;
      font-family: var(--serif);
      font-size: clamp(1.6rem, 4vw, 2.3rem);
      font-weight: 500;
    }
    .checkout-progress-card p {
      margin: 0;
      color: var(--muted);
      line-height: 1.55;
    }
    .checkout-progress-list {
      display: grid;
      gap: 0.45rem;
      margin: 1rem 0 0;
      padding: 0;
      list-style: none;
      color: var(--dim);
      font-family: var(--mono);
      font-size: 0.72rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .checkout-progress-list li {
      position: relative;
      padding-left: 1.2rem;
    }
    .checkout-progress-list li::before {
      content: "";
      position: absolute;
      left: 0;
      top: 0.32rem;
      width: 0.45rem;
      height: 0.45rem;
      border-radius: 50%;
      background: rgba(244, 238, 224, 0.26);
    }
    .checkout-progress-list li.active {
      color: var(--text);
    }
    .checkout-progress-list li.active::before {
      background: var(--gold);
      box-shadow: 0 0 0 4px rgba(212, 173, 104, 0.12);
    }
    @keyframes checkout-spin {
      to { transform: rotate(360deg); }
    }
    .modal-actions {
      display: flex;
      justify-content: flex-end;
      gap: 0.7rem;
      padding-top: 1rem;
    }
    .hidden { display: none !important; }

    @media (max-width: 960px) {
      .hero,
      .checkout,
      .certificate-wrap,
      .gift-page,
      .public-content,
      .owner-tools-grid {
        grid-template-columns: 1fr;
      }
      .flow-grid,
      .policy-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .flow-step:nth-child(2),
      .policy-card:nth-child(2) { border-right: 0; }
      .flow-step,
      .policy-card { border-bottom: 1px solid var(--line); }
      .tier-grid,
      .registry-grid,
      .auction-grid,
      .timeline-detail-grid {
        grid-template-columns: 1fr;
      }
      .tier-card,
      .registry-item,
      .auction-card,
      .timeline-detail-card {
        border-right: 0;
        border-bottom: 1px solid var(--line);
      }
      .timeline-toolbar {
        align-items: flex-start;
        flex-direction: column;
      }
    }
    @media (max-width: 720px) {
      nav { align-items: flex-start; }
      .nav-links {
        display: none;
      }
      .hero {
        padding-top: 2rem;
        min-height: auto;
      }
      .field-grid,
      .flow-grid,
      .policy-grid,
      .phrase-picker-row,
      .segmented {
        grid-template-columns: 1fr;
      }
      .segment,
      .flow-step,
      .policy-card {
        border-right: 0;
      }
      .section-head {
        display: block;
      }
      .cert-footer {
        display: grid;
      }
    }
