:root{--aqua:#0ad4d6;--aqua-dark:#08777b;--ink:#163d40;--muted:#73858a;--line:#e5eded;--bg:#f7faf9;--pale:#e9fbfa;--sidebar:242px}*{box-sizing:border-box}body{margin:0;color:var(--ink);font:15px/1.6 -apple-system,BlinkMacSystemFont,"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;background:var(--bg)}button,input,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button{border:0;background:none;color:inherit}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid var(--aqua-dark);outline-offset:4px}svg{width:20px;height:20px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}span[data-icon]{display:inline-flex;flex-shrink:0} [hidden]{display:none!important}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:#fff;border-right:1px solid var(--line);padding:33px 22px;display:flex;flex-direction:column;z-index:5}.brand{display:flex;align-items:center;gap:11px;font-size:20px;font-weight:750;letter-spacing:.03em}.brand small{display:block;font-size:9px;letter-spacing:.2em;color:#829497;margin-top:1px;font-weight:600}.brand-icon{width:43px;height:43px;border-radius:13px;background:var(--aqua);display:inline-flex!important;align-items:center;justify-content:center;color:#073e41}.brand-icon svg{width:25px;height:25px}.nav-label{font-size:11px;letter-spacing:.11em;color:#8d9e9e;margin:51px 13px 14px}.nav-item{display:flex;align-items:center;gap:12px;width:100%;padding:13px;border-radius:10px;font-size:14px;text-align:left;margin:5px 0;color:#76888a}.nav-item.active{background:var(--pale);color:#076f72;font-weight:650}.nav-count{margin-left:auto;font-size:11px;background:#eef3f3;border-radius:6px;padding:0 7px;line-height:22px}.active .nav-count{background:#cef3f2;color:#08757b}.sidebar-bottom{margin-top:auto;padding:22px 12px 8px}.mini-mark{color:var(--aqua-dark)}.sidebar-bottom p{font-size:18px;font-weight:650;line-height:1.7}.small-muted{font-size:10px;color:#91a1a3}.main-shell{margin-left:var(--sidebar)}.topbar{height:78px;border-bottom:1px solid var(--line);background:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 48px;font-size:12px;color:#88999b}.breadcrumb span{padding:0 17px;color:#becbcb}.breadcrumb strong{font-weight:500;color:#48676a}.header-note{display:flex;align-items:center;gap:8px}.status-dot{width:6px;height:6px;border-radius:50%;background:var(--aqua)}.mobile-brand{display:none}main{max-width:1450px;margin:auto;padding:39px 48px 24px}.hero{padding:29px 35px 25px;background:linear-gradient(115deg,#e1fbf8,#edf9f4 75%,#e7f5ef);border:1px solid #d7efeb;border-radius:18px;position:relative;overflow:hidden}.eyebrow{font-size:11px;color:#458b87;letter-spacing:.16em;display:flex;align-items:center;gap:7px}.eyebrow span{width:5px;height:5px;background:var(--aqua-dark);border-radius:50%}h1{font-size:42px;letter-spacing:.015em;line-height:1.4;margin:13px 0 7px;font-weight:740}h1 span{color:#05858a}.hero>p{font-size:13px;color:#5d8886;margin:0}.library-stats{display:flex;gap:26px;margin-top:26px;position:relative;z-index:1}.library-stats>span{font-size:11px;color:#69918e}.library-stats>span+span{border-left:1px solid #cae3df;padding-left:26px}.library-stats strong{font-size:18px;letter-spacing:.02em;color:#275c59;margin-right:4px}.hero-decoration{position:absolute;right:70px;top:7px;width:240px;height:220px;pointer-events:none}.hero-decoration i{position:absolute;width:175px;height:175px;border:1px solid #b7e5d9;border-radius:50%;right:0;top:17px;box-shadow:0 0 0 20px #d4eee633,0 0 0 42px #d4eee622}.hero-decoration span{position:absolute;font-size:140px;right:70px;top:-5px;transform:rotate(-14deg);color:#09bcb681;line-height:1.5}.hero-decoration b{position:absolute;font-size:48px;right:0;top:108px;transform:rotate(10deg);color:#7ed2c5}.search-section{margin:30px 0 24px}.search-box{display:flex;align-items:center;background:white;border:1px solid #dce8e6;border-radius:12px;padding:0 18px;height:59px;gap:13px;box-shadow:0 4px 10px #184b4003}.search-box>span{color:#50aaa7}.search-box:focus-within{border-color:var(--aqua-dark);box-shadow:0 0 0 3px #0ad4d618}.search-box input{border:0;outline:0;flex:1;min-width:0;color:var(--ink);font-size:14px;background:none;height:100%}.search-box input::placeholder{color:#9caaa9}.search-box input::-webkit-search-cancel-button{display:none}.search-box button{padding:8px;color:#819391}.search-box kbd{border:1px solid #e8eeec;border-radius:5px;color:#95a4a2;font-size:12px;padding:1px 8px}.filter-line{display:flex;justify-content:space-between;gap:14px;margin-top:17px;align-items:center;flex-wrap:wrap}.resource-filters{display:flex;gap:5px;flex-shrink:0}.filter{display:flex;align-items:center;gap:6px;border-radius:8px;font-size:12px;padding:8px 10px;color:#849492;white-space:nowrap}.filter svg{width:15px;height:15px}.filter.active{color:#126b69;background:#dff7f3;font-weight:650}.filter:hover{background:#edf2f0}.select-group{display:flex;gap:8px}.select-group select{max-width:160px;font-size:11px;border:1px solid #dfe8e5;border-radius:7px;background:#fff;padding:8px 26px 8px 10px;color:#6e8381;min-height:35px}.results-heading{display:flex;align-items:center;justify-content:space-between;margin:21px 0 15px}.results-heading h2{font-size:18px;margin:0;font-weight:650}.results-heading h2 span{font-size:11px;font-weight:500;margin-left:9px;color:#70908d;border-radius:6px;background:#eaf0ed;padding:3px 8px;vertical-align:middle}.results-heading>span{font-size:11px;color:#9ba9a6}.song-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.song-card{background:#fff;border:1px solid #e3ebe7;border-radius:12px;padding:19px 20px 0;transition:border-color .2s,box-shadow .2s;min-width:0}.song-card:hover{border-color:#9fe3d9;box-shadow:0 5px 15px #0f625305}.card-top{display:flex;justify-content:space-between;align-items:center}.song-code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#6f9892;font-size:11px;letter-spacing:.09em}.favorite{padding:3px;color:#a8b9b5}.favorite.saved{color:#078781}.favorite.saved svg{fill:#d5f7ef}.song-title{display:block;text-align:left;font-size:18px;line-height:1.5;font-weight:650;padding:7px 0 0;width:100%;letter-spacing:.02em}.song-title:hover{color:#028584}.song-subtitle{margin:5px 0 12px;font-size:11px;color:#899d98;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-preview{font-size:12px;color:#8d9e9a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;height:21px;margin-bottom:15px}.song-resources{border-top:1px solid #eef2ef;display:grid;grid-template-columns:repeat(4,1fr);padding:12px 0}.resource{display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px;padding:3px 0;min-height:29px;color:#6a8580}.resource+ .resource{border-left:1px solid #eef3ef}.resource svg{width:15px;height:15px}.resource:hover{color:var(--aqua-dark);background:#f1fcf8;border-radius:5px}.resource:disabled{color:#bac6c2;cursor:default}.youtube-resource{color:#668a82}.load-more{display:flex;align-items:center;justify-content:center;gap:9px;margin:28px auto 10px;border:1px solid #dce7e2;border-radius:9px;padding:10px 24px;background:#fff;font-size:12px;color:#708e86}.load-more svg{width:14px;height:14px}.loading{text-align:center;padding:35px;color:#809990;font-size:13px}.empty-state{text-align:center;padding:70px 20px;color:#7c958e}.empty-state>span{background:#e9f6ef;padding:18px;border-radius:50%}.empty-state svg{width:26px;height:26px}.empty-state h3{font-size:19px;color:var(--ink);margin:16px 0 7px}.empty-state p{font-size:13px}footer{margin-top:45px;display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid var(--line);padding:21px 0;color:#97a8a1;font-size:10px}footer>span{font-weight:600;font-size:12px;color:#738d83}footer p{margin:0}footer small{font-size:10px}.mobile-nav{display:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.primary-btn{display:inline-flex;align-items:center;gap:8px;background:var(--aqua);color:#073f43;border-radius:9px;padding:11px 19px;font-size:13px;font-weight:650}.secondary-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid #d8e9e1;background:#fff;border-radius:9px;padding:10px 17px;font-size:13px;color:#567d70}.icon-button{padding:9px;background:#f1f6f2;border-radius:50%;flex-shrink:0}.icon-button svg{width:18px;height:18px}dialog{width:min(800px,calc(100vw - 36px));max-height:90dvh;padding:0;border:0;border-radius:18px;box-shadow:0 25px 90px #133b3850;color:var(--ink);background:#fff;overflow:hidden}dialog[open]{display:flex;flex-direction:column}dialog::backdrop{background:#133b3860;backdrop-filter:blur(4px)}.dialog-header{display:flex;align-items:flex-start;justify-content:space-between;padding:26px 30px 19px;flex-shrink:0}.dialog-header h2{font-size:25px;line-height:1.4;margin:7px 0}.dialog-header p{font-size:11px;color:#789388;margin:6px 0 0}.detail-tabs{display:flex;gap:0;padding:0 24px;border-bottom:1px solid var(--line);flex-shrink:0}.detail-tabs button{display:flex;align-items:center;justify-content:center;gap:7px;padding:13px 20px;font-size:13px;color:#91a49a;border-bottom:3px solid transparent}.detail-tabs button[aria-selected=true]{border-bottom-color:var(--aqua);color:#066a63;font-weight:650}.detail-tabs svg{width:17px;height:17px}.detail-content{padding:24px 30px 30px;overflow:auto;min-height:280px;overscroll-behavior:contain}.lyrics-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;font-size:11px;color:#89a193;gap:10px}.font-controls{display:flex;gap:5px}.font-controls button{border:1px solid var(--line);border-radius:6px;padding:3px 10px;font-size:12px;color:#6e8a7b}.lyric-lines{font-size:17px;line-height:1.9}.lyric-lines p{margin:0 0 12px;white-space:pre-wrap}.detail-actions{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 21px}.score-frame{width:100%;height:50dvh;border:1px solid var(--line);border-radius:9px;background:#f1f5f3}.resource-placeholder{display:flex;flex-direction:column;align-items:center;text-align:center;padding:30px 15px}.resource-placeholder .resource-symbol{display:flex;width:65px;height:65px;align-items:center;justify-content:center;background:#e5faf4;border-radius:18px;color:#0a8c82;margin:5px 0 10px}.resource-symbol svg{width:29px;height:29px}.resource-placeholder h3{margin:13px 0 6px;font-size:20px}.resource-placeholder p{font-size:13px;color:#869c91;max-width:400px;margin:0 0 20px}.resource-placeholder .primary-btn{margin-top:5px}audio{width:min(100%,420px);margin:15px 0}.youtube-frame{aspect-ratio:16/9;width:100%;border:0;border-radius:12px;background:#f4f7f4}.dialog-footer{display:flex;align-items:center;justify-content:space-between;padding:14px 30px;border-top:1px solid var(--line);gap:15px;flex-shrink:0}.favorite-button{display:flex;align-items:center;gap:8px;color:#65907b;font-size:12px;white-space:nowrap}.favorite-button.saved{color:#007b71}.favorite-button.saved svg{fill:#d2faf0}.dialog-footer>span{font-size:10px;color:#9aae9f;text-align:right;max-width:55%}.toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);background:#173e38;color:#fff;box-shadow:0 10px 30px #193b3a24;padding:11px 20px;border-radius:9px;font-size:13px;z-index:30;white-space:nowrap}
@media(min-width:1500px){.song-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hero-decoration{right:95px}}
@media(max-width:1150px){:root{--sidebar:205px}.sidebar{padding:28px 16px}.brand{font-size:17px;gap:8px}.brand-icon{width:38px;height:38px}.brand small{font-size:8px}.topbar{padding:0 30px}main{padding:30px}.hero-decoration{right:25px;opacity:.8}.hero h1{font-size:35px}.hero{padding:25px}.resource-filters{gap:1px}.filter{padding:7px 8px}.filter-line{gap:12px}.select-group{margin-left:auto}.song-card{padding:16px 15px 0}.song-title{font-size:16px}}
@media(max-width:760px){.sidebar{display:none}.main-shell{margin:0}.topbar{height:68px;padding:0 20px}.breadcrumb,.header-note{display:none}.mobile-brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:700}.mobile-brand .brand-icon{width:33px;height:33px;border-radius:10px}.mobile-brand .brand-icon svg{width:20px;height:20px}main{padding:20px 18px 85px}.hero{padding:24px 23px 22px;border-radius:15px}.eyebrow{font-size:10px;letter-spacing:.1em}.hero h1{font-size:30px;margin:12px 0 10px}.hero>p{font-size:11px;max-width:220px;line-height:1.9}.hero-decoration{right:-28px;top:7px;transform:scale(.62);transform-origin:right top;opacity:.6}.library-stats{gap:13px;margin-top:20px}.library-stats>span{font-size:9px}.library-stats>span+span{padding-left:13px}.library-stats strong{font-size:17px;margin-right:2px}.search-section{margin:22px 0 20px}.search-box{height:54px;padding:0 13px;gap:9px}.search-box input{font-size:16px}.search-box kbd{display:none}.filter-line{margin-top:13px;gap:12px;display:block}.resource-filters{justify-content:space-between;gap:0}.filter{font-size:11px;padding:8px 7px;gap:4px}.filter svg{width:14px;height:14px}.select-group{margin-top:12px;justify-content:flex-end}.select-group select{font-size:10px;max-width:145px;padding:7px 20px 7px 8px;min-height:32px}.results-heading{margin:20px 0 13px}.results-heading h2{font-size:17px}.results-heading>span{font-size:10px}.song-grid{grid-template-columns:1fr;gap:12px}.song-card{padding:17px 19px 0;border-radius:12px}.song-title{font-size:18px}.song-code{font-size:10px}.song-subtitle{font-size:11px;margin-bottom:9px}.song-preview{font-size:12px;margin-bottom:13px}.song-resources{padding:10px 0}.resource{font-size:12px;min-height:32px;gap:7px}.resource svg{width:16px;height:16px}.mobile-nav{display:flex;position:fixed;inset:auto 0 0;height:calc(64px + env(safe-area-inset-bottom));padding:6px 0 calc(6px + env(safe-area-inset-bottom));background:#fffffff2;backdrop-filter:blur(10px);border-top:1px solid #e0ebe5;z-index:6;box-shadow:0 -5px 30px #174c3705}.mobile-nav button{width:50%;font-size:10px;color:#91a598;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.mobile-nav button.active{color:#007e76;font-weight:650}.mobile-nav button.active svg{fill:#d7faf1;stroke:#008b7e}.mobile-nav svg{width:21px;height:21px}footer{margin-top:30px;flex-wrap:wrap;gap:5px;font-size:9px}footer p{display:none}footer small{font-size:9px}dialog{width:100%;height:100dvh;max-height:100dvh;border-radius:0;margin:0}.dialog-header{padding:24px 21px 17px}.dialog-header h2{font-size:23px}.detail-tabs{padding:0 10px;justify-content:space-around}.detail-tabs button{padding:13px 11px;font-size:12px;gap:5px}.detail-content{padding:23px 22px;flex:1;min-height:0}.lyric-lines{font-size:18px;line-height:1.95}.lyrics-toolbar{margin-bottom:23px;flex-wrap:wrap}.dialog-footer{padding:15px 21px calc(15px + env(safe-area-inset-bottom))}.score-frame{height:60dvh}.toast{bottom:84px}.empty-state{padding:50px 15px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

@media(max-width:760px){.filter{min-height:44px}.resource{min-height:40px}.favorite{padding:10px;margin:-7px}.detail-tabs button{min-height:48px}}