@font-face{font-family:Instrument;src:url('fonts/InstrumentSans-Regular.ttf')}@font-face{font-family:Instrument;src:url('fonts/InstrumentSans-Bold.ttf');font-weight:700}@font-face{font-family:RivieraSerif;src:url('fonts/InstrumentSerif-Regular.ttf')}
:root{--paper:#fffaf0;--ink:#203954;--muted:#526379;--line:#d9dcd6;--gold:#4c6e9c;--blue:#6495ed;--cream:#fff3df;--apricot:#f4a26f}body{font-family:Instrument,Arial,sans-serif;background:var(--paper)}.signature,h1,h2,.closing{font-family:RivieraSerif,Georgia,serif}.signature{font-style:normal;font-size:30px}.masthead{border-bottom-color:#e2e4de}.edition:empty{display:none}.art img{border-radius:14px;box-shadow:0 15px 40px #6495ed1a}.eyebrow{letter-spacing:.12em}.play{background:var(--blue);color:#12283f;box-shadow:none}.play:hover{background:#83acf0}.icon:hover{background:#e0eafb}.actions>*:hover{background:#e0eafb}.icon[aria-pressed=true]{background:#203954}.lyrics-preview{background:#dce7fb;color:#203954;border-radius:14px;box-shadow:none}.lyrics-preview:hover{background:#ccdefa}.preview-lines{font-family:Instrument,Arial,sans-serif;color:#304d72}.preview-lines .preview-active{color:#12283f}.preview-invite{color:#203954}.welcome{background:var(--cream);overflow:hidden}.welcome:before{content:'';position:absolute;width:min(70vw,650px);aspect-ratio:1;border-radius:50%;background:var(--apricot);right:-12vw;top:-10vw}.welcome:after{content:'';position:absolute;width:140%;height:170px;bottom:-35px;left:-15%;border-top:9px solid var(--blue);border-bottom:9px solid var(--blue);border-radius:50%;transform:rotate(-6deg);box-shadow:0 -24px 0 -16px var(--cream),0 -32px 0 -17px var(--blue)}.welcome-card{position:relative;z-index:1;background:#fffaf0f5;box-shadow:none;border:1px solid #fff;border-radius:22px;min-width:min(400px,100%)}.welcome h2{font-size:80px;font-family:RivieraSerif,Georgia,serif}.welcome p{font-family:Instrument,Arial,sans-serif;font-size:17px}.welcome button{background:var(--blue);color:#12283f;font-weight:700}.welcome button:hover{background:#82aaf0}.welcome small{font-size:13px;color:#526379}#lyrics-dialog{background:linear-gradient(150deg,#85aef2,#6495ed);color:#12283f}#lyrics-dialog .immersive-icon{color:#12283f}#lyrics-dialog .immersive-header p,#lyrics-dialog .reading-options span,#lyrics-dialog .verse-title{color:#29496a}#lyrics-dialog .pill{color:#12283f;border-color:#385f96}#lyrics-dialog .pill[aria-pressed=true]{color:#12283f;background:#fff3df;border-color:#fff3df}#lyrics-dialog .line{color:#29496a}#lyrics-dialog .line p{font-family:Instrument,Arial,sans-serif}#lyrics-dialog .line .translation{color:#29496a}#lyrics-dialog .line.active,#lyrics-dialog .line.active .translation{color:#12283f}#lyrics-dialog .line.active p:first-child{font-weight:700}#lyrics-dialog .line:not(.active) p:first-child{font-weight:400}#lyrics-dialog .immersive-player .play{background:#12283f;color:#fff3df}#lyrics-dialog .immersive-player .times{color:#29496a}#lyrics-dialog .immersive-player input{accent-color:#12283f}#lyrics-dialog button:focus-visible,#lyrics-dialog input:focus-visible{outline-color:#12283f}.mobile-dock.visible{background:#fffaf0f5}.mobile-dock button{background:var(--blue);color:#12283f}footer{font-family:Instrument,Arial,sans-serif;font-style:normal;font-size:12px}
/* Refined player hierarchy */
.masthead{border:0;padding-top:24px;padding-bottom:8px}.signature{font-size:26px;min-height:44px;display:flex;align-items:center}.layout{margin-top:24px;column-gap:70px;row-gap:24px}.album-title{margin-top:22px;align-items:center}h1{font-size:42px}#repeat{color:#526379}#repeat svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}#repeat[aria-pressed=true]{color:#fffaf0}#custom-player{margin-top:14px}.controls{margin:10px 0 0;gap:35px}.play{width:74px;height:74px}.play svg{width:30px;height:30px}.status:empty{display:none}.status{margin:14px 0 0}.actions{max-width:1140px;margin:24px auto 0;border:0;justify-content:flex-start;gap:16px;padding:0 48px}.actions>*{flex:0 0 auto;justify-content:center;gap:9px;padding:0 12px;font-size:12px;color:var(--muted);min-height:44px;border:0!important;border-radius:24px}.actions>*:hover{background:#edf1f6}.lyrics-preview{margin-top:0;align-self:center;padding:25px 28px}.preview-lines{font-size:30px;margin:25px 0;gap:15px}.preview-invite{font-size:12px}.preview-invite>span{display:none}.preview-heading{font-size:13px}footer{padding:28px 20px;color:#526379}.mobile-dock button{display:grid;place-items:center}.mobile-dock button svg{width:24px;height:24px;fill:currentColor}.mobile-dock p{font-family:Instrument,Arial,sans-serif;font-size:16px}
@media(min-width:851px){.art{max-width:clamp(260px,calc(100dvh - 340px),470px)}.layout{grid-template-columns:minmax(0,470px) minmax(0,1fr)}.actions{max-width:1280px}.lyrics-preview{margin-top:0}}
@media(max-width:850px){body{padding-bottom:72px}.masthead{padding:12px 24px 0;max-width:470px}.signature{font-size:24px;min-height:36px}.layout{max-width:470px;padding:0 24px;margin-top:10px;gap:22px}.art{max-width:min(64vw,29dvh);margin:auto}.art img{box-shadow:none;border-radius:12px}.album-title{margin-top:16px}h1{font-size:34px}.album-title .icon{height:44px;min-width:44px}#custom-player{margin-top:9px}.controls{margin:8px 0 0;gap:32px}.play{width:68px;height:68px}.times{font-size:11px}.lyrics-preview{padding:18px 20px;width:100%;border-radius:14px}.preview-lines{font-size:23px;line-height:1.3;gap:10px;margin:17px 0}.preview-heading{font-size:12px}.preview-invite{font-size:11px}.actions{max-width:470px;padding:0 24px;margin:12px auto 0;gap:6px;justify-content:center}.actions>*{font-size:11px}footer{padding:16px 20px;font-size:11px}}
@media(max-width:850px) and (max-height:720px){.art{max-width:24dvh}.preview-lines{font-size:21px;margin:12px 0}.layout{gap:16px}.play{width:62px;height:62px}.album-title{margin-top:12px}}
/* Readable lyrics, including before synchronization is calibrated. */
#lyrics-dialog{background:linear-gradient(150deg,#8bb2f3,#6495ed)}
#lyrics-dialog .immersive-shell{max-width:900px}
#lyrics-dialog .lyrics{padding:12px 18px 70px 6px;scrollbar-color:#355d97 transparent;mask-image:none;-webkit-mask-image:none}
#lyrics-dialog .line{padding:17px 0;color:#172f4c}
#lyrics-dialog .line p,#lyrics-dialog .line:not(.active) p:first-child{font-family:Instrument,Arial,sans-serif;font-size:clamp(26px,3.2vw,35px);font-weight:700;line-height:1.45;letter-spacing:0;max-width:720px}
#lyrics-dialog .line .translation{font-family:Instrument,Arial,sans-serif;font-size:17px;font-weight:400;line-height:1.6;letter-spacing:0;color:#203954;margin-top:8px;max-width:660px}
#lyrics-dialog .verse-title{font-size:11px;font-weight:700;letter-spacing:.12em;color:#203954;margin:26px 0 6px}
#lyrics-dialog .line.active{background:#fff3df;border-radius:12px;padding:16px 18px;margin-left:-2px;color:#12283f}
#lyrics-dialog .line.active .translation{color:#203954}
#lyrics-dialog .immersive-player .times{font-size:12px;color:#203954}
#lyrics-dialog .immersive-icon{display:flex;align-items:center;justify-content:center;gap:4px;white-space:nowrap}
#lyrics-dialog .immersive-icon span{display:inline;font-size:13px}
#back,#forward{display:inline-flex;align-items:center;justify-content:center;gap:4px;white-space:nowrap}
#back span,#forward span{display:inline;font-size:13px}
@media(max-width:850px){#lyrics-dialog .immersive-shell{padding:0 22px}#lyrics-dialog .line p,#lyrics-dialog .line:not(.active) p:first-child{font-size:27px;line-height:1.42}#lyrics-dialog .line .translation{font-size:16px;line-height:1.55}#lyrics-dialog .line{padding:15px 0}#lyrics-dialog .lyrics{padding-left:3px;padding-right:12px}#lyrics-dialog .line.active{padding:14px 12px}}
@media(max-width:380px){#lyrics-dialog .line p,#lyrics-dialog .line:not(.active) p:first-child{font-size:25px}}
.calibrating .layout{align-items:start}.calibrating .art,.calibrating #open-lyrics,.calibrating .actions,.calibrating footer,.calibrating .mobile-dock{display:none!important}.calibrating .album{top:25px;padding:25px;background:#fff3df;border-radius:18px}.calibrating .album-title{margin-top:0}.calibrating #calibration{margin:0;padding:26px;max-width:none;min-width:0;background:#e0eafb;border:0;border-radius:18px}.calibrating #calibration h2{font-size:33px}.calibrating #calibration>p{font-size:14px}.calibrating #next-line{font:700 29px/1.4 Instrument,Arial,sans-serif!important;margin:28px 0 8px}.calibrating #next-translation{color:#526379;font-size:17px!important;margin-top:0;margin-bottom:28px}.calibrating .calibration-actions{gap:10px}.calibrating #mark{background:#203954;flex-basis:100%;font-size:18px;min-height:62px}.calibrating #undo,.calibrating #export{font-size:13px;background:#fffaf0;color:#203954}.calibrating .import{background:#fffaf0;color:#203954;font-size:13px;display:block}.calibrating .calibration-help{border-top:1px solid #c3d1e2;padding-top:20px;font-size:12px!important;color:#526379}.calibration-speed{display:flex;align-items:center;gap:12px;font-size:14px}.calibration-speed select{font:16px Instrument,Arial,sans-serif;min-height:44px;border:1px solid #a2b7d1;padding:8px 12px;border-radius:8px;color:#203954;background:#fffaf0}@media(max-width:850px){.calibrating .layout{max-width:640px;gap:18px}.calibrating .album{padding:18px;position:static}.calibrating #calibration{padding:20px}.calibrating #next-line{font-size:25px!important}.calibrating .masthead{max-width:640px}}
#lyrics-dialog .line.grouped p:first-child{font-size:28px;line-height:1.4}@media(max-width:850px){#lyrics-dialog .line.grouped p:first-child{font-size:24px}}
#lyrics-dialog .reading-options{padding-right:0;min-height:44px}#lyrics-dialog #follow{font-size:12px;max-width:calc(100% - 120px);text-align:left;line-height:1.3}#lyrics-dialog .reading-options #sync-note{display:none}
/* A quiet reveal for the gift, without delaying audio playback. */
@keyframes gift-arrive{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes album-arrive{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes sun-arrive{from{opacity:0;transform:translate(20px,-15px) scale(.94)}to{opacity:1;transform:translate(0,0) scale(1)}}
.welcome-card{animation:gift-arrive .8s cubic-bezier(.2,.7,.2,1) both}
.welcome:before{animation:sun-arrive 1.2s cubic-bezier(.2,.7,.2,1) both}
body.gift-opened .album{animation:album-arrive .7s cubic-bezier(.2,.7,.2,1) both}
body.gift-opened #open-lyrics{animation:album-arrive .7s .12s cubic-bezier(.2,.7,.2,1) both}
body.gift-opened .actions{animation:album-arrive .6s .2s cubic-bezier(.2,.7,.2,1) both}
@media(prefers-reduced-motion:reduce){.welcome-card,.welcome:before,body.gift-opened .album,body.gift-opened #open-lyrics,body.gift-opened .actions{animation:none!important}}
.animated-cover{isolation:isolate;overflow:hidden;border-radius:14px}.living-cover{position:absolute;inset:0;width:100%;height:100%;display:block}.animated-cover>img{box-shadow:none;border-radius:0}.animated-cover .cover-sun{animation:cover-sun-drift 5s ease-in-out infinite alternate;animation-play-state:paused;transform-origin:905px 535px}.animated-cover .cover-waves{animation:cover-tide 3s ease-in-out infinite alternate;animation-play-state:paused}.music-playing .animated-cover .cover-sun,.music-playing .animated-cover .cover-waves{animation-play-state:running}
@keyframes cover-sun-drift{from{transform:translateY(0)}to{transform:translateY(-64px)}}
@keyframes cover-tide{from{transform:translate(0,0)}to{transform:translate(-72px,26px)}}
@media(prefers-reduced-motion:reduce){.animated-cover .cover-sun,.animated-cover .cover-waves{animation:none!important}}
.instrumental-note{display:flex;align-items:center;gap:16px;padding:25px 18px;margin:18px 0;border-radius:14px;background:#fff3df;color:#203954;font:400 19px Instrument,Arial,sans-serif}.instrumental-note svg{width:46px;height:46px;flex-shrink:0}.instrumental-preview{display:flex!important;align-items:center;gap:15px;font-size:19px;min-height:115px}.instrumental-preview svg{width:46px;height:46px;flex-shrink:0}
