#shell{height:100vh;height:100dvh;display:flex;flex-direction:column}.workspace{flex:1;min-height:0;display:flex;overflow:hidden}.sidebar{display:none}.pane{flex:1;min-width:0;overflow:auto;background-color:var(--body-bg);overscroll-behavior:contain;padding:10px 7px 20px}.now-playing{flex-shrink:0}
@media(min-width:720px){.sidebar{display:block;flex:0 0 clamp(300px,25vw,360px);padding:20px 18px;overflow:auto;border-right:1px solid #92989e;background-color:#bfc3c7;box-shadow:inset -1px 0 #ffffff80}.pane{padding:22px}.route-home{padding:0}}
/* About reuses the centered 600px column across the full desktop workspace.
   Suppress the generic Back/pop animation so it arrives centered immediately. */
@media(min-width:720px){
 .workspace:has(.route-about)>.sidebar{display:none}
 .pane.route-about>.about-page{animation:none}
}
@media(max-width:359px){.profile-bio{padding:9px 11px}.thumbnail-grid{gap:5px}.pane{padding-left:6px;padding-right:6px}}
.desktop-home{display:none}
.sr-only{top:0;left:0}
.pane:focus{outline:none}
.app-screenshot{width:auto;max-width:none;height:250px;aspect-ratio:2/3;object-fit:contain;background:#e5e2d7}
.pane.route-sounds{background-color:var(--slate)}
.pane{padding-left:max(7px,env(safe-area-inset-left));padding-right:max(7px,env(safe-area-inset-right))}.pane.forward>.photo-viewer,.pane.forward>.album-detail,.pane.forward>.app-detail,.pane.forward>.feed-list{animation:push-in 300ms ease-out}.pane.back>*{animation:pop-in 300ms ease-out}.now-playing-sheet{height:100dvh;max-height:100dvh;border-radius:0;padding-top:var(--safe-top)}.now-playing-sheet .sheet-content{flex:1}.controls-hidden:focus-within .video-controls{opacity:0;pointer-events:none}.controls-hidden:has(:focus-visible) .video-controls{opacity:1;pointer-events:auto}@keyframes push-in{from{opacity:.45;transform:translateX(28px)}to{opacity:1;transform:translateX(0)}}@keyframes pop-in{from{opacity:.45;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}
@media(min-width:1024px){.app-store{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.app-row:nth-child(odd){border-right:1px solid #ccc}.app-row:nth-last-child(2){border-bottom:0}.app-row{padding:20px}.app-summary h2{font-size:17px}.app-summary p{font-size:12px}.app-icon.large{width:114px;height:114px}.app-detail-header{gap:24px;padding:10px 3px 27px}.app-detail-header h2{font-size:29px}.app-detail-header p{font-size:14px}.app-links .glossy{font-size:11px;padding:7px 15px}.app-screenshot{width:200px;height:300px}}
@media(min-width:720px){.album-collection{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:45px 40px;padding:30px}.album h2{font-size:18px}.album p{font-size:15px}.album-cover{width:160px;height:160px}.album-header{padding:20px 0 30px}.album-header h2{font-size:29px}.mini-player{display:none}.desktop-player{display:grid;grid-template-columns:minmax(0,1fr) clamp(240px,40vw,480px) minmax(0,1fr);align-items:center;gap:28px;min-height:96px;max-width:1200px;padding:8px 22px 10px;margin:auto}.desktop-player-left{display:flex;align-items:center;gap:20px;min-width:0}.desktop-track{flex:1;width:auto;max-width:210px;min-width:0}.transport-and-seek{width:100%;max-width:480px;display:flex;flex-direction:column;gap:9px}.transport-and-seek .audio-scrubber{width:100%}.volume-controls{width:160px;max-width:100%;justify-self:end}.now-playing-sheet{max-height:calc(100dvh - 60px)}}
@media(min-width:720px) and (max-width:1000px){.desktop-player{gap:17px;padding-inline:14px}.desktop-player-left{gap:10px}.desktop-track{max-width:140px}.desktop-track>span{max-width:73px}.volume-controls{width:115px}.player-modes button{width:36px}.transport{gap:7px}}
@media(min-width:720px){.thumbnail-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px}.viewbar{max-width:600px;height:47px;margin:0 auto 20px}.photo-viewer{max-width:850px}.full-photo{max-height:56dvh}.mobile-home{display:none}.desktop-home{display:block;height:100%}.route-home{overflow:hidden}.sidebar .profile-bio{font-size:13px;line-height:19px;padding:12px}.sidebar .profile-bio h2{font-size:20px;margin-bottom:5px}.sidebar .profile-card{margin-bottom:25px}}
@media(min-width:720px){.pane{padding-left:max(22px,env(safe-area-inset-left));padding-right:max(22px,env(safe-area-inset-right))}.pane.route-home{padding:0}.now-playing-sheet{height:auto;max-height:calc(100dvh - 60px);border-radius:9px 9px 0 0}}