.tunnel-tool { padding: 24px; border: 1px solid var(--nx-border-2); border-radius: 16px; background: var(--nx-surface); margin: 28px 0 48px; }
.tunnel-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 20px 0; }
.tunnel-tool label { display: flex; flex-direction: column; gap: 8px; font-size: 14px; }
.tunnel-tool input, .tunnel-tool select { width: 100%; min-width: 0; min-height: 44px; padding: 10px 12px; border: 1px solid var(--nx-border-2); border-radius: 8px; background: var(--nx-bg); color: var(--nx-text); font: inherit; }
.tunnel-tool small { color: var(--nx-text-2); }
.tunnel-tool pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.tunnel-tool [hidden] { display: none; }
#tunnel-error { color: #ffb4b4; }
@media (max-width: 600px) { .tunnel-fields { grid-template-columns: 1fr; } .tunnel-tool { padding: 18px; } }