:root{--paper:#f3eee3;--ink:#1d1a16;--soft:#7c766b}*{box-sizing:border-box;margin:0;padding:0}html,body{background:#0d0a08;height:100%;overflow:hidden}body{color:#efe6d4;-webkit-font-smoothing:antialiased;font-family:EB Garamond,serif}canvas{touch-action:none;-webkit-tap-highlight-color:transparent;display:block}html,body{overscroll-behavior:none;-webkit-user-select:none;user-select:none}.sans{letter-spacing:.01em;font-family:Switzer,system-ui,sans-serif;font-size:13px}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0}.hud{z-index:20;pointer-events:none;position:fixed}.hud *{pointer-events:auto}.id{bottom:26px;left:28px}.id h1{font-size:26px;font-weight:400;line-height:1.05}.id p{color:#efe6d499;margin-top:6px}.hud.back{pointer-events:none;margin:-8px -10px;padding:8px 10px}.hud.back.on{pointer-events:auto}.back{z-index:26;color:#efe6d4cc;opacity:0;transition:opacity .4s, transform var(--spring-ms) var(--spring);top:24px;left:28px;transform:translateY(-6px)}.back.on{opacity:1;transform:none}.back:hover{color:#fff}.paper{color:#2a2219;background-color:#ebdfc3;background-image:radial-gradient(120% 140% at 30% 20%,#fff8e48c,#966e372e 70%,#6e4b1e52),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .24 0 0 0 0 .1 0 0 0 .22 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");box-shadow:inset 0 1px #fff6,0 10px 24px -10px #000000a6}.tip{z-index:30;pointer-events:none;white-space:nowrap;opacity:0;transform:var(--at,translate3d(-999px, 0, 0)) translate(-50%, -100%) translateY(4px) scale(.94);transition:opacity .18s, transform .3s var(--spring);border:1px solid #5a3e1e80;padding:5px 11px;position:fixed;top:0;left:0}.tip.on{opacity:1;transform:var(--at) translate(-50%, -100%) translateY(-6px)}.tip .t{letter-spacing:.09em;font-size:17px;font-variant-caps:all-small-caps;line-height:1.1}.pagebar,.chords{z-index:25;opacity:0;pointer-events:none;transition:opacity .3s, transform var(--spring-ms) var(--spring);border:1px solid #5a3e1e80;align-items:center;gap:4px;padding:6px 8px;display:flex;position:fixed;bottom:22px;left:50%;transform:translate(-50%,16px)rotate(.6deg)}.pagebar.on,.chords.on{opacity:1;pointer-events:auto;transform:translate(-50%)rotate(0)}.pagebar button,.chords button{border-radius:2px;padding:5px 12px;font-size:18px;transition:background .2s}.pagebar button:hover:not(:disabled),.chords button:hover{background:#5a3e1e1f}.pagebar button:disabled{opacity:.3;cursor:default}.pagebar .folio{text-align:center;color:#5d4c37;min-width:130px;font-size:16px;font-style:italic}.pagebar .sep{background:#5a3e1e4d;align-self:stretch;width:1px;margin:2px 6px}.pagebar .links a{color:#8a3324;letter-spacing:.08em;margin:0 8px;font-size:17px;font-variant-caps:all-small-caps}.pagebar .links:empty+.sep{display:none}.pagebar .links .copy{color:#5d4c37;border-radius:2px;margin:0 6px 0 -4px;font-style:italic;padding:3px 8px!important;font-size:15px!important}.pagebar .links .copy:hover{background:#5a3e1e1f}.pagebar .links{-webkit-user-select:text;user-select:text}.pagebar .put{letter-spacing:.08em;font-variant-caps:all-small-caps;font-size:17px!important}.chords button[data-chord]{min-width:46px;font-size:19px}.chords button.sel{color:#ebdfc3;background:#2a2219}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (max-width:760px){.pagebar,.chords{bottom:calc(14px + env(safe-area-inset-bottom));flex-wrap:wrap;justify-content:center;max-width:calc(100vw - 24px)}.pagebar .folio{min-width:96px}.pagebar .sep,.chords .sep{display:none}.pagebar .links:not(:empty){text-align:center;order:5;width:100%;padding-top:2px}.pagebar button,.chords button{padding:8px 12px}.id{left:18px;bottom:calc(18px + env(safe-area-inset-bottom))}.id h1{font-size:21px}.back{left:16px;top:calc(16px + env(safe-area-inset-top));padding:6px 4px;font-size:14px}.volume{right:10px;top:calc(8px + env(safe-area-inset-top))}.subtitle{bottom:calc(88px + env(safe-area-inset-bottom));max-width:86vw;font-size:15px}body.bar-up .id{opacity:0;transition:opacity .3s}}@media (hover:none){.tip{display:none}}.chords .sep{background:#5a3e1e4d;align-self:stretch;width:1px;margin:2px 6px}.chords .strum{font-size:16px;font-style:italic}.subtitle{z-index:24;text-align:center;pointer-events:none;letter-spacing:.01em;color:#f2d45c;text-shadow:0 0 1px #000000e6,0 1px 2px #000000d9,0 2px 10px #0000008c;opacity:0;filter:blur(2px);width:max-content;max-width:min(80vw,760px);margin:0;font-family:Switzer,system-ui,sans-serif;font-size:clamp(15px,1.45vw,21px);font-style:italic;font-weight:500;line-height:1.35;transition:opacity .6s,filter .6s,transform .6s;position:fixed;bottom:max(96px,10vh);left:50%;transform:translate(-50%,4px)}.subtitle.on{opacity:1;filter:blur();transform:translate(-50%)}.volume{z-index:27;color:#efe6d4b8;border-radius:999px;flex-direction:row-reverse;align-items:center;padding:4px;transition:background .35s,color .25s;display:flex;position:fixed;top:14px;right:20px}.volume .sound{width:34px;height:34px;color:inherit;transition:transform var(--spring-ms) var(--spring);border-radius:50%;place-items:center;display:grid}.volume .sound:active{transform:scale(.86)}.volume svg{overflow:visible}.volume .wave{transform-origin:12px 12px;transition:opacity .3s ease, transform .45s var(--spring)}.volume .cross{opacity:0;transform-origin:18.5px 12px;transition:opacity .25s, transform .4s var(--spring);transform:scale(.4)}.volume[data-level="1"] .w2,.volume[data-level="0"] .wave,.volume.muted .wave{opacity:0;transform:scale(.6)}.volume.muted .cross{opacity:1;transform:none}.volume:hover .wave,.volume.open .wave{animation:1.6s ease-in-out infinite wave}.volume:hover .w2,.volume.open .w2{animation-delay:.18s}.volume.muted .wave{animation:none}@keyframes wave{50%{transform:translate(1.5px)scale(1.06)}}.volume .track{opacity:0;width:0;transition:width .5s var(--spring), opacity .3s ease, margin .5s var(--spring);align-items:center;display:flex;overflow:hidden}.volume:hover,.volume.open,.volume:focus-within{color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#140e0a8c}.volume:hover .track,.volume.open .track,.volume:focus-within .track{opacity:1;width:104px;margin:0 6px 0 12px}.volume input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:22px}.volume input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg, #f2d45c var(--v,70%), #efe6d440 var(--v,70%));border-radius:3px;height:3px}.volume input[type=range]::-moz-range-track{background:#efe6d440;border-radius:3px;height:3px}.volume input[type=range]::-moz-range-progress{background:#f2d45c;border-radius:3px;height:3px}.volume input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;transition:transform .3s var(--spring);background:#f4ead6;border-radius:50%;margin-top:-4.5px;box-shadow:0 1px 4px #00000080}.volume input[type=range]:active::-webkit-slider-thumb{transform:scale(1.35)}.volume input[type=range]::-moz-range-thumb{background:#f4ead6;border:0;border-radius:50%;width:12px;height:12px}.mini{z-index:24;color:#f5f5f7;-webkit-backdrop-filter:blur(22px)saturate(170%);backdrop-filter:blur(22px)saturate(170%);opacity:0;width:380px;transition:transform var(--spring-ms) var(--spring), opacity .3s;touch-action:none;-webkit-user-select:none;user-select:none;background:#2824209e;border:.5px solid #ffffff24;border-radius:16px;grid-template-rows:auto auto;grid-template-columns:auto 1fr auto auto auto auto;align-items:center;column-gap:8px;padding:8px 10px 6px;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Switzer,system-ui,sans-serif;display:grid;position:fixed;bottom:20px;right:20px;transform:translateY(130%)scale(.96);box-shadow:0 14px 40px -12px #000000a6,inset 0 .5px #ffffff1f}.mini.on{opacity:1;transform:none}.mini-art{border-radius:7px;width:44px;height:44px;box-shadow:0 2px 8px #00000059}.mini-meta{min-width:0}.mini-title{letter-spacing:-.01em;white-space:nowrap;text-overflow:ellipsis;font-size:14.5px;font-weight:590;display:block;overflow:hidden}.mini-btn{color:#f5f5f7;border-radius:50%;place-items:center;width:34px;height:34px;transition:background .2s,transform .15s;display:grid}.mini-btn:hover{background:#ffffff1a}.mini-btn:active{transform:scale(.9)}.mini-btn svg{fill:currentColor;width:22px;height:16px}.mini-play svg{width:20px;height:20px}.mini-play .i-play,.mini.paused .mini-play .i-pause{display:none}.mini.paused .mini-play .i-play{display:block}.mini-close{opacity:0;width:0;height:22px;transition:width .3s var(--spring), opacity .25s;overflow:hidden}.mini-close svg{width:22px;height:22px}.mini-close circle{fill:#ffffff29}.mini-close path{stroke:#f5f5f7d9;stroke-width:1.6px;stroke-linecap:round;fill:none}.mini.paused .mini-close{opacity:1;width:22px}.mini-row{grid-column:1/-1;align-items:center;gap:8px;margin-top:6px;display:flex}.mini-time{font-variant-numeric:tabular-nums;color:#f5f5f78c;min-width:30px;font-size:11px}.mini-time:last-of-type{text-align:right}.mini input[type=range]{appearance:none;cursor:pointer;background:0 0;height:16px;margin:0}.mini input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, #f5f5f7d1 var(--p,0%), #ffffff29 var(--p,0%));border-radius:3px;height:3px}.mini input[type=range]::-moz-range-track{background:#ffffff29;border-radius:3px;height:3px}.mini input[type=range]::-moz-range-progress{background:#f5f5f7d1;border-radius:3px;height:3px}.mini input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:#f5f5f7;border-radius:50%;width:11px;height:11px;margin-top:-4px;transition:transform .15s;transform:scale(0);box-shadow:0 1px 3px #0006}.mini input[type=range]::-moz-range-thumb{background:#f5f5f7;border:0;border-radius:50%;width:11px;height:11px}.mini input[type=range]:hover::-webkit-slider-thumb{transform:scale(1)}.mini input[type=range]:active::-webkit-slider-thumb{transform:scale(1)}.mini input[type=range]:focus-visible::-webkit-slider-thumb{transform:scale(1)}.mini-seek{flex:1;min-width:0}.mini-vol{color:#f5f5f7bf;flex:none;place-items:center;width:22px;height:22px;display:grid}.mini-vol svg{fill:none;stroke:currentColor;stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.mini-vol svg path:first-child{fill:currentColor}.mini.quiet .mini-vol .w2,.mini.silent .mini-vol .w1,.mini.silent .mini-vol .w2{opacity:0}.mini-volume{flex:none;width:64px}#miniprev{display:grid}@media (max-width:760px){.mini{width:auto;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom))}body.mini-up .id{opacity:0;transition:opacity .3s}#miniprev{display:none}.mini-volume{width:52px}.mini input[type=range]::-webkit-slider-thumb{transform:scale(1)}}@media (prefers-reduced-motion:reduce){.mini{transition:opacity .2s}}.recordcap{z-index:24;text-align:center;letter-spacing:.01em;color:#f2d45c;text-shadow:0 0 1px #000000e6,0 1px 2px #000000d9,0 2px 10px #0000008c;opacity:0;pointer-events:none;transition:opacity .35s, transform .5s var(--spring);flex-direction:column;align-items:center;gap:6px;font-family:Switzer,system-ui,sans-serif;font-style:italic;font-weight:500;display:flex;position:fixed;bottom:max(70px,8vh);left:50%;transform:translate(-50%,6px)}.recordcap.on{opacity:1;transform:translate(-50%)}.recordcap .rline{max-width:min(84vw,760px);margin:0;font-size:clamp(15px,1.45vw,21px);line-height:1.35}.recordcap .rby{opacity:.78}.recordcap .rby:before{content:" — "}.recordcap .rlisten{pointer-events:auto;color:#f2d45c;text-underline-offset:3px;opacity:.85;font-size:clamp(13px,1.1vw,16px);text-decoration:underline;text-decoration-thickness:1px;transition:opacity .2s}.recordcap .rlisten:hover{opacity:1}@media (max-width:760px){.recordcap{bottom:calc(26px + env(safe-area-inset-bottom))}}body.records-up .subtitle{bottom:calc(max(70px,8vh) + 66px)}@media (max-width:760px){.pagebar{flex-wrap:nowrap}.pagebar:has(.links:not(:empty)){flex-wrap:wrap}.pagebar button{padding:8px 9px}.mini{transition:transform var(--spring-ms) var(--spring), opacity .3s, bottom .45s var(--spring)}.mini.compact .mini-row{display:none}.pagebar button{white-space:nowrap}.pagebar .folio{min-width:72px}}