.pwa-install{position:fixed;inset:auto 0 0;z-index:20;display:grid;justify-items:center;padding:0 14px max(14px,env(safe-area-inset-bottom));pointer-events:none}.pwa-install__sheet{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;width:min(720px,100%);padding:14px;border:.5px solid var(--color-border);border-radius:18px;background:color-mix(in srgb,var(--color-surface) 94%,transparent);box-shadow:0 18px 48px #1c1a1629;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);pointer-events:auto}.pwa-install__mark{display:grid;place-items:center;width:44px;height:44px;border:.5px solid var(--color-border);border-radius:14px;background:color-mix(in srgb,var(--color-bg-soft) 68%,var(--color-surface))}.pwa-install__mark img{display:block}.pwa-install__copy h2{margin:0 0 3px;color:var(--color-text-primary);font-size:15px;font-weight:700;line-height:1.25}.pwa-install__copy p{margin:0;color:var(--color-text-secondary);font-size:13px;line-height:1.45}.pwa-install__actions{display:flex;gap:8px}.pwa-install__button{min-height:36px;padding:7px 14px;border:.5px solid var(--color-border);border-radius:var(--radius-pill);cursor:pointer;font:inherit;font-size:13px;font-weight:700;transition:border-color .15s,background-color .15s,color .15s,transform .15s}.pwa-install__button:active{transform:translateY(1px)}.pwa-install__button--primary{border-color:var(--color-accent);background:var(--color-accent);color:var(--color-accent-contrast)}.pwa-install__button--secondary{background:var(--color-surface);color:var(--color-text-secondary)}.pwa-install__button--secondary:hover,.pwa-install__button--secondary:focus-visible{border-color:var(--color-border-hover);color:var(--color-text-primary)}@media(prefers-color-scheme:dark){.pwa-install__sheet{box-shadow:0 18px 48px #0000005c}}@media(max-width:620px){.pwa-install__sheet{grid-template-columns:auto minmax(0,1fr);align-items:start;gap:12px;border-radius:18px 18px 0 0}.pwa-install__actions{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;width:100%}}:root{--color-bg: #fbfaf6;--color-bg-soft: #f1efe8;--color-surface: #ffffff;--color-surface-elevated: #fffdf8;--color-canvas: transparent;--color-border: rgba(28, 26, 22, .12);--color-border-hover: rgba(28, 26, 22, .32);--color-text-primary: #1f1d19;--color-text-secondary: #6b665d;--color-text-tertiary: #9a9387;--color-accent: #9a5b12;--color-accent-contrast: #ffffff;--color-focus: #c47b1d;--color-favorite: #c83f36;--radius-card: 10px;--radius-control: 8px;--radius-pill: 999px;--shadow-card: 0 1px 2px rgba(28, 26, 22, .04);--shadow-card-hover: 0 12px 30px rgba(28, 26, 22, .08);--badge-major-bg: #dbeafe;--badge-major-text: #1e3a5f;--badge-minor-bg: #d9f4e8;--badge-minor-text: #1f513f;--badge-extension-bg: #f6e7bf;--badge-extension-text: #68440d;--badge-suspended-bg: #e8e0f6;--badge-suspended-text: #4b3477;--badge-altered-bg: #f4d7d0;--badge-altered-text: #762f27;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color-scheme:light dark;color:var(--color-text-primary);background:var(--color-bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media(prefers-color-scheme:dark){:root{--color-bg: #161512;--color-bg-soft: #1d1b17;--color-surface: #22201b;--color-surface-elevated: #2a2720;--color-border: rgba(255, 250, 238, .13);--color-border-hover: rgba(255, 250, 238, .32);--color-text-primary: #f0ece2;--color-text-secondary: #b5aea0;--color-text-tertiary: #80786b;--color-accent: #d89435;--color-accent-contrast: #1b1308;--color-focus: #e0a64a;--color-favorite: #ef7067;--shadow-card: 0 1px 2px rgba(0, 0, 0, .18);--shadow-card-hover: 0 12px 30px rgba(0, 0, 0, .28);--badge-major-bg: #183757;--badge-major-text: #b9dbff;--badge-minor-bg: #174537;--badge-minor-text: #aae8cf;--badge-extension-bg: #5a3d11;--badge-extension-text: #f3d99c;--badge-suspended-bg: #3c2d5e;--badge-suspended-text: #d8cdf5;--badge-altered-bg: #5b2822;--badge-altered-text: #f4c4ba}}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100dvh;background:linear-gradient(180deg,var(--color-bg) 0%,var(--color-bg-soft) 100%)}#root{max-width:1120px;margin:0 auto;padding:0 18px}button,a,select{-webkit-tap-highlight-color:transparent}button:focus-visible,select:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}@media(max-width:520px){#root{padding:0 12px}}.language-switcher{font-size:13px;font-weight:600;font-family:inherit;min-height:34px;padding:5px 28px 5px 10px;border-radius:var(--radius-control);border:.5px solid var(--color-border);background:var(--color-surface);color:var(--color-text-secondary);cursor:pointer}.language-switcher:hover,.language-switcher:focus-visible{border-color:var(--color-border-hover);color:var(--color-text-primary)}.chord-card{position:relative;min-height:178px;overflow:hidden;border:.5px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-surface);box-shadow:var(--shadow-card);transition:border-color .15s,background-color .15s,box-shadow .15s,transform .15s}.chord-card:hover,.chord-card:focus-within{border-color:var(--color-border-hover);background:var(--color-surface-elevated);box-shadow:var(--shadow-card-hover)}.chord-card:active{transform:translateY(1px)}.chord-card--selected{border-color:var(--color-accent);border-width:1.5px}.chord-card__link{display:grid;min-height:178px;grid-template-rows:auto 1fr;gap:8px;padding:12px 10px 10px;color:inherit;text-decoration:none}.chord-card__link:focus-visible{outline:2px solid var(--color-focus);outline-offset:-3px}.chord-card__header{display:grid;justify-items:center;gap:4px;padding-right:18px}.chord-card__favorite{position:absolute;top:8px;right:8px;z-index:2;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--color-text-tertiary);cursor:pointer;font-family:inherit;font-size:17px;line-height:1;transition:background-color .15s,color .15s,transform .15s}.chord-card__favorite:hover,.chord-card__favorite:focus-visible{background:color-mix(in srgb,var(--color-favorite) 12%,transparent);color:var(--color-favorite)}.chord-card__favorite:active{transform:scale(.94)}.chord-card__favorite--active{color:var(--color-favorite)}.chord-card__name{color:var(--color-text-primary);font-size:20px;font-weight:700;line-height:1.1}.chord-card__badge{display:inline-block;padding:2px 8px;border-radius:var(--radius-pill);font-size:11px;font-weight:650;line-height:1.45}.chord-card__diagram{display:grid;place-items:center;align-self:end}.chord-card__diagram canvas{display:block}.chord-card__badge--Major{background:var(--badge-major-bg);color:var(--badge-major-text)}.chord-card__badge--Minor{background:var(--badge-minor-bg);color:var(--badge-minor-text)}.chord-card__badge--7th,.chord-card__badge--maj7,.chord-card__badge--m7,.chord-card__badge--add9,.chord-card__badge--9th,.chord-card__badge--6th{background:var(--badge-extension-bg);color:var(--badge-extension-text)}.chord-card__badge--sus2,.chord-card__badge--sus4{background:var(--badge-suspended-bg);color:var(--badge-suspended-text)}.chord-card__badge--dim,.chord-card__badge--aug{background:var(--badge-altered-bg);color:var(--badge-altered-text)}.app__header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0 14px;border-bottom:.5px solid var(--color-border);margin-bottom:0}.app__brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}.app__logo{flex-shrink:0;width:36px;height:36px}.app__title{font-size:clamp(20px,4vw,25px);font-weight:700;line-height:1.1;margin:0;color:var(--color-text-primary)}.app__subtitle{font-size:14px;color:var(--color-text-secondary);margin:4px 0 0}.app__main{padding-bottom:40px}@media(max-width:520px){.app__header{align-items:flex-start;padding-top:16px}.app__subtitle{max-width:22ch}}