:root{--ink:#19332e;--muted:#65756e;--line:#dce3dc;--paper:#f7f8f4;--gold:#bc9552}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,select{font:inherit}button{cursor:pointer;border:1px solid var(--line);background:#fff;color:inherit;border-radius:10px;min-height:44px;padding:10px 16px;transition:background .15s,border-color .15s}button:hover{background:#edf2eb;border-color:#9aaa9c}button:disabled{opacity:.4;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}[hidden]{display:none!important}header{background:var(--ink);color:white;min-height:94px;padding:20px max(24px,calc((100vw - 1120px)/2));display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{display:flex;align-items:center;gap:14px;color:inherit;text-decoration:none;font:24px/1.25 Georgia,serif}.brand small{display:block;font:12px/1.5 system-ui;letter-spacing:.04em;color:#c9d4cc;margin-top:5px}.brand-mark{color:#e5c78e;background:#ffffff0d;border:1px solid #ffffff22;width:48px;height:48px;display:grid;place-items:center;border-radius:13px;font-size:30px}.collection-label{font-size:13px;color:#d1dcd4;white-space:nowrap}main{max-width:1168px;margin:auto;padding:36px 24px}.welcome{margin-bottom:26px}.eyebrow{font-size:11px;letter-spacing:.15em;font-weight:700;color:#75816f}h1{font:38px/1.2 Georgia,serif;margin:10px 0}p{margin:0;color:var(--muted)}.browse-controls{position:sticky;top:0;z-index:2;background:var(--paper);padding:12px 0 0}.search-wrap{display:flex;align-items:center;background:#fff;border:1px solid #becdc0;border-radius:12px;box-shadow:0 3px 14px #19332e06;padding:0 16px;gap:12px}.search-wrap:focus-within{outline:2px solid #8a9f86;outline-offset:2px}.search-icon{font-size:29px;color:#738873}input{border:0;outline:0!important;background:none;width:100%;min-width:0;padding:17px 0;color:var(--ink);font-size:16px}.search-wrap button{border:0;font-size:13px;padding:6px 10px;min-height:34px}.tabs{display:flex;gap:26px;border-bottom:1px solid var(--line);margin-top:12px}.tabs button{border:0;border-bottom:3px solid transparent;border-radius:0;background:none;padding:16px 2px 13px;color:var(--muted);font-size:14px;font-weight:600;white-space:nowrap}.tabs button.active{border-bottom-color:var(--ink);color:var(--ink)}.tabs span{background:#e8ede5;border-radius:6px;padding:2px 7px;margin-left:5px;font-size:11px}.tabs .active span{background:#d9e6d6}.results{padding-top:28px}.results-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}h2{font:27px Georgia,serif;margin:0 0 6px}.results-heading p{font-size:13px}.letters{display:flex;gap:6px;flex-wrap:wrap}.letters button{font-size:13px;padding:7px 14px;min-height:38px}.letters button.active{background:var(--ink);color:#fff;border-color:var(--ink)}.collection-note{background:#eef2e9;border-radius:8px;padding:10px 14px;color:#5e7057;font-size:12px;margin-bottom:20px}#list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;background:white;border:1px solid var(--line);border-radius:12px;padding:0 18px;overflow:hidden}.song{display:flex;align-items:center;gap:10px;border-bottom:1px solid #e9ede6;min-width:0}.song .open{flex:1;text-align:left;border:0;border-radius:0;background:none;min-height:90px;min-width:0;display:flex;align-items:center;gap:14px;padding:16px 0}.song .open:hover strong{text-decoration:underline;text-underline-offset:3px}.song-icon{display:grid;place-items:center;flex-shrink:0;width:38px;height:44px;background:#f0f4ed;border-radius:7px;color:#74886b;font:25px Georgia}.song-text{flex:1;min-width:0}.song strong{display:block;font-size:15px;font-weight:600;line-height:1.5;overflow-wrap:anywhere}.song small{display:block;margin-top:5px;font-size:12px;color:var(--muted)}.song-arrow{font-size:20px;color:#8e9a8c}.star{border:0;background:none;padding:9px;color:#aa7f34;font-size:25px;flex-shrink:0}.star[aria-pressed=true]{color:#9a6b20}#empty{text-align:center;padding:48px 20px;background:#fff;border:1px dashed var(--line);border-radius:12px}#empty>span{font-size:40px;color:#a8b79e}#empty h3{font-size:20px;margin:12px 0 6px}#empty p{margin-bottom:20px;font-size:14px}footer{padding:26px 0;display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:12px}dialog{border:0;padding:0;inset:0;margin:0;width:100vw;max-width:none;height:100dvh;max-height:none;background:#0f1917;color:white}dialog[open]{display:flex;flex-direction:column}.viewer-header{display:flex;align-items:center;gap:12px;background:#192b27;padding:12px 20px}.viewer-header button,.viewer-controls button{background:#263d35;border-color:#4b6255;color:#fff;white-space:nowrap;font-size:14px}.viewer-header .back{background:none;border-color:transparent}.viewer-title{flex:1;min-width:0}.viewer-title small{display:block;font-size:9px;letter-spacing:.13em;color:#a6b9aa}.viewer-title strong{display:block;font-size:15px;line-height:1.4}.viewer-header #addSet{font-size:12px}#stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:auto;position:relative;touch-action:pan-y pinch-zoom}#slide{display:block;max-width:100%;max-height:100%;object-fit:contain;background:#fff}#slideLoading{position:absolute;top:20px;left:50%;transform:translateX(-50%);background:#192b27d9;padding:8px 16px;border-radius:8px;font-size:13px}.viewer-controls{padding:10px 24px 14px;background:#192b27}.slide-progress{display:flex;align-items:center;gap:9px;margin-bottom:10px;font-size:12px;color:#c6d2c7}#jump{border-radius:6px;padding:5px;background:#263d35;border:1px solid #52695c;color:white;min-height:34px}#caption{margin-right:auto}.keyboard-hint{font-size:11px;color:#a4b4a6;margin-right:14px}.slide-progress #fullscreen{min-height:34px;padding:5px 10px;font-size:12px}.slide-navigation{display:flex;gap:14px;align-items:center;justify-content:space-between}.slide-navigation button{min-width:160px;min-height:50px;font-weight:600}.slide-navigation #next{background:#dfebd5;color:#20372c;border-color:#dfebd5}.swipe-hint{font-size:11px;color:#a4b4a6}#notice{font-size:12px;color:#ecdcae;text-align:center}#notice:not(:empty){padding-top:9px}@media(min-width:900px){.swipe-hint{display:none}}@media(max-width:680px){header{padding:17px 18px;min-height:80px}.brand{font-size:21px}.brand-mark{width:40px;height:44px}.collection-label{display:none}main{padding:26px 16px}h1{font-size:31px}.welcome p{font-size:14px}.tabs{gap:0;justify-content:space-between}.tabs button{font-size:13px}.tabs span{margin-left:3px;padding:2px 5px}.results{padding-top:22px}.results-heading{align-items:center}h2{font-size:25px}#list{grid-template-columns:1fr;padding:0 14px}.song .open{min-height:84px}.song:last-child{border-bottom:0}.song strong{font-size:15px}footer{flex-direction:column;gap:4px}.viewer-header{padding:10px;gap:6px;flex-wrap:wrap}.viewer-header .back{padding:8px}.viewer-header .back span{display:none}.viewer-title{flex-basis:calc(100% - 52px)}.viewer-header #addSet{margin-left:auto;max-width:75%;white-space:normal}.viewer-header #download{font-size:12px}.viewer-header button{min-height:38px;padding:8px 11px}.viewer-controls{padding:10px 12px max(12px,env(safe-area-inset-bottom))}.keyboard-hint{display:none}.slide-navigation button{min-width:0;flex:1}.slide-navigation{gap:10px}.swipe-hint{display:none}}@media(max-height:500px) and (orientation:landscape){.viewer-header{padding:5px 12px;flex-wrap:nowrap}.viewer-title{flex-basis:auto}.viewer-title small{display:none}.viewer-header button{min-height:32px;padding:4px 8px}.viewer-controls{padding:5px 12px}.slide-progress{margin:0;float:left;min-height:38px}.slide-progress #fullscreen{margin-right:10px}.slide-navigation{justify-content:end}.slide-navigation button{min-height:36px;min-width:100px;flex:0;padding:6px 12px}.keyboard-hint{display:none}#notice{clear:both}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
@media(max-width:680px){.results-heading{flex-wrap:wrap;gap:14px}.letters{width:100%;gap:6px}.letters button{min-width:38px;padding:7px 11px}}

.offline-panel{display:flex;align-items:center;flex-wrap:wrap;gap:14px;padding:18px;background:#eef2e9;border:1px solid var(--line);border-radius:12px;margin-bottom:18px}.offline-panel>div{flex:1;min-width:220px}.offline-panel p{font-size:13px;margin-top:4px}.offline-panel button{font-size:13px}.offline-panel progress{width:100%;accent-color:var(--ink);height:12px}#offlineStatus:not(:empty){margin-top:8px;font-weight:600}@media(max-width:680px){.offline-panel>button{width:100%}}

/* Slide-only presentation mode, including browsers without native fullscreen. */
#viewer.presentation-mode{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;border-radius:0;overflow:hidden;background:#000}
#viewer.presentation-mode .viewer-header,#viewer.presentation-mode .viewer-controls{display:none}
#viewer.presentation-mode #stage{width:100%;height:100%;overflow:hidden;background:#000}
#viewer.presentation-mode #slide{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain}
#presentationExit{position:absolute;z-index:10;top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));background:#192b27b3;color:white;border-color:#ffffff55;min-height:40px;font-size:12px}
