/* src/fonts/inter-web/inter.css */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(./Inter-Thin-3L5KITMZ.woff2?v=3.19) format("woff2"), url(./Inter-Thin-CYZF3GYP.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 100;
  font-display: swap;
  src: url(./Inter-ThinItalic-J7DGFM6P.woff2?v=3.19) format("woff2"), url(./Inter-ThinItalic-2PMJSR4I.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url(./Inter-ExtraLight-NASBO7I6.woff2?v=3.19) format("woff2"), url(./Inter-ExtraLight-CXAIFJL5.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 200;
  font-display: swap;
  src: url(./Inter-ExtraLightItalic-AUJY3XPT.woff2?v=3.19) format("woff2"), url(./Inter-ExtraLightItalic-HPXOKT2Z.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(./Inter-Light-E4ED7JRX.woff2?v=3.19) format("woff2"), url(./Inter-Light-SHP53WCC.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(./Inter-LightItalic-BJ4DXCNT.woff2?v=3.19) format("woff2"), url(./Inter-LightItalic-7DGPFAJ7.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./Inter-Regular-6HYMGWZS.woff2?v=3.19) format("woff2"), url(./Inter-Regular-6NLOQSVA.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(./Inter-Italic-2WJ2RX3Z.woff2?v=3.19) format("woff2"), url(./Inter-Italic-TPVLPBCS.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(./Inter-Medium-3R4SWUEO.woff2?v=3.19) format("woff2"), url(./Inter-Medium-5R65FWOY.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(./Inter-MediumItalic-QTJUSOU7.woff2?v=3.19) format("woff2"), url(./Inter-MediumItalic-C4YB4W2A.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(./Inter-SemiBold-7SYQBR3A.woff2?v=3.19) format("woff2"), url(./Inter-SemiBold-KUBH4RZE.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(./Inter-SemiBoldItalic-3EHSSXIM.woff2?v=3.19) format("woff2"), url(./Inter-SemiBoldItalic-VOIQL3J3.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(./Inter-Bold-K6PA7FOK.woff2?v=3.19) format("woff2"), url(./Inter-Bold-WERUI55F.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url(./Inter-BoldItalic-QKFESTQE.woff2?v=3.19) format("woff2"), url(./Inter-BoldItalic-HUGYAQZD.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(./Inter-ExtraBold-2ZPQFALF.woff2?v=3.19) format("woff2"), url(./Inter-ExtraBold-ECFJ43EZ.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url(./Inter-ExtraBoldItalic-RR7KYXHD.woff2?v=3.19) format("woff2"), url(./Inter-ExtraBoldItalic-GBBJSYXM.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(./Inter-Black-PFV6RWF7.woff2?v=3.19) format("woff2"), url(./Inter-Black-WJKBATCW.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url(./Inter-BlackItalic-OUXR4CVK.woff2?v=3.19) format("woff2"), url(./Inter-BlackItalic-OAYGWDVO.woff?v=3.19) format("woff");
}
@font-face {
  font-family: "Inter var";
  font-weight: 100 900;
  font-display: swap;
  font-style: normal;
  font-named-instance: "Regular";
  src: url(./Inter-roman.var-WIJJYAE4.woff2?v=3.19) format("woff2");
}
@font-face {
  font-family: "Inter var";
  font-weight: 100 900;
  font-display: swap;
  font-style: italic;
  font-named-instance: "Italic";
  src: url(./Inter-italic.var-SWFAXF2C.woff2?v=3.19) format("woff2");
}
@font-face {
  font-family: "Inter var experimental";
  font-weight: 100 900;
  font-display: swap;
  font-style: oblique 0deg 10deg;
  src: url(./Inter.var-OMHIC2JW.woff2?v=3.19) format("woff2");
}

/* src/style.css */
:root {
  font-family: "Inter", sans-serif;
  --theme-live: #c51a1e;
  --theme-border: #888;
  --theme-border-light: #bfbfbf;
  --theme-background-light: #ddd;
  --theme-background-dark: rgb(50, 50, 50);
  --theme-hover: #efefef;
  --theme-background: white;
  --theme-fullscreen-background: black;
}
@supports (font-variation-settings: normal) {
  :root {
    font-family: "Inter var", sans-serif;
  }
}
body {
  margin: 0;
}
.container {
  margin: 1em;
  max-width: 900px;
}
@media only screen and (max-width: 600px) {
  .container {
    margin: 1em 0.5em;
  }
}
.banner {
  display: flex;
  justify-content: space-between;
  padding-bottom: 0.5em;
  margin-bottom: 1em;
  border-bottom: 1px solid var(--theme-background-light);
}
.banner .fullscreen {
  display: none;
}
.capture {
  border: 2px solid var(--theme-border);
  box-shadow: 2px 2px var(--theme-background-light);
}
.capture img {
  display: block;
  width: 100%;
  height: auto;
  border-bottom: 2px solid var(--theme-border);
}
.capture .description {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 2px solid var(--theme-border-light);
  padding: 0.5em;
  background: var(--theme-background-light);
}
.capture .description .current {
  padding: 2px 0;
}
.capture .description .status {
  display: flex;
  align-items: center;
  font-size: 0.8em;
  font-weight: bold;
  background-color: var(--theme-live);
  border-radius: 4px;
  padding: 2px 4px;
  color: white;
}
.capture .description .status[data-status=offline] {
  background-color: var(--theme-background-dark);
}
.capture .description .status .bullet {
  content: "";
  display: block;
  height: 9px;
  width: 9px;
  background: white;
  border-radius: 50%;
  margin-right: 3px;
  animation: blinker 1.5s cubic-bezier(0.5, 0, 1, 1) infinite alternate;
}
@keyframes blinker {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
.capture .description .jump {
  display: none;
}
wt-time-picker {
  display: flex;
  overflow-x: scroll;
  scrollbar-width: none;
}
wt-time-picker::-webkit-scrollbar {
  display: none;
}
wt-time-picker .time {
  font-family: monospace;
  flex-shrink: 0;
  border-left: 2px solid var(--theme-border-light);
  font-size: 80%;
  padding: 1em 0.8em;
  cursor: pointer;
  user-select: none;
}
wt-time-picker .time:hover {
  background-color: var(--theme-hover);
}
wt-time-picker .time.active {
  background-color: var(--theme-hover);
  font-weight: bold;
}
wt-time-picker .time:first-child {
  border-left: none;
}
wt-seekbar {
  border-top: 2px solid var(--theme-border-light);
  display: block;
  width: 100%;
  padding: 1em 0;
}
wt-seekbar input[type=range] {
  -webkit-appearance: none;
  appearance: none;
  display: block;
  margin: 0 auto;
  padding: 0;
  width: 99%;
  height: 2px;
  background: var(--theme-background-dark);
  cursor: pointer;
}
wt-seekbar input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  cursor: grab;
  background: white;
  border: 2px solid var(--theme-background-dark);
  border-radius: 0;
  height: 100%;
  box-shadow: 1px 1px 0px var(--theme-border);
  width: 20px;
  height: 2em;
}
wt-seekbar input[type=range]::-moz-range-thumb {
  cursor: grab;
  background: white;
  border: 2px solid var(--theme-background-dark);
  border-radius: 0;
  height: 100%;
  box-shadow: 1px 1px 0px var(--theme-border);
  width: 20px;
  height: 2em;
}
.fullscreen .container {
  margin: 0;
  max-width: none;
  height: 100vh;
  width: 100vw;
}
.fullscreen .banner {
  display: none;
}
.fullscreen .capture {
  display: flex;
  margin: 0 auto;
  border: 0;
  background: var(--theme-fullscreen-background);
  height: 100%;
  width: 100%;
}
.fullscreen .capture .image {
  width: 100vw;
  max-height: 100vh;
  border: none;
  object-fit: contain;
}
.fullscreen .toolbar {
  opacity: 0.9;
  background: var(--theme-background);
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.fullscreen .toolbar #time-picker,
.fullscreen .toolbar #seekbar {
  display: none;
}
.info-table {
  max-width: 600px;
}
.table {
  margin-top: 20px;
  width: 100%;
  border-top: 2px dotted var(--theme-background-light);
  border-left: 4px solid var(--theme-border);
  border-spacing: 0;
  border-collapse: collapse;
  text-align: left;
  box-shadow: 2px 2px var(--theme-background-light);
}
.table th {
  font-weight: 500;
}
.table td,
.table th {
  border: 1px solid var(--theme-border-light);
  overflow: hidden;
  padding: 3px 5px;
  text-overflow: ellipsis;
}