:root{color:#28394a;background:#f2ead8;font-family:Songti SC,"Noto Serif SC",Iowan Old Style,Georgia,PingFang SC,serif;letter-spacing:0;--paper: rgba(255, 250, 235, .9);--paper-strong: rgba(255, 249, 229, .96);--ink: #28394a;--ink-soft: #607083;--sage: #6f855f;--sage-soft: #dfe7cc;--sky: #d9eaf1;--clay: #c78c59;--line: rgba(86, 99, 80, .2);--shadow: 0 24px 70px rgba(70, 85, 70, .18)}*{box-sizing:border-box}html{min-width:320px;background:#f2ead8}body{margin:0;min-width:320px;min-height:100vh;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}button,input{font:inherit}button{color:inherit}.songbook-shell{position:relative;min-height:100svh;overflow-x:hidden;padding:36px 22px;background:linear-gradient(#f6efdd38,#f6efdd94),var(--sister-bg) center / cover fixed,#f2ead8}.songbook-shell:before{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;content:"";background:radial-gradient(circle at 16% 8%,rgba(255,252,239,.78),transparent 26%),linear-gradient(90deg,#f7efdbf2,#f7efdb8a 48%,#f7efdbdb)}.songbook{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.95fr) minmax(420px,.78fr);gap:28px;width:min(1180px,100%);min-height:calc(100svh - 72px);margin:0 auto;align-items:stretch}.cover-panel,.journal-panel{border:1px solid rgba(82,91,67,.16);box-shadow:var(--shadow)}.cover-panel{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:720px;overflow:hidden;border-radius:8px;background:linear-gradient(180deg,#fffaec14,#fff8e247),var(--sister-bg) center / cover}.cover-panel:after{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;content:"";background:linear-gradient(105deg,#fff9e5eb,#fff9e594 38%,#fff9e50d 62%),linear-gradient(0deg,#384f3733,#fff0 44%)}.brand-block,.dedication{position:relative;z-index:1}.brand-block{width:min(430px,82%);padding:52px 0 0 50px}.eyebrow,.section-label{display:block;color:var(--sage);font-family:PingFang SC,Hiragino Sans GB,Arial,sans-serif;font-size:12px;font-weight:700;letter-spacing:0;text-transform:uppercase}h1,h2,h3,p{margin:0}h1{margin-top:10px;color:#213247;font-size:58px;font-weight:700;line-height:1.08}.brand-block p{margin-top:18px;color:#4d6170;font-size:18px;line-height:1.8}.dedication{align-self:flex-end;max-width:360px;margin:0 34px 34px;padding:20px 24px 18px;border:1px solid rgba(92,82,62,.12);border-radius:6px;color:#34475d;background:#fff9e8c7;font-size:20px;font-weight:650;line-height:1.8;transform:rotate(-1.2deg)}.journal-panel{display:grid;grid-template-rows:auto auto auto auto auto minmax(0,1fr);gap:18px;min-height:720px;padding:34px;border-radius:8px;background:linear-gradient(#fffceff0,#fff8e4f0),repeating-linear-gradient(0deg,transparent 0,transparent 34px,rgba(93,112,86,.09) 35px)}.now-playing{padding-bottom:18px;border-bottom:1px solid var(--line)}.now-playing h2{margin-top:9px;color:var(--ink);font-size:36px;line-height:1.18}.now-playing p{margin-top:15px;color:#5a6a58;font-size:16px;line-height:1.8}.progress-block{display:grid;gap:8px}.progress-range,.volume-range{width:100%;accent-color:var(--sage)}.progress-range{height:22px}.time-row{display:flex;justify-content:space-between;color:var(--ink-soft);font-family:PingFang SC,Hiragino Sans GB,Arial,sans-serif;font-size:13px}.controls{display:flex;align-items:center;justify-content:center;gap:18px}.icon-button,.small-icon-button,.play-button,.mobile-play{display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(51,68,80,.18);color:var(--ink);background:#fffcefb8;cursor:pointer;transition:transform .16s ease,background .16s ease,border-color .16s ease}.icon-button:hover,.small-icon-button:hover,.play-button:hover,.mobile-play:hover{border-color:#465c3f57;background:#f0f6e0db;transform:translateY(-1px)}.icon-button:focus-visible,.small-icon-button:focus-visible,.play-button:focus-visible,.mobile-play:focus-visible,.mode-button:focus-visible,.track-row:focus-visible{outline:3px solid rgba(58,104,138,.28);outline-offset:3px}.icon-button{width:48px;height:48px;border-radius:999px}.play-button{width:68px;height:68px;border-radius:999px;color:#fdf8eb;background:#31465a}.play-button:hover{background:#26394b}.mode-row{display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden;border:1px solid rgba(72,91,63,.2);border-radius:8px;background:#fffbecad}.mode-button{min-height:42px;border:0;border-right:1px solid rgba(72,91,63,.16);color:#556564;background:transparent;cursor:pointer;font-family:PingFang SC,Hiragino Sans GB,Arial,sans-serif;font-size:14px;font-weight:650}.mode-button:last-child{border-right:0}.mode-button.active{color:#fdf8ec;background:#6f855f}.volume-row{display:grid;grid-template-columns:32px minmax(0,1fr);gap:10px;align-items:center}.small-icon-button{width:32px;height:32px;border-radius:999px}.playlist{min-height:0}.playlist-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:12px}.playlist-heading h3{margin-top:4px;color:var(--ink);font-size:24px;line-height:1.2}.playlist-heading>span{color:var(--ink-soft);font-family:PingFang SC,Hiragino Sans GB,Arial,sans-serif;font-size:13px}.playlist ol{display:grid;max-height:320px;margin:0;padding:0;overflow:auto;list-style:none;border-top:1px solid var(--line);scrollbar-color:rgba(111,133,95,.6) transparent}.track-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:12px;width:100%;min-height:66px;padding:10px 4px;border:0;border-bottom:1px solid var(--line);color:var(--ink);background:transparent;text-align:left;cursor:pointer}.track-row:hover{background:#dee8ca6b}.track-row.active{background:#cfe0b575}.track-index{display:flex;align-items:center;justify-content:center;color:var(--sage);font-family:PingFang SC,Hiragino Sans GB,Arial,sans-serif;font-size:13px;font-weight:700}.track-meta{display:grid;gap:5px;min-width:0}.track-meta strong{overflow:hidden;color:#26384d;font-size:16px;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}.track-meta small{overflow:hidden;color:#6b765e;font-size:13px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.track-duration{align-self:center;color:var(--ink-soft);font-family:PingFang SC,Hiragino Sans GB,Arial,sans-serif;font-size:13px}.mobile-player{display:none}audio{display:none}@media(max-width:940px){.songbook-shell{padding:16px 14px 240px;background:linear-gradient(#f6efdd33,#f6efdd9e),var(--sister-bg) center top / cover fixed,#f2ead8}.songbook-shell:before{background:linear-gradient(180deg,#f7efdbd1,#f7efdb7a 42%,#f7efdbe0),#f7efdb42}.songbook{display:grid;grid-template-columns:1fr;gap:14px;min-height:auto}.cover-panel{min-height:286px;border-radius:8px;background-position:center 34%}.cover-panel:after{background:linear-gradient(180deg,#fff9e5e0,#fff9e57a 44%,#fff9e533),linear-gradient(0deg,#2d48303d,#fff0 58%)}.brand-block{width:82%;padding:24px 0 0 22px}h1{margin-top:7px;font-size:36px;line-height:1.12}.brand-block p{max-width:260px;margin-top:10px;font-size:14px;line-height:1.65}.dedication{max-width:250px;margin:0 14px 14px;padding:11px 14px;font-size:14px;line-height:1.65}.journal-panel{min-height:auto;padding:20px 18px 22px;gap:14px;border-radius:8px}.now-playing h2{margin-top:7px;font-size:28px}.now-playing p{margin-top:10px;font-size:14px;line-height:1.65}.controls{gap:15px}.icon-button{width:44px;height:44px}.play-button{width:62px;height:62px}.mode-button{min-height:40px;font-size:13px}.playlist-heading h3{font-size:21px}.playlist ol{max-height:342px}.track-row{grid-template-columns:32px minmax(0,1fr) auto;min-height:62px;gap:9px;padding:9px 2px}.track-meta strong{font-size:15px}.track-meta small{font-size:12px}.mobile-player{position:fixed;right:14px;bottom:14px;left:14px;z-index:4;display:grid;grid-template-columns:minmax(0,1fr) 48px;gap:12px;align-items:center;min-height:70px;padding:12px 14px;border:1px solid rgba(70,88,64,.18);border-radius:8px;color:var(--ink);background:#fffae8f0;box-shadow:0 16px 40px #3c4c3e38;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.mobile-player strong{display:block;overflow:hidden;font-size:15px;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}.mobile-player span{display:inline-flex;gap:5px;align-items:center;margin-top:5px;color:var(--sage);font-family:PingFang SC,Hiragino Sans GB,Arial,sans-serif;font-size:12px;font-weight:650}.mobile-play{width:48px;height:48px;border-radius:999px;color:#fdf8eb;background:#31465a}}@media(max-width:390px){.songbook-shell{padding-right:10px;padding-left:10px}.brand-block{padding-left:18px}h1{font-size:33px}.journal-panel{padding-right:14px;padding-left:14px}.mode-row{grid-template-columns:repeat(2,1fr)}.mode-button:nth-child(2){border-right:0}.mode-button:nth-child(-n+2){border-bottom:1px solid rgba(72,91,63,.16)}}