:root{color:#f2f0e8;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-synthesis:none;text-rendering:optimizelegibility;background:radial-gradient(circle at 12% 0,#f1a6532e,#0000 22rem),radial-gradient(circle at 88% 8%,#c64e8429,#0000 24rem),radial-gradient(circle at 76% 72%,#43c4aa24,#0000 28rem),#121615;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5}*{box-sizing:border-box}body{background:linear-gradient(#ffffff08,#fff0),repeating-linear-gradient(90deg,#ffffff08 0 1px,#0000 1px 5.5rem),#121615;min-width:320px;min-height:100vh;margin:0}button,textarea,input,select{font:inherit}button{color:#f2f0e8;cursor:pointer;background:#1c2422;border:1px solid #394642;border-radius:6px;min-height:2.75rem;padding:.65rem .9rem;transition:border-color .14s,background-color .14s,box-shadow .14s,transform .14s}button:disabled{color:#6f7d78;cursor:not-allowed;background:#1a201f}.test-auth-switcher button{white-space:nowrap;border:0;border-radius:999px;min-height:2rem;padding:.25rem .65rem;font-size:.78rem}button:focus-visible{outline-offset:2px;outline:3px solid #f1a653}button:hover:not(:disabled){background:#24302d;border-color:#43c4aa;transform:translateY(-1px);box-shadow:0 .55rem 1.4rem #43c4aa24}textarea{resize:vertical;color:#f7f4eb;background:linear-gradient(90deg,#f1a65338 0 .25rem,#0000 .25rem),#171d1c;border:2px solid #3c4b47;border-radius:8px;width:100%;min-height:13rem;padding:1rem;box-shadow:inset 0 .05rem .35rem #0000003d,0 .7rem 1.9rem #0000002e}input{color:#f7f4eb;background:#171d1c;border:1px solid #3c4b47;border-radius:6px;width:100%;min-height:3rem;padding:.65rem .8rem}select{color:#f2f0e8;background:#171d1c;border:1px solid #3c4b47;border-radius:6px;width:100%;min-height:2.75rem;padding:.55rem .7rem}textarea:focus,input:focus-visible,select:focus-visible{outline-offset:2px;outline:3px solid #f1a653}#app{min-height:100vh}.skip-link{z-index:200;color:#101615;background:#f1a653;border:2px solid #f1a653;border-radius:6px;padding:.65rem .85rem;font-weight:800;text-decoration:none;position:fixed;top:.5rem;left:.5rem;transform:translateY(calc(-100% - 1rem))}.skip-link:focus{outline-offset:2px;outline:3px solid #fff;transform:translateY(0)}.test-auth-switcher{z-index:100;color:#d7dedb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f1413f0;border:1px solid #53635e;border-radius:999px;align-items:center;gap:.35rem;padding:.3rem;display:flex;position:fixed;top:.65rem;left:50%;transform:translate(-50%);box-shadow:0 .6rem 1.5rem #0000004d}.test-auth-switcher span{color:#9cada8;text-transform:uppercase;white-space:nowrap;padding:0 .55rem;font-size:.72rem;font-weight:800}.test-auth-switcher button[aria-pressed=true]{color:#101615;background:#43c4aa}.language-switcher{z-index:110;color:#d7dedb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f1413f0;border:1px solid #53635e;border-radius:999px;align-items:center;gap:.45rem;padding:.3rem .4rem .3rem .7rem;display:flex;position:fixed;top:.65rem;right:.65rem;box-shadow:0 .6rem 1.5rem #0000004d}.language-switcher label{text-transform:uppercase;font-size:.74rem;font-weight:800}.language-switcher select{border:0;border-radius:999px;width:auto;min-height:2rem;padding:.25rem 1.8rem .25rem .65rem;font-size:.82rem}.workspace{width:min(1180px,100% - 2rem);margin:0 auto;padding:2.5rem 0}.workspace__header{justify-content:space-between;align-items:flex-end;gap:1.5rem;padding:1.35rem 0 2rem;display:flex;position:relative}.workspace__header:after{content:"";background:linear-gradient(90deg,#c64e84,#f1a653,#43c4aa,#8f7af4);border-radius:999px;height:.35rem;position:absolute;bottom:1.2rem;left:0;right:0}.workspace__header h1{letter-spacing:0;color:#f7f4eb;text-wrap:balance;max-width:13ch;margin:.2rem 0 0;font-size:4rem;line-height:.95}.workspace-login{color:#8ce8d5;white-space:nowrap;background:#236f642e;border-color:#43c4aa;align-self:flex-start}.workspace-save-message{color:#69d9c3;text-align:right;min-height:1.5rem;margin:-.85rem 0 1rem}.eyebrow{color:#43c4aa;letter-spacing:0;text-transform:uppercase;margin:0;font-size:.78rem;font-weight:700}.workspace__grid{grid-template-columns:minmax(0,1.35fr) minmax(18rem,.65fr);align-items:start;gap:1.15rem;display:grid}.setup-panel,.layer-panel,.feedback-panel,.manuscript-panel{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#181f1de0;border:1px solid #5f7871b8;border-radius:8px;padding:1.15rem;box-shadow:0 1.2rem 2.8rem #00000047,inset 0 1px #ffffff0d}.setup-panel,.layer-panel{border-top:6px solid #f1a653;min-height:23rem}.setup-panel{border-top:6px solid #c64e84}.layer-panel--one{background:linear-gradient(145deg,#f1a65321,#0000 18rem),#181f1de0;border-top-color:#f1a653}.layer-panel--2{background:linear-gradient(145deg,#43c4aa21,#0000 18rem),#181f1de0;border-top-color:#43c4aa}.layer-panel--3{background:linear-gradient(145deg,#8f7af424,#0000 18rem),#181f1de0;border-top-color:#8f7af4}.manuscript-panel{border-top:6px solid #43c4aa;grid-column:1/-1}.section-heading{margin-bottom:.85rem}.section-heading h2{letter-spacing:0;color:#f7f4eb;margin:.1rem 0 0;font-size:1.2rem;line-height:1.25}.helper-text{color:#aeb9b4;margin:.75rem 0 0}.composition-notes{gap:.45rem;margin-top:.85rem;display:grid}.composition-note{color:#f5dde8;background:#c64e8424;border-left:4px solid #c64e84;margin:0;padding:.55rem .7rem;font-size:.94rem}.feedback-list{gap:.9rem;margin:0;display:grid}.feedback-panel__edit{color:#ede7ff;background:#8f7af41f;border-color:#8f7af4;width:100%;margin-bottom:1rem}.feedback-list div{border-top:1px solid #303d39;padding-top:.8rem}.feedback-list dt{color:#aeb9b4;font-size:.86rem}.feedback-list dd{margin:.15rem 0 0;font-weight:700}.feedback-list select{margin-top:.15rem}.button-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;display:grid}.button-row--compact{margin-top:1rem}.random-controls{grid-template-columns:minmax(0,1fr) auto;gap:.6rem;margin-top:1rem;display:grid}.random-controls--three{grid-template-columns:minmax(0,.9fr) minmax(0,1fr) auto}.primary-action{color:#fff;background:linear-gradient(135deg,#236f64,#43c4aa);border-color:#43c4aa;box-shadow:0 .55rem 1.3rem #43c4aa33}.primary-action:hover:not(:disabled){background:linear-gradient(135deg,#2e8275,#69d9c3);border-color:#69d9c3}.setup-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;display:grid}.setup-grid label{background:#ffffff0a;border:1px solid #303d39;border-radius:8px;gap:.4rem;padding:.75rem;font-weight:700;display:grid}.setup-grid span,.previous-layer>span{color:#aeb9b4;font-size:.9rem;font-weight:700}.setup-action{margin-top:1rem}.previous-layer{gap:.5rem;margin-bottom:1rem;display:grid}.digit-strip{flex-wrap:wrap;gap:.45rem;display:flex}.digit-token{color:#f7d7a4;background:linear-gradient(145deg,#27211b,#171d1c);border-color:#4b4136;place-items:center;width:2.75rem;height:2.75rem;min-height:2.75rem;padding:0;font-weight:800;display:grid;position:relative;box-shadow:0 .35rem .85rem #00000038}.digit-token--stacked{align-content:center;gap:.12rem}.digit-token[aria-pressed=true]{color:#fff;background:linear-gradient(145deg,#236f64,#43c4aa);border-color:#43c4aa}.layer-two-badge{color:#161a19;background:#f1a653;border-radius:999px;place-items:center;min-width:1.25rem;min-height:1.25rem;font-size:.72rem;line-height:1;display:grid}.digit-token[aria-pressed=true] .layer-two-badge{color:#161a19;background:#ffe1a8}.manuscript-heading{grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:1rem;display:grid}.playback-row{min-width:13rem}.score-meta{color:#aeb9b4;flex-wrap:wrap;gap:.5rem 1rem;margin-bottom:.75rem;display:flex}.score-meta span,.score-meta strong{background:#171d1c;border:1px solid #303d39;border-radius:999px;padding:.25rem .6rem}.score-meta strong{color:#ede7ff;background:#8f7af41f}.empty-manuscript{color:#aeb9b4;background:linear-gradient(135deg,#f1a6531c,#8f7af41c),#171d1c;border:1px dashed #53635e;border-radius:8px;place-items:center;min-height:12rem;display:grid}.circle-score{grid-template-columns:repeat(auto-fit,minmax(5.3rem,1fr));gap:.65rem;margin-top:1rem;display:grid}.circle-score__cell{background:linear-gradient(#43c4aa1a,#0000 4rem),#171d1c;border:1px solid #3d4b47;border-radius:8px;min-height:11.5rem;padding:0;position:relative;overflow:hidden;box-shadow:0 .45rem 1rem #0003}.circle-score__cell:nth-child(3n+2){background:linear-gradient(#f1a6531a,#0000 4rem),#171d1c}.circle-score__cell:nth-child(3n+3){background:linear-gradient(#8f7af41c,#0000 4rem),#171d1c}.circle-score__cell:disabled{cursor:default;opacity:1}.note-pitch-controls{z-index:4;gap:.4rem;display:flex;position:absolute;bottom:.55rem;right:.55rem}.note-pitch-button{color:#101615;background:#8ce8d5;border-radius:999px;place-items:center;width:2.35rem;min-height:2.35rem;padding:0;font-size:1.15rem;font-weight:900;display:grid}.circle-score__lines{background:repeating-linear-gradient(#0000 0 .74rem,#f2f0e866 .76rem .82rem);height:4.1rem;position:absolute;inset:1.55rem .65rem auto}.circle-note{--staff-position:0;z-index:2;top:calc(5.62rem - var(--staff-position) * .5rem);color:#fff;letter-spacing:-.02em;background:#236f64;border:3px solid #8ce8d5;border-radius:50%;place-items:center;width:3.15rem;height:3.15rem;font-size:.82rem;font-weight:850;display:grid;position:absolute;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 .28rem #43c4aa1f,0 .4rem .9rem #00000047}.circle-note--harmony{background:#7562d4;border-width:2px;border-color:#d5ccff;width:1.25rem;height:1.25rem;margin-left:1.05rem;display:block;box-shadow:0 0 0 .2rem #8f7af41f}.circle-note--rest{background:0 0;border-color:#f6c77e}.circle-note--tie{background:#463d75;border-color:#d5ccff}.login-page{place-items:center;min-height:100vh;padding:1rem;display:grid}.landing-page{background:radial-gradient(circle at 50% 45%,#43c4aa2b,#0000 24rem),#0f1413;place-items:center;min-height:100vh;padding:1.5rem;display:grid;position:relative;overflow:hidden}.about-footer{justify-content:center;padding:2.2rem 0 .6rem;display:flex}.landing-page>.about-footer{padding:0;position:absolute;bottom:1.25rem;left:0;right:0}.about-footer__link{color:#9cada8;text-underline-offset:.28rem;background:0 0;border:0;min-height:auto;padding:.35rem;text-decoration:underline}.about-footer__link:hover:not(:disabled){color:#8ce8d5;box-shadow:none;background:0 0;transform:none}.about-page{width:min(54rem,100% - 2rem);margin:0 auto;padding:2rem 0 5rem}.about-page__header{border-bottom:1px solid #394642;padding:0 0 2rem}.about-page__back{margin-bottom:3rem}.about-page__header h1{color:#43c4aa;letter-spacing:-.055em;max-width:10ch;margin:.35rem 0 1.3rem;font-size:clamp(3rem,8vw,6.4rem);line-height:.92}.about-page__intro{color:#dce4e0;max-width:42rem;margin:0;font-size:clamp(1.15rem,2.5vw,1.45rem);line-height:1.6}.about-page__content{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.3rem;display:grid}.about-page__content section{background:#181f1de6;border:1px solid #394642;border-top:4px solid #43c4aa;border-radius:8px;padding:1.35rem}.about-page__content section:nth-child(2n){border-top-color:#f1a653}.about-page__content section:nth-child(3n){border-top-color:#8f7af4}.about-page__content h2{color:#f7f4eb;margin:.3rem 0 .8rem;font-size:1.35rem;line-height:1.2}.about-copy{color:#bcc7c2;margin-bottom:0}.about-page__contact{grid-column:1/-1}.about-page__contact a{color:#8ce8d5;font-weight:750}.landing-content{text-align:center;justify-items:center;display:grid}.landing-content h1{color:#43c4aa;letter-spacing:-.055em;text-wrap:balance;opacity:0;margin:0;font-size:clamp(3.2rem,11vw,8.5rem);font-weight:650;line-height:.92;animation:2.8s ease-out .25s forwards title-fade-in}.landing-start,.landing-saved{opacity:0;animation:1.2s ease-out 2.25s forwards control-fade-in}.landing-start{color:#101615;background:#43c4aa;border-color:#43c4aa;min-width:10rem;margin-top:3rem;font-size:1.08rem;font-weight:800}.landing-saved{color:#9cada8;text-underline-offset:.25rem;background:0 0;border:0;min-height:auto;margin-top:1rem;padding:.35rem;text-decoration:underline}.landing-saved:hover:not(:disabled){color:#8ce8d5;box-shadow:none;background:0 0;transform:none}@keyframes title-fade-in{0%{opacity:0;filter:blur(8px);transform:translateY(1rem)}to{opacity:1;filter:blur();transform:translateY(0)}}@keyframes control-fade-in{to{opacity:1}}.login-card{background:#181f1df0;border:1px solid #5f7871b8;border-top:6px solid #c64e84;border-radius:8px;width:min(100%,31rem);padding:clamp(1.5rem,5vw,3.5rem);box-shadow:0 1.8rem 4rem #00000059}.login-card h1{margin:.4rem 0 1rem;font-size:clamp(2.4rem,7vw,4.4rem);line-height:.96}.login-intro,.login-note{color:#aeb9b4}.login-intro strong{color:#f7f4eb;overflow-wrap:anywhere}.auth-form{display:grid}.auth-notice{color:#f5d5ae;background:#f1a6531a;border-left:3px solid #f1a653;padding:.7rem .85rem}.auth-field-error{color:#ff9fba;font-size:.82rem;font-weight:600}.share-dialog input{width:100%;min-width:0;font-size:.9rem}.login-field{gap:.45rem;margin-top:2rem;font-weight:700;display:grid}.login-field input:has(+.auth-field-error){border-color:#e06a91}.login-action{width:100%;margin-top:.8rem}.login-back{background:0 0;width:100%;margin-top:.6rem}.login-note{text-align:center;margin:1rem 0 0;font-size:.82rem}.draft-page{width:min(1180px,100% - 2rem);margin:0 auto;padding:2rem 0 4rem}.draft-paper__heading,.draft-actions{justify-content:space-between;align-items:center;gap:1rem;display:flex}.draft-paper{color:#f2f0e8;background:#181f1df0;border-top:6px solid #43c4aa;border-radius:8px;padding:clamp(1rem,3vw,2rem);box-shadow:0 1.8rem 4rem #0000004d}.draft-paper h1{margin:.15rem 0 0;font-size:clamp(1.8rem,4vw,3rem)}.draft-paper__heading .score-meta{justify-content:flex-end;margin:0}.draft-actions{flex-wrap:wrap;justify-content:flex-end;margin-top:1.25rem}.save-action{color:#161a19;background:#f1a653;border-color:#f1a653;font-weight:800}.save-message{color:#69d9c3;text-align:right;min-height:1.5rem;margin:.75rem 0 0}.saved-page{width:min(52rem,100% - 2rem);margin:0 auto;padding:3rem 0}.saved-header{border-bottom:1px solid #394642;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:2rem;padding-bottom:1.5rem;display:flex}.saved-header__actions{flex-wrap:wrap;justify-content:flex-end;gap:.6rem;display:flex}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.saved-header h1{margin:.15rem 0 0;font-size:clamp(2.4rem,7vw,4.5rem);line-height:1}.saved-project-card,.saved-empty{text-align:left;background:#181f1d;border:1px solid #53635e;border-left:6px solid #43c4aa;border-radius:8px;width:100%;padding:1.2rem}.saved-project-card{gap:.8rem;display:grid}.saved-project-list{gap:1rem;display:grid}.saved-project-open{text-align:left;background:0 0;border:0;gap:.3rem;padding:0;display:grid}.saved-project-open span{font-size:1.2rem;font-weight:800}.saved-project-open small,.saved-empty p{color:#aeb9b4}.saved-project-actions{flex-wrap:wrap;gap:.6rem;display:flex}.rename-dialog-backdrop{z-index:20;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#050a09c7;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.rename-dialog{overscroll-behavior:contain;background:#181f1d;border:1px solid #53635e;border-top:5px solid #43c4aa;border-radius:10px;gap:.9rem;width:min(100%,28rem);max-height:calc(100dvh - 2rem);padding:1.5rem;display:grid;overflow-y:auto;box-shadow:0 1.5rem 4rem #00000073}.rename-dialog h2,.rename-dialog p{margin:0}.share-dialog__message{color:#69d9c3;min-height:1.3rem;margin:0}.share-dialog__warning{color:#f5d5ae;background:#f1a6531a;border-left:3px solid #f1a653;padding:.8rem .9rem}.share-dialog__warning p{margin:.35rem 0 0}.danger-action{color:#fff;background:#9f3e5f;border-color:#e06a91}.rename-dialog label{font-weight:700}.rename-dialog__input{width:100%}.rename-dialog__actions{justify-content:flex-end;gap:.7rem;margin-top:.3rem;display:flex}.version-dialog{background:#181f1d;border:1px solid #53635e;border-top:5px solid #43c4aa;border-radius:10px;gap:1rem;width:min(100%,38rem);max-height:min(85vh,44rem);padding:1.5rem;display:grid;overflow:auto;box-shadow:0 1.5rem 4rem #00000073}.version-dialog__heading{justify-content:space-between;align-items:start;gap:1rem;display:flex}.version-dialog__heading h2,.version-dialog__heading p,.version-dialog__intro{margin:0}.version-dialog__intro{color:#aeb9b4}.version-list{gap:.7rem;display:grid}.version-card{background:#111715;border:1px solid #394642;border-radius:7px;justify-content:space-between;align-items:center;gap:1rem;padding:.9rem;display:flex}.version-card div{gap:.18rem;display:grid}.version-card span,.version-card small{color:#aeb9b4}.saved-empty{justify-items:start;display:grid}@media (prefers-reduced-motion:reduce){.landing-content h1,.landing-start,.landing-saved{opacity:1;animation:none}}@media (width<=820px){.workspace{width:min(100% - 1rem,48rem);padding:1rem 0}.workspace__header,.workspace__grid{display:grid}.about-page__content{grid-template-columns:1fr}.about-page__contact{grid-column:auto}.workspace__header h1{max-width:13ch;font-size:2.5rem}.workspace-login{justify-self:start}.workspace-save-message{text-align:left;margin-top:-.25rem}.workspace__grid,.manuscript-heading,.setup-grid,.draft-paper__heading{grid-template-columns:1fr}.draft-paper__heading{display:grid}.draft-paper__heading .score-meta{justify-content:flex-start}}@media (width<=480px){.button-row,.random-controls,.random-controls--three{grid-template-columns:1fr}.saved-header{flex-direction:column;align-items:flex-start}.draft-actions{grid-template-columns:repeat(2,minmax(0,1fr));width:100%;display:grid}.draft-actions button{width:100%;min-width:0}.draft-actions .save-action{grid-column:1/-1}.save-message{text-align:left}.saved-header__actions,.saved-project-actions{grid-template-columns:repeat(2,minmax(0,1fr));width:100%;display:grid}.saved-header__actions button,.saved-project-actions button{width:100%;min-width:0}.rename-dialog{padding:1.1rem}.version-dialog{max-height:calc(100dvh - 2rem);padding:1.1rem}.version-dialog__heading,.version-card{flex-direction:column;align-items:stretch}.version-dialog__heading button,.version-card button{width:100%}.rename-dialog__actions{grid-template-columns:1fr;display:grid}.rename-dialog__actions button{width:100%}.saved-project-actions button:first-child{grid-column:1/-1}.test-auth-switcher{justify-content:center;left:.4rem;right:.4rem;transform:none}.test-auth-switcher span{display:none}.language-switcher{top:auto;bottom:.5rem;right:.5rem}.language-switcher label{clip:rect(0 0 0 0);white-space:nowrap;clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}}