/* V.20.14 draft: a fullscreen view without moving or covering the Twitch iframe. */
.stream-notice.has-fullscreen-control {
  flex-basis:auto;
  min-height:46px;
  flex-wrap:wrap;
  gap:4px 10px;
}
.has-fullscreen-control .stream-playback { flex:1 1 125px }
.stream-fullscreen-open {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  flex-shrink:0;
  min-height:36px;
  padding:4px 5px;
  border:0;
  border-radius:4px;
  background:transparent;
  color:#d6d6dc;
  font:inherit;
  cursor:pointer;
}
.stream-fullscreen-open:hover { color:#fff;background:#2a2a30 }
.stream-fullscreen-open:focus-visible,
.stream-fullscreen-close:focus-visible { outline:2px solid #fff;outline-offset:2px }
.stream-fullscreen-toolbar { display:none }

html.has-stream-fullscreen,
html.has-stream-fullscreen body { overflow:hidden;overscroll-behavior:none }
.stream-grid.has-stream-fullscreen { z-index:1000 }
.stream-card.has-stream-fullscreen { z-index:1001;overflow:visible }
.stream-media.is-stream-fullscreen {
  --fullscreen-tools:calc(44px + env(safe-area-inset-top, 0px));
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  width:100dvw;
  height:100dvh;
  min-width:0;
  min-height:0;
  max-width:none;
  max-height:none;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  flex:none;
  z-index:1002;
  overflow:hidden;
  background:#000;
  box-sizing:border-box;
}
.stream-media.is-stream-fullscreen:fullscreen { width:100%;height:100%;inset:0 }
.stream-media.is-stream-fullscreen:-webkit-full-screen { width:100%;height:100%;inset:0 }
.is-stream-fullscreen .stream-fullscreen-toolbar {
  position:absolute;
  top:0;left:0;right:0;
  display:flex;
  align-items:center;
  gap:12px;
  height:var(--fullscreen-tools);
  padding:env(safe-area-inset-top, 0px) max(10px,env(safe-area-inset-right, 0px)) 0 max(10px,env(safe-area-inset-left, 0px));
  box-sizing:border-box;
  color:#dddde3;
  background:#111114;
  border-bottom:1px solid #303035;
  font:12px/1.3 var(--mono, monospace);
}
.stream-fullscreen-title {
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  font-weight:700;
}
.stream-fullscreen-hint { display:none;font-size:10px;color:#a2a2ae }
.stream-fullscreen-close {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:none;
  gap:6px;
  margin-left:auto;
  min-width:60px;
  min-height:40px;
  padding:4px 8px;
  color:#f5f5f7;
  background:#26262d;
  border:1px solid #494954;
  border-radius:4px;
  font:inherit;
  cursor:pointer;
}
.stream-fullscreen-close:hover { background:#393942 }
.stream-fullscreen-close .icon { width:16px;height:16px }
.stream-media.is-stream-fullscreen > .stream-player,
.stream-media.is-stream-fullscreen > .stream-placeholder {
  position:absolute;
  inset:var(--fullscreen-tools) 0 0;
  width:100%;
  height:calc(100% - var(--fullscreen-tools));
  min-width:0;
  min-height:0;
  max-width:none;
  max-height:none;
}
.stream-media.is-stream-fullscreen .stream-player iframe {
  display:block;
  width:100%;height:100%;max-width:none;max-height:none;
  border:0;
}
.stream-player iframe:fullscreen { width:100%;height:100%;max-width:none;max-height:none }
.stream-player iframe:-webkit-full-screen { width:100%;height:100%;max-width:none;max-height:none }
@media (orientation:portrait) and (min-width:450px) {
  .is-stream-fullscreen[data-fullscreen-mode="viewport"] .stream-fullscreen-hint { display:inline }
}
/* On short landscape screens put Exit beside the player. This preserves video
   height and leaves all Twitch controls visible without a button overlay. */
@media (orientation:landscape) and (max-height:380px) {
  .stream-media.is-stream-fullscreen { --fullscreen-tools:calc(52px + env(safe-area-inset-right, 0px)) }
  .is-stream-fullscreen .stream-fullscreen-toolbar {
    top:0;bottom:0;right:0;left:auto;
    flex-direction:column;
    width:var(--fullscreen-tools);
    height:100%;
    padding:max(5px,env(safe-area-inset-top, 0px)) env(safe-area-inset-right, 0px) max(5px,env(safe-area-inset-bottom, 0px)) 0;
    border-bottom:0;
    border-left:1px solid #303035;
  }
  .is-stream-fullscreen .stream-fullscreen-title,
  .is-stream-fullscreen .stream-fullscreen-hint,
  .is-stream-fullscreen .stream-fullscreen-close span { display:none }
  .is-stream-fullscreen .stream-fullscreen-close { min-width:44px;min-height:44px;margin:0;padding:5px }
  .stream-media.is-stream-fullscreen > .stream-player,
  .stream-media.is-stream-fullscreen > .stream-placeholder {
    inset:0 var(--fullscreen-tools) 0 0;
    width:calc(100% - var(--fullscreen-tools));
    height:100%;
  }
}