/* TireNex Beta — public signup form + My Devices (dark theme friendly) */
.tnb-signup { max-width: 560px; margin: 0 auto; }
.tnb-form { display: flex; flex-direction: column; gap: 14px; }
.tnb-form .tnb-row { display: flex; gap: 14px; }
.tnb-form .tnb-row label { flex: 1; }
.tnb-form label { display: flex; flex-direction: column; gap: 6px; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: #9ca3af; font-weight: 600; }
.tnb-form input { width: 100%; padding: 13px 15px; background: #0d1520; border: 1px solid rgba(255,255,255,0.12); border-radius: 10px; color: #e8e8e8; font-size: 15px; }
.tnb-form input:focus { outline: none; border-color: #1D9E75; box-shadow: 0 0 0 3px rgba(29,158,117,0.18); }
.tnb-btn { margin-top: 4px; padding: 14px 20px; background: #1D9E75; color: #04201a; border: none; border-radius: 10px; font-size: 15px; font-weight: 700; cursor: pointer; transition: background .2s, transform .1s; }
.tnb-btn:hover { background: #5DCAA5; }
.tnb-btn:active { transform: translateY(1px); }
.tnb-fineprint { margin: 2px 0 0; font-size: 12px; color: #6b7280; text-align: center; }
.tnb-banner { padding: 13px 16px; border-radius: 10px; margin-bottom: 16px; font-size: 14px; line-height: 1.5; }
.tnb-banner.ok { background: rgba(29,158,117,0.12); border: 1px solid rgba(29,158,117,0.4); color: #5DCAA5; }
.tnb-banner.err { background: rgba(220,38,38,0.12); border: 1px solid rgba(220,38,38,0.4); color: #fca5a5; }
.tnb-full { text-align: center; padding: 22px; border: 1px dashed rgba(255,255,255,0.16); border-radius: 12px; background: rgba(255,255,255,0.02); }
.tnb-full strong { display: block; font-size: 18px; color: #e8e8e8; margin-bottom: 4px; }
.tnb-full span { color: #9ca3af; font-size: 14px; }
@media (max-width: 520px) { .tnb-form .tnb-row { flex-direction: column; } }

/* My Devices */
.tnb-mydevices { max-width: 760px; }
.tnb-md-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; gap: 12px; flex-wrap: wrap; }
.tnb-md-head h3 { margin: 0; font-size: 20px; }
.tnb-md-status { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; padding: 4px 12px; border-radius: 20px; background: rgba(148,163,184,0.18); color: #9fb0c4; }
.tnb-md-status.is-beta { background: rgba(217,119,6,0.18); color: #e7a948; }
.tnb-md-empty { color: #9ca3af; padding: 18px 0; }
.tnb-device-card { border: 1px solid rgba(255,255,255,0.10); border-left: 3px solid #1D9E75; border-radius: 12px; padding: 16px 18px; margin-bottom: 14px; background: rgba(255,255,255,0.02); }
.tnb-device-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.tnb-device-serial strong { font-size: 18px; font-family: 'DM Mono', ui-monospace, monospace; }
.tnb-device-serial .tnb-model { margin-left: 10px; font-size: 13px; color: #9ca3af; }
.tnb-device-beta { font-size: 11px; font-weight: 600; text-transform: uppercase; padding: 3px 10px; border-radius: 5px; background: rgba(217,119,6,0.18); color: #e7a948; }
.tnb-device-grid { display: flex; flex-wrap: wrap; gap: 18px 32px; margin-bottom: 8px; }
.tnb-device-grid > div { font-size: 14px; }
.tnb-lbl { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: #6b7280; margin-bottom: 3px; font-weight: 600; }
.tnb-device-hw { margin-top: 10px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,0.08); }
.tnb-device-hw p { margin: 0; font-size: 14px; line-height: 1.6; color: #cbd5e1; }