@font-face{font-family:MusicMyanmar;src:url('/assets/NotoSansMyanmar-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
:root{color-scheme:light;--red:#ff3b30;--ink:#202024;--muted:#8e8e93;--line:#ededf0;--ease:cubic-bezier(.22,1,.36,1);--lyric-size:23px}
*{box-sizing:border-box}html,body{height:100%;margin:0;background:#fff;color:var(--ink)}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",MusicMyanmar,sans-serif;-webkit-font-smoothing:antialiased}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer;touch-action:manipulation}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.icon-definitions{position:absolute;width:0;height:0;overflow:hidden}button:focus-visible,a:focus-visible,input:focus-visible,.reader-scroll:focus-visible{outline:3px solid #ff3b3055;outline-offset:4px}.skip-link{position:fixed;top:-80px;left:20px;z-index:20;background:var(--ink);color:white;border-radius:12px;padding:12px 18px}.skip-link:focus{top:16px}
.app-shell{max-width:480px;margin:auto;height:100%;height:100dvh;position:relative;background:#fff}.screen{display:flex;flex-direction:column;height:100%;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}.navigation{display:flex;gap:4px;align-items:center;min-height:60px;padding:8px 24px;position:relative;flex-shrink:0;background:#fff;z-index:2}h1{font-size:24px;letter-spacing:-.6px;line-height:1.5;font-weight:700;margin:0}.wordmark{display:flex;align-items:center;gap:5px;margin-left:auto;color:var(--ink);font-size:14px;font-weight:600;letter-spacing:-.3px}.wordmark img{object-fit:contain;display:block}
.listen-stage{padding:32px 32px 0;text-align:center;flex:1;position:relative}.listen-orbit{position:relative;margin:0 auto;width:284px;height:284px;display:grid;place-items:center}.listen-orbit canvas{position:absolute;width:400px;height:400px;pointer-events:none}.listen-button{border:0;background:transparent;width:216px;height:216px;border-radius:50%;z-index:1}.listen-button:disabled{cursor:default}.record-status{margin:12px 0 0;min-height:24px;line-height:24px;font-size:15px;color:var(--muted)}.capture-mode{width:100%;max-width:300px;margin:18px auto 0;text-align:left}.capture-mode input{display:block;width:100%;height:28px;margin:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:ew-resize;touch-action:pan-y}.capture-mode input::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(to right,var(--red) 0%,var(--red) var(--mode-progress,0%),#e5e5ea var(--mode-progress,0%),#e5e5ea 100%)}.capture-mode input::-moz-range-track{height:4px;border-radius:4px;background:#e5e5ea}.capture-mode input::-moz-range-progress{height:4px;background:var(--red);border-radius:4px}.capture-mode input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:white;box-shadow:0 2px 5px #0003,0 0 1px #0003;margin-top:-11px}.capture-mode input::-moz-range-thumb{width:26px;height:26px;border:0;border-radius:50%;background:#fff;box-shadow:0 2px 5px #0003}.capture-mode:has(input:disabled){opacity:.55}.mode-labels{display:flex;justify-content:space-between;margin-top:5px;font-size:12px;color:var(--muted);line-height:22px}.mode-labels span{width:33.333%}.mode-labels span:nth-child(2){text-align:center}.mode-labels span:last-child{text-align:right}.capture-mode[data-step="0"] .mode-labels span:nth-child(1),.capture-mode[data-step="1"] .mode-labels span:nth-child(2),.capture-mode[data-step="2"] .mode-labels span:nth-child(3){color:var(--red)}
.upload-area{position:relative;margin:30px auto 0;display:inline-flex;border-radius:12px}.upload-button{display:flex;gap:8px;align-items:center;padding:12px;font-size:13px;color:var(--muted)}.upload-button .icon{width:17px;height:17px}.upload-area input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.upload-area:focus-within{outline:3px solid #ff3b3033}.upload-area:has(input:disabled){opacity:.4}.message{margin:14px 0;color:var(--muted);font-size:14px;line-height:1.7}.message:empty{display:none}.message.error{color:var(--red)}.site-footer{text-align:center;color:#b2b2b8;font-size:10px;padding:22px 16px 24px;line-height:1.7}
.icon-button{background:transparent;border:0;color:var(--red);width:40px;min-height:42px;padding:8px;display:grid;place-items:center;border-radius:12px}.icon-button:active{background:#ff3b300a;transform:scale(.93)}.reader-navigation{padding-left:12px;padding-right:16px}.back-button{width:28px;padding:3px;margin-right:4px}.back-button .icon{width:25px;height:25px}.reader-actions{display:flex;align-items:center;margin-left:auto;gap:3px}.type-button{font-family:Georgia,serif;font-size:20px;letter-spacing:-2px}.size-panel{position:absolute;right:56px;top:54px;display:flex;gap:8px;padding:8px;border:1px solid var(--line);border-radius:15px;background:#fff;box-shadow:0 8px 24px #0000000c;z-index:4}.size-panel button{border:0;border-radius:9px;color:var(--red);background:#fff4f3;font-size:17px;width:50px;height:40px}.size-panel button:disabled{opacity:.4}
.reader-scroll{padding:8px 24px 60px;overflow:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;flex:1;min-height:0;scrollbar-width:none;scroll-padding-top:24px}.reader-scroll::-webkit-scrollbar{display:none}.song-header{display:flex;align-items:center;gap:16px;margin-bottom:20px}.artwork{position:relative;display:grid;place-items:center;width:80px;height:80px;border-radius:15px;background:#f5f5f7;color:#c7c7cc;flex-shrink:0;overflow:hidden;box-shadow:0 4px 12px #20202408}.artwork .icon{width:30px;height:30px}.artwork img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.song-meta{min-width:0;flex:1}.song-meta h2{font-size:23px;line-height:1.5;font-weight:650;letter-spacing:-.5px;margin:0 0 3px}.song-meta p{font-size:15px;color:var(--muted);line-height:1.65;margin:2px 0 0}.song-meta .song-album{font-size:13px;color:#a2a2aa}.song-meta :lang(my){font-family:MusicMyanmar,sans-serif;font-weight:400;letter-spacing:normal;line-height:1.95;word-break:normal;overflow-wrap:normal}.song-meta h2:lang(my){font-size:23px}
.youtube-button{display:flex;align-items:center;gap:10px;min-height:48px;padding:12px 16px;border:1px solid #ff3b3026;border-radius:13px;background:#fff;color:var(--red);font-size:15px;font-weight:500;margin-bottom:28px}.youtube-button .external-arrow{margin-left:auto;width:15px;height:15px}.youtube-button:hover{background:#fff8f7}.youtube-button:active{transform:scale(.98)}.lyrics{padding-bottom:40px}.lyric-line{position:relative;margin:0;padding:5px 12px;border-radius:12px;font-size:var(--lyric-size);line-height:1.95;font-weight:400;overflow-wrap:normal;word-break:normal;white-space:pre-wrap;min-height:20px;isolation:isolate}.lyric-line:lang(my){font-family:MusicMyanmar,sans-serif}.lyric-line>span{position:relative;z-index:1;box-decoration-break:clone;-webkit-box-decoration-break:clone}.lyric-line::before{content:"";position:absolute;inset:0;background:#ff3b3014;border-radius:12px;opacity:0;transform:scaleX(.02);transform-origin:left;z-index:0;transition:transform .7s var(--ease),opacity .5s}.lyric-line.detected{color:var(--red);transition:color .8s}.lyric-line.detected::before{opacity:1;transform:scaleX(1)}.lyric-line.detected.pop>span{display:inline-block;animation:line-pop .7s var(--ease)}.no-lyrics{color:var(--muted);font-size:15px;line-height:1.8;padding:8px 12px}.reader-message{color:var(--muted);font-size:12px;text-align:center;line-height:1.6}
.reveal-overlay{position:fixed;inset:0;width:100%;height:100%;z-index:10;pointer-events:auto}.screen.revealing .navigation,.screen.revealing .song-header,.screen.revealing .youtube-button,.screen.revealing .lyric-line,.screen.revealing .no-lyrics{opacity:0}.screen.revealing.chrome .navigation{opacity:1;transition:opacity .45s}.screen.revealing.chrome .artwork{animation:art-in .62s var(--ease) both}.screen.revealing.chrome .song-header{opacity:1}.screen.revealing.chrome .song-meta>*{animation:chrome-in .62s var(--ease) both}.screen.revealing.chrome .song-meta p{animation-delay:.05s}.screen.revealing.chrome .song-meta .song-album{animation-delay:.09s}.screen.revealing.chrome .youtube-button{animation:chrome-in .62s .16s var(--ease) both}.screen.revealing.landing .lyric-line.hero-line{opacity:1;color:var(--red);transition:opacity .42s,color .8s}.screen.revealing.settled .lyric-line.hero-line{color:var(--ink)}.screen.revealing.settled .lyric-line:not(.hero-line),.screen.revealing.settled .no-lyrics{animation:chrome-in .62s var(--ease) both;animation-delay:var(--line-delay,0s)}.screen.revealing:not(.reveal-finished) .reader-scroll{overflow:hidden;pointer-events:none}
@keyframes chrome-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes art-in{from{opacity:0;transform:scale(.84)}to{opacity:1;transform:scale(1)}}@keyframes line-pop{20%{transform:scale(1.035)}to{transform:scale(1)}}
@media(min-width:700px){body{background:#f7f7f9}.app-shell{height:calc(100dvh - 48px);margin:24px auto;border-radius:28px;box-shadow:0 10px 45px #20202406;overflow:hidden}.navigation{padding-top:16px;min-height:70px}.reader-navigation{padding-top:12px}.site-footer{padding-bottom:30px}}
@media(max-width:359px){.listen-stage{padding-left:22px;padding-right:22px}.listen-orbit{width:270px}.reader-scroll{padding-left:16px;padding-right:16px}.song-header{gap:12px}.song-meta h2:lang(my){font-size:21px}}
@media(max-height:650px){.listen-stage{padding-top:12px}.upload-area{margin-top:14px}.site-footer{padding:12px 10px}.record-status{margin-top:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.screen.revealing.chrome .youtube-button,.screen.revealing.settled .lyric-line,.screen.revealing.settled .no-lyrics{opacity:1}}
#lyrics-title:focus{outline:none}.screen.revealing.reveal-finished .lyric-line.detected{color:var(--red)}

html,body{overflow:hidden}.app-shell{overflow:hidden}