:root{color-scheme:dark;font-family:Microsoft YaHei,PingFang SC,system-ui,sans-serif;background:#020817}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}button{font:inherit}.player{position:relative;isolation:isolate;background:radial-gradient(circle at 50% 35%,#0b2750,#020817 62%);color:#eaf7ff}.screens,.screen{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:0}.screen{z-index:0;opacity:0;visibility:hidden;pointer-events:none;background:#020817;transition:opacity .7s ease,visibility .7s}.screen.is-active{z-index:1;opacity:1;visibility:visible;pointer-events:auto}.chrome{position:absolute;z-index:10;transition:opacity .25s ease,transform .25s ease}.topbar{top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:14px 20px 34px;background:linear-gradient(to bottom,rgba(1,7,20,.82),transparent);pointer-events:auto;text-shadow:0 1px 10px #000}.brand{display:flex;align-items:center;gap:10px;font-size:15px}.brand__mark{width:8px;height:8px;border-radius:50%;background:#32dcff;box-shadow:0 0 12px #32dcff}.clock{font-variant-numeric:tabular-nums;font-size:14px;opacity:.84}.controls{left:50%;bottom:25px;display:flex;align-items:center;gap:8px;max-width:calc(100% - 24px);padding:8px;border:1px solid rgba(117,210,255,.22);border-radius:999px;background:#020c1ecc;box-shadow:0 10px 30px #0006,inset 0 0 20px #2797ff14;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transform:translate(-50%)}.controls button{height:34px;min-width:34px;border:0;border-radius:50%;background:transparent;color:#dff7ff;cursor:pointer}.controls button:hover,.controls button:focus-visible{background:#43c0ff33;outline:none}.controls .text-button{width:auto;padding:0 12px;border-radius:999px;font-size:13px}.pagination{display:flex;align-items:center;gap:7px;padding:0 5px}.pagination .pagination__dot{min-width:7px;width:7px;height:7px;padding:0;background:#bfe5ff5c;transition:width .25s,background .25s}.pagination .pagination__dot.is-active{width:25px;border-radius:999px;background:#47d8ff;box-shadow:0 0 10px #47d8ffcc}.progress{position:absolute;z-index:11;left:0;right:0;bottom:0;height:2px;background:#ffffff14}.progress__bar{width:0;height:100%;background:linear-gradient(90deg,#168dff,#58eaff);box-shadow:0 0 8px #39cdff}.is-paused .progress__bar{animation-play-state:paused!important;opacity:.45}.loading{position:absolute;z-index:5;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;gap:12px;background:#020817;color:#9edfff;transition:opacity .35s,visibility .35s}.loading.is-hidden{opacity:0;visibility:hidden}.loading__spinner{width:24px;height:24px;border:2px solid rgba(88,217,255,.2);border-top-color:#58d9ff;border-radius:50%;animation:spin .8s linear infinite}.controls-hidden{cursor:none}.controls-hidden .topbar{opacity:0;transform:translateY(-12px)}.controls-hidden .controls{opacity:0;transform:translate(-50%,12px);pointer-events:none}@keyframes countdown{0%{width:0}to{width:100%}}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 640px){.topbar{padding-inline:12px}.brand{max-width:65%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.controls{bottom:16px}.controls .text-button{display:none}}@media (prefers-reduced-motion: reduce){.screen,.chrome,.loading{transition:none}}