.fd,.fd[data-tone=violet]{--tone:#8b5cf6;--tone-soft:#8b5cf61f;--tone-border:#8b5cf647;--tone-glow:#8b5cf62e}.fd[data-tone=sky]{--tone:#38bdf8;--tone-soft:#38bdf81f;--tone-border:#38bdf847;--tone-glow:#38bdf82e}.fd[data-tone=emerald]{--tone:#10b981;--tone-soft:#10b9811f;--tone-border:#10b98147;--tone-glow:#10b9812e}.fd[data-tone=amber]{--tone:#f59e0b;--tone-soft:#f59e0b1f;--tone-border:#f59e0b47;--tone-glow:#f59e0b2e}.fd[data-tone=rose]{--tone:#f43f5e;--tone-soft:#f43f5e1f;--tone-border:#f43f5e47;--tone-glow:#f43f5e2e}.fd[data-tone=cyan]{--tone:#06b6d4;--tone-soft:#06b6d41f;--tone-border:#06b6d447;--tone-glow:#06b6d42e}.fd-preview{border:1px solid var(--border);background:var(--surface);border-radius:.875rem;overflow:hidden;box-shadow:0 16px 32px -12px #00000026}.dark .fd-preview{background:#0f1017;box-shadow:0 20px 40px -12px #0009}.fd-preview__bar{border-bottom:1px solid var(--border);background:var(--surface-alt);align-items:center;padding:.5rem .75rem;display:flex}.dark .fd-preview__bar{background:#141620}.fd-card{transition:transform .18s,border-color .18s,box-shadow .18s}.fd-card:hover{border-color:var(--tone-border);transform:translateY(-2px);box-shadow:0 10px 24px -6px #00000024}.dark .fd-card:hover{box-shadow:0 12px 28px -6px #00000073}@media (min-width:768px){.fd-steps-container{position:relative}.fd-steps-connector{background:linear-gradient(90deg, var(--tone-border) 0%, #ffffff14 100%);pointer-events:none;z-index:0;height:2px;position:absolute;top:2.25rem;left:4rem;right:4rem}}