:root{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:#181818;background:#111}*{box-sizing:border-box}body{margin:0;background:#111}button,input,textarea{font:inherit}button{border:0;cursor:pointer}.mobile-prototype{position:relative;width:100%;max-width:390px;height:844px;margin:0 auto;overflow:hidden;background:#fff}.screen{position:absolute;inset:0;display:none;overflow:hidden}.screen.is-current{display:block}.library-head{height:94px;padding:31px 18px 12px;display:flex;align-items:center;gap:10px}.app-mark{display:grid;place-items:center;width:39px;height:39px;border-radius:14px;background:#ff5360;color:#fff;font-size:17px}.song-search{flex:1;height:43px;display:flex;align-items:center;gap:9px;padding:0 12px;border-radius:15px;background:#f5f5f6;color:#aaa}.song-search input{width:100%;border:0;outline:0;background:transparent;color:#222;font-size:14px}.round-light{width:39px;height:39px;border-radius:50%;background:#f5f5f6;color:#555}.primary-tabs{display:flex;justify-content:center;gap:32px;height:54px}.primary-tabs button{position:relative;background:transparent;color:#949494;font-size:18px}.primary-tabs .is-active{color:#171717;font-weight:750}.primary-tabs .is-active:after{content:"";position:absolute;left:50%;bottom:7px;width:23px;height:3px;transform:translateX(-50%);border-radius:3px;background:#ff5260}.genre-tabs{display:flex;gap:21px;overflow:auto;padding:1px 18px 13px;white-space:nowrap}.genre-tabs button{padding:0;background:transparent;color:#969696;font-size:15px}.genre-tabs .is-active{color:#161616;font-weight:750}.song-list{height:640px;overflow:auto;padding:0 17px 92px}.song-row{display:grid;grid-template-columns:64px minmax(0,1fr) 38px 59px;align-items:center;gap:10px;min-height:87px}.song-row img{width:64px;height:64px;object-fit:cover;border-radius:13px}.song-info{min-width:0}.song-info h2{margin:0 0 4px;font-size:17px;line-height:1.2;font-weight:720;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-info p{margin:0;color:#858585;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-info p span{display:inline-block;margin-left:3px;padding:1px 4px;border-radius:4px;background:#fff1e8;color:#e98a40;font-size:10px}.song-info small{display:block;margin-top:4px;color:#b3b3b3;font-size:10px}.listen-button{display:grid;gap:4px;justify-items:center;background:transparent;color:#aaa;font-size:10px}.listen-button i{font-size:17px}.sing-button{height:34px;border:1px solid #ffd0d4;border-radius:18px;background:#fff;color:#ff5260;font-size:12px;font-weight:700}.bottom-nav{position:absolute;right:0;bottom:0;left:0;display:grid;grid-template-columns:repeat(5,1fr);height:75px;padding:9px 10px 8px;background:#fff;box-shadow:0 -5px 18px rgba(0,0,0,.08)}.bottom-nav button{display:grid;gap:5px;justify-items:center;background:transparent;color:#858585;font-size:10px}.bottom-nav i{font-size:20px}.bottom-nav .is-active{color:#ff5260}.bottom-nav .is-active i{display:grid;place-items:center;width:38px;height:38px;margin-top:-24px;border:4px solid #fff;border-radius:50%;background:#ff5260;color:#fff;box-shadow:0 4px 13px rgba(255,82,96,.3)}.prepare-background{position:absolute;inset:0;z-index:-1;background:#25170f url('./assets/private-song-cover-v1.png') center/cover no-repeat;filter:brightness(.43) saturate(.7)}.screen-top{height:86px;display:grid;grid-template-columns:46px 1fr 64px;align-items:center;padding:25px 17px 0;color:#f7f7f7}.screen-top h1{margin:0;text-align:center;font-size:22px;letter-spacing:.04em}.screen-top.white{grid-template-columns:46px 1fr}.icon-button{width:38px;height:38px;background:transparent;color:inherit;font-size:22px}.top-actions{display:flex;justify-content:flex-end;gap:8px}.compact-action{height:38px;padding:0 10px;border-radius:10px;background:rgba(255,255,255,.14);color:#fff;font-size:12px}.compact-action i{margin-right:5px}.loaded-card{position:relative;display:grid;grid-template-columns:66px minmax(0,1fr) 47px;gap:14px;margin:17px 16px 0;padding:18px 17px 16px;border-radius:20px;background:rgba(55,36,25,.88);color:#fff}.loaded-card>img{width:66px;height:78px;object-fit:cover;border-radius:10px}.loaded-info h1{margin:3px 0 6px;font-size:24px}.loaded-info p{margin:0;font-size:14px;font-weight:700}.loaded-info p button{margin-left:5px;background:transparent;color:#c7beb8;font-size:20px}.avatar-dot{display:inline-grid;place-items:center;width:19px;height:19px;border-radius:50%;background:#ff6170;color:#fff;font-size:10px;font-weight:800;vertical-align:middle}.loaded-info small{display:inline-block;margin-top:8px;padding:3px 6px;border-radius:4px;background:rgba(255,255,255,.14);color:#d6cfcb;font-size:11px}.preview-pause{align-self:center;width:47px;height:47px;border-radius:50%;background:#988f8a;color:#fff;font-size:16px}.setting-row{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:5px}.setting-chip{height:39px;border-radius:10px;background:#7c6959;color:#fff;font-size:14px}.benefit-strip{display:flex;justify-content:space-between;align-items:center;width:calc(100% - 32px);height:48px;margin:12px 16px 0;padding:0 14px;border-radius:13px;background:rgba(63,42,29,.88);color:#f7f1ed;text-align:left;font-size:13px}.benefit-strip i:first-child{margin-right:8px}.prepare-lyrics{height:307px;padding:45px 24px 0;color:#d8d1cc;text-align:center;overflow:hidden}.prepare-lyrics p{margin:0 0 28px;font-size:20px}.prepare-lyrics .is-focus{color:#fff;font-weight:750}.prepare-tools{display:flex;justify-content:center;gap:49px;color:#fff}.prepare-tools button{display:grid;gap:7px;justify-items:center;background:transparent;color:#fff;font-size:12px}.prepare-tools i{font-size:21px}.start-row{display:grid;grid-template-columns:108px 1fr;gap:12px;margin:25px 28px 0}.voice-chip{height:49px;border-radius:25px;background:rgba(237,230,226,.22);color:#fff}.voice-chip .avatar-dot{margin-right:7px}.primary-cta{height:50px;border-radius:26px;background:#ff505d;color:#fff;font-size:20px;font-weight:800;box-shadow:0 7px 18px rgba(204,43,56,.28)}.mode-tabs{display:flex;justify-content:space-around;margin-top:35px;padding:0 30px}.mode-tabs button{position:relative;background:transparent;color:#b6ada9;font-size:17px}.mode-tabs .is-active{color:#fff;font-weight:800}.mode-tabs .is-active:after{content:"";position:absolute;bottom:-10px;left:50%;width:21px;height:2px;transform:translateX(-50%);background:#fff}.screen-sing{background:#000;color:#fff}.sing-top{grid-template-columns:46px 1fr 46px;padding-top:25px}.sing-progress{display:grid;grid-template-columns:36px 1fr 31px 70px;gap:7px;align-items:center;margin:18px 18px 0}.avatar-dot.large{width:35px;height:35px;font-size:13px}.progress-track{height:27px;overflow:hidden;border-radius:18px;background:#1e1e1e}.progress-track span{display:block;width:9%;height:100%;background:#ff2458}.sing-progress>b{font-size:16px}.sing-progress button{height:30px;border-radius:16px;background:#2b2b2b;color:#ddd;font-size:11px;font-weight:700}.pitch-lane{position:relative;height:122px;margin:8px 17px 0;border-top:1px solid #202020;border-bottom:1px solid #202020}.pitch-lane:after{content:"";position:absolute;top:0;bottom:0;left:34%;border-left:1px solid #1e1e1e}.pitch-lane i{position:absolute;left:32%;bottom:0;color:#fff;font-size:23px}.pitch-lane span{position:absolute;height:11px;border-radius:8px;background:#444}.pitch-lane span:nth-of-type(1){top:44px;left:0;width:80px}.pitch-lane span:nth-of-type(2){top:73px;left:74px;width:85px}.pitch-lane span:nth-of-type(3){top:40px;left:242px;width:55px}.pitch-lane span:nth-of-type(4){top:59px;left:197px;width:65px}.pitch-lane span:nth-of-type(5){top:44px;right:0;width:83px}.pitch-lane b{position:absolute;right:35%;top:0;height:38px;border-left:2px dashed #777}.sing-lyrics{padding-top:54px;text-align:center}.sing-lyrics p{margin:0 0 23px;color:#797979;font-size:21px}.sing-lyrics .active{margin-bottom:28px;color:#fff;font-size:27px;font-weight:800}.sing-side-actions{position:absolute;right:16px;bottom:232px;display:grid;gap:19px}.sing-side-actions button{display:grid;gap:6px;justify-items:center;background:transparent;color:#fff;font-size:11px}.sing-side-actions i{font-size:23px}.sing-controls{position:absolute;right:14px;bottom:67px;left:14px;display:grid;grid-template-columns:46px 46px 1fr 46px 46px;align-items:center;gap:7px}.sing-controls>button:not(.pause-control){display:grid;gap:6px;justify-items:center;background:transparent;color:#c7c7c7;font-size:11px}.sing-controls>button:not(.pause-control) i{font-size:23px}.pause-control{justify-self:center;display:grid;place-items:center;width:102px;height:102px;border:7px solid #373737;border-right-color:#fff;border-radius:50%;background:#080808;color:#fff;font-size:35px}.sing-time{position:absolute;bottom:23px;left:0;right:0;margin:0;text-align:center;color:#777;font-size:16px}.sing-time b{color:#fff}.screen-adjust{background:#1b1b1b;color:#f6f6f6}.text-action{background:transparent;color:#fff;font-size:16px}.publish-card{margin:17px 15px 0;padding:17px 14px 15px;border-radius:16px;background:#292929}.publish-card textarea{display:block;width:100%;height:115px;padding:0;border:0;resize:none;outline:none;background:transparent;color:#fff;font-size:18px;line-height:1.35}.publish-card-actions{display:grid;grid-template-columns:auto auto 1fr;gap:8px;align-items:center}.publish-card-actions button{height:35px;padding:0 10px;border-radius:8px;background:#424242;color:#ededed;font-size:12px}.publish-card-actions .video-edit{justify-self:end;width:109px;background:#121212}.playback-row{display:grid;grid-template-columns:23px 44px 1fr 44px 26px;align-items:center;gap:7px;margin-top:17px;padding-top:14px;border-top:1px solid #3b3b3b;color:#cfcfcf;font-size:12px}.playback-row button{background:transparent;color:#fff;font-size:17px}.playback-row input{width:100%;accent-color:#fff}.tuning-tabs{display:flex;justify-content:center;gap:100px;margin:20px 0 15px}.tuning-tabs button{background:transparent;color:#969696;font-size:17px;font-weight:700}.tuning-tabs .is-active{color:#fff}.effect-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;padding:0 18px}.effect-tile{aspect-ratio:1;border-radius:11px;background:#383838;color:#fff;display:grid;place-content:center;gap:5px;font-size:10px}.effect-tile i{font-size:19px}.effect-tile.is-active{background:#71303a;box-shadow:inset 0 0 0 2px #ff6b78}.mix-sliders{display:grid;gap:17px;margin:25px 19px 0}.mix-sliders label{display:grid;grid-template-columns:82px 1fr;align-items:center;gap:10px;font-size:16px}.mix-sliders input{accent-color:#fff}.adjust-tools{display:flex;gap:0;overflow:hidden;margin-top:26px;padding:13px 5px;border-top:1px solid #303030}.adjust-tools button{flex:0 0 78px;display:grid;gap:6px;justify-items:center;border-right:1px solid #303030;background:transparent;color:#aaa;font-size:10px}.adjust-tools i{color:#fff;font-size:20px}.suggestion{position:absolute;right:0;bottom:76px;left:0;display:flex;align-items:center;gap:8px;height:48px;padding:0 15px;background:#333;color:#d5d5d5;font-size:12px}.suggestion i{color:#ff5965}.suggestion span{flex:1}.suggestion button{height:31px;padding:0 10px;border:1px solid #777;border-radius:16px;background:transparent;color:#fff;font-size:12px}.finish-bar{position:absolute;right:0;bottom:0;left:0;display:grid;grid-template-columns:54px 1fr 54px;gap:10px;align-items:center;height:76px;padding:10px 18px;background:#1b1b1b}.finish-bar>button:not(.primary-cta){display:grid;gap:5px;justify-items:center;background:transparent;color:#bbb;font-size:10px}.finish-bar i{font-size:20px}.finish-bar .primary-cta{font-size:18px}.toast{position:fixed;z-index:10;left:50%;bottom:29px;transform:translate(-50%,15px);padding:10px 14px;border-radius:20px;background:#fff;color:#222;font-size:13px;opacity:0;pointer-events:none;transition:.2s;white-space:nowrap}.toast.show{transform:translate(-50%,0);opacity:1}@media (max-height:760px){.mobile-prototype{height:100svh;min-height:650px}.prepare-lyrics{height:255px;padding-top:26px}.prepare-lyrics p{margin-bottom:19px}.start-row{margin-top:14px}.mode-tabs{margin-top:22px}.sing-lyrics{padding-top:24px}.sing-lyrics p{margin-bottom:17px}.effect-grid{gap:6px}.mix-sliders{margin-top:15px}.adjust-tools{margin-top:16px}}@media (min-width:600px){.mobile-prototype{margin-left:0;margin-right:0}}
/* Compact browser-height pass: keep the primary call-to-action inside the viewport. */
.mobile-prototype{height:min(844px,100svh)}
/* A phone installation is an app canvas, not a 390px desktop mockup. */
@media (max-width:599px){:root,body{width:100%;min-height:100%;background:#fff}.mobile-prototype{width:100%;max-width:none;height:100dvh;min-height:650px;margin:0}}
@media (max-height:760px){.screen-prepare.is-current{display:grid;grid-template-rows:68px auto 48px minmax(76px,1fr) 42px 50px 35px;align-items:center}.screen-prepare .screen-top{height:68px;padding-top:11px}.screen-prepare .loaded-card{margin:0 16px;padding:14px 15px 12px}.screen-prepare .loaded-card>img{width:58px;height:67px}.screen-prepare .loaded-info h1{margin-top:1px;font-size:21px}.screen-prepare .loaded-info small{margin-top:5px}.screen-prepare .setting-row{margin-top:2px}.screen-prepare .setting-chip{height:34px;font-size:13px}.screen-prepare .benefit-strip{width:calc(100% - 32px);height:43px;margin:0 16px;font-size:12px}.screen-prepare .prepare-lyrics{height:auto;align-self:stretch;padding:15px 24px 0}.screen-prepare .prepare-lyrics p{margin-bottom:14px;font-size:17px}.screen-prepare .prepare-lyrics p:nth-child(n+4){display:none}.screen-prepare .prepare-tools{gap:49px}.screen-prepare .prepare-tools i{font-size:18px}.screen-prepare .start-row{margin:0 28px}.screen-prepare .mode-tabs{margin:0;padding:0 30px}.screen-prepare .mode-tabs .is-active:after{bottom:-5px}}

/* Singing controls follow the reference: five evenly weighted actions, with a restrained pause control. */
.sing-controls{right:15px;bottom:62px;left:15px;grid-template-columns:repeat(5,1fr);gap:0}.sing-controls>button:not(.pause-control){font-size:11px}.sing-controls>button:not(.pause-control) i{font-size:21px}.pause-control{width:78px;height:78px;border-width:5px;font-size:28px}.sing-time{bottom:17px;font-size:15px}.sing-side-actions{bottom:210px}
@media (max-height:760px){.screen-sing .sing-controls{right:13px;bottom:47px;left:13px}.screen-sing .pause-control{width:68px;height:68px;border-width:4px;font-size:24px}.screen-sing .sing-time{bottom:10px;font-size:13px}.screen-sing .sing-side-actions{right:13px;bottom:165px;gap:15px}.screen-sing .sing-side-actions i{font-size:19px}.screen-sing .pitch-lane{height:94px}.screen-sing .sing-lyrics{padding-top:25px}.screen-sing .sing-lyrics p{margin-bottom:16px;font-size:18px}.screen-sing .sing-lyrics .active{margin-bottom:20px;font-size:23px}}

/* Reference-layout pass: selection, preparation and mix screens share the measured mobile rhythm. */
.screen-library .library-head{height:116px;padding:42px 18px 15px}.screen-library .app-mark{width:42px;height:42px;border-radius:50%;font-size:18px}.screen-library .primary-tabs{height:58px;gap:33px}.screen-library .primary-tabs button{font-size:19px}.screen-library .genre-tabs{gap:27px;padding:4px 18px 15px}.screen-library .genre-tabs button{font-size:16px}.screen-library .song-list{height:calc(100% - 231px);padding-bottom:76px}.screen-library .song-row{min-height:88px}.screen-library .song-row img{width:64px;height:64px;border-radius:11px}.screen-library .song-info h2{font-size:18px}.screen-library .listen-button{color:#9a9a9a}.screen-library .sing-button{height:36px;border-color:#ececf0;font-size:13px}.screen-library .bottom-nav{height:76px}
.screen-prepare .prepare-background{filter:brightness(.34) saturate(.72)}.screen-prepare .screen-top{height:98px;padding-top:30px}.screen-prepare .loaded-card{margin-top:10px;border-radius:20px;background:rgba(69,48,36,.88)}.screen-prepare .benefit-strip{margin-top:12px;border-radius:13px;background:rgba(68,46,31,.88)}.screen-prepare .prepare-lyrics{height:315px;padding-top:53px}.screen-prepare .prepare-lyrics p{margin-bottom:28px;font-size:20px}.screen-prepare .prepare-tools{gap:52px}.screen-prepare .start-row{margin-top:27px}.screen-prepare .mode-tabs{margin-top:37px}
.screen-adjust .screen-top{height:97px;padding-top:30px}.screen-adjust .publish-card{margin-top:12px;border-radius:16px}.screen-adjust .publish-card textarea{height:118px;font-size:18px}.screen-adjust .tuning-tabs{margin:22px 0 17px}.screen-adjust .effect-grid{grid-template-columns:repeat(5,1fr);gap:9px;padding:0 18px}.screen-adjust .effect-tile{border-radius:11px;background-image:url('./assets/private-song-cover-v1.png');background-size:cover;background-position:center;color:#fff;text-shadow:0 1px 3px #000}.screen-adjust .effect-tile:nth-child(2n){background-image:url('./assets/recording-stage-bg.png')}.screen-adjust .effect-tile:nth-child(3n){background-color:#46252d}.screen-adjust .mix-sliders{margin-top:27px}.screen-adjust .adjust-tools{margin-top:28px}.screen-adjust .suggestion{height:49px}.screen-adjust .finish-bar{height:78px}
@media (max-height:760px){.screen-library .library-head{height:83px;padding:19px 15px 8px}.screen-library .primary-tabs{height:45px}.screen-library .genre-tabs{padding-bottom:9px;gap:19px}.screen-library .song-list{height:calc(100% - 196px);padding:0 15px 72px}.screen-library .song-row{min-height:75px}.screen-library .song-row img{width:54px;height:54px}.screen-library .song-info h2{font-size:16px}.screen-library .song-info p{font-size:11px}.screen-library .screen-library .bottom-nav{height:70px}.screen-prepare .screen-top{height:68px;padding-top:11px}.screen-prepare .prepare-lyrics{padding-top:15px}.screen-adjust .screen-top{height:65px;padding-top:11px}.screen-adjust .publish-card{margin-top:6px}.screen-adjust .publish-card textarea{height:84px;font-size:15px}.screen-adjust .tuning-tabs{margin:11px 0}.screen-adjust .effect-grid{gap:6px}.screen-adjust .effect-tile{font-size:8px}.screen-adjust .effect-tile i{font-size:15px}.screen-adjust .mix-sliders{gap:11px;margin-top:13px}.screen-adjust .mix-sliders label{font-size:14px}.screen-adjust .adjust-tools{margin-top:13px}.screen-adjust .suggestion{height:43px}.screen-adjust .finish-bar{height:64px;padding:7px 18px}}

@media (max-height:760px){.screen-library .bottom-nav{height:70px}}

/* Keep the preparation artwork inside its screen stacking context instead of behind the white app canvas. */
.screen-prepare{isolation:isolate;background:#2a170d}.screen-prepare .prepare-background{z-index:0}.screen-prepare>*:not(.prepare-background){position:relative;z-index:1}

/* Shared account-avatar slot: account data can later replace this image without touching the flow layout. */
.avatar-dot.is-default-avatar{background:#f5e1d4 url('./assets/default-avatar-v1.png') center/cover no-repeat;box-shadow:0 0 0 1px rgba(255,255,255,.72)}

/* Time-coded lyric viewport: playback advances the active line; vertical drag seeks the track. */
.screen-sing .sing-lyrics{height:346px;overflow:hidden;touch-action:none;cursor:grab}.screen-sing .sing-lyrics:active{cursor:grabbing}.screen-sing .lyric-scroll{transition:transform .28s ease-out;will-change:transform}.screen-sing .lyric-scroll.is-dragging{transition:none}.screen-sing .lyric-scroll p{user-select:none}
@media (max-height:760px){.screen-sing .sing-lyrics{height:250px}}

/* Live mix drawer: opens above the singing screen without changing playback state. */
.live-mix-overlay{position:fixed;z-index:40;inset:0}.live-mix-overlay[hidden]{display:none}.live-mix-backdrop{position:absolute;inset:0;width:100%;background:rgba(1,7,19,.72)}.live-mix-sheet{position:absolute;right:0;bottom:0;left:0;width:min(100%,390px);min-height:535px;margin:auto;padding:23px 22px 19px;border-radius:25px 25px 0 0;background:#1b1b1b;color:#f5f5f5}.live-mix-head{display:flex;justify-content:space-between;align-items:center}.live-mix-head button{padding:0 0 9px;background:transparent;color:#858585;font-size:17px}.live-mix-head button+button{margin-left:25px}.live-mix-head .is-active{color:#fff;font-weight:800}.live-mix-head .live-mix-close{padding:0;color:#c5c5c5;font-size:25px}.live-toggle{position:relative;display:block;margin-top:25px;padding-right:70px;font-size:17px}.live-toggle small{display:block;margin-top:7px;color:#777;font-size:12px}.live-toggle em{margin-left:6px;padding:2px 4px;border-radius:4px;background:#ff5865;color:#fff;font-size:10px;font-style:normal}.live-toggle input{position:absolute;opacity:0}.live-toggle span{position:absolute;right:0;top:10px;width:45px;height:25px;border-radius:14px;background:#555}.live-toggle span:after{content:"";position:absolute;top:4px;left:4px;width:17px;height:17px;border-radius:50%;background:#fff;transition:.2s}.live-toggle input:checked+span{background:#ff5360}.live-toggle input:checked+span:after{transform:translateX(20px)}.live-slider{display:grid;grid-template-columns:90px 1fr;align-items:center;gap:8px;margin-top:28px;font-size:17px}.live-slider input,.live-pitch input{width:100%;accent-color:#fff}.spatial-toggle{margin-top:32px}.live-pitch{margin-top:30px}.pitch-title{display:flex;justify-content:space-between;font-size:17px}.pitch-title span{color:#8c8c8c;font-size:14px}.pitch-title strong{color:#fff}.pitch-value{margin:22px 0 10px;text-align:center;font-size:27px;font-weight:750}.pitch-stepper{display:grid;grid-template-columns:42px 1fr 42px;align-items:center;gap:12px}.pitch-stepper button{height:32px;border-radius:5px;background:#555;color:#fff;font-size:28px;line-height:1}.live-themes{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:32px;overflow:hidden}.live-themes button{aspect-ratio:.9;border-radius:10px;background:#3e332d url('./assets/private-song-cover-v1.png') center/cover no-repeat;color:#fff;font-size:14px;font-weight:800;text-shadow:0 1px 3px #000}.live-themes button:nth-child(2n){background-image:url('./assets/recording-stage-bg.png')}.live-themes .is-active{box-shadow:inset 0 0 0 3px #ff5763}@media (max-height:760px){.live-mix-sheet{min-height:0;height:492px;padding:18px 20px 14px}.live-toggle{margin-top:17px;font-size:15px}.live-toggle small{margin-top:4px;font-size:11px}.live-slider{margin-top:20px;font-size:15px}.spatial-toggle{margin-top:22px}.live-pitch{margin-top:21px}.pitch-value{margin:12px 0 6px;font-size:23px}.live-themes{margin-top:20px;gap:8px}.live-themes button{font-size:11px}}

/* The pause ring is the whole-song clock, not a decorative border. */
.pause-control{position:relative;isolation:isolate;border:0;background:conic-gradient(#fff var(--song-progress,0deg),#393939 0);padding:5px}.pause-control:before{content:"";position:absolute;z-index:-1;inset:5px;border-radius:50%;background:#080808}.pause-control i{position:relative;z-index:1}
@media (max-height:760px){.pause-control{padding:4px}.pause-control:before{inset:4px}}

/* Current lyric is the active singing cue; all surrounding lines deliberately recede. */
.screen-sing .lyric-scroll p{color:#747474;opacity:.82}.screen-sing .lyric-scroll p.active{color:#fff;opacity:1;font-weight:850;text-shadow:0 0 14px rgba(255,255,255,.18)}

/* Fixed lyric rows keep the active sentence pinned to the first visible line. */
.screen-sing .lyric-scroll p,.screen-sing .lyric-scroll p.active{display:flex;align-items:center;justify-content:center;height:55px;margin:0;line-height:1.2}.screen-sing .lyric-scroll p.active{font-size:27px}
@media (max-height:760px){.screen-sing .lyric-scroll p,.screen-sing .lyric-scroll p.active{height:55px}.screen-sing .lyric-scroll p.active{font-size:23px}}

/* Active line starts at the viewport edge; prior rows are fully clipped, never half-visible. */
.screen-sing .sing-lyrics{padding-top:0}

/* Drag preview behaves like a native lyric scroller: the list tracks the finger and exposes a brief scroll thumb. */
.screen-sing .sing-lyrics{position:relative}.lyric-drag-bar{position:absolute;top:10px;right:2px;width:2px;height:38px;border-radius:2px;background:#888;opacity:0;transition:opacity .16s}.screen-sing .sing-lyrics.is-previewing .lyric-drag-bar{opacity:.8}.screen-sing .sing-lyrics.is-previewing{cursor:grabbing}

/* Moving pitch road: target notes travel right-to-left through a fixed playhead. */
.screen-sing .pitch-lane{overflow:hidden}.pitch-road{position:absolute;inset:0;will-change:transform}.pitch-note{position:absolute;left:0;height:10px;border-radius:8px;background:#484848;transition:background .12s}.pitch-note.is-current{background:#ff5360;box-shadow:0 0 8px rgba(255,83,96,.55)}.pitch-playhead{position:absolute;z-index:2;top:0;right:auto;bottom:0;left:50%;width:0;border-left:2px dashed #888}.pitch-voice-dot{position:absolute;z-index:3;left:calc(50% - 10px);width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 0 13px rgba(255,255,255,.72);transition:top .06s linear,opacity .16s}

/* Top-right performance display menu: one fast, low-friction switch for the pitch road. */
.sing-more-menu{position:absolute;z-index:12;top:74px;right:14px;width:150px;padding:6px;border:1px solid rgba(255,255,255,.1);border-radius:13px;background:rgba(40,40,42,.97);box-shadow:0 12px 28px rgba(0,0,0,.42)}.sing-more-menu[hidden]{display:none}.sing-more-menu button{display:flex;align-items:center;justify-content:space-between;width:100%;height:43px;padding:0 8px;border-radius:9px;background:transparent;color:#fff;font-size:14px}.sing-more-menu button:active{background:#4a4a4d}.sing-more-menu span{display:flex;align-items:center;gap:8px}.sing-more-menu i{color:#d8d8d8}.mini-switch{position:relative;width:35px;height:20px;border-radius:12px;background:#5c5c60;transition:background .18s}.mini-switch:after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#fff;transition:transform .18s}.sing-more-menu button.is-active .mini-switch{background:#ff5360}.sing-more-menu button.is-active .mini-switch:after{transform:translateX(15px)}.screen-sing.is-pitch-hidden .pitch-lane{display:none}
.screen-sing.is-pitch-hidden .sing-lyrics{height:468px}
@media (max-height:760px){.screen-sing.is-pitch-hidden .sing-lyrics{height:372px}}

/* Publication is local-first: pick visibility before saving the finished work. */
.visibility-menu{position:absolute;z-index:15;top:183px;right:15px;width:142px;padding:9px 7px;border:1px solid #4b4b4b;border-radius:12px;background:#383838;box-shadow:0 12px 26px rgba(0,0,0,.35)}.visibility-menu[hidden]{display:none}.visibility-menu>b{display:block;padding:2px 5px 7px;color:#aaa;font-size:11px;font-weight:600}.visibility-menu button{display:flex;align-items:center;gap:7px;width:100%;height:34px;padding:0 5px;border-radius:7px;background:transparent;color:#fff;text-align:left;font-size:12px}.visibility-menu button:active{background:#505050}.visibility-menu i{width:13px;color:#d8d8d8}

/* Measured compact preparation proportions: 125px song card, 43px benefit row, then lyric-first space. */
@media (max-height:760px){.screen-prepare.is-current{grid-template-rows:68px 125px 43px minmax(90px,1fr) 42px 50px 40px}.screen-prepare .loaded-card{height:125px;grid-template-columns:54px minmax(0,1fr) 42px;grid-template-rows:64px 32px;gap:7px 10px;margin:0 16px;padding:10px 12px;border-radius:18px}.screen-prepare .loaded-card>img{width:54px;height:64px;border-radius:8px}.screen-prepare .loaded-info h1{margin:0 0 4px;font-size:20px;line-height:1.1}.screen-prepare .loaded-info p{font-size:12px;line-height:1.1}.screen-prepare .loaded-info small{margin-top:5px;padding:2px 4px;font-size:9px}.screen-prepare .preview-pause{width:42px;height:42px;font-size:14px}.screen-prepare .setting-row{gap:7px;margin:0}.screen-prepare .setting-chip{height:32px;border-radius:9px;font-size:13px}.screen-prepare .benefit-strip{height:43px;margin:0 16px;padding:0 13px;border-radius:13px}.screen-prepare .prepare-lyrics{padding:19px 24px 0}.screen-prepare .prepare-lyrics p{margin-bottom:16px;font-size:17px}.screen-prepare .prepare-tools{gap:51px}.screen-prepare .prepare-tools button{gap:5px;font-size:11px}.screen-prepare .start-row{grid-template-columns:104px 1fr;gap:12px;margin:0 28px}.screen-prepare .voice-chip,.screen-prepare .primary-cta{height:50px}.screen-prepare .mode-tabs{padding:0 31px}.screen-prepare .mode-tabs button{font-size:16px}}
@media (max-height:760px){.screen-prepare.is-current{row-gap:9px;grid-template-rows:68px 125px 43px minmax(54px,1fr) 42px 50px 40px}.screen-prepare .prepare-lyrics{padding-top:25px}}

/* Bottom performance choices are viewport-anchored so they can never be clipped by lyric compression. */
@media (max-height:760px){.screen-prepare .start-row{position:absolute;right:28px;bottom:50px;left:28px;margin:0}.screen-prepare .mode-tabs{position:absolute;right:0;bottom:6px;left:0;height:35px;margin:0;padding:0 31px}.screen-prepare .mode-tabs button{height:30px}.screen-prepare .mode-tabs .is-active:after{bottom:-1px}}