:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;padding:0;overflow:hidden;background-color:#1a1a1a;color:#fff}#app{display:flex;flex-direction:column;width:100vw;height:100vh}.header{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;box-sizing:border-box;flex-shrink:0}.header-content{display:flex;align-items:center;width:100%}.logo-header{height:30px;margin-right:1rem}.header-text{flex-grow:1;display:flex;flex-direction:column;justify-content:center}.institution{font-size:.8em;opacity:.8}.event-title{font-size:1.2em;font-weight:700}.clock{font-size:1em;white-space:nowrap;margin-left:1rem}.grid{flex-grow:1;position:relative;width:100%;height:calc(100vh - var(--header-height, 50px));overflow:hidden}.grid-item{position:absolute;transition:all .5s ease-in-out;display:flex;justify-content:center;align-items:center;background-color:#000;overflow:hidden}.video-wrapper{position:relative;width:100%;height:0;padding-bottom:56.25%}.video-wrapper iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000000b3;color:#fff;display:flex;justify-content:center;align-items:center;font-size:2em;text-align:center;z-index:10;transition:opacity .3s ease-in-out}.overlay.hidden{opacity:0;pointer-events:none}.video-error-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#8b0000cc;color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:1.5em;text-align:center;z-index:11}