:root{--bg:#f1f4f9;--surface:#ffffff;--surface-inset:#e9ecf1;--border:#dadce0;--text:#202124;--text-dim:#5f6368;--text-faint:#80868b;--primary:#1a73e8;--primary-deep:#1765cc;--on-primary:#ffffff;--tint:#e8f0fe;--danger:#d93025;--danger-bg:#fce8e6;--g-blue:#4285f4;--g-red:#ea4335;--g-yellow:#fbbc04;--g-green:#34a853;--radius:16px;--radius-sm:10px;--shadow-card:0 1px 2px rgba(60,64,67,0.1),0 2px 6px rgba(60,64,67,0.06);--shadow-fab:0 2px 5px rgba(60,64,67,0.24),0 4px 10px rgba(60,64,67,0.12);--shadow-fab-hover:0 4px 8px rgba(60,64,67,0.26),0 8px 18px rgba(60,64,67,0.16)}*{box-sizing:border-box}body,html{margin:0;padding:0;height:100%}body{background:var(--bg);color:var(--text);font-family:Google Sans,Roboto,ui-sans-serif,system-ui,-apple-system,Segoe UI,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.app{max-width:1080px;margin:0 auto;padding:28px 20px 40px;min-height:100vh;display:flex;flex-direction:column;justify-content:center;gap:20px}.app.loaded{justify-content:flex-start;height:100vh;height:100dvh;min-height:0;overflow:hidden;padding:16px 20px;gap:12px}.header h1{font-size:22px;font-weight:600;letter-spacing:-.01em;margin:0 0 4px;display:flex;align-items:center;gap:10px}.header .sub{color:var(--text-dim);font-size:14px;line-height:1.5;margin:0;max-width:64ch}.h-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.loader{background:var(--surface);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow-card)}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}.field label{font-size:12.5px;font-weight:500;color:var(--text-dim)}.field input{width:100%;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);padding:12px 14px;font-size:14px;outline:none;transition:border-color .15s,box-shadow .15s}.field input::placeholder{color:var(--text-faint)}.field input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(26,115,232,.15)}.loader-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.btn{border:none;cursor:pointer;font-size:14px;font-weight:600;border-radius:999px;padding:11px 24px;color:var(--on-primary);background:var(--primary);transition:background .15s,box-shadow .15s,transform .08s}.btn:hover{background:var(--primary-deep);box-shadow:var(--shadow-card)}.btn:active{transform:translateY(1px)}.btn:focus-visible{outline:3px solid rgba(26,115,232,.4);outline-offset:2px}.btn:disabled{opacity:.5;cursor:not-allowed}.hint{color:var(--text-faint);font-size:12.5px}.error{color:var(--danger);font-size:13px;background:var(--danger-bg);border-radius:var(--radius-sm);padding:10px 14px;margin-top:4px}.stage{position:relative;background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-card);overflow:hidden}.visualizer{display:block;width:100%;height:76px}.visualizer.seekable{cursor:pointer}.app.loaded .header,.app.loaded .stage-wrap{flex:0 0 auto}.wave-hint{right:2px;bottom:100%;padding-bottom:5px;animation:status-in .2s cubic-bezier(.22,1,.36,1)}.wave-hint,.wave-status{position:absolute;font-size:12px;line-height:1;color:var(--text-faint);pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.wave-status{left:18px;bottom:14px;display:flex;align-items:center;gap:8px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;letter-spacing:.01em}.wave-status b{color:var(--primary);font-weight:600}.wave-status-dot{width:12px;height:12px;border-radius:50%;flex:0 0 auto;background:conic-gradient(var(--g-blue) 0 25%,var(--g-red) 0 50%,var(--g-yellow) 0 75%,var(--g-green) 0);animation:status-spin .9s linear infinite}.wave-status-line{animation:status-in .2s cubic-bezier(.22,1,.36,1)}@keyframes status-spin{to{transform:rotate(1turn)}}@keyframes status-in{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}.stage-wrap{position:relative}.caption-lane{right:0;bottom:100%;z-index:5}.caption-lane,.wave-bubble{position:absolute;left:0;pointer-events:none}.wave-bubble{bottom:6px;transform:translateX(-50%);z-index:3;max-width:min(76%,440px);opacity:0;transition:opacity .16s ease}.wave-bubble.visible{opacity:1}.wbub-inner{position:relative;z-index:1;display:flex;align-items:baseline;gap:8px;padding:7px 12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow-card);font-size:13px;line-height:1.45;color:var(--text);transform:translateY(3px);transition:transform .16s cubic-bezier(.22,1,.36,1)}.wave-bubble.visible .wbub-inner{transform:translateY(0)}.wbub-time{flex:0 0 auto;color:var(--primary);font-weight:600;font-size:11.5px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.wbub-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}.wave-bubble:after{content:"";position:absolute;z-index:0;bottom:-4px;left:calc(50% + var(--tail, 0px));width:9px;height:9px;transform:translateX(-50%) rotate(45deg);background:var(--surface);border-right:1px solid var(--border);border-bottom:1px solid var(--border);box-shadow:var(--shadow-card)}.topbar{display:flex;align-items:center;gap:12px;min-width:0}.time{font-feature-settings:"tnum";font-variant-numeric:tabular-nums;font-size:13px;color:var(--text-dim)}.times{display:flex;align-items:center;gap:5px;flex:0 0 auto}.time-sep{color:var(--text-faint);font-size:13px}.topbar .h-title{flex:1 1 auto;font-size:17px;font-weight:600;letter-spacing:-.01em}.play-btn{flex:0 0 auto;width:40px;height:40px;border-radius:50%;background:var(--primary);color:var(--on-primary);border:none;display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow-fab);transition:background .15s,box-shadow .15s,transform .1s}.play-btn svg{width:20px;height:20px}.play-btn:hover{background:var(--primary-deep);box-shadow:var(--shadow-fab-hover)}.play-btn:active{transform:scale(.95)}.play-btn:focus-visible{outline:3px solid rgba(26,115,232,.4);outline-offset:3px}.pdf-viewer{flex:1 1;min-height:0;background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-card);display:flex;flex-direction:column;overflow:hidden}.pdf-head{gap:10px;padding:9px 12px;border-bottom:1px solid var(--border)}.pdf-head,.pdf-tabs{display:flex;align-items:center}.pdf-tabs{gap:4px;flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:none}.pdf-tabs::-webkit-scrollbar{display:none}.pdf-tab{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;padding:7px 13px;border:none;border-radius:999px;background:none;cursor:pointer;font:inherit;font-size:13px;font-weight:600;color:var(--text-faint);white-space:nowrap;transition:color .15s,background .15s}.pdf-tab svg{opacity:.9}.pdf-tab:hover{color:var(--text-dim);background:var(--surface-inset)}.pdf-tab.active{color:var(--primary);background:var(--tint)}.pdf-tab:focus-visible{outline:3px solid rgba(26,115,232,.4);outline-offset:2px}.pdf-open{display:inline-grid;place-items:center;flex:0 0 auto;width:32px;height:32px;margin:0 -2px 0 0;border-radius:50%;color:var(--text-faint);transition:background .15s,color .15s}.pdf-open:hover{background:var(--surface-inset);color:var(--primary)}.pdf-open:focus-visible{outline:3px solid rgba(26,115,232,.4);outline-offset:2px}.pdf-frame{position:relative;flex:1 1;min-height:0;background:var(--surface-inset)}.pdf-doc,.pdf-scroll{position:absolute;inset:0}.pdf-scroll{overflow:auto;scrollbar-gutter:stable;text-align:center;background:var(--surface-inset);padding:16px 0;touch-action:pan-x pan-y}.pdf-page{position:relative;margin:0 auto 14px;background:#fff;box-shadow:0 1px 3px rgba(60,64,67,.18)}.pdf-page:last-child{margin-bottom:0}.pdf-page-canvas{display:block;width:100%;height:100%}.pdf-head-controls{display:flex;align-items:center;flex:0 0 auto}.pdf-controls{gap:4px}.pdf-controls,.pdf-ctl-group{display:flex;align-items:center}.pdf-ctl-group{gap:2px}.pdf-ctl{display:inline-grid;place-items:center;width:30px;height:30px;border:none;background:none;border-radius:50%;color:var(--text-dim);cursor:pointer;transition:background .15s,color .15s}.pdf-ctl:hover:not(:disabled){background:var(--surface-inset);color:var(--primary)}.pdf-ctl:disabled{color:var(--text-faint);opacity:.45;cursor:default}.pdf-ctl:focus-visible{outline:3px solid rgba(26,115,232,.4);outline-offset:1px}.pdf-ctl-readout{min-width:44px;padding:0 4px;text-align:center;font-size:12.5px;font-weight:600;color:var(--text-dim);font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.pdf-ctl-sep{width:1px;height:20px;margin:0 2px;background:var(--border)}.pdf-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:var(--text-faint);font-size:13px;background:var(--surface-inset);animation:status-in .2s cubic-bezier(.22,1,.36,1)}.pdf-spinner{width:26px;height:26px;border-radius:50%;border:3px solid var(--border);border-top-color:var(--primary);animation:pdf-spin .8s linear infinite}@keyframes pdf-spin{to{transform:rotate(1turn)}}@media (max-width:560px){.visualizer{height:64px}}@media (prefers-reduced-motion:reduce){.pdf-loading,.wave-hint,.wave-status-dot,.wave-status-line{animation:none}.pdf-spinner{animation-duration:1.4s}*{transition-duration:.01ms!important}}