:root{color-scheme:light;--paper: #fdfbf7;--paper-edge: #f5f0e7;--surface: #ffffff;--ink: #211c16;--ink-2: #6b6256;--accent: #b45309;--accent-2: #92400e;--accent-tint: #fbf1e4;--border: #e7dfd3;--danger: #b42318;--danger-tint: #fbeae7;--ring: #b45309;--radius: 12px;--radius-sm: 9px;--shadow: 0 1px 2px rgba(33, 28, 22, .04), 0 1px 3px rgba(33, 28, 22, .06);--shadow-accent: 0 1px 2px rgba(146, 64, 14, .22), inset 0 1px 0 rgba(255, 255, 255, .18);--shadow-accent-hover: 0 3px 9px rgba(146, 64, 14, .28), inset 0 1px 0 rgba(255, 255, 255, .14);--t: .15s ease;--font-serif: Georgia, "Iowan Old Style", Cambria, "Times New Roman", serif;--font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;font-family:var(--font-sans);line-height:1.5;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0;background:var(--paper)}#root{max-width:720px;margin:0 auto;padding:1.5rem 1.25rem 4rem}@supports (padding: max(0px)){#root{padding-left:max(1.25rem,env(safe-area-inset-left));padding-right:max(1.25rem,env(safe-area-inset-right));padding-bottom:max(4rem,env(safe-area-inset-bottom))}}::selection{background:var(--accent-tint);color:var(--ink)}h1,h2{font-family:var(--font-serif);font-weight:600;letter-spacing:-.01em;line-height:1.15;color:var(--ink)}h1{font-size:1.9rem;margin:0}h2{font-size:1.3rem}:focus-visible{outline:2px solid var(--ring);outline-offset:2px;border-radius:4px}button,.touch-target{min-height:44px;min-width:44px}button,.button-link,.touch-target,.song-list a,.song-view-nav a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{display:inline-flex;align-items:center;justify-content:center;padding:0 1.25rem;font-family:var(--font-sans);font-size:1rem;font-weight:600;color:#fff;background:var(--accent);border:1px solid var(--accent-2);border-radius:var(--radius-sm);box-shadow:var(--shadow-accent);cursor:pointer;transition:background var(--t),border-color var(--t),color var(--t),box-shadow var(--t),transform 90ms ease}@media (hover: hover){button:hover:not(:disabled){background:var(--accent-2);border-color:var(--accent-2);box-shadow:var(--shadow-accent-hover);transform:translateY(-1px)}}button:active:not(:disabled){background:var(--accent-2);border-color:var(--accent-2);transform:scale(.97);box-shadow:0 1px 1px #92400e33,inset 0 1px #ffffff1f}button:disabled{opacity:.5;cursor:not-allowed}.button-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 1.25rem;font-family:var(--font-sans);font-weight:600;text-decoration:none;color:var(--accent);background:var(--surface);border:1px solid var(--accent);border-radius:var(--radius-sm);box-shadow:0 1px 2px #211c160d;cursor:pointer;transition:background var(--t),color var(--t),border-color var(--t),box-shadow var(--t),transform 90ms ease}@media (hover: hover){.button-link:hover{background:var(--accent-tint);color:var(--accent-2);border-color:var(--accent-2);box-shadow:0 3px 8px #92400e26;transform:translateY(-1px)}}.button-link:active{background:var(--accent-tint);color:var(--accent-2);border-color:var(--accent-2);transform:scale(.97);box-shadow:0 1px 2px #211c160d}.button-link--primary{color:#fff;background:var(--accent);border-color:var(--accent-2);box-shadow:var(--shadow-accent)}@media (hover: hover){.button-link--primary:hover{color:#fff;background:var(--accent-2);border-color:var(--accent-2);box-shadow:var(--shadow-accent-hover)}}.button-link--primary:active{color:#fff;background:var(--accent-2);box-shadow:0 1px 1px #92400e33,inset 0 1px #ffffff1f}input,textarea{font-family:var(--font-sans);color:var(--ink);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm)}input:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint)}.error{color:var(--danger)}.loading,.empty-state{color:var(--ink-2);font-family:var(--font-serif);font-style:italic}.app-loading{text-align:center;margin-top:4rem;font-size:1.1rem}.login{max-width:23rem;margin:3.5rem auto 0}.login h1{font-size:2.1rem;margin-bottom:.35rem}.login-sub{margin:0 0 1.75rem;color:var(--ink-2);font-family:var(--font-serif);font-style:italic}.login form{display:flex;flex-direction:column;gap:.85rem}.login label{font-weight:600;font-size:.9rem}.login input{font-size:1rem;padding:.65rem .8rem;min-height:44px}.library-header,.song-view-nav,.song-view-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.library-header{padding-bottom:1rem;margin-bottom:.75rem;border-bottom:1px solid var(--border)}.song-view-nav a:not(.button-link){color:var(--accent);text-decoration:none;font-weight:600;transition:color var(--t)}.song-view-nav a:not(.button-link):hover{color:var(--accent-2)}.song-view-nav{margin-bottom:1.25rem}.song-list{list-style:none;padding:0;margin:0}.song-list li{border-bottom:1px solid var(--border)}.song-list li:last-child{border-bottom:0}.song-list a{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem .25rem;font-family:var(--font-serif);font-size:1.15rem;color:var(--ink);text-decoration:none;transition:color var(--t),padding-left var(--t)}.song-list-text{display:flex;flex-direction:column;gap:.1rem;min-width:0}.song-list-title{overflow-wrap:anywhere}.song-list-artist{font-family:var(--font-sans);font-size:.82rem;color:var(--ink-2);overflow-wrap:anywhere}.song-list a:after{content:"›";color:var(--accent);font-family:var(--font-sans);font-size:1.2rem;line-height:1;transition:transform var(--t)}.song-list a:hover{color:var(--accent-2);padding-left:.4rem}.song-list a:hover:after{transform:translate(3px)}.song-view-header{margin-bottom:1rem}.song-view-header h1{font-size:1.7rem}.song-view-title{min-width:0}.song-view-artist{margin:.15rem 0 0;font-family:var(--font-sans);font-size:.95rem;color:var(--ink-2)}.font-controls{display:inline-flex;align-items:stretch;gap:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:0 1px 2px #211c160d}.font-controls button{min-width:44px;padding:0 .7rem;color:var(--ink-2);background:transparent;border:0;border-radius:0;box-shadow:none;font-size:1.1rem;font-weight:700}.font-controls button:first-child{border-right:1px solid var(--border);border-top-left-radius:calc(var(--radius-sm) - 1px);border-bottom-left-radius:calc(var(--radius-sm) - 1px)}.font-controls button:last-child{border-left:1px solid var(--border);border-top-right-radius:calc(var(--radius-sm) - 1px);border-bottom-right-radius:calc(var(--radius-sm) - 1px)}@media (hover: hover){.font-controls button:hover:not(:disabled){color:var(--accent-2);background:var(--accent-tint);box-shadow:none;transform:none}}.font-controls button:active:not(:disabled){color:#fff;background:var(--accent);box-shadow:none;transform:none}.font-controls-size{display:inline-flex;align-items:center;justify-content:center;min-width:4.5ch;padding:0 .4rem;color:var(--ink);background:var(--paper-edge);font-size:.85rem;font-weight:600;font-variant-numeric:tabular-nums}.chord-sheet{line-height:1.15;overflow-wrap:anywhere}.cs-line{margin:0 0 .4em}.cs-blank{height:1.2em}.cs-word{display:inline-block;vertical-align:top;margin-right:.4em;max-width:100%;overflow-wrap:anywhere}.cs-seg{display:inline-block;vertical-align:top}.cs-chord{display:block;font-family:var(--font-sans);font-size:.8em;font-weight:700;letter-spacing:.01em;color:var(--accent);white-space:pre}.cs-text{display:block;font-family:var(--font-serif);color:var(--ink);white-space:pre-wrap;overflow-wrap:anywhere}@media (min-width: 768px){.song-view{display:flex;flex-direction:column;height:calc(100vh - 5.5rem);height:calc(100dvh - 1.5rem - max(4rem,env(safe-area-inset-bottom)))}.chord-sheet{display:flex;align-items:stretch;flex:1 1 auto;min-height:0}.cs-column{flex:1 1 0;min-width:0;overflow-y:auto;padding:0 1.5rem;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--border) transparent;--cs-fade: 1.5rem;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--cs-fade),#000 calc(100% - var(--cs-fade)),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 var(--cs-fade),#000 calc(100% - var(--cs-fade)),transparent 100%)}.cs-column::-webkit-scrollbar{width:8px}.cs-column::-webkit-scrollbar-track{background:transparent}.cs-column::-webkit-scrollbar-thumb{background:var(--border);border-radius:999px;border:2px solid transparent;background-clip:padding-box}.cs-column::-webkit-scrollbar-thumb:hover{background:var(--ink-2);background-clip:padding-box}.cs-column:first-child{padding-left:0}.cs-column:last-child{padding-right:0}.cs-column+.cs-column{border-left:1px solid var(--border)}}.song-edit h1{margin-bottom:1rem}.song-edit-form{display:flex;flex-direction:column;gap:.4rem}.song-edit-form label{font-weight:600;font-size:.9rem;margin-top:.5rem}.song-edit-form label code{font-family:var(--font-mono);font-size:.85em;padding:.1em .35em;background:var(--accent-tint);color:var(--accent-2);border-radius:4px}.song-edit-form input,.song-edit-form textarea{font-size:1rem;padding:.6rem .75rem;width:100%}.song-edit-form textarea{font-family:var(--font-mono);line-height:1.5;resize:vertical}.song-edit-actions{display:flex;gap:.75rem;margin-top:1rem}.delete-button{margin-left:auto;color:var(--danger);background:transparent;border-color:var(--border);box-shadow:none}@media (hover: hover){.delete-button:hover:not(:disabled){color:var(--danger);background:var(--danger-tint);border-color:var(--danger);box-shadow:none;transform:none}}.delete-button:active:not(:disabled){color:var(--danger);background:var(--danger-tint);border-color:var(--danger);transform:scale(.97);box-shadow:none}.song-edit-preview{margin-top:2rem;border-top:1px solid var(--border);padding-top:1.25rem}.song-edit-preview h2{font-family:var(--font-sans);font-size:.8rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);margin:0 0 .75rem}.lc-section{margin-top:2rem;border-top:1px solid var(--border);padding-top:1.25rem}.lc-section-title{font-family:var(--font-sans);font-size:.8rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);margin:0 0 .85rem}.lc-tabs{display:inline-flex;padding:3px;gap:3px;background:var(--paper-edge);border:1px solid var(--border);border-radius:var(--radius-sm)}.lc-tab{min-width:5.5rem;min-height:38px;padding:0 1rem;color:var(--ink-2);background:transparent;border:1px solid transparent;border-radius:7px;box-shadow:none}@media (hover: hover){.lc-tab:hover:not(:disabled){color:var(--ink);background:var(--surface);border-color:transparent;box-shadow:none;transform:none}}.lc-tab:active:not(:disabled){background:var(--surface);border-color:transparent;box-shadow:none;transform:scale(.98)}.lc-tab--active,.lc-tab--active:active:not(:disabled){color:#fff;background:var(--accent);border-color:var(--accent-2);box-shadow:var(--shadow-accent)}.lc-panel{margin-top:1rem}.lc-hint{display:block;margin:0 0 .6rem;color:var(--ink-2);font-size:.88rem;line-height:1.45}.lc-lyrics-input{width:100%;font-family:var(--font-serif);font-size:1rem;line-height:1.6;padding:.6rem .75rem;resize:vertical}.lc-sheet{font-family:var(--font-serif);font-size:1.05rem;line-height:1.3}.lc-line{display:flex;flex-wrap:wrap;align-items:flex-end;margin-bottom:.5rem}.lc-line--blank{height:1rem;margin-bottom:.5rem}.lc-line--plain{display:block;font-family:var(--font-mono);font-size:.9rem;color:var(--ink-2);white-space:pre-wrap;overflow-wrap:anywhere}.lc-word{color:var(--ink);padding-bottom:2px}.lc-gap{min-width:1.7rem;min-height:44px;padding:0;align-self:stretch;color:var(--ink-2);background:transparent;border:1px dashed transparent;border-radius:6px;box-shadow:none}.lc-gap-add{font-family:var(--font-sans);font-size:.95rem;font-weight:700;line-height:1;color:var(--ink-2);opacity:.35}@media (hover: hover){.lc-gap:hover:not(:disabled){background:var(--accent-tint);border-color:transparent;box-shadow:none;transform:none}.lc-gap:hover .lc-gap-add{opacity:1;color:var(--accent)}}.lc-gap:active:not(:disabled){background:var(--accent-tint);border-color:transparent;box-shadow:none;transform:scale(.94)}.lc-gap--set{min-width:0;padding:0 .3rem;margin:0 .1rem}.lc-gap-chord{font-family:var(--font-sans);font-size:.78rem;font-weight:700;letter-spacing:.01em;color:var(--accent)}.lc-gap--active{border-color:var(--accent);background:var(--accent-tint)}.lc-picker{margin:.25rem 0 .85rem;padding:.85rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow)}.lc-picker-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.6rem}.lc-picker-title{font-family:var(--font-sans);font-size:.9rem;font-weight:600;color:var(--ink)}.lc-picker-close,.lc-remove{min-width:0;min-height:36px;padding:0 .6rem;font-size:.85rem;color:var(--accent);background:transparent;border:1px solid transparent;box-shadow:none}.lc-remove{color:var(--danger)}@media (hover: hover){.lc-picker-close:hover:not(:disabled){background:var(--accent-tint);box-shadow:none;transform:none}.lc-remove:hover:not(:disabled){background:var(--danger-tint);box-shadow:none;transform:none}}.lc-picker-close:active:not(:disabled),.lc-remove:active:not(:disabled){transform:scale(.96);box-shadow:none}.lc-picker-current{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.6rem;font-size:.9rem;color:var(--ink-2)}.lc-picker-current strong{color:var(--accent)}.lc-palette{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.7rem}.lc-chip{min-width:0;min-height:40px;padding:0 .7rem;font-size:.9rem;color:var(--accent);background:var(--surface);border:1px solid var(--accent);border-radius:999px;box-shadow:none}@media (hover: hover){.lc-chip:hover:not(:disabled){background:var(--accent-tint);color:var(--accent-2);border-color:var(--accent-2);box-shadow:none;transform:none}}.lc-chip:active:not(:disabled){background:var(--accent-tint);box-shadow:none;transform:scale(.96)}.lc-chip--on{color:#fff;background:var(--accent);border-color:var(--accent-2)}.lc-custom{display:flex;gap:.5rem}.lc-custom-input{flex:1 1 auto;min-width:0;font-size:1rem;padding:.5rem .7rem;min-height:44px}.lc-add{flex:0 0 auto}@media (prefers-reduced-motion: reduce){*{transition:none!important}.song-list a:hover{padding-left:.25rem}.song-list a:hover:after{transform:none}}