.app .topbar{padding:max(.75rem, env(safe-area-inset-top)) max(var(--gutter), env(safe-area-inset-right)) .75rem max(var(--gutter), env(safe-area-inset-left));background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none;-webkit-tap-highlight-color:transparent}.app .appbar-start{align-items:center;gap:inherit;flex:auto;display:flex}.app .topbar{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}.app .appbar-title{contain:inline-size;text-overflow:ellipsis;white-space:nowrap;flex:1 1 0;min-width:0;margin:0;font-weight:600;overflow:hidden}@media not (min-width:26rem){.app .star-button{justify-content:center;width:1.9rem;padding:0}.app .star-count{display:none}}.app .install{border-color:var(--accent);min-height:2.1rem;color:var(--accent);background:0 0;border-radius:999px;padding:.25rem .85rem;font-size:.875rem}.app .install:hover{background:var(--accent-soft)}.app .loading-bar{height:3px;position:absolute;bottom:-1px;left:0;right:0;overflow:hidden}.app .loading-bar>span{width:var(--progress,35%);background:var(--accent);height:100%;transition:width var(--ease);display:block}.app .loading-bar:not([data-known])>span{animation:1.3s ease-in-out infinite sweep}@keyframes sweep{0%{transform:translate(-100%)}to{transform:translate(300%)}}.app .menu{inset:auto;top:calc(3.5rem + env(safe-area-inset-top));right:max(var(--gutter), env(safe-area-inset-right));border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg);width:max-content;min-width:12rem;height:max-content;max-height:calc(100dvh - 5rem);color:var(--fg);box-shadow:var(--shadow);margin:0;padding:.35rem;display:none;bottom:auto;left:auto;overflow-y:auto}.app .menu:popover-open{align-content:start;gap:.15rem;display:grid}@supports not selector(:popover-open){.app #menu-button{display:none}}.app .menu button{background:0 0;border:0;justify-content:flex-start;min-height:2.5rem;font-weight:400}.app .menu button:hover{background:var(--surface-2)}.app[data-screen=player] :is(.home,.about,main>footer),.app[data-screen=home] .stage{display:none}.app .home{place-content:center;justify-items:center;gap:1rem;min-height:min(70dvh,34rem);display:grid}.app .dropzone{border:2px dashed var(--line-strong);border-radius:var(--radius);background:var(--surface);text-align:center;width:min(100%,30rem);transition:border-color var(--ease), background var(--ease);justify-items:center;gap:.6rem;padding:clamp(2rem,6vw,3rem) 1.5rem;display:grid}.app.dragging .dropzone{border-color:var(--accent);background:var(--accent-soft)}.app .dropzone-icon{width:3rem;height:3rem;color:var(--accent)}.app .dropzone h1{margin:0;font-size:clamp(1.35rem,1.15rem + 1vw,1.75rem)}.app .dropzone p{color:var(--muted);margin:0}.app .dropzone button{min-width:11rem;margin-top:.5rem}.app .dropzone-hint{font-size:.875rem}@media (hover:none){.app .dropzone-hint{display:none}}.app .home-status{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem 1rem;display:flex}.app .offline{color:var(--muted);align-items:center;gap:.45rem;margin:0;font-size:.875rem;display:inline-flex}.app .offline:before{content:"";background:var(--line-strong);border-radius:50%;width:.5rem;height:.5rem}.app .offline[data-state=ready]{color:var(--ok)}.app .offline[data-state=ready]:before{background:var(--ok)}.app .recent{width:min(100%,30rem);margin-top:.5rem}.app .recent-head{justify-content:space-between;align-items:center;margin-bottom:.35rem;display:flex}.app .recent-head h2{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin:0;font-size:.78rem;font-weight:600}.app .text-button{min-height:2rem;color:var(--accent);background:0 0;border:0;border-radius:999px;padding:.2rem .55rem;font-size:.875rem}.app .text-button:hover{background:var(--accent-soft)}.app .recent-list{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);margin:0;padding:0;list-style:none;overflow:hidden}.app .recent-list li{align-items:center;padding-right:.4rem;display:flex}.app .recent-list li+li{border-top:1px solid var(--line)}.app .recent-open{text-align:left;background:0 0;border:0;border-radius:0;flex:1;grid-template-columns:minmax(0,1fr);justify-content:stretch;justify-items:start;gap:.1rem;min-width:0;min-height:3.4rem;padding:.55rem .9rem;font-weight:400;display:grid}.app .recent-open:hover{background:var(--surface-2)}.app .recent-title,.app .recent-meta{text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}.app .recent-title{font-weight:600}.app .recent-meta{color:var(--muted);font-size:.8125rem}.app .recent-remove{flex:none}.app .recent-list :focus-visible{outline-offset:-2px}.app[data-screen=player] main{width:min(100%, var(--content));padding:0 0 env(safe-area-inset-bottom)}.app[data-screen=player] .message{margin:.75rem var(--gutter) 0}@media (min-width:48rem){.app[data-screen=player] main{width:min(100% - 2 * var(--gutter), var(--content))}.app[data-screen=player] .message{margin:1.25rem 0 1rem}}.app .stage{position:relative}.app h5p-player{margin-top:0}.app h5p-player:not([state=ready]){box-shadow:none;background:0 0;border:0;border-radius:0}.app h5p-player[state=ready]{min-height:0}.app .loading{color:var(--muted);text-align:center;pointer-events:none;place-content:center;justify-items:center;gap:.6rem;padding:1rem;display:grid;position:absolute;inset:0}.app .spinner{border:3px solid var(--line-strong);border-top-color:var(--accent);border-radius:50%;width:2.25rem;height:2.25rem;animation:.9s linear infinite spin}.app .loading-detail{font-variant-numeric:tabular-nums;font-size:.875rem}@keyframes spin{to{transform:rotate(1turn)}}@media (prefers-reduced-motion:reduce){.app .spinner{animation-duration:3s}.app .loading-bar:not([data-known])>span{opacity:.5;width:100%;animation:none}}.app .drop-hint{z-index:20;border:2px dashed var(--accent);border-radius:var(--radius);background:color-mix(in srgb, var(--bg) 88%, transparent);color:var(--accent);pointer-events:none;place-items:center;margin:0;font-size:1.25rem;font-weight:600;display:none;position:fixed;inset:.75rem}.app.dragging[data-screen=player] .drop-hint{pointer-events:auto;display:grid}.app .message.snackbar{bottom:calc(1rem + env(safe-area-inset-bottom));z-index:30;background:var(--bg);width:max-content;max-width:calc(100% - 2rem);box-shadow:var(--shadow);align-items:center;gap:.75rem;margin:0;display:flex;position:fixed;left:50%;transform:translate(-50%)}.app .about-dialog{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);width:min(100% - 2rem,30rem);max-height:calc(100dvh - 2rem);color:var(--fg);box-shadow:var(--shadow);padding:1.5rem}.app .about-dialog::backdrop{background:#00000073}.app .about-dialog h2{color:var(--fg);letter-spacing:-.01em;text-transform:none;margin:0 0 .75rem;font-size:1.15rem}.app .about-dialog p{margin:0 0 .75rem;line-height:1.55}.app .about-dialog .credit{color:var(--muted);font-size:.875rem}.app .dialog-actions{justify-content:space-between;align-items:center;gap:1rem;margin-top:1.25rem;display:flex}.app .about{margin-top:2.5rem;max-width:48rem;margin-inline:auto}.app .about p{margin:0 0 1rem;line-height:1.6}.app .about h3{margin:1.5rem 0 .5rem;font-size:1rem}@media (display-mode:standalone),(display-mode:window-controls-overlay){.app .topbar nav[aria-label=Site],.app .topbar .star-button,.app .install,.app .menu-install,.app .about,.app main>footer{display:none}.app{flex-direction:column;display:flex}.app main{padding-bottom:max(1.5rem, env(safe-area-inset-bottom));flex-direction:column;flex:1;display:flex}.app .home{flex:1 0 auto;min-height:0}.app .topbar{-webkit-user-select:none;user-select:none;display:flex}:root{overscroll-behavior-y:none}}@media (display-mode:window-controls-overlay){.app .topbar{top:env(titlebar-area-y,0);left:env(titlebar-area-x,0);width:env(titlebar-area-width,100%);height:env(titlebar-area-height,2.5rem);-webkit-app-region:drag;app-region:drag;padding:0 .5rem;position:fixed}.app .topbar :is(a,button){-webkit-app-region:no-drag;app-region:no-drag}.app .topbar .icon-button{width:1.9rem;height:1.9rem}.app .brand-mark{width:1.35rem;height:1.35rem}.app .brand-name{flex-direction:row;align-items:baseline;gap:.35em}.app{padding-top:env(titlebar-area-height,2.5rem)}}
