.header{background:var(--color-surface);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:var(--z-sticky)}.header-container{max-width:var(--container-xl);margin:0 auto;padding:var(--space-4) var(--space-4);display:flex;align-items:center;justify-content:space-between;gap:var(--space-4)}.logo{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-wide);background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-decoration:none}.nav{display:flex;align-items:center;gap:var(--space-6);flex:1;justify-content:center}.nav a{color:var(--color-text-secondary);font-weight:var(--font-weight-medium);transition:color var(--transition);text-decoration:none}.nav a:hover{color:var(--color-text-primary)}.header-user{display:flex;align-items:center;gap:var(--space-3)}.header-user span{color:var(--color-text-secondary);font-size:var(--font-size-sm);display:none}@media (min-width: 640px){.header-user span{display:inline}}.btn-logout{padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);background:var(--color-surface-hover);border:none;border-radius:var(--border-radius);cursor:pointer;transition:all var(--transition)}.btn-logout:hover{color:var(--color-text-primary);background:var(--color-border)}.btn-sm{padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);text-decoration:none;display:inline-block}.layout{min-height:100vh;display:flex;flex-direction:column}.main-content{flex:1;max-width:var(--container-xl);width:100%;margin:0 auto;padding:var(--space-6) var(--space-4)}@media (min-width: 640px){.main-content{padding:var(--space-8) var(--space-6)}}.error-message{background-color:#fee;border:1px solid #fcc;border-radius:8px;padding:12px 16px;margin-bottom:16px;animation:slideIn .3s ease-out}.error-content{display:flex;align-items:center;gap:12px}.error-icon{font-size:20px;flex-shrink:0}.error-text{flex:1;color:#c33;font-size:14px;line-height:1.5}.error-close{background:none;border:none;font-size:24px;color:#c33;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity .2s}.error-close:hover{opacity:.7}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-4);background:var(--color-background)}.login-card{width:100%;max-width:420px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-xl);padding:var(--space-8);box-shadow:var(--shadow-xl);animation:fadeIn var(--transition-slow)}.login-header{text-align:center;margin-bottom:var(--space-8)}.login-header .logo{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-wide);background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:var(--space-2)}.tagline{color:var(--color-text-secondary);font-size:var(--font-size-sm)}.login-form{display:flex;flex-direction:column;gap:var(--space-5)}.form-group label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.login-footer{margin-top:var(--space-6);text-align:center;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.login-footer a{color:var(--color-primary);font-weight:var(--font-weight-medium)}.card-musica{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-5);min-height:140px;text-decoration:none;color:inherit}.card-musica-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-2)}.card-musica-titulo{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);line-height:var(--line-height-tight)}.card-musica-artista{font-size:var(--font-size-sm);color:var(--color-text-secondary);flex:1}.card-musica-footer{margin-top:auto;display:flex;align-items:center;gap:var(--space-2)}.badge-favorito{color:var(--color-acorde);font-size:var(--font-size-lg);line-height:1}.badge-tom{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);border-radius:var(--border-radius-full);background:var(--color-acorde-bg);color:var(--color-acorde);font-family:var(--font-mono);font-weight:var(--font-weight-bold)}.loading-container{display:flex;align-items:center;justify-content:center;min-height:200px;padding:var(--space-8)}.loading-spinner{width:40px;height:40px;border:3px solid var(--color-surface);border-top-color:var(--color-primary);border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.home-container{animation:fadeIn var(--transition-slow)}.home-header{display:flex;flex-direction:column;gap:var(--space-4);margin-bottom:var(--space-6)}@media (min-width: 640px){.home-header{flex-direction:row;align-items:center;justify-content:space-between}}.home-header h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-tight)}.search-container{margin-bottom:var(--space-6)}.search-input{width:100%;padding:var(--space-4);font-size:var(--font-size-base);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-lg)}.search-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-subtle)}.musicas-grid{display:grid;grid-template-columns:1fr;gap:var(--space-4);animation:fadeIn var(--transition-slow)}@media (min-width: 480px){.musicas-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 768px){.musicas-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-5)}}@media (min-width: 1024px){.musicas-grid{grid-template-columns:repeat(3,1fr);gap:var(--space-6)}}@media (min-width: 1280px){.musicas-grid{grid-template-columns:repeat(4,1fr)}}.linha-cifra{margin-bottom:var(--cifra-gap);padding:var(--space-1) 0;transition:background var(--transition-fast);border-radius:var(--border-radius-sm)}.linha-cifra.com-numero{display:flex;gap:var(--space-3);align-items:flex-start}.numero-linha{font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--color-text-muted);font-weight:var(--font-weight-medium);min-width:32px;text-align:right;padding-top:2px;-webkit-user-select:none;user-select:none;opacity:.6}.linha-conteudo{flex:1;min-width:0}.linha-cifra:hover{background:var(--color-surface)}.linha-cifra.linha-vazia{min-height:.8em;margin-bottom:var(--space-4);padding:0}.linha-cifra.linha-vazia:hover{background:transparent}.linha-cifra.linha-vazia .linha-acordes,.linha-cifra.linha-vazia .linha-letra{display:none}.linha-acordes{font-family:var(--font-mono);font-size:var(--cifra-acorde-size);color:var(--color-acorde);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;letter-spacing:var(--letter-spacing-normal);min-height:1.4em;-webkit-user-select:all;user-select:all;text-shadow:0 0 20px var(--color-acorde-glow)}.linha-letra{font-family:var(--font-mono);font-size:var(--cifra-letra-size);color:var(--color-letra);line-height:var(--cifra-line-height);white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;letter-spacing:var(--letter-spacing-normal);-webkit-user-select:all;user-select:all}.acorde-inline{color:var(--color-acorde);font-weight:var(--font-weight-bold);text-shadow:0 0 8px var(--color-acorde-glow);padding:0 2px;background:var(--color-acorde-bg);border-radius:3px}.linha-solo{margin-bottom:var(--space-3)}.linha-solo .linha-acordes{font-size:calc(var(--cifra-acorde-size) * 1.1);padding:var(--space-2) 0;background:var(--color-acorde-bg);border-left:3px solid var(--color-acorde);padding-left:var(--space-3);border-radius:var(--border-radius-sm)}.modo-palco .linha-solo{margin-bottom:var(--space-4)}.modo-palco .linha-solo .linha-acordes{font-size:calc(var(--stage-acorde-size) * 1.15);padding:var(--space-3) 0;padding-left:var(--space-4);border-left-width:4px}.modo-palco .linha-cifra{margin-bottom:var(--space-1)}@media (min-width: 375px){.modo-palco .linha-cifra{margin-bottom:var(--space-2)}}@media (min-width: 768px){.modo-palco .linha-cifra{margin-bottom:var(--space-3)}}.modo-palco .linha-acordes{font-size:var(--stage-acorde-size);text-shadow:0 0 30px var(--color-acorde-glow)}.modo-palco .linha-letra{font-size:var(--stage-letra-size);line-height:var(--stage-line-height);word-wrap:break-word;overflow-wrap:break-word}.modo-palco .linha-cifra{animation:slideUp var(--transition-slow) ease-out;animation-fill-mode:both}.modo-palco .linha-cifra:nth-child(1){animation-delay:0ms}.modo-palco .linha-cifra:nth-child(2){animation-delay:30ms}.modo-palco .linha-cifra:nth-child(3){animation-delay:60ms}.modo-palco .linha-cifra:nth-child(4){animation-delay:90ms}.modo-palco .linha-cifra:nth-child(5){animation-delay:.12s}.cifra-viewer{padding:var(--space-4);background:var(--color-background-subtle);border-radius:var(--border-radius-lg);max-width:100%;overflow-x:hidden;overflow-y:visible;word-wrap:break-word;-webkit-overflow-scrolling:touch}@media (min-width: 768px){.cifra-viewer{padding:var(--space-6)}}.modo-palco .cifra-viewer{background:transparent;padding:0;border-radius:0;overflow-x:hidden}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:var(--space-4);z-index:var(--z-modal-backdrop);animation:fadeIn var(--transition-fast)}.modal-content{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-xl);box-shadow:var(--shadow-xl);max-width:420px;width:100%;max-height:90vh;overflow:auto;animation:scaleIn var(--transition);z-index:var(--z-modal)}.modal-content:focus{outline:none}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--color-border)}.modal-header h2{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold)}.modal-close{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--border-radius);color:var(--color-text-muted);transition:all var(--transition)}.modal-close:hover{background:var(--color-surface-hover);color:var(--color-text-primary)}.modal-body{padding:var(--space-5)}@media (prefers-reduced-motion: reduce){.modal-overlay,.modal-content{animation:none}}.modal-transposicao{padding:var(--space-4)}.modal-info{margin-bottom:var(--space-5);color:var(--color-text-secondary);text-align:center;font-size:var(--font-size-sm)}.modal-info strong{color:var(--color-acorde);font-family:var(--font-mono);font-size:var(--font-size-lg)}.tons-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-2)}.btn-tom-opcao{aspect-ratio:1;display:flex;align-items:center;justify-content:center;padding:var(--space-3);background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--border-radius-lg);color:var(--color-text-primary);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);font-family:var(--font-mono);cursor:pointer;transition:all var(--transition)}.btn-tom-opcao:hover{background:var(--color-surface-hover);border-color:var(--color-primary);transform:scale(1.05)}.btn-tom-opcao:active{transform:scale(.98)}.btn-tom-opcao.ativo{background:var(--gradient-primary);border-color:var(--color-primary);color:#fff;box-shadow:var(--shadow-glow)}@media (max-width: 400px){.tons-grid{grid-template-columns:repeat(3,1fr)}}.detalhe-musica-container{animation:fadeIn var(--transition-slow)}.detalhe-header{display:flex;flex-direction:column;gap:var(--space-4);margin-bottom:var(--space-6);padding-bottom:var(--space-4);border-bottom:1px solid var(--color-border)}@media (min-width: 768px){.detalhe-header{flex-direction:row;align-items:center;justify-content:space-between}}.btn-back{padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);background:var(--color-surface);border-radius:var(--border-radius);transition:all var(--transition)}.btn-back:hover{color:var(--color-text-primary);background:var(--color-surface-hover)}.musica-info{flex:1}.musica-info h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-1)}.musica-info .artista{font-size:var(--font-size-base);color:var(--color-text-secondary)}.musica-actions{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap}.btn-tom{padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);color:var(--color-text-secondary);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius);transition:all var(--transition)}.btn-tom:hover{border-color:var(--color-primary);color:var(--color-primary)}.btn-tom strong{color:var(--color-acorde);font-family:var(--font-mono)}.btn-favorito{width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xl);color:var(--color-text-muted);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius);transition:all var(--transition)}.btn-favorito:hover{background:var(--color-danger-subtle);color:var(--color-danger);border-color:var(--color-danger)}.btn-favorito.active{color:var(--color-danger);border-color:var(--color-danger)}.cadastro-musica-container{animation:fadeIn var(--transition-slow)}.cadastro-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-6)}.cadastro-header h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold)}.form-musica{max-width:800px;display:flex;flex-direction:column;gap:var(--space-5)}.form-row{display:flex;gap:var(--space-4);flex-wrap:wrap}.form-row .form-group{flex:1;min-width:200px}.form-row .flex-1{flex:1}.form-row .flex-2{flex:2}.form-group{display:flex;flex-direction:column;gap:var(--space-2)}.form-group label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);display:flex;flex-direction:column;gap:var(--space-1)}.label-help{font-size:var(--font-size-xs);font-weight:var(--font-weight-normal);color:var(--color-text-muted)}.form-actions{display:flex;gap:var(--space-3);padding-top:var(--space-4)}.error-message{padding:var(--space-3) var(--space-4);background:var(--color-danger-subtle);border:1px solid var(--color-danger);color:var(--color-danger);border-radius:var(--border-radius);font-size:var(--font-size-sm);animation:slideDown var(--transition-slow)}.favoritos-container{animation:fadeIn var(--transition-slow)}.favoritos-header{margin-bottom:var(--space-6)}.favoritos-header h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-tight)}.modo-palco{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-background);z-index:var(--z-modal);display:flex;flex-direction:column;overflow:hidden}.modo-palco-header-fixed{position:fixed;top:0;left:0;right:0;height:60px;display:flex;align-items:center;gap:var(--space-3);padding:0 var(--space-2);background:#09090bf2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border);z-index:1000;box-shadow:var(--shadow-md)}@media (min-width: 480px){.modo-palco-header-fixed{height:70px;padding:0 var(--space-4);gap:var(--space-4)}}@media (min-width: 768px){.modo-palco-header-fixed{height:80px;padding:0 var(--space-6)}}.btn-voltar-fixo{display:flex;align-items:center;justify-content:center;gap:var(--space-1);padding:var(--space-2) var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-full);color:var(--color-text-primary);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);transition:all var(--transition);cursor:pointer;flex-shrink:0}@media (min-width: 480px){.btn-voltar-fixo{padding:var(--space-2) var(--space-4);font-size:var(--font-size-base)}}.btn-voltar-fixo:hover{background:var(--color-surface-hover);border-color:var(--color-primary);transform:translate(-2px)}.btn-voltar-fixo:active{transform:scale(.95)}.musica-info-header{flex:1;text-align:center;overflow:hidden}.musica-info-header h1{font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (min-width: 480px){.musica-info-header h1{font-size:var(--font-size-base)}}@media (min-width: 768px){.musica-info-header h1{font-size:var(--font-size-lg)}}.musica-info-header p{font-size:var(--font-size-xs);color:var(--color-text-secondary);margin:var(--space-1) 0 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (min-width: 480px){.musica-info-header p{font-size:var(--font-size-sm)}}.cifra-palco{flex:1;overflow-y:auto;overflow-x:hidden;padding:70px var(--space-3) var(--space-6);scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--color-border) transparent}.modo-palco.no-scroll .cifra-palco{overflow-y:hidden;display:flex;align-items:center;justify-content:center}.cifra-palco::-webkit-scrollbar{width:6px}.cifra-palco::-webkit-scrollbar-track{background:transparent}.cifra-palco::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--border-radius-full)}.cifra-palco::-webkit-scrollbar-thumb:hover{background:var(--color-border-subtle)}.scroll-indicator{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background:#0009;color:#fff;padding:8px 16px;border-radius:20px;font-size:24px;animation:bounce 2s infinite;pointer-events:none;z-index:999}@keyframes bounce{0%,20%,50%,80%,to{transform:translate(-50%) translateY(0)}40%{transform:translate(-50%) translateY(-10px)}60%{transform:translate(-50%) translateY(-5px)}}@media (min-width: 480px){.cifra-palco{padding:80px var(--space-4) var(--space-8)}}@media (min-width: 768px){.cifra-palco{padding:90px var(--space-8) var(--space-10)}}@media (min-width: 1024px){.cifra-palco{padding:100px var(--space-16) var(--space-12)}}.repertorios-container{max-width:800px;margin:0 auto;padding:var(--space-4)}.repertorios-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-6);gap:var(--space-3)}.repertorios-header h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0}.repertorios-lista{display:flex;flex-direction:column;gap:var(--space-4)}.repertorio-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-lg);padding:var(--space-4);transition:all var(--transition)}.repertorio-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md)}.repertorio-link{display:block;text-decoration:none;color:inherit;margin-bottom:var(--space-3)}.repertorio-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);margin-bottom:var(--space-2)}.repertorio-titulo{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0;display:flex;align-items:center;gap:var(--space-2)}.repertorio-info{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0}.repertorio-actions{display:flex;gap:var(--space-2);padding-top:var(--space-3);border-top:1px solid var(--color-border)}.badge{padding:4px 12px;border-radius:var(--border-radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);background:var(--color-surface-hover);color:var(--color-text-secondary)}.badge-public{background:var(--color-primary);color:#fff}.btn-sm{padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm)}@media (max-width: 640px){.repertorios-header{flex-direction:column;align-items:stretch}.repertorios-header h1{font-size:var(--font-size-xl)}}.criar-repertorio-container{max-width:800px;margin:0 auto;padding:var(--space-4)}.page-header{display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-6)}.page-header h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0}.btn-back{background:none;border:none;font-size:var(--font-size-base);color:var(--color-primary);cursor:pointer;padding:var(--space-2);transition:all var(--transition)}.btn-back:hover{transform:translate(-4px)}.repertorio-form{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-lg);padding:var(--space-6)}.form-group{margin-bottom:var(--space-4)}.form-group label{display:block;margin-bottom:var(--space-2);font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}.form-group input{width:100%;padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--border-radius-md);background:var(--color-background);color:var(--color-text-primary);font-size:var(--font-size-base);transition:all var(--transition)}.form-group input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #6366f11a}.form-group-checkbox{display:flex;align-items:flex-start;gap:var(--space-3);margin-bottom:var(--space-6)}.form-group-checkbox input[type=checkbox]{margin-top:4px;width:20px;height:20px;cursor:pointer}.form-group-checkbox label{cursor:pointer;font-weight:var(--font-weight-semibold);display:flex;flex-direction:column;gap:var(--space-1)}.label-description{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:var(--font-weight-normal)}.musicas-section{margin-bottom:var(--space-6)}.musicas-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-4)}.musicas-header h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0}.empty-musicas{text-align:center;padding:var(--space-8);color:var(--color-text-secondary);background:var(--color-background);border:2px dashed var(--color-border);border-radius:var(--border-radius-md)}.musicas-lista{display:flex;flex-direction:column;gap:var(--space-2)}.musica-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--border-radius-md);transition:all var(--transition)}.musica-item:hover{border-color:var(--color-primary)}.musica-ordem{font-weight:var(--font-weight-bold);color:var(--color-text-secondary);min-width:24px}.musica-info{flex:1;display:flex;flex-direction:column;gap:var(--space-1);overflow:hidden}.musica-titulo{font-weight:var(--font-weight-semibold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.musica-artista{font-size:var(--font-size-sm);color:var(--color-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.btn-remove{background:none;border:none;cursor:pointer;padding:var(--space-1);font-size:16px;transition:transform var(--transition)}.btn-remove:hover{transform:scale(1.2)}.form-actions{display:flex;gap:var(--space-3);justify-content:flex-end}.modal-musicas-lista{max-height:400px;overflow-y:auto;display:flex;flex-direction:column;gap:var(--space-2)}.modal-musica-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--border-radius-md);cursor:pointer;transition:all var(--transition)}.modal-musica-item:hover{background:var(--color-surface-hover);border-color:var(--color-primary)}.modal-musica-item.selected{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.modal-musica-item.selected .musica-artista{color:#fffc}.modal-musica-item input[type=checkbox]{width:20px;height:20px;cursor:pointer}@media (max-width: 640px){.page-header h1{font-size:var(--font-size-xl)}.repertorio-form{padding:var(--space-4)}.musicas-header{flex-direction:column;align-items:stretch;gap:var(--space-3)}.form-actions{flex-direction:column}.form-actions button{width:100%}}.visualizar-repertorio{min-height:100vh;background:var(--color-background);padding-bottom:80px}.repertorio-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-4);background:var(--color-surface);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:100}.btn-fechar{background:none;border:none;font-size:var(--font-size-base);color:var(--color-primary);cursor:pointer;padding:var(--space-2);font-weight:var(--font-weight-semibold);transition:all var(--transition);display:flex;align-items:center;gap:var(--space-2)}.btn-fechar:hover{transform:translate(-4px)}.btn-fechar-icon{background:none;border:none;font-size:24px;color:var(--color-text-secondary);cursor:pointer;padding:var(--space-2);transition:all var(--transition)}.btn-fechar-icon:hover{color:var(--color-text-primary);transform:rotate(90deg)}.musica-contador{text-align:center;padding:var(--space-3);font-size:var(--font-size-sm);color:var(--color-text-secondary);background:var(--color-surface-hover);border-bottom:1px solid var(--color-border)}.musica-info-box{max-width:800px;margin:0 auto;padding:var(--space-6) var(--space-4);text-align:center}.musica-info-box h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0 0 var(--space-2) 0}.musica-info-box p{font-size:var(--font-size-lg);color:var(--color-text-secondary);margin:0 0 var(--space-4) 0}.btn-tom-repertorio{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--color-primary);color:#fff;border:none;border-radius:var(--border-radius-full);font-size:var(--font-size-base);cursor:pointer;transition:all var(--transition)}.btn-tom-repertorio:hover{background:var(--color-primary-hover);transform:scale(1.05)}.cifra-container{max-width:800px;margin:0 auto;padding:0 var(--space-4)}.nav-musicas{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-between;padding:var(--space-3) var(--space-4);background:transparent;z-index:100;pointer-events:none}.btn-nav{min-width:80px;height:40px;padding:var(--space-2) var(--space-3);background:#0000004d;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#ffffffb3;border:1px solid rgba(255,255,255,.1);border-radius:var(--border-radius-full);font-size:var(--font-size-sm);font-weight:var(--font-weight-normal);cursor:pointer;transition:all var(--transition);pointer-events:auto;opacity:.6}.btn-nav:hover:not(:disabled){background:#00000080;color:#fff;opacity:.9}.btn-nav:active:not(:disabled){transform:scale(.95)}.btn-nav:disabled{opacity:.2;cursor:not-allowed}@media (max-width: 640px){.musica-info-box h1{font-size:var(--font-size-xl)}.musica-info-box p{font-size:var(--font-size-base)}.btn-fechar{font-size:var(--font-size-sm);max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-musicas{padding:var(--space-2) var(--space-3)}.btn-nav{font-size:var(--font-size-xs);min-width:70px;height:36px}}@media (min-width: 768px){.btn-nav{min-width:100px}}:root{--color-background: #09090b;--color-background-subtle: #0f0f12;--color-surface: #18181b;--color-surface-elevated: #1f1f23;--color-surface-hover: #27272a;--color-border: #27272a;--color-border-subtle: #3f3f46;--color-text-primary: #fafafa;--color-text-secondary: #a1a1aa;--color-text-muted: #71717a;--color-primary: #8b5cf6;--color-primary-hover: #7c3aed;--color-primary-subtle: rgba(139, 92, 246, .15);--color-primary-glow: rgba(139, 92, 246, .4);--color-success: #10b981;--color-success-subtle: rgba(16, 185, 129, .15);--color-danger: #ef4444;--color-danger-subtle: rgba(239, 68, 68, .15);--color-warning: #f59e0b;--color-acorde: #fcd34d;--color-acorde-hover: #fbbf24;--color-acorde-bg: rgba(252, 211, 77, .08);--color-acorde-glow: rgba(252, 211, 77, .3);--color-letra: #e4e4e7;--gradient-primary: linear-gradient(135deg, #8b5cf6 0%, #6366f1 100%);--gradient-surface: linear-gradient(180deg, #18181b 0%, #09090b 100%);--gradient-glow: radial-gradient(ellipse at center, var(--color-primary-glow) 0%, transparent 70%);--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Courier New", monospace;--font-display: "Inter", sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--letter-spacing-tight: -.025em;--letter-spacing-normal: 0;--letter-spacing-wide: .025em;--space-px: 1px;--space-0: 0;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--border-radius-sm: 6px;--border-radius: 10px;--border-radius-lg: 14px;--border-radius-xl: 20px;--border-radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4), 0 2px 4px -2px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5), 0 4px 6px -4px rgba(0, 0, 0, .4);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .5), 0 8px 10px -6px rgba(0, 0, 0, .4);--shadow-glow: 0 0 20px var(--color-primary-glow);--shadow-acorde: 0 0 12px var(--color-acorde-glow);--transition-fast: .1s cubic-bezier(.4, 0, .2, 1);--transition: .15s cubic-bezier(.4, 0, .2, 1);--transition-slow: .3s cubic-bezier(.4, 0, .2, 1);--transition-spring: .5s cubic-bezier(.175, .885, .32, 1.275);--z-dropdown: 100;--z-sticky: 200;--z-modal-backdrop: 300;--z-modal: 400;--z-toast: 500;--cifra-line-height: 2;--cifra-acorde-size: 1.125rem;--cifra-letra-size: 1.0625rem;--cifra-gap: .375rem;--stage-acorde-size: 1.25rem;--stage-letra-size: 1rem;--stage-line-height: 1.8;--container-sm: 640px;--container-md: 768px;--container-lg: 1024px;--container-xl: 1280px}@media (min-width: 375px){:root{--stage-acorde-size: 1.375rem;--stage-letra-size: 1.125rem;--stage-line-height: 1.9}}@media (min-width: 480px){:root{--stage-acorde-size: 1.5rem;--stage-letra-size: 1.25rem;--stage-line-height: 2}}@media (min-width: 640px){:root{--stage-acorde-size: 1.75rem;--stage-letra-size: 1.375rem;--stage-line-height: 2.1}}@media (min-width: 768px){:root{--stage-acorde-size: 2rem;--stage-letra-size: 1.625rem;--stage-line-height: 2.25}}@media (min-width: 1024px){:root{--stage-acorde-size: 2.5rem;--stage-letra-size: 2rem;--stage-line-height: 2.5}}[data-theme=light]{--color-background: #fafafa;--color-background-subtle: #f4f4f5;--color-surface: #ffffff;--color-surface-elevated: #ffffff;--color-surface-hover: #f4f4f5;--color-border: #e4e4e7;--color-border-subtle: #d4d4d8;--color-text-primary: #18181b;--color-text-secondary: #52525b;--color-text-muted: #a1a1aa;--color-primary: #7c3aed;--color-primary-hover: #6d28d9;--color-primary-subtle: rgba(124, 58, 237, .1);--color-primary-glow: rgba(124, 58, 237, .2);--color-acorde: #b45309;--color-acorde-hover: #92400e;--color-acorde-bg: rgba(180, 83, 9, .08);--color-acorde-glow: rgba(180, 83, 9, .15);--color-letra: #3f3f46;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{height:100%;scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{min-height:100%;font-family:var(--font-sans);font-size:var(--font-size-base);font-weight:var(--font-weight-normal);color:var(--color-text-primary);background:var(--color-background);line-height:var(--line-height-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}#root{min-height:100vh;display:flex;flex-direction:column}:focus{outline:none}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:var(--border-radius-sm)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition)}a:hover{color:var(--color-primary-hover)}button{font-family:inherit;font-size:inherit;cursor:pointer;border:none;background:none;color:inherit;-webkit-tap-highlight-color:transparent}button:disabled{cursor:not-allowed;opacity:.5}input,textarea,select{font-family:inherit;font-size:var(--font-size-base);width:100%;padding:var(--space-3) var(--space-4);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius);color:var(--color-text-primary);transition:all var(--transition)}input::placeholder,textarea::placeholder{color:var(--color-text-muted)}input:hover,textarea:hover,select:hover{border-color:var(--color-border-subtle)}input:focus,textarea:focus,select:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-subtle)}textarea{resize:vertical;min-height:120px}select{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23a1a1aa' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10l-5 5z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--space-3) center;padding-right:var(--space-10)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);line-height:1;border-radius:var(--border-radius);transition:all var(--transition);white-space:nowrap;-webkit-user-select:none;user-select:none}.btn-primary{background:var(--gradient-primary);color:#fff;box-shadow:var(--shadow-md),0 0 0 0 var(--color-primary-glow)}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:var(--shadow-lg),0 0 20px var(--color-primary-glow)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-secondary{background:var(--color-surface);color:var(--color-text-primary);border:1px solid var(--color-border)}.btn-secondary:hover:not(:disabled){background:var(--color-surface-hover);border-color:var(--color-primary);color:var(--color-primary)}.btn-ghost{background:transparent;color:var(--color-text-secondary)}.btn-ghost:hover:not(:disabled){background:var(--color-surface);color:var(--color-text-primary)}.btn-danger{background:var(--color-danger-subtle);color:var(--color-danger);border:1px solid var(--color-danger)}.btn-danger:hover:not(:disabled){background:var(--color-danger);color:#fff;box-shadow:var(--shadow-md)}.btn-danger:active:not(:disabled){transform:translateY(0)}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-lg);padding:var(--space-5);transition:all var(--transition)}.card-interactive{cursor:pointer}.card-interactive:hover{border-color:var(--color-primary);box-shadow:var(--shadow-lg),0 0 0 1px var(--color-primary-subtle);transform:translateY(-2px)}.skeleton{background:linear-gradient(90deg,var(--color-surface) 25%,var(--color-surface-hover) 50%,var(--color-surface) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--border-radius)}.skeleton-text{height:1em;margin-bottom:var(--space-2)}.skeleton-title{height:1.5em;width:60%;margin-bottom:var(--space-3)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--space-16) var(--space-6);animation:fadeIn var(--transition-slow)}.empty-state-icon{font-size:var(--font-size-5xl);margin-bottom:var(--space-4);opacity:.3}.empty-state-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--space-2)}.empty-state-description{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-bottom:var(--space-6);max-width:300px}.container{width:100%;max-width:var(--container-lg);margin:0 auto;padding:0 var(--space-4)}@media (min-width: 640px){.container{padding:0 var(--space-6)}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--border-radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-border-subtle)}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}