/* Drink Cam · beyaz-yeşil düğün teması */
:root{
  --bg:#f6faf6; --ink:#16281c; --muted:#5c7565;
  --green:#2f6b45; --green-dk:#1f4a2f; --green-soft:#e4f1e8;
  --line:#d7e6dc; --gold:#c8a86b;
  --ok:#2f6b45; --warn:#8a6a1f; --bad:#a4402f;
  --serif:"Iowan Old Style",Georgia,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--ink);font:16px/1.5 var(--sans)}

button{font:600 16px/1 var(--sans);border:0;border-radius:12px;padding:16px;cursor:pointer}
button.primary{background:var(--green);color:#fff;width:100%}
button.ghost{background:var(--green-soft);color:var(--green-dk)}
button.danger{background:#f6e3df;color:var(--bad)}
button:disabled{opacity:.55}

/* ---------- yayıncı: giriş ---------- */
.gate{max-width:420px;margin:0 auto;padding:48px 22px;text-align:center}
.gate .logo{font-size:44px}
.gate h1{font:400 34px/1 var(--serif);letter-spacing:.06em;margin:10px 0 4px}
.gate .tag{color:var(--muted);font-size:14px;margin:0 0 30px;letter-spacing:.04em}
.gate label{display:block;text-align:left;font-size:13px;color:var(--muted);margin-bottom:14px}
.gate input{display:block;width:100%;margin-top:6px;padding:15px;font-size:17px;
  border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}
.gate input:focus{outline:2px solid var(--green);border-color:transparent}
.err{color:var(--bad);font-size:14px;min-height:20px;margin:12px 0 0}
.fine{color:var(--muted);font-size:12.5px;line-height:1.45;margin:16px 0 0}

/* ---------- yayıncı: canlı ---------- */
.live{display:flex;flex-direction:column;height:100dvh}
.videowrap{position:relative;flex:1;background:#000;overflow:hidden}
.videowrap video{width:100%;height:100%;object-fit:cover;display:block}
.onair{position:absolute;top:14px;left:50%;transform:translateX(-50%) scale(.9);
  background:var(--bad);color:#fff;font:700 13px/1 var(--sans);letter-spacing:.12em;
  padding:9px 16px;border-radius:999px;opacity:0;transition:.25s;pointer-events:none}
.onair.show{opacity:1;transform:translateX(-50%) scale(1);
  animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 0 12px rgba(164,64,47,.001);opacity:.75}}
.conn{position:absolute;bottom:12px;left:12px;background:rgba(0,0,0,.55);color:#fff;
  font-size:12px;padding:6px 11px;border-radius:999px;backdrop-filter:blur(6px)}
.conn.ok{background:rgba(47,107,69,.85)}
.conn.warn{background:rgba(138,106,31,.85)}
.conn.bad{background:rgba(164,64,47,.9)}

.controls{padding:14px 16px calc(16px + env(safe-area-inset-bottom));background:#fff;
  border-top:1px solid var(--line)}
.lens{display:flex;gap:8px;margin-bottom:12px;overflow-x:auto}
.lensbtn{flex:0 0 auto;padding:10px 14px;font-size:13px;background:var(--green-soft);
  color:var(--green-dk);border-radius:999px}
.lensbtn.on{background:var(--green);color:#fff}
.zoom{display:flex;align-items:center;gap:12px;margin-bottom:12px;font-size:13px;color:var(--muted)}
.zoom input{flex:1;accent-color:var(--green)}
.zoom b{color:var(--ink);min-width:44px;text-align:right}
.btnrow{display:flex;gap:10px}
.btnrow button{flex:1}