*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-bg: #0a0a0a;--color-surface: #141414;--color-border: #2a2a2a;--color-text: #f5f5f5;--color-text-secondary: #888;--color-accent: #6c5ce7;--color-accent-light: #a29bfe}html{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:var(--color-text);background:radial-gradient(ellipse at 50% 0%,rgba(108,92,231,.08) 0%,transparent 60%),var(--color-bg);scroll-behavior:smooth;-webkit-font-smoothing:antialiased}body{min-height:100dvh}a{color:var(--color-accent-light)}.hero{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100dvh;padding:2rem;text-align:center}.app-store-badge{display:inline-block;margin-bottom:2rem;transition:opacity .2s,transform .15s}.app-store-badge:hover{opacity:.8;transform:translateY(-1px)}.app-store-badge img{height:48px;width:auto}.hero h1{font-size:clamp(3rem,8vw,5.5rem);font-weight:700;letter-spacing:-.03em;line-height:1.05;margin-bottom:1.5rem}.hero h1 .accent{color:var(--color-accent-light)}.hero-subtitle{max-width:520px;font-size:1.2rem;line-height:1.6;color:var(--color-text-secondary);margin-bottom:2.5rem}.hero-cta{display:inline-flex;align-items:center;gap:.5rem;padding:.9rem 2rem;border-radius:12px;border:none;background:var(--color-accent);color:#fff;font-size:1.05rem;font-weight:600;cursor:pointer;text-decoration:none;transition:background .2s,transform .15s}.hero-cta:hover{background:var(--color-accent-light);transform:translateY(-1px)}.hero-cta svg{width:20px;height:20px}.features{padding:5rem 2rem;max-width:960px;margin:0 auto}.features h2{text-align:center;font-size:2rem;font-weight:700;margin-bottom:3rem}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem}.feature-card{padding:1.75rem;border-radius:16px;border:1px solid var(--color-border);background:var(--color-surface)}.feature-icon{font-size:2rem;margin-bottom:1rem}.feature-card h3{font-size:1.15rem;font-weight:600;margin-bottom:.5rem}.feature-card p{color:var(--color-text-secondary);line-height:1.5;font-size:.95rem}.see-it-in-action{padding:4rem 2rem;text-align:center}.see-it-in-action h2{font-size:2rem;font-weight:700;margin-bottom:1rem}.see-it-in-action p{color:var(--color-text-secondary);margin-bottom:2rem}.chord-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem;max-width:480px;margin:0 auto}.chord-cell{aspect-ratio:1.6;display:flex;align-items:center;justify-content:center;border-radius:12px;border:1px solid var(--color-border);background:var(--color-surface);font-size:1.25rem;font-weight:600;transition:border-color .2s,background .2s}.chord-cell.active{border-color:var(--color-accent);background:#6c5ce726;color:var(--color-accent-light)}.donations{padding:5rem 2rem;max-width:960px;margin:0 auto}.donation-card{position:relative;padding:3rem 2.5rem;border-radius:20px;border:1px solid rgba(108,92,231,.3);background:linear-gradient(135deg,#6c5ce71a,#a29bfe0d);text-align:center;overflow:hidden}.donation-card:before{content:"";position:absolute;inset:0;border-radius:20px;background:radial-gradient(ellipse at 50% 0%,rgba(108,92,231,.15) 0%,transparent 60%);pointer-events:none}.donation-icon{display:inline-block;font-size:2.5rem;color:var(--color-accent-light);margin-bottom:1rem}.donation-card h2{font-size:2rem;font-weight:700;margin-bottom:1.25rem}.donation-card p{color:var(--color-text-secondary);line-height:1.7;font-size:1.05rem;margin-bottom:1rem;max-width:480px;margin-inline:auto}.donate-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.9rem 2.5rem;border-radius:12px;background:var(--color-accent);color:#fff;font-size:1.05rem;font-weight:600;text-decoration:none;cursor:pointer;transition:background .2s,transform .15s;margin-top:1rem}.donate-btn:hover{background:var(--color-accent-light);transform:translateY(-1px)}.donation-card em{color:var(--color-accent-light);font-style:normal;font-weight:600}.footer{padding:3rem 2rem;text-align:center;color:var(--color-text-secondary);font-size:.85rem;border-top:1px solid var(--color-border)}.footer-link{display:inline-block;margin-top:.5rem;font-size:.8rem;text-decoration:none}.footer-link:hover{color:var(--color-accent)}.footer-sep{display:inline-block;margin:.5rem .5rem 0;color:var(--color-text-secondary);font-size:.8rem}
