*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,Hiragino Sans,Yu Gothic,sans-serif;background:radial-gradient(circle at 20% 0,#23264a 0,#14141f 45%,#0b0b12 100%);color:#f0f0f5;display:flex;justify-content:center;min-height:100vh;padding:16px}.container{max-width:960px;width:100%;display:flex;flex-direction:column;min-height:calc(100vh - 32px)}.logo{font-size:1.8rem;font-weight:800;letter-spacing:.04em;margin:4px 0 16px;text-transform:uppercase}.logo .accent{background:linear-gradient(135deg,#4f7cff,#4fe3ff);-webkit-background-clip:text;background-clip:text;color:transparent}.upload-area{display:flex;align-items:center;gap:12px;margin-top:16px;flex-wrap:nowrap}.file-button{position:relative;display:inline-block;flex-shrink:0;white-space:nowrap;background:linear-gradient(135deg,#4f7cff,#6f4fff);color:#fff;border:none;padding:10px 20px;border-radius:999px;cursor:pointer;font-size:.9rem;font-weight:600;letter-spacing:.02em;box-shadow:0 4px 16px rgba(79,124,255,.35);transition:transform .15s ease,box-shadow .15s ease}.file-button:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(79,124,255,.5)}.file-button input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.model-select{position:relative;flex:1 1;min-width:0}.model-select-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;background:hsla(0,0%,100%,.06);color:#f0f0f5;border:1px solid rgba(79,124,255,.5);border-radius:999px;padding:10px 16px;font-size:.9rem;font-weight:600;font-family:inherit;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);cursor:pointer}.model-select-trigger:disabled{opacity:.5;cursor:not-allowed}.model-select-arrow{font-size:.7rem;color:#4fe3ff;transition:transform .15s ease}.model-select.open .model-select-arrow{transform:rotate(180deg)}.model-select-options{position:absolute;left:0;right:0;bottom:calc(100% + 8px);margin:0;padding:6px;list-style:none;background:#1e1e2f;border:1px solid rgba(79,124,255,.5);border-radius:14px;box-shadow:0 -8px 24px rgba(0,0,0,.5);z-index:20}.model-select-options li{padding:10px 14px;border-radius:10px;font-size:.9rem;font-weight:600;cursor:pointer;white-space:nowrap;color:#f0f0f5}.model-select-options li:hover{background:rgba(79,124,255,.2)}.model-select-options li.selected{background:#4f7cff;color:#fff}.video-wrapper{position:relative;width:100%;flex:1 1;min-height:200px;background:#000;border-radius:16px;overflow:hidden;box-shadow:0 12px 40px rgba(0,0,0,.5),0 0 0 1px rgba(79,124,255,.15)}video{display:block;width:100%;height:auto}.video-wrapper.is-loading .center-icon,.video-wrapper.is-loading .seek-bar-area,.video-wrapper.is-loading canvas,.video-wrapper.is-loading video{visibility:hidden}canvas{top:0;left:0;width:100%;height:100%}.center-icon,canvas{position:absolute;pointer-events:none}.center-icon{top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.45);border-radius:50%;opacity:1;transition:opacity .4s ease}.center-icon.fade-out{opacity:0}.center-icon svg{width:30px;height:30px;fill:#fff}.seek-bar-area{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;background:linear-gradient(0deg,rgba(0,0,0,.7),transparent)}.seek-bar-area input[type=range]{width:100%;display:block;accent-color:#4fe3ff;touch-action:none}.seek-bar-area input[type=range]:disabled{opacity:.4}.loading-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#000}.spinner{width:48px;height:48px;border:4px solid #3a3a55;border-top-color:#4fe3ff;border-radius:50%;animation:spin .8s linear infinite;box-shadow:0 0 16px rgba(79,227,255,.4)}@keyframes spin{to{transform:rotate(1turn)}}