:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg:#f6f4ef;--paper:#fffefa;--ink:#202d30;--muted:#627174;--line:#d8e0dd;--accent:#286b65;--accent-ink:#fff;--error:#953a3a}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}*{box-sizing:border-box}html{min-width:320px}body{background:var(--bg);color:var(--ink);margin:0;font-family:Arial,Helvetica,sans-serif;line-height:1.5}a{color:var(--accent)}button,input{font:inherit}button{cursor:pointer}.shell{max-width:1120px;margin:auto;padding:28px clamp(20px,5vw,72px)}.brand{color:var(--ink);letter-spacing:-.03em;align-items:center;gap:10px;font-size:1.2rem;font-weight:750;text-decoration:none;display:inline-flex}.brand-mark{background:var(--accent);color:#fff;border-radius:12px;place-items:center;width:37px;height:37px;font-size:1.45rem;display:inline-grid}.hero{min-height:100svh}.hero-content{max-width:760px;padding:clamp(100px,18vh,210px) 0 80px}.eyebrow{color:var(--accent);text-transform:uppercase;letter-spacing:.12em;margin:0 0 18px;font-size:.8rem;font-weight:750}h1{letter-spacing:-.055em;margin:0 0 24px;font-size:clamp(2.5rem,6vw,5.1rem);line-height:1.07}.lede{max-width:610px;color:var(--muted);font-size:clamp(1.1rem,2vw,1.35rem)}.actions{flex-wrap:wrap;gap:12px;margin-top:32px;display:flex}.button{background:var(--accent);min-height:48px;color:var(--accent-ink);border:1px solid var(--accent);border-radius:12px;justify-content:center;align-items:center;padding:12px 22px;font-weight:700;text-decoration:none;display:inline-flex}.button:hover{filter:brightness(1.08)}.button.secondary{color:var(--accent);background:0 0}.auth-page{min-height:100svh}.card{background:var(--paper);border:1px solid var(--line);border-radius:22px;width:min(100%,440px);margin:clamp(55px,10vh,130px) auto;padding:clamp(24px,5vw,42px);box-shadow:0 12px 35px #142b2310}.card h1,.empty-state h1{font-size:clamp(2rem,4vw,3rem)}label{margin:18px 0 7px;font-weight:650;display:block}input{border:1px solid var(--line);background:var(--bg);width:100%;min-height:48px;color:var(--ink);border-radius:10px;padding:11px 13px}input:focus-visible,.button:focus-visible,.text-button:focus-visible{outline-offset:3px;outline:3px solid #70b1a6}.full{width:100%;margin-top:26px}.form-footer{color:var(--muted);margin:25px 0 0}.notice{color:#0e1721;background:#f2e9dc;border:1px solid #e8b66f;border-radius:10px;padding:12px 14px}.notice.error{color:var(--error);background:#f9e6e4}.app-page header{justify-content:space-between;align-items:center;gap:16px;display:flex}.text-button{color:var(--accent);background:0 0;border:0;padding:12px}.empty-state{max-width:630px;margin:clamp(70px,16vh,170px) auto}.empty-state p:last-child{color:var(--muted);font-size:1.1rem}@media (prefers-color-scheme:dark){:root{--bg:#111b1d;--paper:#1b292b;--ink:#e6eeeb;--muted:#acbcb9;--line:#35474a;--accent:#8dc9b8;--accent-ink:#102322;--error:#ffc1ba}.brand-mark{color:#102322}.notice{color:#f5f2ec;background:#172635;border-color:#e8b66f}.notice.error{color:#ffd6d0;background:#4a2626}}.library-intro{justify-content:space-between;align-items:end;gap:24px;margin:clamp(55px,10vh,105px) 0 36px;display:flex}.library-intro h1{margin-bottom:14px;font-size:clamp(2.4rem,5vw,4rem)}.library-intro p:not(.eyebrow){max-width:650px;color:var(--muted);margin:0;font-size:1.1rem}.song-count{text-align:center;background:var(--paper);border:1px solid var(--line);border-radius:16px;gap:1px;min-width:115px;padding:15px 20px;display:grid}.song-count strong{font-size:2rem;line-height:1.1}.song-count span{color:var(--muted);font-size:.88rem}.library-layout{grid-template-columns:minmax(0,1.65fr) minmax(280px,.85fr);align-items:start;gap:22px;display:grid}.song-list-panel,.add-song-panel,.editor-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:clamp(20px,3vw,30px)}.list-toolbar{justify-content:space-between;align-items:center;gap:18px;margin-bottom:18px;display:flex}.list-toolbar h2,.add-song-panel h2{margin:0;font-size:1.35rem}.search-form{gap:8px;display:flex}.search-form input{width:min(240px,45vw);min-height:42px}.search-form .button{min-height:42px;padding:8px 14px}.song-list{border-top:1px solid var(--line);margin:0;padding:0;list-style:none}.song-list li{border-bottom:1px solid var(--line)}.song-row{min-height:76px;color:var(--ink);align-items:center;gap:14px;padding:12px 4px;text-decoration:none;display:flex}.song-row:hover .song-main strong{color:var(--accent)}.song-symbol,.empty-note{background:color-mix(in srgb,var(--accent) 15%,transparent);width:42px;height:42px;color:var(--accent);border-radius:13px;flex:none;place-items:center;font-size:1.45rem;display:grid}.song-main{flex:1;gap:2px;min-width:0;display:grid}.song-main strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.song-main small,.song-meta{color:var(--muted);font-size:.9rem}.song-meta{white-space:nowrap}.song-arrow{color:var(--muted);font-size:1.2rem}.empty-library{text-align:center;padding:48px 18px 40px}.empty-note{width:52px;height:52px;margin:0 auto 14px;font-size:1.8rem}.empty-library h3{margin:0 0 7px;font-size:1.18rem}.empty-library p,.panel-footnote{color:var(--muted);margin:0;font-size:.95rem}.add-song-panel .eyebrow{margin-bottom:8px}.add-song-panel h2{margin-bottom:16px}.add-song-panel label,.editor-card label{margin:16px 0 6px}.add-song-panel input,.editor-card input,.editor-card textarea,.add-song-panel select{background:var(--bg)}.add-song-panel select,.editor-card select,.editor-card textarea{font:inherit;border:1px solid var(--line);width:100%;color:var(--ink);border-radius:10px;padding:11px 13px}.add-song-panel select,.editor-card select{min-height:48px}.form-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.form-columns>div{min-width:0}.panel-footnote{margin-top:14px;font-size:.84rem}.notice{margin:14px 0}.visually-hidden{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.back-link{margin:32px 0 18px}.back-link a{color:var(--muted);text-decoration:none}.back-link a:hover{color:var(--accent)}.editor-card{max-width:790px;margin:0 auto 70px}.editor-card h1{margin-bottom:22px;font-size:clamp(2rem,4vw,3rem)}.editor-card textarea{resize:vertical;min-height:220px}.editor-actions{justify-content:flex-end;margin-top:20px;display:flex}.delete-form{border-top:1px solid var(--line);justify-content:flex-end;margin-top:22px;padding-top:18px;display:flex}.danger-button{color:#a44949;background:0 0;border:1px solid #a44949;border-radius:10px;padding:10px 16px;font-weight:700}.danger-button:hover{background:#a4494912}@media (max-width:760px){.library-intro{align-items:start}.library-layout{grid-template-columns:1fr}.add-song-panel{order:-1}.list-toolbar{flex-direction:column;align-items:flex-start}.search-form{width:100%}.search-form input{flex:1;width:100%}.song-meta{font-size:.8rem}.form-columns{gap:10px}}@media (max-width:460px){.library-intro{flex-direction:column}.song-count{grid-template-columns:auto auto;align-items:center;gap:8px;padding:10px 15px}.song-count strong{font-size:1.45rem}.song-count span{font-size:.85rem}.song-row{gap:9px}.song-symbol{width:36px;height:36px}.song-meta{text-overflow:ellipsis;max-width:80px;overflow:hidden}.editor-card .form-columns{grid-template-columns:1fr}}.brand-logo img{width:220px;max-width:52vw;height:auto;display:block}@media (max-width:600px){.brand-logo img{width:190px;max-width:65vw}}.marketing-page{color:#172629;background:#f4f1e9;overflow:hidden}.marketing-hero{isolation:isolate;color:#fff;background:#081012;min-height:100svh;position:relative;overflow:hidden}.marketing-hero-video{z-index:-3;object-fit:cover;object-position:center center;width:100%;height:100%;position:absolute;inset:0}.marketing-hero-shade{z-index:-2;background:linear-gradient(90deg,#050c0ee6 0%,#050c0eb8 38%,#050c0e47 67%,#050c0e2e 100%);position:absolute;inset:0}.marketing-hero-shade:after{content:"";background:linear-gradient(#0308097a 0%,#0000 30%,#03080940 100%);position:absolute;inset:0}.marketing-hero-inner{flex-direction:column;width:min(100%,1280px);min-height:100svh;margin:0 auto;padding:24px clamp(20px,5vw,72px);display:flex}.marketing-nav{justify-content:space-between;align-items:center;gap:24px;min-height:72px;display:flex}.marketing-logo{width:clamp(150px,18vw,210px);display:block}.marketing-logo img{width:100%;height:auto;display:block}.marketing-login{color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#050c0e33;border:1px solid #ffffff57;border-radius:11px;padding:11px 16px;font-weight:700;text-decoration:none}.marketing-copy{width:min(700px,100%);margin:auto 0;padding:clamp(70px,12vh,150px) 0 clamp(70px,10vh,120px)}.marketing-eyebrow{color:#b8dfd5;text-transform:uppercase;letter-spacing:.14em;margin:0 0 18px;font-size:.8rem;font-weight:800}.marketing-copy h1{color:#fff;letter-spacing:-.055em;text-wrap:balance;text-shadow:0 2px 24px #00000047;max-width:680px;margin:0 0 24px;font-size:clamp(2.65rem,6.2vw,5.35rem);line-height:1.02}.marketing-promise{color:#fff;margin:0 0 10px;font-size:clamp(1.18rem,2vw,1.48rem);font-weight:800}.marketing-lede{color:#fffc;max-width:620px;margin:0;font-size:clamp(1.04rem,1.6vw,1.22rem);line-height:1.55}.marketing-actions{flex-wrap:wrap;gap:12px;margin-top:32px;display:flex}.marketing-button{border-radius:12px;justify-content:center;align-items:center;min-height:50px;padding:12px 21px;font-weight:750;text-decoration:none;display:inline-flex}.marketing-button.primary{color:#132426;background:#fff;border:1px solid #fff}.marketing-button.secondary{color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#050c0e38;border:1px solid #fff6}.marketing-button:hover,.marketing-login:hover{filter:brightness(1.08)}.marketing-button:focus-visible,.marketing-login:focus-visible{outline-offset:3px;outline:3px solid #b8dfd5}.story-section,.story-cta{width:min(100%,1180px);margin:0 auto;padding:clamp(80px,11vw,150px) clamp(20px,5vw,64px)}.story-heading{max-width:820px}.story-kicker{color:#286b65;letter-spacing:.13em;text-transform:uppercase;margin:0 0 15px;font-size:.78rem;font-weight:800}.story-heading h2,.chaos-question h2,.story-cta h2{color:#172629;letter-spacing:-.05em;text-wrap:balance;margin:0;font-size:clamp(2.35rem,5.2vw,4.5rem);line-height:1.04}.story-heading>p:last-child{color:#536568;max-width:720px;margin:25px 0 0;font-size:clamp(1.05rem,1.6vw,1.22rem)}.flow-steps{border-top:1px solid #bdc9c5;grid-template-columns:repeat(3,1fr);margin:70px 0 0;padding:0;list-style:none;display:grid}.flow-steps li{padding:32px 34px 0 0;position:relative}.flow-steps li+li{border-left:1px solid #bdc9c5;padding-left:34px}.flow-steps span,.feature-section article>span{color:#6e8883;letter-spacing:.1em;margin-bottom:28px;font-size:.75rem;font-weight:800;display:block}.flow-steps strong{letter-spacing:-.03em;font-size:clamp(1.3rem,2.3vw,1.7rem);display:block}.flow-steps p{color:#647477;margin:9px 0 0}.chaos-section{border-top:1px solid #d4d9d4;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(40px,8vw,110px);display:grid}.chaos-copy{color:#526366;font-size:clamp(1.18rem,2vw,1.55rem);line-height:1.55}.chaos-copy p{margin:0}.chaos-copy .chaos-answer{color:#172629;margin-top:28px;font-weight:800}.feature-section{border-top:1px solid #d4d9d4;grid-template-columns:repeat(3,1fr);gap:0;display:grid}.feature-section article{padding:10px clamp(22px,3vw,42px) 10px 0}.feature-section article+article{border-left:1px solid #d4d9d4;padding-left:clamp(22px,3vw,42px)}.feature-section h3{letter-spacing:-.04em;margin:0;font-size:clamp(1.45rem,2.5vw,2rem);line-height:1.12}.feature-section p{color:#607174;margin:18px 0 0;font-size:1.02rem}.story-cta{text-align:center;padding-top:clamp(90px,12vw,160px);padding-bottom:clamp(100px,14vw,180px)}.story-cta h2{max-width:800px;margin:0 auto 35px}.story-cta .marketing-button.primary{color:#fff;background:#286b65;border-color:#286b65}@media (max-width:700px){.marketing-hero-video{object-position:62% center}.marketing-hero-shade{background:linear-gradient(#040a0c9e 0%,#040a0c66 34%,#040a0cd6 68%,#040a0cf2 100%)}.marketing-hero-inner{padding:18px 20px 22px}.marketing-nav{min-height:58px}.marketing-logo{width:158px}.marketing-login{padding:9px 12px;font-size:.92rem}.marketing-copy{margin-top:auto;padding:72px 0 30px}.marketing-copy h1{max-width:12ch;font-size:clamp(2.5rem,12vw,4rem)}.marketing-promise{font-size:1.15rem}.marketing-lede{font-size:1rem}.marketing-actions{grid-template-columns:1fr;margin-top:25px;display:grid}.marketing-button{width:100%}.story-section,.story-cta{padding:75px 20px}.flow-steps{border-top:0;grid-template-columns:1fr;margin-top:48px}.flow-steps li,.flow-steps li+li{border-top:1px solid #bdc9c5;border-left:0;padding:25px 0}.flow-steps span{margin-bottom:15px}.chaos-section{grid-template-columns:1fr;gap:35px}.feature-section{grid-template-columns:1fr}.feature-section article,.feature-section article+article{border-top:1px solid #d4d9d4;border-left:0;padding:32px 0}.feature-section article:first-child{border-top:0}.feature-section article>span{margin-bottom:16px}}@media (prefers-color-scheme:dark){.marketing-page{color:#e6eeeb;background:#111b1d}.story-heading h2,.chaos-question h2,.story-cta h2,.chaos-copy .chaos-answer{color:#e6eeeb}.story-kicker{color:#8dc9b8}.story-heading>p:last-child,.flow-steps p,.chaos-copy,.feature-section p{color:#acbcb9}.flow-steps,.flow-steps li+li,.chaos-section,.feature-section,.feature-section article+article{border-color:#35474a}.story-cta .marketing-button.primary{color:#102322;background:#8dc9b8;border-color:#8dc9b8}}@media (prefers-reduced-motion:reduce){.marketing-hero-video{display:none}.marketing-hero{background:radial-gradient(circle at 80% 25%,#24413e 0%,#0c191b 42%,#071012 100%)}}
:root{--bg:#faf7f1;--paper:#fff;--ink:#0e1721;--muted:#59636d;--line:#e2d8ca;--accent:#e8b66f;--accent-ink:#0e1721}input:focus-visible,.button:focus-visible,.text-button:focus-visible{outline-color:#e8b66f}@media (prefers-color-scheme:dark){:root{--bg:#0e1721;--paper:#0d1b29;--ink:#f5f2ec;--muted:#a9adb3;--line:#263746;--accent:#e8b66f;--accent-ink:#0e1721}.brand-mark{color:#0e1721}}
