:root{--font-main:"Helvetica",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:"Helvetica",SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--font-size:16px;--content-max-width:568px;--extra-max-width:900px;--learn-max-width:650px;--header-height:52px;--footer-height:64px;--player-dock-height:calc(16px + 44px + 24px + 8px * 2 + 12px * 2 + env(safe-area-inset-bottom, 0px));--sidebar-width:0px;--page-max-width:768px;--side-padding:20px;--transition-duration:0.25s}@media(max-width:576px){:root{--side-padding:15px}}@media(min-width:576px){:root{--player-dock-height:calc(44px + 24px + 8px + 12px * 2 + env(safe-area-inset-bottom, 0px))}}@media(min-aspect-ratio:1/1)and (max-height:800px),(min-width:1200px)and (max-height:800px){:root{--footer-height:0px;--sidebar-width:var(--header-height)}}:root{--accent-color:var(--orange);--border-color:var(--gray);--header-bg-color:var(--dark);--footer-bg-color:var(--dark);--main-bg-color:var(--beige);--song-bg-color:#fff;--placeholder-color:var(--mid-gray);--text-color:var(--dark-gray);--page-text-color:var(--darker-gray);--title-color:var(--dark);--shadow-color:rgba(56,55,142,0.15);--link-color:#1e80f3;--btn-bg:rgba(0,0,0,0.06);--btn-hover-bg:rgba(0,0,0,0.1);--btn-active-bg:#bfa871;--btn-active-hover-bg:#a99166;--beige:#fffaed;--brown:#26231b;--dark:#0b0800;--darker-gray:#515151;--dark-gray:#6c6c6c;--mid-gray:#8e8e93;--gray:#c0c0c0;--light-gray:#f5f5f5;--orange:#f5c149;--error:#ff6542}.PlayerDock{position:fixed;left:var(--sidebar-width,0);right:0;bottom:0;z-index:9000;height:var(--player-dock-height);--title-color:#fff;--text-color:rgba(255,255,255,0.72);--btn-bg:rgba(255,255,255,0.1);--btn-hover-bg:rgba(255,255,255,0.18);--shadow-color:rgba(0,0,0,0.4);color:var(--text-color);background:var(--footer-bg-color);border-top:1px solid hsla(0,0%,100%,.08);transform:translateY(calc(100% + 12px));transition:transform var(--transition-duration) ease-in-out}.PlayerDock--visible{transform:none}.PlayerDock__inner{display:flex;align-items:center;gap:8px;height:100%;max-width:var(--page-max-width);margin:0 auto;padding:12px 12px calc(12px + env(safe-area-inset-bottom, 0px));overflow:hidden}.PlayerDock__main{flex:1 1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:8px}.PlayerDock__title{grid-column:1/-1;grid-row:1;min-width:0;margin:0;font-size:13px;font-weight:700;line-height:16px;text-align:center;color:var(--title-color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(min-width:768px){.PlayerDock__title{font-size:14px}}.PlayerDock__subtitle{font-weight:400;color:var(--text-color)}.PlayerDock__buttons{display:grid;grid-template-columns:1fr auto 1fr;grid-auto-flow:row dense;align-items:center;gap:8px}@media(min-width:576px){.PlayerDock__buttons{grid-template-columns:minmax(0,1fr) auto auto auto}.PlayerDock__buttons .PlayerDock__title{grid-column:1;text-align:left}.PlayerDock__buttons .PlayerDock__action{grid-column:2;margin-right:-4px}.PlayerDock__buttons .PlayerDock__transport{grid-column:3}.PlayerDock__buttons .PlayerDock__close{grid-column:4}}.PlayerDock__transport{grid-column:2;display:flex;align-items:center;gap:4px;height:44px}.PlayerDock__btn{flex:none;display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:none;border-radius:50%;font-size:24px;color:var(--text-color);background:rgba(0,0,0,0);cursor:pointer;transition:background-color var(--transition-duration),color var(--transition-duration);-webkit-tap-highlight-color:rgba(0,0,0,0)}@media(hover:hover)and (pointer:fine){.PlayerDock__btn:hover:not(:disabled){color:var(--title-color);background:var(--btn-bg)}}.PlayerDock__btn:active:not(:disabled){color:var(--title-color);background:var(--btn-bg)}.PlayerDock__btn:disabled{opacity:.35;cursor:default}.PlayerDock__action{grid-column:1;justify-self:start;font-size:20px}.PlayerDock__seek{display:flex;align-items:center;gap:8px;height:24px}.PlayerDock__seek .SeekBar{--seek-track:rgba(255,255,255,0.2);height:24px}.PlayerDock__seek .SeekBar__tip{color:var(--footer-bg-color);background:var(--accent-color)}.PlayerDock__seek .SeekBar--loading .SeekBar__track{background:repeating-linear-gradient(-45deg,var(--seek-track) 0 6px,rgba(255,255,255,.06) 6px 12px);background-size:17px 100%}.PlayerDock .PlayToggle{color:var(--footer-bg-color);background:var(--accent-color)}.PlayerDock .PlayToggle:hover{color:var(--footer-bg-color);background:#ffd57a}.PlayerDock .PlayToggle--loading:after{border-top-color:#fff}.PlayerDock .PlayToggle--error{color:#fff;background:#b3261e}.PlayerDock__time{flex:none;min-width:34px;font-size:11px;line-height:16px;color:var(--text-color);font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.PlayerDock__time:last-child{text-align:right}.PlayerDock__close{grid-column:3;justify-self:end;flex:none;display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:none;border-radius:50%;font-size:26px;color:var(--text-color);background:var(--btn-bg);cursor:pointer;transition:background-color var(--transition-duration),color var(--transition-duration);-webkit-tap-highlight-color:rgba(0,0,0,0)}.PlayerDock__close:hover{color:var(--title-color);background:var(--btn-hover-bg)}@media print{.PlayerDock{display:none}}.PlayToggle{position:relative;flex:none;display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:none;border-radius:50%;font-size:16px;color:#fff;background:var(--brown);cursor:pointer;transition:background-color var(--transition-duration),color var(--transition-duration);-webkit-tap-highlight-color:rgba(0,0,0,0)}.PlayToggle:hover{color:var(--accent-color)}.PlayToggle--playing{color:var(--brown);background:var(--accent-color)}.PlayToggle--playing:hover{color:var(--brown)}.PlayToggle--loading:after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid rgba(0,0,0,0);border-top:2px solid var(--accent-color);animation:PlayToggle-spin .8s linear infinite}.PlayToggle--error{background:#b3261e}@keyframes PlayToggle-spin{to{transform:rotate(1turn)}}.SeekBar{--seek-color:var(--accent-color);--seek-track:rgba(0,0,0,0.12);position:relative;flex:1 1;min-width:0;height:32px;display:flex;align-items:center;padding:0 8px;margin:0 -8px;cursor:pointer;touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.SeekBar:focus{outline:none}.SeekBar:focus-visible .SeekBar__thumb{box-shadow:0 0 0 4px rgba(245,193,73,.4)}.SeekBar__track{position:relative;width:100%;height:4px;border-radius:2px;background:var(--seek-track)}.SeekBar__fill{inset:0 auto 0 0;border-radius:inherit}.SeekBar__fill,.SeekBar__thumb{position:absolute;background:var(--seek-color)}.SeekBar__thumb{top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;box-shadow:0 1px 3px var(--shadow-color);transform:scale(.85);transition:transform .15s}.SeekBar__tip{position:absolute;bottom:14px;transform:translateX(-50%);padding:2px 6px;border-radius:4px;font-size:12px;line-height:16px;letter-spacing:0;white-space:nowrap;color:#fff;background:var(--brown);pointer-events:none}@media(hover:hover){.SeekBar:hover .SeekBar__thumb{transform:scale(1)}}.SeekBar--dragging .SeekBar__thumb{transform:scale(1.25)}.SeekBar--disabled{cursor:default}.SeekBar--readonly{height:auto;padding:0;margin:0;cursor:inherit;pointer-events:none}.SeekBar--readonly .SeekBar__fill{transition:width .25s linear}.SeekBar--disabled .SeekBar__thumb{opacity:0}.SeekBar--loading .SeekBar__track{background:repeating-linear-gradient(-45deg,var(--seek-track) 0 6px,rgba(0,0,0,.04) 6px 12px);background-size:17px 100%;animation:SeekBar-loading .6s linear infinite}@keyframes SeekBar-loading{to{background-position:17px 0}}.PlayerWidget{position:relative;display:flex;align-items:center;gap:14px;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.PlayerWidget .PlayToggle{width:25px;height:25px;font-size:12px}.PlayerWidget .PlayToggle--loading:after{inset:-2px;border-width:1px}.PlayerWidget__title{flex:1 1;min-width:0;margin:0;font-size:14px;line-height:20px;color:var(--title-color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.PlayerWidget .SeekBar{position:absolute;left:39px;right:0;bottom:-6px}.PlayerWidget--active:is(.PlayerWidget--paused,.PlayerWidget--ended) .PlayToggle{color:var(--brown);background:var(--accent-color)}