.view-app{border:1px solid rgba(0,0,0,.1);border-radius:var(--border-radius);background-color:#00000026;width:var(--view-width);height:var(--view-height);display:inline-flex;align-items:start;justify-content:center;position:relative}.view-app.playing{border:1px solid var(--selection-color-tr);background-color:var(--selection-bg-color);box-shadow:var(--box-shadow)}.view-app.small{width:var(--view-width-sm);height:var(--view-height-sm)}.view-app .download-panel .download-in-progress{position:absolute;top:40%;left:1em;right:1em}.view-app .download-panel{text-align:left;padding:1em;margin-top:60px}.view-app .download-panel>.title{position:absolute;top:1em;left:1em;right:calc(3 * var(--icon-width-sm));text-align:left;font-size:1.1em;color:var(--title-color);font-weight:500;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;white-space:nowrap}.view-app .download-panel>.info{text-align:left;display:inline-block;margin-bottom:3em;font-size:1.2em}.view-app .download-panel>.choose{display:flex;gap:1em;margin-bottom:3em;font-size:1.2em;padding-top:2em}.view-app .download-panel>.buttons{position:absolute;bottom:6em;left:1em;right:1em;text-align:center}.view-app .download-panel>.close{position:absolute;top:1em;right:1em}.view-app .download-panel>.small-print{position:absolute;bottom:1em;left:1em;right:1em;text-align:center;font-size:.95em;color:#a0a0a0}.spinner{position:absolute;top:30%}.error{color:var(--error-color);font-size:1.2em;font-weight:400;position:absolute;top:30%}.error .emoji-error{font-size:1.6em}.preview{font-size:1.1em;font-weight:500;color:var(--title-color);display:inline-block;text-align:left;max-width:100%}.preview>header{display:flex;align-items:center;padding:.8em}.preview>header>*{display:flex;align-items:center;max-width:100%}.preview>header>.title{flex-grow:2;max-width:calc(100% - 3 * var(--icon-width-sm))}.preview>header>.title>span{overflow:hidden;text-overflow:ellipsis;max-width:100%;box-sizing:border-box;white-space:nowrap}.preview>.content{padding:0 1em}.preview>footer{padding:1em;font-size:1em;font-weight:300}.preview>footer button{color:#c0c0ff!important}.preview>footer button svg{opacity:.8}.preview>footer .error{color:#ffa0a0}.preview .tags .tag-btn-content{display:flex;gap:7px}.preview .content header{display:flex;align-items:center;font-size:1em}.preview .freq-knob-container{display:flex;align-items:center;gap:.3em;position:relative}.preview .frame-num{flex-grow:2;text-align:right;color:#c0c0ff}.preview .canvas-container{position:relative;background-color:#000;border-radius:var(--border-radius);padding:.4em 1em 1em}.preview footer{display:flex;align-items:center}.preview footer .slider-wrapper{padding:0 .8em;flex-grow:2}.preview footer .bp5-slider-progress{background-color:var(--bg-color-1)}.preview .info{font-size:13px;font-weight:400;color:gray;position:absolute;left:30px;bottom:5px}.preview .info>span{border:1px solid rgb(0 0 0 / .2);background-color:#00000026;border-radius:var(--border-radius);display:inline-block;padding:2px 4px;margin-right:5px}.preview .elapsed-time{font-size:13px;font-weight:400;color:#a0a0a0;position:absolute;right:30px;bottom:5px}.stop-playing-btn{animation:blinking 1.5s infinite}@keyframes blinking{0%{opacity:1}50%{opacity:.2}to{opacity:1}}