:root{color:#eff5ff;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-main:#0a1224c7;--bg-panel:#0e172be6;--bg-card:#f4f8fff5;--bg-card-soft:#eef4ffe6;--line-soft:#8eaeff2e;--line-strong:#a0cbff59;--text-main:#eaf2ff;--text-muted:#95a9cf;--text-dark:#11203d;--accent:#58f0cf;--accent-strong:#8bf55d;--accent-secondary:#58a7ff;--shadow-lg:0 24px 80px #00000061;--shadow-md:0 16px 40px #05091438;--radius-xl:28px;--radius-lg:20px;--radius-md:14px;background:radial-gradient(circle at 0 0,#28d1ff33,#0000 28%),radial-gradient(circle at 80% 0,#6751ff2e,#0000 26%),linear-gradient(#0a1224 0%,#0d1730 45%,#09111f 100%);font-family:Avenir Next,Hiragino Sans,Yu Gothic,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{width:100%;min-width:0;color:var(--text-main);background:radial-gradient(circle at 15% 10%,#58f0cf1f,#0000 18%),radial-gradient(circle at 85% 20%,#58a7ff1a,#0000 22%),linear-gradient(#08111f 0%,#0c1630 42%,#0a1324 100%);margin:0;overflow-x:hidden}button,select,input{font:inherit}button{cursor:pointer}.app{min-height:100vh;padding:24px;position:relative}.app-backdrop{pointer-events:none;background-color:#0000;background-image:linear-gradient(90deg,#0000 0 calc(100% - 1px),#ffffff08 calc(100% - 1px)),linear-gradient(0deg,#0000 0 calc(100% - 1px),#ffffff08 calc(100% - 1px));background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:96px 96px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#0000007a,#0000 80%);mask-image:linear-gradient(#0000007a,#0000 80%)}.auth-shell{place-items:center;min-height:calc(100vh - 140px);padding:24px;display:grid}.auth-shell-login{justify-items:center;min-height:calc(100vh - 120px)}.auth-page-stack{gap:22px;width:min(100%,880px);margin:0 auto;display:grid}.auth-card{border:1px solid var(--line-soft);border-radius:var(--radius-xl);width:min(100%,480px);box-shadow:var(--shadow-lg);background:#0a1224d1;padding:32px}.auth-card h2{margin:6px 0 12px;font-size:2rem}.auth-card p{color:var(--text-muted);line-height:1.6}.auth-card-login{text-align:center;background:radial-gradient(circle at 100% 0,#58f0cf24,#0000 30%),linear-gradient(135deg,#0a1224f0 0%,#0e172bf5 100%);width:min(100%,560px);margin:0 auto;padding:38px}.auth-card-hero{justify-items:center;gap:10px;display:grid}.auth-card-hero h2{text-transform:lowercase;margin:0;font-size:clamp(2rem,5vw,3rem)}.auth-action-stack{gap:14px;margin-top:26px;display:grid}.auth-primary-button,.auth-secondary-button{border-radius:18px;min-height:56px;font-weight:900}.auth-primary-button{color:#08111f;background:linear-gradient(135deg,#53d6ff 0%,#58f0cf 100%);border:0}.auth-secondary-button{color:var(--text-main);background:#ffffff0d;border:1px solid #91bbff2e}.auth-footnote{color:var(--text-muted);text-align:center;margin-top:16px;font-size:.92rem}.auth-legal-links{gap:8px;margin-top:16px;display:grid}.auth-legal-links p{color:#8fa1c7;margin:0;font-size:.82rem}.auth-legal-link-row,.auth-footer-links{flex-wrap:wrap;justify-content:center;gap:14px;display:flex}.auth-legal-link-row a,.auth-footer-links a{color:#8fa1c7;font-size:.82rem;text-decoration:underline}.auth-legal-link-row span,.auth-footer-links span{color:#6e7fa4;font-size:.82rem}.auth-legal-link-row a:hover,.auth-footer-links a:hover{color:var(--text-main)}.auth-footer-links{padding-bottom:16px}.login-lp-stack{gap:22px;width:100%;display:grid}.lp-section{border:1px solid var(--line-soft);box-shadow:var(--shadow-md);background:radial-gradient(circle at 100% 0,#58f0cf1a,#0000 30%),linear-gradient(135deg,#0a1224d6 0%,#0e172be6 100%);border-radius:26px;padding:28px}.lp-section:hover{transition:transform .2s,box-shadow .2s;transform:translateY(-2px);box-shadow:0 18px 42px #05091447}.lp-showcase-section{padding:14px;overflow:hidden}.lp-showcase-image{border:1px solid #91bbff29;border-radius:18px;width:100%;height:auto;display:block;box-shadow:0 14px 30px #03081247}.lp-copy-block,.lp-section-heading{gap:10px;display:grid}.lp-copy-block h3,.lp-section-heading h3,.lp-cta-card h3{margin:0;font-size:clamp(1.5rem,3vw,2.2rem);line-height:1.2}.lp-copy-block p,.lp-feature-card p,.lp-cta-card p,.lp-difference-list li{color:var(--text-muted)}.lp-copy-lead{margin:0;font-size:1rem;line-height:1.75}.lp-highlight-list{gap:14px;margin-top:22px;display:grid}.lp-highlight-card,.lp-feature-card,.lp-difference-card,.lp-cta-card{background:#ffffff0a;border:1px solid #91bbff1f;border-radius:20px;padding:20px}.lp-highlight-card{gap:6px;display:grid}.lp-highlight-card strong,.lp-feature-card h4,.lp-difference-card h4{color:var(--text-main)}.lp-highlight-card span{color:var(--text-muted)}.lp-feature-section{gap:22px;display:grid}.lp-feature-grid{gap:14px;display:grid}.lp-feature-card{gap:8px;display:grid}.lp-feature-card h4,.lp-difference-card h4{margin:0;font-size:1.1rem}.lp-feature-card p,.lp-difference-card p{margin:0}.lp-difference-card{gap:12px;display:grid}.lp-difference-list{gap:10px;margin:0;padding-left:18px;display:grid}.lp-cta-card{text-align:center;background:radial-gradient(circle at 0 0,#53d6ff24,#0000 34%),#ffffff0a;gap:12px;display:grid}.lp-cta-card p{margin:0}.lp-cta-button{width:100%;margin-top:8px}.legal-shell{place-items:center;padding:24px;display:grid}.legal-card{border:1px solid var(--line-soft);width:min(100%,920px);box-shadow:var(--shadow-lg);background:#0a1224e0;border-radius:26px;padding:32px}.legal-card h1,.legal-card h2,.legal-card p,.legal-card li{margin-top:0}.legal-card h1{margin-bottom:20px;font-size:2rem}.legal-card h2{margin-top:26px;margin-bottom:10px;font-size:1.15rem}.legal-card p,.legal-card li{color:var(--text-muted);line-height:1.8}.legal-card ul{margin:0;padding-left:22px}.auth-form{gap:12px;margin-top:20px;display:grid}.auth-form label{color:var(--text-main);font-weight:700}.auth-form input{border:1px solid var(--line-soft);min-height:54px;color:var(--text-main);background:#ffffff0a;border-radius:16px;padding:0 16px}.auth-form button,.auth-google-button,.auth-inline-card button{color:#08111f;background:linear-gradient(135deg,#53d6ff 0%,#58f0cf 100%);border:0;border-radius:14px;min-height:48px;font-weight:800}.auth-inline-card{background:#ffffff0a;border:1px solid #91bbff2e;border-radius:18px;gap:12px;margin-top:16px;padding:16px 18px;display:grid}.auth-inline-card p{color:var(--text-muted);margin:0}.avatar-editor{align-items:center;gap:18px;margin-bottom:8px;display:flex}.avatar-editor-actions{gap:10px;display:grid}.avatar-preview{color:#08111f;background:linear-gradient(135deg,#53d6ff 0%,#58f0cf 100%);border-radius:50%;place-items:center;font-weight:900;display:grid;overflow:hidden}.avatar-preview img{object-fit:cover;width:100%;height:100%}.avatar-preview-large{width:96px;height:96px;font-size:2rem}.file-upload-button{color:#08111f;cursor:pointer;background:linear-gradient(135deg,#53d6ff 0%,#58f0cf 100%);border-radius:14px;justify-content:center;align-items:center;min-height:46px;padding:0 16px;font-weight:800;display:inline-flex}.file-upload-button input{display:none}.modal-overlay{z-index:60;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#030812b3;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.modal-card{border:1px solid var(--line-soft);width:min(100%,560px);max-height:min(88vh,760px);box-shadow:var(--shadow-lg);background:#0a1224f2;border-radius:24px;padding:28px;overflow:auto}.modal-header{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px;display:flex}.modal-header h2{margin:6px 0 0}.modal-close{border:1px solid var(--line-soft);width:42px;height:42px;color:var(--text-main);background:#ffffff0a;border-radius:12px;font-size:1.4rem;line-height:1}.text-link-button{color:#9fb2d9;background:0 0;border:0;padding:0;font-size:.9rem;text-decoration:underline}.account-danger-link{margin-top:14px}.inline-confirm-card{background:#ff5f8214;border:1px solid #ff7d953d;border-radius:18px;gap:12px;margin-top:18px;padding:18px;display:grid}.inline-confirm-card h3,.inline-confirm-card p{margin:0}.inline-confirm-actions{flex-wrap:wrap;gap:10px;display:flex}.danger-button{color:#fff;background:linear-gradient(135deg,#ff7d95 0%,#ff4d7a 100%);border:0;border-radius:12px;min-height:44px;padding:0 16px;font-weight:800}.site-header{z-index:30;border:1px solid var(--line-soft);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);max-width:1640px;box-shadow:var(--shadow-lg);background:#070e1cd1;border-radius:26px;justify-content:space-between;align-items:center;gap:24px;margin:0 auto 24px;padding:18px 22px;display:flex;position:sticky;top:16px}.brand-lockup{align-items:center;gap:18px;min-width:0;display:flex}.brand-logo{filter:drop-shadow(0 10px 20px #00000047);width:min(27vw,280px);min-width:180px;display:block}.brand-text{flex-direction:column;gap:4px;display:flex}.brand-text h1{letter-spacing:.04em;margin:0;font-size:1.55rem}.brand-eyebrow{color:var(--accent);letter-spacing:.16em;text-transform:uppercase;margin:0;font-size:.78rem;font-weight:700}.practice-nav{gap:12px;display:flex}.header-actions{align-items:center;gap:14px;margin-left:auto;display:flex}.auth-chip{border:1px solid var(--line-soft);background:#ffffff0a;border-radius:14px;align-items:center;gap:10px;min-width:0;padding:8px 14px;display:flex}.auth-chip-button{cursor:pointer;text-align:left}.auth-chip-copy{flex-direction:column;gap:2px;min-width:0;display:flex}.auth-chip-avatar{color:#08111f;background:linear-gradient(135deg,#53d6ff 0%,#58f0cf 100%);border-radius:50%;flex:none;place-items:center;width:40px;height:40px;font-weight:900;display:grid;overflow:hidden}.auth-chip-avatar img{object-fit:cover;width:100%;height:100%}.auth-chip-label{color:var(--text-muted);letter-spacing:.08em;text-transform:uppercase;font-size:.72rem;font-weight:700}.auth-chip strong{color:var(--text-main);white-space:nowrap;font-size:.95rem}.auth-link-button{height:44px;color:var(--text-main);background:#ffffff08;border:1px solid #91bbff2e;border-radius:999px;padding:0 18px;font-weight:700}.auth-link-button:hover{background:#ffffff14}.practice-tab{height:46px;color:var(--text-main);background:#ffffff08;border:1px solid #91bbff2e;border-radius:999px;padding:0 18px;font-weight:700;transition:all .22s}.practice-tab:hover{background:#ffffff14;border-color:#91bbff59}.practice-tab.is-active{color:#08111f;background:linear-gradient(135deg,#53d6ff 0%,#58f0cf 100%);border-color:#0000;box-shadow:0 8px 24px #58f0cf47}.menu-toggle{border:1px solid var(--line-soft);background:#ffffff0d;border-radius:14px;width:48px;height:48px;padding:0;display:none}.menu-toggle span{background:var(--text-main);width:22px;height:2px;margin:5px auto;transition:transform .2s,opacity .2s;display:block}.menu-toggle.is-open span:first-child{transform:translateY(7px)rotate(45deg)}.menu-toggle.is-open span:nth-child(2){opacity:0}.menu-toggle.is-open span:nth-child(3){transform:translateY(-7px)rotate(-45deg)}.workspace{grid-template-columns:minmax(280px,320px) minmax(0,1fr);align-items:start;gap:24px;max-width:1880px;margin:0 auto;display:grid}.settings-panel{border:1px solid var(--line-soft);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);background:linear-gradient(#111d36fa 0%,#0a1122fa 100%);position:sticky;top:124px;overflow:hidden}.panel-scroll{max-height:calc(100vh - 156px);padding:24px;overflow:auto}.mobile-practice-nav{margin-bottom:18px;display:none}.panel-intro{background:linear-gradient(160deg,#58a7ff1f,#58f0cf0f);border:1px solid #638cff2e;border-radius:18px;margin-bottom:24px;padding:18px}.panel-intro h2{margin:0 0 8px;font-size:1.28rem}.panel-intro p{color:var(--text-muted);margin:0;line-height:1.6}.panel-kicker{color:var(--accent);letter-spacing:.16em;text-transform:uppercase;margin:0 0 10px;font-size:.76rem;font-weight:700}.control-panel{grid-template-columns:1fr;gap:14px;display:grid}.control-item{flex-direction:column;gap:8px;display:flex}.control-item label{color:var(--text-main);letter-spacing:.02em;font-size:.92rem;font-weight:700}.control-item select,.control-item input,.bpm-control input{appearance:none;width:100%;min-height:52px;color:var(--text-main);background:linear-gradient(#f5f8ff14,#ffffff0a),#070e1ca3;border:1px solid #91bbff2e;border-radius:14px;outline:none;padding:0 16px;box-shadow:inset 0 1px #ffffff0a}.control-item select:focus,.control-item input:focus,.bpm-control input:focus{border-color:#58f0cfa6;box-shadow:0 0 0 3px #58f0cf24}.control-item-checkbox{background:#ffffff0a;border:1px solid #91bbff2e;border-radius:14px;padding:14px 16px}.control-item-checkbox label{justify-content:space-between;align-items:center;gap:16px;font-weight:700;display:flex}.control-item-checkbox input{width:18px;height:18px;accent-color:var(--accent-strong)}.action-panel{border-top:1px solid var(--line-soft);margin-top:22px;padding-top:22px}.mobile-action-panel{border:1px solid var(--line-soft);max-width:1880px;box-shadow:var(--shadow-md);background:linear-gradient(#111d36fa 0%,#0a1122fa 100%);border-radius:22px;margin:0 auto 18px;padding:18px;display:none}.button-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.button-row button,.ghost-button{color:#071120;background:linear-gradient(135deg,#58a7ff 0%,#58f0cf 100%);border:0;border-radius:14px;min-height:52px;padding:0 16px;font-weight:800;box-shadow:0 12px 28px #28a1ff3d}.button-row button:disabled,.ghost-button:disabled{opacity:.4;cursor:default;box-shadow:none}.button-row button:nth-child(3),.button-row button:nth-child(4),.ghost-button{color:var(--text-main);box-shadow:none;background:#ffffff14;border:1px solid #91bbff29}.utility-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin-top:12px;display:grid}.bpm-control{color:var(--text-main);flex-direction:column;gap:8px;font-size:.92rem;font-weight:700;display:flex}.sheet-area{justify-content:center;min-width:0;display:flex}.practice-sheet-stack{gap:14px;width:min(100%,1360px);display:grid}.sheet-paper{background:linear-gradient(180deg, #fcfefffa, #f3f8fffa), var(--bg-card);width:min(100%,1360px);min-height:980px;box-shadow:var(--shadow-lg);color:var(--text-dark);border:1px solid #7a9bd52e;border-radius:28px;padding:28px 30px 34px}.sheet-meta{color:#314666;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 24px;font-size:.95rem;display:grid}.sheet-meta-outside{color:#fffffff5;padding:0 6px}.sheet-meta-outside>div{color:#fffffff5}.practice-sheet-paper{min-height:auto}.practice-score-section{padding:14px 14px 16px}.practice-sheet-paper.is-accent-mode .svg-preview-list{gap:10px}.practice-sheet-paper.is-accent-mode .abc-section h2{margin-bottom:8px}.abc-section{background:linear-gradient(#ffffffeb,#f0f6fffa);border:1px solid #31466629;border-radius:22px;padding:18px 18px 20px}.abc-preview{width:100%}.abc-section h2{color:#162746;margin:0 0 14px;font-size:1.3rem}.svg-preview-list{flex-direction:column;gap:18px;display:flex}.abc-preview svg{width:100%;height:auto;display:block}.pattern-svg{display:block;overflow:visible}.accent-text{fill:#111;font-size:58px;font-weight:700}@media (width<=1200px){.workspace{grid-template-columns:minmax(270px,300px) minmax(0,1fr)}.brand-logo{width:210px;min-width:150px}.brand-text h1{font-size:1.32rem}}@media (width<=960px){.app{padding:14px}.site-header{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px 14px;display:grid;top:10px}.brand-lockup{gap:10px;min-width:0}.menu-toggle{display:block}.brand-logo{width:132px;min-width:132px}.brand-text{min-width:0}.brand-text h1{word-break:keep-all;font-size:1rem;line-height:1.1}.brand-eyebrow{letter-spacing:.12em;font-size:.62rem}.header-actions{justify-content:flex-end;justify-self:end;gap:8px;width:auto;min-width:0;margin-left:0}.auth-chip{flex:0 auto;min-width:0;max-width:150px;padding:6px 10px}.auth-chip-label{display:none}.auth-chip strong{text-overflow:ellipsis;white-space:nowrap;font-size:.88rem;display:block;overflow:hidden}.auth-link-button{height:40px;padding:0 12px;font-size:.88rem}.route-nav{-ms-overflow-style:none;scrollbar-width:none;flex-wrap:nowrap;grid-column:1/-1;justify-content:flex-start;align-items:center;gap:8px;width:100%;padding-top:6px;padding-bottom:2px;overflow-x:auto}.route-nav::-webkit-scrollbar{display:none}.route-nav .practice-tab{white-space:nowrap;flex:none;height:40px;padding:0 14px;font-size:.88rem}.workspace{grid-template-columns:1fr}.settings-panel{z-index:25;opacity:0;pointer-events:none;max-height:calc(100vh - 164px);transition:transform .22s,opacity .22s;position:fixed;top:148px;left:14px;right:14px;transform:translateY(-16px)}.settings-panel.is-open{opacity:1;pointer-events:auto;transform:translateY(0)}.mobile-action-panel{display:block}.desktop-action-panel{display:none}.panel-scroll{max-height:calc(100vh - 196px)}.mobile-practice-nav{flex-wrap:wrap;gap:10px;display:flex}.mobile-practice-nav .practice-tab{flex:220px}.sheet-paper{width:min(100%,1100px);min-height:auto;padding:20px 16px 24px}.practice-sheet-stack{width:min(100%,1100px)}.sheet-meta{grid-template-columns:1fr;gap:8px}}@media (width<=640px){.site-header{grid-template-columns:minmax(0,1fr);gap:12px}.brand-lockup{width:100%}.header-actions{justify-content:space-between;justify-self:stretch;width:100%}.mobile-action-panel{border-radius:18px;padding:14px}.brand-logo{width:116px;min-width:116px}.brand-text h1{font-size:.9rem}.brand-eyebrow{font-size:.56rem}.auth-chip{max-width:140px;padding:6px 8px}.auth-chip-avatar{width:32px;height:32px}.auth-link-button{padding:0 10px;font-size:.82rem}.menu-toggle{width:42px;height:42px}.settings-panel{max-height:calc(100vh - 204px);top:188px}.panel-scroll{max-height:calc(100vh - 236px)}.button-row,.utility-row{grid-template-columns:1fr}.abc-section{padding:14px 12px 16px}.abc-section h2{font-size:1.1rem}}@media print{@page{size:A4 portrait;margin:8mm}:root,body{color:#111!important;background:#fff!important}.app{padding:0}.no-print,.site-header,.settings-panel,.app-backdrop{display:none!important}.workspace,.sheet-area{display:block}.sheet-paper{width:100%;max-width:794px;min-height:auto;box-shadow:none;background:#fff;border:none;border-radius:0;padding:0}.abc-section{background:#fff;border:none;padding:0}.abc-section h2{display:none}.svg-preview-list{gap:0}.abc-preview svg{width:100%}.practice-sheet-stack{gap:0;width:100%}.practice-sheet-paper.is-accent-mode .svg-preview-list{gap:0}.practice-sheet-paper.is-accent-mode .vexflow-preview{margin-bottom:-10px}.practice-score-section{padding:0}.vexflow-preview svg{max-width:100%!important;height:auto!important}}.route-nav{flex-wrap:wrap;justify-content:flex-end}.practice-nav-inline{margin-bottom:18px}.fill-editor-sidebar{top:124px}.fill-editor-area .sheet-paper{gap:24px;display:grid}.fill-grid-card,.saved-patterns-card{color:var(--text-dark);background:#f0f5ffb8;border:1px solid #11203d14;border-radius:24px;padding:22px}.fill-grid-header{justify-content:space-between;align-items:end;gap:16px;margin-bottom:16px;display:flex}.fill-grid-header h3,.saved-pattern-item h4{margin:0}.fill-grid-header p,.saved-pattern-item p,.saved-pattern-empty{color:#51627f;margin:0}.saved-pattern-toggle-row{color:#51627f;align-items:center;gap:10px;margin-top:8px;font-weight:700;display:flex}.fill-grid-wrap{overflow-x:auto}.fill-grid{gap:8px;min-width:980px;display:grid}.fill-grid-row{grid-template-columns:132px repeat(16,minmax(0,1fr));gap:8px;display:grid}.fill-grid.is-dense{min-width:980px}.fill-grid.is-dense .fill-grid-row{grid-template-columns:118px repeat(32,minmax(0,1fr));gap:4px}.fill-grid.is-dense .fill-grid-label{min-height:28px;padding:0 10px;font-size:.82rem}.fill-grid.is-dense .fill-grid-cell{border-radius:8px;min-width:0;min-height:20px;padding:0;font-size:.8rem}.fill-grid.is-dense .accent-cell{font-size:.9rem}.fill-grid-label{background:#11203d0f;border-radius:12px;align-items:center;min-height:42px;padding:0 14px;font-weight:700;display:flex}.fill-grid-cell{color:#17315d;background:#fff;border:1px solid #11203d1f;border-radius:12px;min-height:42px;font-weight:800}.fill-grid-cell.is-active{color:#071120;background:linear-gradient(135deg,#58a7ff 0%,#58f0cf 100%);border-color:#0000}.fill-grid-cell.is-playing{box-shadow:inset 0 0 0 2px #8bf55d}.accent-cell{font-size:1.15rem}.saved-pattern-list{gap:12px;display:grid}.saved-pattern-item{background:#ffffffeb;border:1px solid #11203d14;border-radius:16px;justify-content:space-between;align-items:center;gap:16px;padding:16px 18px;display:flex}.saved-pattern-actions{flex-wrap:wrap;gap:10px;display:flex}.saved-pattern-actions button{color:#071120;background:linear-gradient(135deg,#58a7ff 0%,#58f0cf 100%);border:1px solid #11203d14;border-radius:12px;min-height:42px;padding:0 14px;font-weight:800}.saved-pattern-actions .ghost-button{min-height:42px;padding:0 14px}.toggle-switch{background:#8e8e93;border:0;border-radius:999px;flex:none;width:58px;height:32px;padding:0;transition:background .2s;position:relative;box-shadow:inset 0 1px 2px #0000002e}.toggle-switch.is-on{background:#35b4e8}.toggle-switch-thumb{background:#fff;border-radius:50%;width:28px;height:28px;transition:transform .2s;position:absolute;top:2px;left:2px;box-shadow:0 1px 4px #00000047}.toggle-switch.is-on .toggle-switch-thumb{transform:translate(26px)}.editor-hint,.editor-error{margin:14px 0 0;font-size:.92rem}.editor-hint{color:var(--text-muted)}.editor-error{color:#ff9db6}.community-shell{gap:24px;max-width:1500px;margin:0 auto;display:grid}.community-hero{border:1px solid var(--line-soft);box-shadow:var(--shadow-lg);background:radial-gradient(circle at 100% 0,#58f0cf29,#0000 30%),linear-gradient(135deg,#0b1529f0 0%,#0e172be6 100%);border-radius:28px;gap:14px;padding:28px 30px;display:grid}.community-hero h2{margin:0;font-size:clamp(1.9rem,3vw,2.8rem)}.community-hero p{max-width:780px;color:var(--text-muted);margin:0}.community-bpm{border:1px solid var(--line-soft);background:#ffffff0a;border-radius:16px;align-items:center;gap:10px;width:fit-content;padding:10px 14px;display:inline-flex}.community-bpm input{width:88px;min-height:38px;color:var(--text-main);background:#ffffff0a;border:1px solid #91bbff2e;border-radius:12px;padding:0 12px}.community-grid{grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:22px;display:grid}.community-card,.community-empty-card{box-shadow:var(--shadow-md);background:radial-gradient(circle at 0 0,#53d6ff1f,#0000 24%),#f4f8fff5;border:1px solid #a0cbff2e;border-radius:26px;padding:22px}.community-empty-card{color:var(--text-dark)}.community-card-top{justify-content:space-between;align-items:center;gap:12px;display:flex}.community-author{align-items:center;gap:12px;min-width:0;display:flex}.community-avatar{width:48px;height:48px;font-size:1.1rem}.community-author-name,.community-date,.community-card-heading h3,.community-card-heading p{margin:0}.community-author-name{color:var(--text-dark);font-weight:800}.community-date,.community-card-heading p{color:#5b6b87}.community-like-button{color:#445372;background:#ffffffe6;border:1px solid #11203d14;border-radius:999px;align-items:center;gap:8px;min-height:42px;padding:0 14px;font-weight:800;display:inline-flex}.community-like-button.is-liked{color:#fff;background:linear-gradient(135deg,#ff9bc0 0%,#ff6b9c 100%)}.community-card-heading{gap:6px;margin-top:18px;display:grid}.community-card-heading h3{color:var(--text-dark);font-size:1.45rem}.community-score{background:#fff;border:1px solid #11203d14;border-radius:18px;margin-top:16px;padding:12px}.community-score .vf-preview-shell{background:0 0;border:0;padding:0}.community-card-actions{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.community-card-actions button{color:#071120;background:linear-gradient(135deg,#58a7ff 0%,#58f0cf 100%);border:1px solid #11203d14;border-radius:12px;min-height:42px;padding:0 16px;font-weight:800}@media (width<=980px){.route-nav{justify-content:flex-start;width:100%}.header-actions{justify-content:flex-end;width:auto}.auth-chip{flex:0 auto}.saved-pattern-item{flex-direction:column;align-items:flex-start}}@media (width>=720px){.lp-highlight-list,.lp-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lp-feature-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}