:root{--center-size: 100px;--orbit-size: 64px;--orbit-radius: 86px}.circle-container.svelte-1sbme36{position:relative;width:calc(var(--orbit-radius) * 2 + var(--orbit-size));height:calc(var(--orbit-radius) * 2 + var(--orbit-size));margin:0 auto}.center-circle.svelte-1sbme36{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:var(--center-size);height:var(--center-size);border-radius:50%;background:linear-gradient(135deg,color-mix(in oklab,var(--color-primary) 30%,transparent),color-mix(in oklab,var(--color-primary) 15%,transparent));border:3px solid var(--color-primary);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10;box-shadow:0 4px 20px color-mix(in oklab,var(--color-primary) 30%,transparent)}.root-note.svelte-1sbme36{font-size:1.5rem;font-weight:800;line-height:1;color:var(--color-primary)}.scale-name.svelte-1sbme36{font-size:.6rem;font-weight:600;opacity:.8;text-transform:uppercase;letter-spacing:.05em;margin-top:2px}.orbit-circle.svelte-1sbme36{position:absolute;width:var(--orbit-size);height:var(--orbit-size);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;border:2px solid transparent;transition:all .2s ease;left:calc(50% + var(--orbit-radius) * cos(var(--angle)) - var(--orbit-size) / 2);top:calc(50% + var(--orbit-radius) * sin(var(--angle)) - var(--orbit-size) / 2)}.orbit-circle.svelte-1sbme36:hover{left:calc(50% + calc(var(--orbit-radius) + 4px) * cos(var(--angle)) - var(--orbit-size) / 2);top:calc(50% + calc(var(--orbit-radius) + 4px) * sin(var(--angle)) - var(--orbit-size) / 2);box-shadow:0 4px 12px #0000004d}.orbit-circle.expanded.svelte-1sbme36{border-color:var(--color-base-content);box-shadow:0 0 0 3px color-mix(in oklab,var(--color-primary) 50%,transparent)}.orbit-circle.playing.svelte-1sbme36{animation:svelte-1sbme36-chord-pulse .4s ease-out}@keyframes svelte-1sbme36-chord-pulse{0%{transform:scale(1);box-shadow:0 0 color-mix(in oklab,var(--color-primary) 70%,transparent)}50%{transform:scale(1.15);box-shadow:0 0 20px 10px color-mix(in oklab,var(--color-primary) 30%,transparent)}to{transform:scale(1);box-shadow:0 0 color-mix(in oklab,var(--color-primary) 0%,transparent)}}.orbit-circle.major.svelte-1sbme36{background:linear-gradient(135deg,color-mix(in oklab,var(--color-success) 90%,transparent),color-mix(in oklab,var(--color-success) 70%,transparent));border-color:var(--color-success)}.orbit-circle.minor.svelte-1sbme36{background:linear-gradient(135deg,color-mix(in oklab,var(--color-info) 90%,transparent),color-mix(in oklab,var(--color-info) 70%,transparent));border-color:var(--color-info)}.orbit-circle.diminished.svelte-1sbme36{background:linear-gradient(135deg,color-mix(in oklab,var(--color-warning) 90%,transparent),color-mix(in oklab,var(--color-warning) 70%,transparent));border-color:var(--color-warning)}.orbit-circle.augmented.svelte-1sbme36{background:linear-gradient(135deg,color-mix(in oklab,var(--color-secondary) 90%,transparent),color-mix(in oklab,var(--color-secondary) 70%,transparent));border-color:var(--color-secondary)}.orbit-circle.svelte-1sbme36 .chord-name:where(.svelte-1sbme36){font-size:.85rem;font-weight:700;line-height:1;color:var(--color-base-100);text-shadow:0 1px 2px rgba(0,0,0,.2)}.orbit-circle.svelte-1sbme36 .numeral:where(.svelte-1sbme36){font-size:.6rem;font-weight:600;opacity:.9;color:var(--color-base-100);text-shadow:0 1px 2px rgba(0,0,0,.2)}.orbit-circle.svelte-1sbme36 .chord-notes-inner:where(.svelte-1sbme36){display:flex;flex-direction:column;align-items:center;gap:.125rem}.orbit-circle.svelte-1sbme36 .chord-notes-inner:where(.svelte-1sbme36) span:where(.svelte-1sbme36){font-size:.7rem;font-weight:600;color:var(--color-base-100);text-shadow:0 1px 2px rgba(0,0,0,.2);line-height:1.1}@media(min-width:480px){:root{--center-size: 120px;--orbit-size: 76px;--orbit-radius: 102px}.root-note.svelte-1sbme36{font-size:1.75rem}.scale-name.svelte-1sbme36{font-size:.7rem}.orbit-circle.svelte-1sbme36 .chord-name:where(.svelte-1sbme36){font-size:1rem}.orbit-circle.svelte-1sbme36 .numeral:where(.svelte-1sbme36){font-size:.7rem}.orbit-circle.svelte-1sbme36 .chord-notes-inner:where(.svelte-1sbme36) span:where(.svelte-1sbme36){font-size:.8rem}}@media(min-width:640px){:root{--center-size: 140px;--orbit-size: 88px;--orbit-radius: 118px}.root-note.svelte-1sbme36{font-size:2rem}.scale-name.svelte-1sbme36{font-size:.75rem}.orbit-circle.svelte-1sbme36 .chord-name:where(.svelte-1sbme36){font-size:1.15rem}.orbit-circle.svelte-1sbme36 .numeral:where(.svelte-1sbme36){font-size:.8rem}.orbit-circle.svelte-1sbme36 .chord-notes-inner:where(.svelte-1sbme36) span:where(.svelte-1sbme36){font-size:.85rem}}@media(min-width:768px){:root{--center-size: 160px;--orbit-size: 100px;--orbit-radius: 134px}.root-note.svelte-1sbme36{font-size:2.25rem}.orbit-circle.svelte-1sbme36 .chord-name:where(.svelte-1sbme36){font-size:1.25rem}.orbit-circle.svelte-1sbme36 .numeral:where(.svelte-1sbme36){font-size:.85rem}.orbit-circle.svelte-1sbme36 .chord-notes-inner:where(.svelte-1sbme36) span:where(.svelte-1sbme36){font-size:.95rem}}