/* CAM100 polish layer — visual only */
:root {
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --focus-ring: 0 0 0 3px #3d8cff30;
}
.login-card,.welcome-card,.monitor-card,.panel{
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow);
}
.topbar{
  min-height:76px;
  background:#0b111bef;
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(16px);
}
.main-nav button,.top-action,.logout-btn{
  transition:background .18s ease,color .18s ease;
}
.device-item{
  border:1px solid transparent;
  border-radius:var(--radius-md);
  transition:background .18s ease,border-color .18s ease;
}
.device-item.selected{
  background:#3d8cff18;
  border-color:#3d8cff65;
  box-shadow:inset 3px 0 0 var(--blue);
}
.device-item.locked{opacity:.68}
.input-wrap,.search-box{
  border-radius:var(--radius-md);
  transition:border-color .18s ease,box-shadow .18s ease;
}
.input-wrap:focus-within,.search-box:focus-within{
  border-color:var(--blue);
  box-shadow:var(--focus-ring);
}
.primary-btn,.ghost-btn,.danger-btn,.link-btn,.icon-btn,.control-btn{
  transition:background .18s ease,border-color .18s ease,filter .18s ease;
}
.danger-btn{
  background:#ff657418;
  border-color:#ff657455;
  color:var(--danger);
}
.monitor-card{overflow:hidden;background:var(--panel)}
.monitor-head{background:var(--panel2);border-bottom:1px solid var(--line)}
.video-wrap{background:#000}
.replay-track{overflow:hidden;border-radius:999px;background:var(--panel3)}
.replay-fill{border-radius:inherit;background:linear-gradient(90deg,#287cf0,#6baeff)}
.panel{padding:20px}
button:focus-visible,a:focus-visible,input:focus-visible{
  outline:2px solid var(--blue);outline-offset:2px;
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
@media (max-width:760px){
  .topbar{min-height:56px}
  .panel{padding:14px}
  .primary-btn,.ghost-btn,.danger-btn,.control-btn{min-height:42px}
}