*,:before,:after{box-sizing:border-box;font-size:100%;font:inherit;vertical-align:baseline;border:0;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{color:#f6f6f6;background:#1f1f1f;font-family:sans-serif;line-height:1.5}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}body>#root{place-content:center;width:100vw;height:100vh;display:grid}.container{flex-direction:column;align-items:center;width:55vw;height:90vh;display:flex}.home-container{text-align:center}.home-heading{margin-bottom:1rem;font-size:3rem;font-weight:700}.home-body{margin-bottom:2rem}.app-header{padding-bottom:3rem;font-size:4rem}.accent{color:#4285f4}.app-body{text-align:center;flex:1;width:100%}.query-form-container{margin-bottom:2rem}.search-wrapper{width:calc(max(66%,18rem));margin:0 auto;position:relative}.search-icon-btn{color:#4285f4;cursor:pointer;z-index:1;background-color:#0000;border-radius:50%;outline:none;width:2.5rem;height:2.5rem;position:absolute;top:50%;right:.5rem;transform:translateY(-50%)}.search-icon-btn:active{background-color:#90caf94d;outline:none}.video-window{max-width:45vw;height:0;margin:0 auto;padding-bottom:25.3125vw;position:relative}.video-window iframe{border-radius:8px;width:100%;height:100%;position:absolute;top:0;left:0}.search-label{color:#1f1f1f;background-color:#e2e2e2;border-radius:100px;width:100%;margin:.5rem auto;padding:.5rem 3rem .5rem 1.5rem;font-size:1rem;display:block;position:relative}.action-btn{cursor:pointer;background-color:#e47711;border-radius:100px;padding:.5rem 1rem}.video-options-group{margin-bottom:2rem}.video-option-btn{cursor:pointer;text-align:left;background-color:#0000;border-radius:12px;align-items:flex-start;gap:1rem;width:100%;padding:1rem;transition:background-color .2s;display:flex}.video-option-btn:hover,.video-option-btn:focus{background:#ffffff1a}.video-option-thumbnail{border-radius:8px}.video-option-info{flex-direction:column;gap:.25rem;display:flex}.video-option-title{color:#f6f6f6;text-overflow:ellipsis;overflow:hidden}.video-option-channel{color:#ccc}.video-option-description{color:#ccc;text-overflow:ellipsis;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.previous-video-option{margin-top:2rem}.previous-video-text{color:#f6f6f6;text-align:left;margin-bottom:.5rem;margin-left:1.25rem}.control-btn{color:#ccc;cursor:pointer;background:0 0;border:1px solid #ccc;border-radius:100px;padding:.5rem 1rem;display:block}.btn-row{justify-content:center;gap:1rem;margin-top:1rem;display:flex}.loop-control-btn{color:#e47711;cursor:pointer;background:0 0;border:1px solid #e47711;border-radius:100px;padding:.5rem 1rem;display:block}.recorder-panel{justify-content:center;align-items:center;padding:1rem;display:flex}.record-icon{color:#aaa;cursor:pointer;background-color:#0000}.audio-btn{margin:1rem auto 0}.active-window{position:relative}.video-deselect-btn{color:#aaa;cursor:pointer;background-color:#0000;font-size:1.5rem;position:absolute;top:0;right:0}.search-return-btn{color:#aaa;cursor:pointer;background-color:#0000;font-size:1.5rem;position:absolute;top:0;left:0}.video-control-btns{justify-content:center;align-items:center;gap:3rem;margin-top:1rem;display:flex;position:relative}.loop-control-icon{color:#aaa;cursor:pointer;background-color:#0000;font-size:1.5rem;position:absolute;top:0;left:0}.active-control-icon{color:#e47711!important;background-color:#2c2c2c!important;border-radius:8px!important;transition:background-color .2s,color .2s!important}.video-control-play,.video-control-pause,.loop-control-arrow{color:#aaa;cursor:pointer;background-color:#0000;font-size:1.5rem}.dummy-arrow{opacity:.3}.video-timeline{margin-top:1rem}.video-timeline-bar{background-color:#444;border-radius:6px;width:100%;height:6px;position:relative}.video-timeline-progress{background-color:#4285f4;border-radius:6px;height:100%;transition:width .1s linear;position:absolute;top:0;left:0}.video-timeline-indicator{z-index:3;touch-action:none;background-color:#4285f4;border:2px solid #f6f6f6;border-radius:50%;width:16px;height:16px;transition:box-shadow .1s;position:absolute;top:50%;box-shadow:0 0 4px #4285f4}.video-timeline-tick{z-index:3;background-color:#aaa;border-radius:1px;width:2px;height:14px;position:absolute;top:-4px}.active-timeline-tick{z-index:4;background-color:#e47711;width:3px;height:18px;transition:background .2s,box-shadow .2s;top:-6px;box-shadow:0 0 #e47711}.loop-control-frame{background-color:#2c2c2c;border:2px solid #444;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;margin-top:1rem;padding-top:1rem;display:flex;box-shadow:0 4px 24px #00000040}.control-timeline{width:90%;margin:0 auto;padding-top:2rem;padding-bottom:1rem;overflow-x:auto}.video-timeline-time-marker{color:#f6f6f6;pointer-events:"none";z-index:4;background-color:#0000;border-radius:4px;padding:.5rem;font-size:.75rem;position:absolute;top:-2rem}.loop-name-field{text-align:center;margin:.5rem 0;position:relative}.video-loop-name{cursor:pointer}.name-edit-popup{z-index:10;background-color:#555;border-radius:8px;padding:1rem;position:absolute;top:-4rem;left:50%;transform:translate(-50%);box-shadow:0 2px 12px #00000026}.name-edit-input{padding:.5rem 1rem}.options-btn-container{z-index:4;position:absolute;top:0;right:0}.options-icon{color:#aaa;cursor:pointer;background-color:#0000;font-size:1.5rem;position:relative}.options-popup{z-index:10;background-color:#555;border-radius:8px;min-width:15rem;padding:2rem;position:absolute;top:-8.75rem;left:50%;transform:translate(-50%);box-shadow:0 2px 12px #00000026}.options-popup-close-btn{color:#eee;cursor:pointer;background-color:#0000;position:absolute;top:1rem;right:1rem}.options-popup-label{color:#f6f6f6;justify-content:center;align-items:center;gap:.5rem;display:flex}.options-title{margin-bottom:.5rem}.options-popup-checkbox{accent-color:#e47711}.recorder-audio-row{justify-content:center;align-items:center;gap:1rem;display:flex}.recorder-delete-btn{color:#eee;cursor:pointer;background-color:#0000;border-radius:50%;padding:.5rem;transition:background-color .2s}.recorder-delete-btn:hover{background-color:#333}
