.nio-live-cameras-app,.nio-single-camera{--nio-border:#e5e7eb;--nio-bg:#f8fafc;--nio-text:#111827;--nio-muted:#6b7280;--nio-brand:#0f766e;--nio-brand-2:#14b8a6;color:var(--nio-text)}
.nio-hero{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:24px;border:1px solid var(--nio-border);border-radius:20px;background:linear-gradient(135deg,#eff6ff,#ecfeff);margin-bottom:20px}
.nio-eyebrow{text-transform:uppercase;letter-spacing:.08em;font-size:12px;color:var(--nio-brand);font-weight:700;margin:0 0 8px}
.nio-hero h2{margin:0 0 8px;font-size:32px;line-height:1.1}
.nio-hero p{margin:0;max-width:760px}
.nio-hero-actions{display:flex;gap:10px;flex-wrap:wrap}
.nio-btn{border:1px solid var(--nio-border);background:#fff;padding:10px 14px;border-radius:12px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;font-weight:600;color:#111827}
.nio-btn-primary,.nio-btn.is-active{background:var(--nio-brand);color:#fff;border-color:var(--nio-brand)}
.nio-toolbar{display:grid;grid-template-columns:2fr repeat(5,1fr) auto auto;gap:12px;margin:18px 0}
.nio-search,.nio-filter,.nio-sort{padding:12px;border:1px solid var(--nio-border);border-radius:12px;background:#fff;min-width:0}
.nio-map-wrap{border:1px solid var(--nio-border);border-radius:18px;overflow:hidden;background:#fff;margin-bottom:18px}
#nio-live-cameras-map{height:420px}
.nio-results-header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:10px 0 16px}
.nio-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.nio-results.compact-view{grid-template-columns:repeat(2,minmax(0,1fr))}
.nio-card{border:1px solid var(--nio-border);border-radius:18px;overflow:hidden;background:#fff;display:flex;flex-direction:column;box-shadow:0 10px 30px rgba(2,6,23,.05)}
.nio-card.is-compact{flex-direction:row}
.nio-card-media-link{display:block}
.nio-card.is-compact .nio-card-media-link{width:36%}
.nio-card-media{width:100%;aspect-ratio:16/9;object-fit:cover;background:#dbeafe;display:block}
.nio-card-media-placeholder{display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--nio-muted)}
.nio-card-body{padding:16px}
.nio-card-topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:8px}
.nio-status{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font-size:12px;text-transform:capitalize;background:#eef2ff;color:#3730a3}
.nio-status.is-online{background:#ecfdf5;color:#065f46}.nio-status.is-offline{background:#fef2f2;color:#991b1b}.nio-status.is-unknown{background:#f3f4f6;color:#374151}
.nio-favourite-toggle{border:none;background:#fff7ed;border-radius:999px;width:36px;height:36px;cursor:pointer;font-size:18px;color:#c2410c}.nio-favourite-toggle.is-active{background:#fed7aa}
.nio-card h3{margin:0 0 8px;font-size:22px;line-height:1.2}.nio-card h3 a{text-decoration:none;color:#0f172a}
.nio-location,.nio-distance{color:var(--nio-muted);font-size:14px;margin:0 0 8px}
.nio-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.nio-tags span{font-size:12px;background:var(--nio-bg);border:1px solid var(--nio-border);padding:4px 8px;border-radius:999px}
.nio-disclaimer{margin-top:16px;font-size:13px;color:var(--nio-muted)}
.nio-empty{padding:28px;border:1px dashed var(--nio-border);border-radius:16px;text-align:center;background:#fff}
.nio-featured-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.nio-single-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(320px,1fr);gap:24px;margin-top:20px}.nio-panel{border:1px solid var(--nio-border);background:#fff;border-radius:18px;padding:18px;margin-bottom:18px}
.nio-single-image-wrap img,.nio-single-embed-wrap iframe{display:block;width:100%;aspect-ratio:16/9;border:1px solid var(--nio-border);border-radius:18px;background:#fff}.nio-single-embed-wrap iframe{min-height:460px}
.nio-meta-list{list-style:none;padding:0;margin:0}.nio-meta-list li{padding:8px 0;border-bottom:1px solid var(--nio-border)}.nio-meta-list li:last-child{border-bottom:none}
#nio-single-map{height:280px;border-radius:14px;overflow:hidden}
.nio-sponsor-block{background:linear-gradient(135deg,#fff7ed,#fffbeb)}
@media (max-width: 1100px){.nio-toolbar{grid-template-columns:1fr 1fr 1fr}.nio-results,.nio-featured-grid,.nio-single-grid{grid-template-columns:1fr 1fr}.nio-card.is-compact{flex-direction:column}.nio-card.is-compact .nio-card-media-link{width:100%}}
@media (max-width: 767px){.nio-hero,.nio-results-header{flex-direction:column;align-items:flex-start}.nio-toolbar,.nio-results,.nio-featured-grid,.nio-single-grid{grid-template-columns:1fr}#nio-live-cameras-map{height:340px}.nio-hero h2{font-size:26px}}
.nio-source-line,.nio-image-attribution{font-size:12px;color:var(--nio-muted);margin:10px 0 0}