.ramp-preview.svelte-tfx8wz{gap:var(--spacing-xl);min-width:0;padding:var(--spacing-3xl);background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);flex-direction:column;flex:1;display:flex}.ramp-output.svelte-tfx8wz{gap:var(--spacing-md);flex-direction:column;display:flex}.ramp-strip.svelte-tfx8wz{border-radius:var(--radius-sm);border:1px solid var(--border-color);height:64px;display:flex;overflow:hidden}.ramp-cell.svelte-tfx8wz{cursor:pointer;border:none;flex:1;padding:0;transition:transform .1s;position:relative}.ramp-cell.svelte-tfx8wz:hover{z-index:1;transform:scaleY(1.1)}.copied-badge.svelte-tfx8wz{background:var(--tooltip-bg);color:var(--tooltip-text);padding:var(--spacing-xs) 6px;border-radius:var(--radius-md);pointer-events:none;white-space:nowrap;font-size:10px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.ramp-hexes.svelte-tfx8wz{display:flex;overflow-x:auto}.ramp-hex.svelte-tfx8wz{text-align:center;color:var(--text-tertiary);text-overflow:ellipsis;flex:1;min-width:0;font-family:monospace;font-size:10px;overflow:hidden}.mode-buttons.svelte-tfx8wz{gap:6px;display:flex}.mode-btn.svelte-tfx8wz{padding:var(--spacing-lg) 12px;color:var(--text-secondary);background:var(--button-bg);border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;flex:1;font-size:13px;font-weight:500}.mode-btn.svelte-tfx8wz:hover{background:var(--button-bg-hover)}.mode-btn.active.svelte-tfx8wz{color:var(--text-on-accent);background:var(--accent-color);border-color:var(--accent-color)}