:root{--bg: var(--tg-theme-bg-color, #ffffff);--text: var(--tg-theme-text-color, #000000);--hint: var(--tg-theme-hint-color, #999999);--button: var(--tg-theme-button-color, #3390ec);--button-text: var(--tg-theme-button-text-color, #ffffff);--secondary-bg: var(--tg-theme-secondary-bg-color, #f0f0f0)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);font-size:16px;-webkit-text-size-adjust:100%}.app{max-width:480px;margin:0 auto;padding:16px 16px 100px}.header{display:flex;align-items:center;gap:12px;margin-bottom:20px}.header h1{font-size:20px;font-weight:600}.back-btn{background:none;border:none;color:var(--button);font-size:16px;cursor:pointer;padding:4px 0}.card-list{display:flex;flex-direction:column;gap:10px}.card-item{background:var(--secondary-bg);border-radius:12px;padding:16px;cursor:pointer;transition:opacity .15s}.card-item:active{opacity:.7}.card-item h3{font-size:16px;font-weight:500}.card-detail{display:flex;flex-direction:column;gap:12px}.line-row{background:var(--secondary-bg);border-radius:10px;padding:14px 16px;cursor:pointer;transition:background .15s,transform .1s;font-size:17px;line-height:1.5}.line-row:active{transform:scale(.98)}.line-row.playing{background:var(--button);color:var(--button-text)}.hint{color:var(--hint);font-size:13px;text-align:center;margin-top:4px}.play-all-bar{position:fixed;bottom:0;left:0;right:0;padding:10px 16px;padding-bottom:max(10px,env(safe-area-inset-bottom));background:var(--bg);border-top:1px solid var(--secondary-bg);display:flex;flex-direction:column;gap:8px;max-width:480px;margin:0 auto}.loop-btn{width:100%;padding:10px;border:2px solid var(--secondary-bg);border-radius:10px;background:var(--bg);color:var(--hint);font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.loop-btn.active{border-color:var(--button);background:var(--button);color:var(--button-text)}.loop-btn:active{opacity:.8}.play-buttons{display:flex;gap:8px}.play-all-btn{flex:1;padding:12px 8px;border:none;border-radius:10px;background:var(--button);color:var(--button-text);font-size:14px;font-weight:600;cursor:pointer;transition:opacity .15s}.play-all-btn.nonstop{background:var(--secondary-bg);color:var(--text)}.play-all-btn:active{opacity:.8}.loading{text-align:center;color:var(--hint);padding:40px 0}
