.kr-live-wrap{
  max-width:1400px;
  margin:0 auto;
  padding:20px;
  min-height:80vh;
  position:relative;
}

/* Error notice */
.kr-error-notice{
  background:#f8d7da;
  color:#721c24;
  padding:20px;
  border:1px solid #f5c6cb;
  border-radius:8px;
  text-align:center;
  margin:50px auto;
  max-width:700px;
}
.kr-error-notice h2{ margin:0 0 10px; }

/* Grid Layout */
.live-grid{
  display:grid;
  grid-template-columns:2fr 1fr;
  gap:20px;
  animation:krFadeIn .5s ease;
}
@keyframes krFadeIn{
  from{ opacity:0; transform:translateY(10px); }
  to{ opacity:1; transform:translateY(0); }
}

/* Video */
.video-column{
  background:rgba(0,0,0,.80);
  border-radius:8px;
  padding:15px;
  box-shadow:0 4px 6px rgba(0,0,0,.15);
}
.video-container{
  position:relative;
  padding-bottom:56.25%;
  height:0;
  overflow:hidden;
  border-radius:6px;
  background:#000;
}
.video-container iframe,
.video-container video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}
.video-fallback{
  background:#000;
  color:#fff;
  padding:50px;
  text-align:center;
  border-radius:6px;
}

/* Chat */
.chat-column{
  background:rgba(0,0,0,.80);
  border-radius:8px;
  overflow:hidden;
  box-shadow:0 4px 6px rgba(0,0,0,.15);
}
.chat-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:15px;
  background:#222;
  border-bottom:1px solid #444;
}
.chat-title{ margin:0; color:#ba922d; }
.chat-icon{ margin-right:8px; }

.chat-controls{ display:flex; gap:5px; }
.chat-control-btn{
  background:#444;
  border:1px solid #555;
  color:#fff;
  cursor:pointer;
  padding:5px 10px;
  border-radius:4px;
  font-size:14px;
}
.chat-control-btn:hover{ background:#555; }

.chat-container{ padding:0; }
.chat-fallback{
  padding:20px;
  text-align:center;
  color:#ddd;
}

/* Collapsed chat */
.kr-chat-collapsed .chat-container{ display:none; }
.kr-chat-collapsed .chat-header{ border-bottom:none; }

/* Login */
.login-container{
  max-width:520px;
  margin:50px auto;
  background:#111;
  padding:40px;
  border:2px solid #ba922d;
  border-radius:10px;
  text-align:center;
  color:#fff;
  animation:krFadeIn .8s ease;
}
.login-icon{
  font-size:50px;
  margin-bottom:15px;
  color:#ba922d;
}
.login-header h1{
  color:#fff;
  margin:0 0 5px;
}
.login-form-container{
  background:rgba(0,0,0,.30);
  padding:20px;
  border-radius:6px;
}
.login-fallback{ color:#fff; }

/* Responsive */
@media (max-width:1200px){
  .live-grid{ grid-template-columns:1.5fr 1fr; }
}
@media (max-width:900px){
  .live-grid{ grid-template-columns:1fr; }
  .chat-column{ margin-top:20px; }
}
@media (max-width:600px){
  .kr-live-wrap{ padding:12px; }
  .login-container{ padding:20px; margin:20px auto; }
}