/* Mobile presentation; shared APIs and account state remain in the main app. */
html{-webkit-text-size-adjust:100%;scrollbar-width:thin}body{font-family:system-ui,"Microsoft YaHei",sans-serif!important}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,input,select,textarea{touch-action:manipulation}
body.app-shell{grid-template-rows:minmax(0,1fr) 64px calc(60px + env(safe-area-inset-bottom));background:#101319}
.app-shell main>header{height:56px;padding:0 16px;border-bottom:1px solid #ffffff08;background:#11151c}.app-shell #shellTitle{font-size:16px;color:#edf1f6}.app-shell #loginShortcut{font-size:12px;min-height:34px;padding:6px 13px;border-radius:12px}.app-shell #refresh{font-size:12px;min-height:36px}.app-shell #notificationPreference{display:none}.app-shell #profileShortcut{border:0;background:transparent;max-width:150px}.app-shell .header-identity small{font-size:9px}.app-shell #importantNotices{font-size:11px;padding:4px}
.app-shell footer{height:64px;min-height:64px;max-height:64px;padding:8px 16px;gap:10px;background:#1b212a;border-top:1px solid #ffffff0d;overflow:visible}.app-shell #art{width:42px;height:42px;border-radius:12px}.app-shell .metadata{flex:1;width:auto;gap:3px;font-size:12px}.app-shell .metadata small{font-size:10px}.app-shell .transport{flex:0 0 80px;min-width:80px}.app-shell .transport>div{justify-content:flex-end}.app-shell .transport button{width:38px;height:40px;min-height:40px}.app-shell #prev{display:none}.app-shell #seek{position:absolute;bottom:0;left:0;width:100%;height:3px;margin:0;opacity:.8}.app-shell .mobile-nav{padding:4px 10px env(safe-area-inset-bottom);background:#12171f;border-top:1px solid #ffffff09;gap:6px}.app-shell .mobile-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10px;border-radius:12px;min-height:50px;padding:5px}.app-shell .mobile-nav button:before{content:'✦';font-size:20px;line-height:22px}.app-shell .mobile-nav [data-route=library]:before{content:'♫'}.app-shell .mobile-nav [data-route=chat]:before{content:'☏'}.app-shell .mobile-nav [data-route=account]:before{content:'◉'}.app-shell .mobile-nav #moreNav:before{content:'☷'}.app-shell .mobile-nav .chat-icon{display:none}.app-shell .mobile-nav button[aria-current=page]{background:#b8ee7112;color:#c0f57a}.app-shell:not([data-authenticated=true]) .mobile-nav [data-route]{display:flex!important}.app-shell aside{inset:56px 12px 138px;width:calc(100% - 24px);border:1px solid #39404c;border-radius:18px;padding:16px;background:#191f29}.app-shell aside .brand{display:none}.app-shell aside nav{display:grid;grid-template-columns:1fr 1fr;gap:8px}.app-shell aside nav button{text-align:left;font-size:13px;padding:10px}.app-shell .login-dialog{width:calc(100vw - 20px);max-height:calc(100dvh - 24px)}
html[data-web-embedded] main{padding:14px 14px 24px!important}html[data-web-embedded] .studio-v3{font-size:13px!important}html[data-web-embedded] .studio-v3 .headline{margin:4px 0 16px;display:flex;flex-wrap:wrap;gap:12px}html[data-web-embedded] .studio-v3 h1{font-size:23px;letter-spacing:-.6px;line-height:1.35}html[data-web-embedded] .headline p{font-size:12px;line-height:1.6}html[data-web-embedded] .project-label{display:flex;align-items:center;gap:12px;width:100%;margin:0;font-size:11px;color:#8f9bad}html[data-web-embedded] .project-label select{flex:1;width:0;margin:0;padding:8px 12px;min-height:36px;font-size:12px}html[data-web-embedded] #status{font-size:11px;line-height:1.5;padding:7px 10px;margin:0 0 12px;border-radius:8px}html[data-web-embedded] .studio-v3 .card{padding:16px;border-radius:18px;border-color:#303743;margin-bottom:14px}html[data-web-embedded] .studio-v3 h2{font-size:16px;margin-bottom:16px}html[data-web-embedded] .studio-v3 label{font-size:12px;margin-bottom:12px}html[data-web-embedded] .studio-v3 :is(input:not([type=range]):not([type=checkbox]),select,textarea){font-size:14px;padding:10px 12px;border-radius:11px;min-height:42px;margin-top:6px;line-height:1.5;min-width:0}html[data-web-embedded] .studio-v3 .row{gap:10px}html[data-web-embedded] .studio-v3 .row>label{min-width:0}html[data-web-embedded] .studio-v3 #music .card:first-child>.row:first-of-type{display:grid;grid-template-columns:1fr 1.5fr;align-items:start}html[data-web-embedded] .studio-v3 button{min-height:38px;font-size:12px;border-radius:11px;padding:8px 12px}html[data-web-embedded] .studio-v3 .style-grid{gap:6px;margin-bottom:14px}html[data-web-embedded] .studio-v3 .style-grid button{padding:7px 3px;font-size:11px}html[data-web-embedded] .studio-v3 #musicGenerate{min-height:46px;font-size:14px;font-weight:700}html[data-web-embedded] .studio-v3 #music textarea[data-field=lyrics]{min-height:140px;height:160px}html[data-web-embedded] .mini-player{display:none!important}html[data-web-embedded] .own-work-grid{grid-template-columns:1fr}html[data-web-embedded] .recovery-banner{padding:14px;font-size:12px}html[data-web-embedded] .account-hero h1{font-size:24px!important}html[data-web-embedded] .playback-shared .lyric-scroll{font-size:15px}html[data-web-embedded] :is(.row,.wrap){min-width:0}html[data-web-embedded] img{max-width:100%}
#packages{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}#packages .entry{padding-bottom:8px;border-radius:13px}#packages p{font-size:11px;margin:8px;line-height:1.6}#packages button{font-size:11px;min-height:36px;width:calc(100% - 16px);margin:4px 8px;padding:7px 4px}#packages img{width:100%;height:auto;aspect-ratio:1.25;object-fit:contain}

/* Keep embedded WebKit surfaces laid out while switching; avoid opacity animations on iframes. */
.app-shell #surfaces>iframe{position:absolute;inset:0;width:100%;height:100%;display:block;background:#111319;color-scheme:dark}.app-shell #surfaces>iframe[hidden]{display:block!important;visibility:hidden;pointer-events:none;z-index:-1}.app-shell #surfaces>iframe:not([hidden]){visibility:visible;z-index:1}.app-shell footer .transport{position:static}.app-shell footer #seek{position:absolute;left:0;bottom:0;width:100%;min-width:0;-webkit-appearance:none;appearance:none;height:3px;background:#394137;border:0;padding:0}.app-shell footer #seek::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:10px;border-radius:50%;background:#bdec78}.app-shell .mobile-nav [data-route=space]:before{content:'◉'}
html[data-web-embedded] .personal-space .space-list{padding:4px 12px;border-radius:16px}.personal-space .space-item{display:grid!important;grid-template-columns:52px minmax(0,1fr);align-items:center;gap:10px 12px;padding:16px 0!important;min-width:0}.personal-space .space-item .album-cover,.personal-space .space-item .art{grid-column:1;grid-row:1;width:52px!important;height:52px!important;min-height:52px;max-height:52px;aspect-ratio:1;margin:0!important}.personal-space .space-item .meta{grid-column:2;grid-row:1;min-width:0;width:auto}.personal-space .space-item h3{font-size:15px;line-height:1.5;margin:0 0 4px;word-break:normal;overflow-wrap:break-word}.personal-space .space-item p{font-size:11px;line-height:1.6;margin:3px 0;word-break:normal;overflow-wrap:break-word}.personal-space .space-item .song-social{grid-column:1/-1;grid-row:auto;display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 0}.personal-space .space-item .social-actions :is(button,a){font-size:11px;padding:7px 10px;min-height:34px;margin:0;white-space:nowrap}.personal-space .space-item>.meta:only-child{grid-column:1/-1}.personal-space .space-item>a{grid-column:1/-1}.personal-space .space-item>audio{display:none}.personal-space .space-tabs{gap:6px;margin-bottom:14px}.personal-space .space-tabs button{font-size:11px;padding:8px 10px;min-height:36px}.personal-space .space-stats{gap:22px;margin:20px 2px}.personal-space .space-stats span{font-size:12px;gap:8px}.personal-space .space-stats strong{font-size:25px}.personal-space .profile-hero{padding:18px;gap:14px}.personal-space .profile-intro h1{font-size:22px}.personal-space .profile-intro p{font-size:12px}.personal-space .space-shortcuts{display:grid;grid-template-columns:1fr;gap:8px}.personal-space .space-shortcuts a{padding:11px 14px;font-size:12px}.personal-space .work-browser{gap:8px;margin:10px 0}.personal-space .work-browser input{padding:10px 12px;font-size:13px}.personal-space .work-pages{font-size:11px}.personal-space .work-pages button{font-size:11px;min-height:32px;padding:6px 10px}
