*{box-sizing:border-box}html,body{margin:0;height:100%;background:#000;color:#fff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;overflow:hidden}button,input{font:inherit}a{color:#fff;text-decoration:none}.screen{position:relative;width:100vw;height:100dvh;overflow:hidden;background:#000}.video-stage{position:absolute;inset:0;background:#000}.main-slot,.main-video,.self-main{position:absolute;inset:0;background:#000;overflow:hidden}.main-video video,.self-main video{width:100%;height:100%;object-fit:cover}.main-video:after,.self-main:after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.62),transparent 28%,transparent 55%,rgba(0,0,0,.76));pointer-events:none;z-index:2}.topbar{position:absolute;top:0;left:0;right:0;z-index:30;padding:18px 18px 0;display:flex;justify-content:space-between;align-items:flex-start}.host-card{display:grid;grid-template-columns:58px 1fr;gap:12px;align-items:center}.avatar{width:58px;height:58px;border-radius:50%;background:linear-gradient(135deg,#f472b6,#7c3aed);display:grid;place-items:center;font-weight:900;border:2px solid rgba(255,255,255,.85)}.host-name{font-size:20px;font-weight:900;text-shadow:0 2px 10px #000}.viewer-text{font-size:15px;opacity:.92;text-shadow:0 2px 8px #000}.live-badge{display:inline-block;margin-top:14px;background:#ec2f68;color:#fff;padding:8px 13px;border-radius:8px;font-size:16px;font-weight:900}.close-btn{width:48px;height:48px;border:0;background:transparent;color:#fff;font-size:46px;line-height:1;text-shadow:0 2px 8px #000}.guest-stack{position:absolute;right:14px;top:130px;bottom:230px;width:96px;z-index:22;display:flex;flex-direction:column;gap:10px;overflow-y:auto}.guest-tile{position:relative;width:96px;min-height:130px;border-radius:18px;overflow:hidden;background:#141414;border:1px solid rgba(255,255,255,.2)}.guest-tile video{width:100%;height:100%;object-fit:cover}.name-chip{position:absolute;left:8px;bottom:8px;z-index:6;background:rgba(0,0,0,.58);border-radius:999px;padding:5px 8px;font-size:12px;font-weight:800}.status-icons{position:absolute;right:6px;top:6px;z-index:7;display:flex;gap:4px}.ico{background:rgba(0,0,0,.58);border-radius:999px;padding:4px 5px;font-size:12px}.off,.waiting{position:absolute;inset:0;z-index:5;display:none;align-items:center;justify-content:center;text-align:center;background:linear-gradient(135deg,#151515,#050505);color:#ddd;font-size:12px;padding:12px}.waiting{display:flex;background:rgba(0,0,0,.52)}.off b{display:block;font-size:28px}.comments{position:absolute;left:18px;right:120px;bottom:110px;z-index:32;max-height:34vh;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}.messages{overflow-y:auto;max-height:34vh;padding-right:6px}.msg{display:grid;grid-template-columns:42px 1fr;gap:9px;margin:10px 0;align-items:start;text-shadow:0 2px 8px #000}.msg .av{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#f97316,#ec4899);display:grid;place-items:center;font-weight:900;border:1px solid rgba(255,255,255,.45)}.msg b{display:block;font-size:16px}.msg span{font-size:16px;color:#fff}.bottom-input{position:absolute;left:18px;right:18px;bottom:26px;z-index:40;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}.comment-form{display:grid;grid-template-columns:1fr 46px;gap:8px}.comment-form input{height:56px;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:rgba(255,255,255,.16);backdrop-filter:blur(20px);color:#fff;padding:0 20px;font-size:18px;outline:0}.comment-form button{border:0;border-radius:999px;background:#ec2f68;color:#fff;font-weight:900;width:56px}.request-pill{height:56px;border:0;border-radius:999px;background:rgba(255,255,255,.18);backdrop-filter:blur(20px);color:#fff;font-weight:900;display:flex;align-items:center;gap:8px;padding:0 18px;font-size:16px}.request-pill svg{width:26px;height:26px}.drawer-backdrop{position:absolute;inset:0;z-index:60;background:rgba(0,0,0,.18);display:none}.drawer-backdrop.open{display:block}.bottom-sheet{position:absolute;left:0;right:0;bottom:0;z-index:70;background:rgba(25,26,30,.96);backdrop-filter:blur(26px);border-radius:30px 30px 0 0;padding:16px 22px 34px;transform:translateY(110%);transition:transform .22s ease;box-shadow:0 -18px 70px rgba(0,0,0,.6)}.bottom-sheet.open{transform:translateY(0)}.sheet-handle{width:58px;height:6px;border-radius:999px;background:rgba(255,255,255,.32);margin:0 auto 20px}.sheet-title{font-size:22px;font-weight:900;margin:0 0 8px}.sheet-subtitle{font-size:16px;color:#aaa;margin-bottom:18px}.sheet-row{width:100%;display:flex;align-items:center;gap:18px;border:0;background:transparent;color:#fff;padding:18px 0;font-size:20px;font-weight:800;text-align:left}.sheet-icon{width:44px;height:44px;border-radius:14px;background:rgba(236,47,104,.12);display:grid;place-items:center;color:#ec2f68;font-size:24px}.chev{margin-left:auto;font-size:32px;color:#fff}.menu-panel{position:absolute;right:18px;top:86px;width:min(330px,calc(100vw - 36px));z-index:75;background:rgba(25,26,30,.96);backdrop-filter:blur(26px);border:1px solid rgba(255,255,255,.12);border-radius:24px;padding:14px;display:none}.menu-panel.open{display:block}.field{margin-bottom:10px}.field label{display:block;font-size:12px;color:#aaa;margin-bottom:5px}.field input{width:100%;height:44px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(255,255,255,.08);color:#fff;padding:0 12px;outline:0}.self-preview{height:150px;background:#000;border-radius:18px;overflow:hidden;position:relative;margin:10px 0}.self-preview video{width:100%;height:100%;object-fit:cover}.grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.btn{border:0;border-radius:14px;padding:12px 10px;background:#2b303b;color:#fff;font-weight:900;text-align:center}.btn.red{background:#ec2f68}.btn.green{background:#16a34a}.btn.blue{background:#2563eb}.btn:disabled{opacity:.5}.hidden{display:none!important}.requests{max-height:170px;overflow:auto}.req{display:grid;grid-template-columns:1fr auto auto;gap:6px;align-items:center;border-top:1px solid rgba(255,255,255,.12);padding:8px 0}.participant-menu{position:absolute;left:8px;right:8px;bottom:46px;z-index:20;background:rgba(0,0,0,.78);backdrop-filter:blur(12px);border-radius:14px;padding:8px;display:none;flex-direction:column;gap:6px}.participant-menu.open{display:flex}.participant-menu button{border:0;border-radius:10px;padding:8px;color:#fff;background:#2b303b;font-weight:900}.participant-menu button.red{background:#ec2f68}.lives-page{min-height:100dvh;overflow:auto;background:#08080c;padding:18px}.live-card{display:grid;grid-template-columns:110px 1fr;gap:12px;align-items:center;background:#171922;border:1px solid #2b303b;border-radius:18px;padding:10px;margin:12px 0;color:#fff;text-decoration:none}.thumb{height:86px;border-radius:16px;background:linear-gradient(135deg,#7c3aed,#ec4899);position:relative}.thumb:after{content:"LIVE";position:absolute;left:8px;top:8px;background:#ec2f68;padding:4px 8px;border-radius:7px;font-weight:900;font-size:12px}.empty{background:#171922;border-radius:18px;padding:20px;color:#aaa;margin-top:12px}@media(max-width:420px){.comments{right:112px}.guest-stack{width:88px}.guest-tile{width:88px;min-height:118px}.host-card{grid-template-columns:50px 1fr}.avatar{width:50px;height:50px}.host-name{font-size:18px}.comment-form input{font-size:16px}.request-pill{padding:0 14px}}

/* Patch: hamburger menu and full-width bottom controls */
.close-btn{display:none!important}
.menu-toggle{width:54px;height:54px;border:0;background:transparent;color:#fff;display:grid;place-items:center;padding:0;filter:drop-shadow(0 2px 8px #000)}
.menu-toggle span,.menu-toggle span:before,.menu-toggle span:after{display:block;width:34px;height:4px;background:#fff;border-radius:999px;content:""}
.menu-toggle span:before{transform:translateY(-10px)}
.menu-toggle span:after{transform:translateY(6px)}
.menu-panel{display:block!important;position:absolute!important;left:0!important;right:0!important;top:auto!important;bottom:0!important;width:100%!important;z-index:75!important;background:rgba(25,26,30,.97)!important;backdrop-filter:blur(26px)!important;border:0!important;border-radius:30px 30px 0 0!important;padding:16px 24px max(34px,env(safe-area-inset-bottom))!important;transform:translateY(110%);transition:transform .22s ease;box-shadow:0 -18px 70px rgba(0,0,0,.6)!important}
.menu-panel.open{transform:translateY(0)!important}
.menu-panel:before{content:"";display:block;width:58px;height:6px;border-radius:999px;background:rgba(255,255,255,.32);margin:0 auto 16px}
.menu-panel:after{content:"Live controls";display:block;font-size:22px;font-weight:900;margin:0 0 14px}
.drawer-backdrop.open{display:block!important}
.bottom-sheet{width:100%!important}

/* Latest UX improvements */
.name-modal-backdrop{position:absolute;inset:0;z-index:120;background:rgba(0,0,0,.72);backdrop-filter:blur(18px);display:none;align-items:flex-end}.name-modal-backdrop.open{display:flex}.name-modal{width:100%;background:rgba(25,26,30,.98);border-radius:30px 30px 0 0;padding:22px 24px max(34px,env(safe-area-inset-bottom));box-shadow:0 -20px 80px rgba(0,0,0,.7)}.name-modal h2{margin:0 0 8px;font-size:26px}.name-modal p{margin:0 0 18px;color:#aaa;font-size:16px}.name-modal input{width:100%;height:56px;border:1px solid rgba(255,255,255,.14);border-radius:18px;background:rgba(255,255,255,.08);color:#fff;padding:0 16px;font-size:18px;outline:0}.name-modal button{margin-top:12px;width:100%;height:56px;border:0;border-radius:18px;background:#ec2f68;color:#fff;font-weight:900;font-size:18px}.request-pill{width:56px!important;padding:0!important;justify-content:center!important}.request-pill .request-text{display:none!important}.center-status{position:absolute;inset:0;z-index:8;display:none;align-items:center;justify-content:center;gap:18px;pointer-events:none}.center-status.show{display:flex}.center-status span{width:64px;height:64px;border-radius:50%;background:rgba(0,0,0,.58);backdrop-filter:blur(12px);display:none;align-items:center;justify-content:center;font-size:32px;box-shadow:0 8px 24px rgba(0,0,0,.45)}.center-status span.show{display:flex}.status-icons{display:none!important}.btn.full{grid-column:1/-1;width:100%}


/* Latest menu and live metadata updates */
.menu-panel{
  height:40dvh!important;
  max-height:40dvh!important;
  overflow-y:auto!important;
}
.menu-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:8px;
}
.menu-header .sheet-title{
  margin:0;
}
.menu-close{
  width:42px;
  height:42px;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-size:26px;
  line-height:1;
  font-weight:900;
}
.field textarea{
  width:100%;
  min-height:70px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:rgba(255,255,255,.08);
  color:#fff;
  padding:10px 12px;
  outline:0;
  resize:vertical;
}
.live-image-preview{
  width:100%;
  height:96px;
  border-radius:16px;
  background:#111;
  object-fit:cover;
  display:none;
  margin-top:8px;
}
.live-image-preview.show{display:block}
.live-card-image{
  height:86px;
  border-radius:16px;
  background:linear-gradient(135deg,#7c3aed,#ec4899);
  object-fit:cover;
  width:110px;
}

.request-pill{position:relative}
.request-badge{position:absolute;right:-4px;top:-6px;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:#ff1744;color:#fff;display:none;align-items:center;justify-content:center;font-size:12px;font-weight:900;box-shadow:0 4px 12px rgba(0,0,0,.35)}
.request-badge.show{display:flex}
.requests-sheet-list{display:flex;flex-direction:column;gap:10px;max-height:26dvh;overflow:auto}
.request-card{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:12px}
.request-card b{display:block;font-size:16px}.request-card small{color:#aaa}
.request-card .small-btn{border:0;border-radius:12px;padding:10px 12px;color:#fff;font-weight:900;background:#2b303b}
.request-card .small-btn.green{background:#16a34a}.request-card .small-btn.red{background:#ec2f68}
