:root{
    --card-bg: #0f172a;
    --accent: #2563eb;
    --muted: #94a3b8;
    --text: #e6eef8;
    --radius: 12px;
  }

  .camera-card{
    width: 100%;
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(2,6,23,0.6);
    background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
    border: 1px solid rgba(255,255,255,0.03);
  }

  .camera-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:12px 16px;
    background: linear-gradient(90deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
    border-bottom: 1px solid rgba(255,255,255,0.02);
  }

  .camera-title{
    display:flex;
    gap:12px;
    align-items:center;
  }
  .camera-badge{
    width:12px;height:12px;border-radius:50%;
    background:#16a34a; box-shadow:0 0 8px rgba(22,163,74,0.25);
  }
  .camera-meta{
    font-size:14px;
    color:var(--muted);
  }

  /* Aspect ratio container 16:9 */
  .camera-frame{
    position:relative;
    width:100%;
    aspect-ratio: 16 / 9;
    background: #000;
  }

  .camera-frame iframe{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    border:0;
    display:block;
    background:#000;
  }

  /* overlay controls */
  .overlay{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    pointer-events:none; /* allow clicks to pass except on buttons */
  }


  .controls{
    position:absolute;
    right:12px;
    bottom:12px;
    display:flex;
    gap:8px;
    pointer-events:auto;
  }

  .icon-btn{
    background: rgba(0,0,0,0.45);
    border:1px solid rgba(255,255,255,0.04);
    color:var(--text);
    padding:8px;
    border-radius:10px;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:40px;
  }

  .small-note{
    position:absolute;
    left:12px;
    bottom:14px;
    font-size:13px;
    color:var(--muted);
    pointer-events:none;
  }

  /* mobile tweaks */
  @media (max-width:600px){
    .camera-card{ border-radius:10px; }
    .play-btn{ padding:10px 14px; font-size:14px; }
  }