@import"https://fonts.googleapis.com/css2?family=Fredoka:wght@500;600;700&family=IBM+Plex+Mono:wght@400;500;600&family=Nunito+Sans:opsz,wght@6..12,400;6..12,500;6..12,600;6..12,700;6..12,800;6..12,900&display=swap";:root,[data-theme=personal],[data-theme=band],[data-theme=light]{color-scheme:light;--studio-teal: #0e7c89;--teal-board: #0e7c89;--studio-teal-bright: #0e9397;--deep-teal: #075b63;--deepest-teal: #04464d;--seafoam: #7cced2;--paper-cream: #f4e7d7;--paper-white: #fff9f2;--paper-edge: #e2d7c3;--paper-rule: #e2d7c3;--studio-pink: #e85c86;--pressed-pink: #c93f6c;--blush: #f3a9c0;--mustard: #e2af44;--lilac: #b388ff;--coral: #d9825b;--teal-ink: #174e53;--ink: #173c3f;--muted-ink: #6f7a73;--ink-muted: var(--muted-ink);--brick: #c9514e;--fresh-teal: #2d9b8f;--color-primary: var(--studio-teal);--color-primary-strong: var(--deep-teal);--color-accent: var(--studio-pink);--color-accent-strong: var(--pressed-pink);--color-mustard: var(--mustard);--color-cream: var(--paper-cream);--color-cream-raised: var(--paper-white);--color-paper-line: var(--paper-edge);--bg: var(--studio-teal);--surface: var(--paper-cream);--surface-1: var(--paper-white);--surface-2: color-mix(in srgb, var(--paper-edge) 45%, var(--paper-cream));--surface-3: color-mix(in srgb, var(--seafoam) 13%, var(--paper-cream));--surface-hover: color-mix(in srgb, var(--seafoam) 17%, var(--paper-cream));--border: var(--paper-edge);--border-strong: color-mix(in srgb, var(--teal-ink) 28%, var(--paper-edge));--text: var(--ink);--text-strong: var(--teal-ink);--text-dim: var(--muted-ink);--muted: var(--muted-ink);--accent: var(--studio-pink);--error: var(--brick);--error-border: color-mix(in srgb, var(--brick) 45%, var(--paper-edge));--error-bg: color-mix(in srgb, var(--brick) 8%, var(--paper-cream));--success: var(--fresh-teal);--section-intro: #0a7078;--section-verse: #0d858b;--section-prechorus: var(--lilac);--section-chorus: var(--studio-pink);--section-bridge: var(--mustard);--section-solo: var(--coral);--section-outro: #08767d;--radius-cell: 3px;--r-xs: 3px;--r-sm: 6px;--r-md: 9px;--r-lg: 14px;--radius-control: var(--r-sm);--control-radius: var(--radius-control);--radius-list: var(--r-sm);--radius-popover: var(--r-md);--radius-dialog: var(--r-lg);--radius-sheet: var(--r-lg);--radius-shell: var(--r-lg);--sheet-radius: var(--radius-sheet);--shadow-raised: 0 2px 0 rgba(88, 62, 35, .12), 0 5px 12px rgba(88, 62, 35, .05);--shadow-floating: 0 12px 32px rgba(43, 32, 20, .18), 0 2px 0 rgba(88, 62, 35, .1);--shadow-inset: inset 0 0 0 1px var(--paper-edge);--shadow-cutout: var(--shadow-raised);--shadow-popover: var(--shadow-floating);--shadow-dialog: var(--shadow-floating);--shadow-sheet: var(--shadow-raised);--shadow-1: var(--shadow-raised);--shadow-2: var(--shadow-floating);--shadow-3: var(--shadow-floating);--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-7: 32px;--sp-8: 40px;--sp-9: 48px;--font-display: "Fredoka", "Arial Rounded MT Bold", sans-serif;--font-ui: "Nunito Sans", "Avenir Next", sans-serif;--font-data: "IBM Plex Mono", "SFMono-Regular", monospace;--text-xs: clamp(.67rem, .65rem + .06vw, .73rem);--text-sm: clamp(.77rem, .74rem + .08vw, .84rem);--text-md: clamp(.88rem, .84rem + .1vw, .96rem);--text-lg: clamp(1.02rem, .95rem + .24vw, 1.2rem);--text-xl: clamp(1.42rem, 1.25rem + .55vw, 1.88rem);--text-display: clamp(2.4rem, 1.7rem + 2.7vw, 4.6rem);--texture-paper: url(/paper-stock.webp);--paper-stock-texture: var(--texture-paper);--paper-material: var(--texture-paper);--board-material: var(--texture-paper);--popup-background: var(--paper-white);--popup-opaque-background: var(--paper-white);--popup-border: var(--paper-edge);--popup-shadow: var(--shadow-floating);--popup-radius: var(--r-md);--popup-padding: var(--sp-2);--popup-gap: var(--sp-1);--popup-font-size: var(--text-sm);--popup-font-weight: 650;--popup-backdrop: none;--pink-wash: color-mix(in srgb, var(--blush) 22%, transparent);--nav-width: 218px;--topbar-height: 68px;--topbar-h: var(--topbar-height);--bottom-nav-h: 48px;--bottom-nav-height: var(--bottom-nav-h);--focus-ring: 3px solid var(--studio-pink);--focus-offset: 2px;--bar-width: 20px;--bar-gap: 0px;--section-radius: 5px;--section-alpha: .92}:where(.popup-surface){color:var(--ink);background-color:var(--paper-white);background-image:var(--paper-stock-texture);background-size:420px 420px;border:0;border-radius:var(--radius-popover);box-shadow:var(--shadow-popover);font-family:var(--font-ui);font-size:.9rem;line-height:1.35}.popup-menu{display:grid;gap:.15rem;min-width:12rem;max-width:min(20rem,calc(100vw - 1.5rem));padding:var(--sp-2);overflow:auto;overscroll-behavior:contain;word-break:normal}.popup-menu.popup-fixed{position:fixed;z-index:1600}.popup-menu.popup-absolute{position:absolute;z-index:1480}.popup-menu .popup-menu-item,.popup-menu>button,.popup-menu>a{display:flex;align-items:center;gap:var(--sp-2);width:100%;min-height:2.4rem;padding:0 var(--sp-3);border:0;border-radius:var(--radius-control);box-sizing:border-box;color:var(--ink);background:transparent;font:inherit;font-weight:750;text-align:left;text-decoration:none;cursor:pointer;transition:background-color .13s ease,color .13s ease}.popup-menu .popup-menu-item:hover,.popup-menu .popup-menu-item:focus-visible,.popup-menu>button:hover,.popup-menu>button:focus-visible,.popup-menu>a:hover,.popup-menu>a:focus-visible{color:var(--ink);background:color-mix(in srgb,var(--seafoam) 35%,var(--paper-white));outline:0}.popup-menu .popup-menu-item[aria-current=true],.popup-menu>button[aria-pressed=true]{color:var(--paper-white);background:var(--studio-teal)}.popup-menu .popup-menu-item.danger,.popup-menu>.danger{color:var(--brick)}.popup-menu .popup-menu-item.danger:hover,.popup-menu .popup-menu-item.danger:focus-visible,.popup-menu>.danger:hover,.popup-menu>.danger:focus-visible{color:var(--brick);background:color-mix(in srgb,var(--brick) 12%,var(--paper-white))}.popup-menu select,.popup-menu input,.popup-menu textarea{width:100%;min-height:2.5rem;padding:0 var(--sp-3);border:1px solid var(--paper-edge);border-radius:var(--radius-control);box-sizing:border-box;color:var(--ink);background:var(--paper-white);font:inherit}.popup-menu textarea{min-height:5rem;padding-block:var(--sp-2);resize:vertical}.popup-menu select:focus-visible,.popup-menu input:focus-visible,.popup-menu textarea:focus-visible{border-color:transparent;outline:var(--focus-ring);outline-offset:var(--focus-offset)}.popup-menu-separator{height:1px;margin:var(--sp-1) var(--sp-2);background:var(--paper-edge)}.popup-card{display:grid;gap:var(--sp-4);width:min(30rem,calc(100vw - 2rem));max-height:min(44rem,calc(100dvh - 2rem));padding:var(--sp-5);overflow:auto;overscroll-behavior:contain;border:0;border-radius:var(--radius-dialog);box-sizing:border-box;color:var(--ink);background-color:var(--paper-white);background-image:var(--paper-stock-texture);background-size:420px 420px;box-shadow:var(--shadow-dialog)}.popup-card--wide{width:min(42rem,calc(100vw - 2rem))}.popup-card .form-group{display:grid;gap:var(--sp-1)}.popup-card label{color:var(--ink);font-size:.85rem;font-weight:800}.popup-card .form-group input,.popup-card .form-group select,.popup-card .form-group textarea{width:100%;min-height:2.65rem;padding:0 var(--sp-3);border:1px solid var(--paper-edge);border-radius:var(--radius-control);box-sizing:border-box;color:var(--ink);background:color-mix(in srgb,var(--paper-white) 86%,transparent);font:inherit}.popup-card .form-group textarea{min-height:6rem;padding-block:var(--sp-2);resize:vertical}.popup-card .form-group input:focus-visible,.popup-card .form-group select:focus-visible,.popup-card .form-group textarea:focus-visible{border-color:transparent;outline:var(--focus-ring);outline-offset:var(--focus-offset)}.popup-card .modal-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--sp-2)}@media (max-width: 640px){.popup-menu{max-width:calc(100vw - 1rem)}.popup-card,.popup-card--wide{width:calc(100vw - 1rem);max-height:calc(100dvh - 1rem);padding:var(--sp-4)}}*{box-sizing:border-box}html,body{min-height:100%}html{background:var(--teal-board)}body{margin:0;color:var(--text);background-color:var(--teal-board);background-image:var(--board-material);background-size:960px;background-blend-mode:multiply;font:500 var(--text-md)/1.38 var(--font-ui);letter-spacing:-.008em;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}body:before{content:"";position:fixed;z-index:10000;top:0;right:0;bottom:0;left:0;pointer-events:none;background:var(--texture-paper) center / 960px repeat;mix-blend-mode:multiply;opacity:.055}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}input,textarea,[contenteditable=true],[contenteditable=""]{-webkit-user-select:text;user-select:text}a{color:inherit}h1,h2,h3,h4,h5,h6{margin-block:0;color:var(--text-strong);font-family:var(--font-ui);font-weight:800;line-height:1.08;letter-spacing:-.022em}h1{font-family:var(--font-display);font-size:var(--text-xl);font-weight:600;letter-spacing:-.035em}h2{font-size:var(--text-lg)}h3{font-size:var(--text-md)}p{margin-block:0}button,.button{min-height:36px;padding:.5rem .78rem;border:0;border-radius:var(--r-sm);color:var(--paper-white);background:var(--studio-teal);font-weight:750;line-height:1;cursor:pointer;transition:background-color .14s ease,color .14s ease,box-shadow .14s ease}button:hover,.button:hover{background:var(--deep-teal)}button:active,.button:active{background:var(--deepest-teal)}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:var(--focus-ring);outline-offset:var(--focus-offset)}button:disabled,.button[aria-disabled=true]{color:color-mix(in srgb,var(--muted-ink) 74%,var(--paper-cream));background:color-mix(in srgb,var(--paper-edge) 68%,var(--paper-cream));cursor:not-allowed}.btn-primary,.primary,.cta{background:var(--studio-teal);color:var(--paper-white)}.btn-accent,.accent,.play{background:var(--studio-pink);color:var(--paper-white)}.btn-ghost,.ghost,.secondary,.icon-button{background:transparent;color:var(--teal-ink)}.btn-ghost:hover,.ghost:hover,.secondary:hover,.icon-button:hover{color:var(--deep-teal);background:color-mix(in srgb,var(--seafoam) 18%,transparent)}.btn-danger,.danger{background:transparent;color:var(--brick)}.btn-danger:hover,.danger:hover{background:var(--brick);color:var(--paper-white)}input,textarea,select{min-height:38px;padding:.52rem .68rem;color:var(--ink);background:color-mix(in srgb,var(--paper-white) 70%,var(--paper-cream));border:1px solid color-mix(in srgb,var(--teal-ink) 12%,var(--paper-edge));border-radius:var(--r-sm)}input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--muted-ink) 72%,var(--paper-cream))}input:focus,textarea:focus,select:focus{border-color:var(--studio-teal)}label{color:var(--teal-ink);font-weight:700}.container{max-width:1320px;margin:0 auto;padding:clamp(10px,1.5vw,22px)}.paper-sheet{color:var(--ink);background-color:var(--paper-cream);background-image:var(--paper-material);background-size:960px;background-blend-mode:multiply;border:0;border-radius:var(--r-lg)}.card,.panel,.group{color:var(--ink);background:transparent;border:0;border-radius:0;box-shadow:none}.item-card,.paper-piece{background-color:var(--paper-white);background-image:var(--paper-material);background-size:960px;background-blend-mode:multiply;border:0;border-radius:var(--r-sm);box-shadow:var(--shadow-raised)}.data,time,.bar-number,.timecode,.duration,.bpm{font-family:var(--font-data);font-variant-numeric:tabular-nums}.micro-label{color:var(--muted-ink);font-size:var(--text-xs);font-weight:800;letter-spacing:.055em;text-transform:uppercase}.text-muted{color:var(--muted-ink)}.mouse-gradient,.hover-gradient:before{display:none}.popup-surface,.popup-card,.sync-card,.notif-panel,.popup-menu{color:var(--ink);background-color:var(--paper-white);background-image:var(--paper-material);background-size:960px;background-blend-mode:multiply;border:0;-webkit-backdrop-filter:none;backdrop-filter:none}.skeleton{background:color-mix(in srgb,var(--paper-edge) 58%,var(--paper-cream));animation:paper-pulse 1.2s ease-in-out infinite alternate}@keyframes paper-pulse{to{background:color-mix(in srgb,var(--seafoam) 18%,var(--paper-cream))}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media (max-width: 720px){:root{--sp-5: 16px;--sp-6: 22px;--sp-7: 28px}.container{padding:8px}}.display-type{font-family:var(--font-display);font-weight:600;letter-spacing:-.035em}.paper-surface{background-color:var(--paper-cream);background-image:var(--paper-material);background-size:960px;background-blend-mode:multiply}.teal-surface{background-color:var(--studio-teal);background-image:var(--board-material);background-size:960px;background-blend-mode:multiply}