:root {
    --soft-dark-start: #14181C;
    --soft-dark-end: #1A1F26;
  }

  

  
  

  
  .mock-coia { display: flex; flex-direction: column; gap: 8px; }
  .mock-coia__title { font-family: var(--font-mono); font-size: 10.5px; color: var(--ink-500); text-transform: uppercase; letter-spacing: 0.08em; padding-bottom: 6px; border-bottom: 1px dashed rgba(20,24,28,0.18); }
  .mock-coia__row { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink-900); padding: 4px 0; }
  .mock-coia__hash { color: var(--accent-700); font-family: var(--font-mono); font-weight: 600; flex-shrink: 0; min-width: 14px; }
  .mock-coia__apply { margin-top: 8px; padding: 8px 14px; background: var(--ink-900); color: var(--paper-10); border: none; border-radius: 6px; font-size: 11.5px; font-weight: 600; cursor: default; align-self: flex-start; }

  
  .mock-short { display: flex; flex-direction: column; gap: 8px; }
  .mock-short__head { display: flex; align-items: center; gap: 8px; padding-bottom: 6px; border-bottom: 1px dashed rgba(20,24,28,0.18); font-family: var(--font-mono); font-size: 10.5px; color: var(--ink-500); text-transform: uppercase; letter-spacing: 0.08em; }
  .mock-short__head::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--accent-500); }
  .mock-short__bubble { padding: 6px 10px; border-radius: 8px; font-size: 12px; line-height: 1.4; max-width: 88%; }
  .mock-short__bubble--user { background: rgba(20,24,28,0.08); color: var(--ink-900); align-self: flex-start; }
  .mock-short__bubble--agent { background: rgba(245,184,0,0.18); color: var(--ink-900); align-self: flex-end; margin-left: auto; }

  
  .mock-midterm { display: flex; flex-direction: column; gap: 4px; }
  .mock-midterm__title { font-family: var(--font-mono); font-size: 10.5px; color: var(--ink-500); text-transform: uppercase; letter-spacing: 0.08em; padding-bottom: 6px; border-bottom: 1px dashed rgba(20,24,28,0.18); margin-bottom: 4px; }
  .mock-midterm__row { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink-900); padding: 4px 0; }
  .mock-midterm__row::before { content: '•'; color: var(--accent-700); flex-shrink: 0; }
  .mock-midterm__row--muted { color: var(--ink-500); }
  .mock-midterm__more { font-size: 11.5px; color: var(--ink-500); font-style: italic; margin-top: 4px; font-family: var(--font-italic); }

  
  .mock-longterm { display: flex; flex-direction: column; gap: 8px; }
  .mock-longterm__head { font-family: var(--font-mono); font-size: 10.5px; color: var(--accent-700); text-transform: uppercase; letter-spacing: 0.08em; padding-bottom: 6px; border-bottom: 1px dashed rgba(166,120,0,0.30); }
  .mock-longterm__row { display: flex; justify-content: space-between; align-items: baseline; padding: 5px 0; font-family: var(--font-mono); font-size: 12.5px; border-bottom: 1px solid rgba(166,120,0,0.15); }
  .mock-longterm__row:last-of-type { border-bottom: none; }
  .mock-longterm__row span:first-child { color: var(--ink-900); font-weight: 500; }
  .mock-longterm__row span:last-child { color: var(--ink-700); font-size: 12px; }

  
  .wf-bar {
    margin-top: 40px;
    padding: 32px 36px;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--soft-dark-start) 0%, var(--soft-dark-end) 100%);
    color: var(--paper-10);
  }
  @media (max-width: 880px) { .wf-bar { padding: 28px 24px; } }
  .wf-bar__eb { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent-500); margin: 0 0 10px; }
  .wf-bar__h { font-family: var(--font-italic); font-size: clamp(22px, 2.5vw, 28px); line-height: 1.15; margin: 0 0 6px; font-weight: 500; }
  .wf-bar__h em { font-style: normal; font-weight: 300; letter-spacing: -0.06em; color: var(--accent-500); }
  .wf-bar__body { font-size: 14.5px; line-height: 1.6; color: rgba(251,251,253,0.72); max-width: 640px; margin-top: 8px; }
  .wf-bar__pipe { margin-top: 20px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
  .wf-bar__step { padding: 8px 14px; border-radius: 6px; background: rgba(251,251,253,0.08); font-family: var(--font-mono); font-size: 12.5px; border: 1px solid rgba(251,251,253,0.12); }
  .wf-bar__arr { color: var(--accent-500); font-weight: 700; font-family: var(--font-mono); }

  
  .einschub {
    max-width: 1440px;
    margin: 96px auto;
    padding: 80px 48px;
    border-radius: 24px;
    background: linear-gradient(135deg, var(--soft-dark-start) 0%, var(--soft-dark-end) 100%);
    color: var(--paper-10);
  }
  @media (max-width: 880px) { .einschub { padding: 56px 24px; border-radius: 16px; margin: 64px 24px; } }
  .einschub__inner { display: grid; grid-template-columns: 1.1fr 1fr; gap: 56px; align-items: start; }
  @media (max-width: 880px) { .einschub__inner { grid-template-columns: 1fr; gap: 40px; } }
  .einschub__eb { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent-500); margin: 0 0 14px; }
  .einschub__h {
    font-family: var(--font-italic);
    font-size: clamp(32px, 4vw, 48px);
    line-height: 1.05;
    font-weight: 500;
    margin: 0;
    letter-spacing: -0.015em;
  }
  .einschub__h em { font-style: normal; font-weight: 300; letter-spacing: -0.06em; color: var(--accent-500); }
  .einschub__body { font-size: 16px; line-height: 1.6; color: rgba(251,251,253,0.78); margin-top: 22px; max-width: 540px; }
  .einschub__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 14px; }
  .einschub__list li { padding: 20px 24px; background: rgba(251,251,253,0.06); border: 1px solid rgba(251,251,253,0.10); border-radius: 8px; }
  .einschub__list b { color: var(--paper-10); font-weight: 600; font-size: 15px; }
  .einschub__list span { color: rgba(251,251,253,0.62); display: block; margin-top: 4px; font-size: 13.5px; }
  .einschub__cta { margin-top: 28px; display: inline-flex; align-items: center; gap: 10px; padding: 12px 22px; background: var(--accent-500); color: var(--ink-900); border-radius: 9999px; font-weight: 600; font-size: 14px; text-decoration: none; transition: background .2s var(--motion-ease-out), transform .2s var(--motion-ease-out); }
  .einschub__cta:hover { background: #FFC92E; transform: translateY(-1px); }

  
  .final-cta {
    max-width: 1440px; margin: 96px auto 120px;
    padding: 96px 48px; border-radius: 24px;
    background: linear-gradient(135deg, var(--soft-dark-start) 0%, var(--soft-dark-end) 100%);
    color: var(--paper-10); text-align: center;
  }
  @media (max-width: 880px) { .final-cta { padding: 64px 24px; margin: 64px 24px 80px; border-radius: 16px; } }
  .final-cta__eb { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent-500); margin-bottom: 18px; }
  .final-cta__h { font-family: var(--font-italic); font-size: clamp(36px, 4.6vw, 60px); line-height: 1.0; font-weight: 500; margin: 0 0 18px; letter-spacing: -0.018em; }
  .final-cta__h em { font-style: normal; font-weight: 300; letter-spacing: -0.06em; color: var(--accent-500); }
  .final-cta__p { font-size: 18px; line-height: 1.55; color: rgba(251,251,253,0.72); max-width: 580px; margin: 0 auto 32px; }
  .final-cta__btn { display: inline-flex; align-items: center; gap: 10px; padding: 14px 28px; background: var(--accent-500); color: var(--ink-900); border-radius: 9999px; font-weight: 600; font-size: 15px; text-decoration: none; transition: background .2s var(--motion-ease-out), transform .2s var(--motion-ease-out); }
  .final-cta__btn:hover { background: #FFC92E; transform: translateY(-1px); }

  
  

  
  .du-link { text-decoration: none; color: inherit; }
  .du-link .dv-card { transition: transform .2s var(--motion-ease-out), border-color .2s var(--motion-ease-out); }
  .du-link:hover .dv-card { transform: translateY(-2px); border-color: var(--ink-300); }
  .du-metric { display: inline-block; margin-top: 12px; padding: 4px 10px; background: rgba(245,184,0,0.18); border-radius: 4px; font-family: var(--font-mono); font-size: 11.5px; color: var(--accent-700); font-weight: 600; }

  
  .dw-tag { display: inline-block; padding: 4px 12px; background: rgba(245,184,0,0.18); color: var(--accent-700); border-radius: 999px; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 600; }

  
  .next-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 24px; color: var(--accent-700); text-decoration: none; font-weight: 500; font-size: 15px; }
  .next-link:hover { color: var(--accent-600); }
  .next-link::after { content: '→'; font-weight: 400; }