:root{--font-stack: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--light-bg: #ffffff;--light-text: #1a1a1a;--light-dial-bg: #f5f5f7;--light-dial-border: #ffffff;--light-note-inactive: #949494;--dark-bg: #000000;--dark-text: #f5f5f7;--dark-dial-bg: #1c1c1e;--dark-dial-border: #000000;--dark-note-inactive: #5c5c5c;--center-line: #ff3b30;--note-active: #007aff;--note-perfect: #34c759;--bg-color: var(--light-bg);--text-primary: var(--light-text);--dial-bg: var(--light-dial-bg);--dial-border: var(--light-dial-border);--note-inactive: var(--light-note-inactive)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg-color: var(--dark-bg);--text-primary: var(--dark-text);--dial-bg: var(--dark-dial-bg);--dial-border: var(--dark-dial-border);--note-inactive: var(--dark-note-inactive)}}[data-theme=dark]{--bg-color: var(--dark-bg);--text-primary: var(--dark-text);--dial-bg: var(--dark-dial-bg);--dial-border: var(--dark-dial-border);--note-inactive: var(--dark-note-inactive)}[data-theme=light]{--bg-color: var(--light-bg);--text-primary: var(--light-text);--dial-bg: var(--light-dial-bg);--dial-border: var(--light-dial-border);--note-inactive: var(--light-note-inactive)}.icon-sun{display:none}.icon-moon{display:block}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .icon-sun{display:block}:root:not([data-theme=light]) .icon-moon{display:none}}[data-theme=dark] .icon-sun{display:block}[data-theme=dark] .icon-moon,[data-theme=light] .icon-sun{display:none}[data-theme=light] .icon-moon{display:block}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-primary);font-family:var(--font-stack);height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;transition:background-color .3s ease,color .3s ease}#themeToggle{position:absolute;top:20px;right:20px;background:transparent;border:none;color:var(--text-primary);cursor:pointer;padding:8px;border-radius:50%;transition:background .2s;opacity:.7;z-index:100}#themeToggle:hover{background:#80808033;opacity:1}#themeToggle svg{width:24px;height:24px}#swarDial{position:relative;width:100%;max-width:800px;height:160px;background:var(--dial-bg);border-top:1px solid var(--dial-border);border-bottom:1px solid var(--dial-border);overflow:hidden;mask-image:linear-gradient(to right,transparent,black 20%,black 80%,transparent);-webkit-mask-image:linear-gradient(to right,transparent,black 20%,black 80%,transparent)}#swarDial:after{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;background-color:var(--center-line);transform:translate(-50%);z-index:10;box-shadow:0 0 10px var(--center-line)}#swarContainer{display:flex;height:100%;align-items:center;will-change:transform;transform:translateZ(0);opacity:.3;transition:opacity .5s ease}.swarItem{flex:0 0 60px;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--note-inactive);transition:color .2s,transform .2s;-webkit-user-select:none;user-select:none}.swarName{font-size:1.5rem;font-weight:600}.swarIndicator{width:4px;height:20px;background-color:currentColor;margin-top:10px;border-radius:2px}.swarItem.active{color:var(--note-active);transform:scale(1.1);opacity:1}.swarItem.perfect{color:var(--note-perfect);text-shadow:0 0 15px var(--note-perfect);transform:scale(1.25)}.swarItem.perfect .swarIndicator{box-shadow:0 0 10px var(--note-perfect)}#detailedSwarDisplay{margin-top:2rem;font-size:1.1rem;font-weight:500;color:var(--text-secondary);font-variant-numeric:tabular-nums;letter-spacing:.5px;min-height:1.5em;text-align:center}.footer{position:fixed;bottom:20px;font-size:.8rem;color:var(--text-primary);text-align:center;opacity:.75}.footer svg{margin:5px 2px}.footer a{color:inherit;text-decoration:none}@media(max-width:600px){#swarDial{height:120px}.swarName{font-size:1.2rem}}