:root{--bg:#d9d0bc;--bg-2:#cfc4ab;--panel:#ece2cc;--panel-2:#f3ecdc;--line:rgba(71, 58, 34, .12);--line-2:rgba(71, 58, 34, .18);--text:#33291d;--muted:#6d624f;--shadow:0 12px 30px rgba(74, 59, 33, .08);--voice-chest-rgb:0,128,128;--voice-mix-rgb:255,128,45;--voice-head-rgb:128,0,0;--c-expresion:#b08968;--c-tecnica:#7a9e9f;--c-afinacion:#c08497;--c-general:#a3a380;--c-breathing:#87a96b;--c-intonation:#c08497;--c-diction:#6f9fb3;--c-expression:#b08968;--c-custom:#8c7aa9}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{background:radial-gradient(circle at top left,rgba(255,255,255,.18),transparent 24%),linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 100%);color:var(--text);font-family:Georgia,Bookerly,Palatino Linotype,Times New Roman,serif;overflow-x:hidden}button,input,select,textarea{font:inherit}img{max-width:100%}textarea{resize:vertical}.app-shell{min-height:100vh;padding:12px}.page{max-width:1380px;margin:0 auto}.topbar{position:sticky;top:10px;z-index:30;display:flex;flex-direction:column;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:18px;background:#f3ecdcf0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow)}.topbar-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.topbar-left,.topbar-right{display:flex;align-items:center;gap:10px;min-width:0;flex-wrap:wrap}.toolbar-compact{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.toolbar-compact--voices{display:flex;align-items:center;gap:10px;flex-wrap:nowrap}.action-button{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 12px;border:1px solid var(--line);border-radius:12px;background:#f7f0e1;color:var(--text);cursor:pointer;transition:.16s ease}.action-button:hover,.voice-button:hover,.songs-toggle-button:hover,.mode-button:hover,.voice-clear-button:hover,.mini-action:hover,.teacher-toggle-btn:hover,.drawer-mini-btn:hover,.copy-modal-btn:hover{filter:brightness(.98)}.action-button:disabled{opacity:.5;cursor:not-allowed;filter:none}.action-icon{display:flex;align-items:center;justify-content:center;width:16px;height:16px}.action-label{font-size:.93rem;font-weight:700}.svg-icon{width:18px;height:18px;display:block}.custom-voice-icon{width:20px;height:20px;display:block;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none}.voice-button{display:inline-flex;align-items:center;gap:6px;min-width:88px;height:40px;padding:0 10px;border-radius:12px;border:1px solid var(--line);background:#f7f0e1;color:var(--text);cursor:pointer;transition:.16s ease}.voice-button-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px}.voice-button-label{font-size:.9rem;font-weight:800}.voice-button--chest{color:rgb(var(--voice-chest-rgb));border-color:rgba(var(--voice-chest-rgb),.35)}.voice-button--mix{color:rgb(var(--voice-mix-rgb));border-color:rgba(var(--voice-mix-rgb),.35)}.voice-button--head{color:rgb(var(--voice-head-rgb));border-color:rgba(var(--voice-head-rgb),.35)}.voice-button.is-active{box-shadow:0 0 0 2px #473a221a inset}.voice-clear-button{height:40px;padding:0 12px;border:1px solid var(--line);border-radius:12px;background:#f7f0e1;color:var(--text);cursor:pointer;font-weight:700}.voice-clear-button:disabled{opacity:.5;cursor:not-allowed;filter:none}.mode-button,.songs-toggle-button{height:40px;border-radius:12px;border:1px solid var(--line);background:#f7f0e1;color:var(--text);padding:0 12px;cursor:pointer;font-weight:700;display:inline-flex;align-items:center;gap:8px}.mode-button.is-edit{color:#8b6232}.mode-button.is-select{color:#4c5c72}.mode-button--icon,.songs-toggle-button--icon{width:42px;min-width:42px;justify-content:center;padding:0}.mode-button--icon span,.songs-toggle-button--icon span{display:none}.subbar{margin-top:12px;padding:10px 14px;border:1px solid var(--line);border-radius:18px;background:#f3ecdceb;box-shadow:var(--shadow)}.song-header-row.minimal{display:flex;align-items:center;gap:10px;width:100%}.song-title-inline.minimal{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700;font-size:1.05rem;border:none;background:transparent;color:var(--text);outline:none;padding:0;height:28px}.song-title-inline.minimal::placeholder{color:#7c715d}.difficulty-dot-wrapper{display:flex;align-items:center}.difficulty-dot{width:14px;height:14px;border-radius:50%;border:none;cursor:pointer;flex-shrink:0;box-shadow:0 0 0 1px #0000001f inset}.difficulty-dot-beginner{background:#2d7d32}.difficulty-dot-intermediate{background:#d48a12}.difficulty-dot-advanced{background:#a32828}.sr-only-select{position:absolute;left:-9999px;opacity:0;pointer-events:none;width:1px;height:1px}.song-meta-footer{margin-top:12px;padding:0 4px;display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:.9rem}.workspace-frame{position:relative;margin-top:12px}.editor-wrap{min-width:0}.editor-card{min-height:calc(100vh - 230px);border:1px solid var(--line);border-radius:22px;background:var(--panel-2);box-shadow:var(--shadow);padding:24px 24px 48px;position:relative}.editor-card.has-comments-space{padding-right:500px}.editor-host{position:relative}.ProseMirror,.editor-surface{min-height:calc(100vh - 300px);outline:none;line-height:1.82;font-size:1.12rem;color:var(--text);white-space:pre-wrap;word-break:normal;overflow-wrap:normal;user-select:text;-webkit-user-select:text}.ProseMirror p{margin:.4rem 0}.ProseMirror[contenteditable=false]{cursor:text;-webkit-user-select:text;user-select:text}.ProseMirror *{-webkit-user-select:text;user-select:text}.voice-mark{display:inline;padding:0;margin:0;border-radius:0;background:transparent!important;box-shadow:none!important;font-weight:inherit!important;white-space:normal}.voice-chest{color:rgb(var(--voice-chest-rgb))}.voice-mix{color:rgb(var(--voice-mix-rgb))}.voice-head{color:rgb(var(--voice-head-rgb))}.ProseMirror::selection,.ProseMirror *::selection{background:#4b6c9238;color:inherit}.comment-mark{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;text-decoration-style:solid;text-decoration-color:var(--comment-color, #b08968)}.hide-comments .comment-mark{text-decoration:none}.comment-floating{position:absolute;pointer-events:none;z-index:2}.comment-guide-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:1}.comment-guide-path{fill:none;stroke:var(--comment-color, #b08968);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.9}.comment-bubble{position:relative;background:#fff7e8;border:1px solid var(--comment-color, var(--line-2));border-radius:18px;padding:0 44px 0 0;box-shadow:var(--shadow);pointer-events:auto;min-height:56px;overflow:hidden}.comment-delete-btn{position:absolute;top:50%;right:10px;transform:translateY(-50%);width:26px;height:26px;border:none;background:transparent;color:var(--muted);display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:8px}.comment-delete-btn:hover{background:#0000000d;color:var(--text)}.comment-delete-btn .svg-icon{width:14px;height:14px}.comment-bubble-head{display:flex;align-items:stretch;min-width:0;min-height:56px}.comment-type-pill{display:flex;align-items:center;justify-content:center;min-width:90px;padding:0 14px;background:#e2d5b8;font-size:.9rem;font-weight:500;color:#786b64;flex:0 0 auto}.comment-bubble-inline-text{display:flex;align-items:center;min-width:0;flex:1 1 auto;padding:8px 16px;font-size:1rem;line-height:1.15;color:#6d625d;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.comment-bubble-body{display:none}.comment-type-general .comment-type-pill,.comment-chip.comment-type-general{background:#efe2c5}.comment-type-breathing .comment-type-pill,.comment-chip.comment-type-breathing{background:#dfeeda}.comment-type-intonation .comment-type-pill,.comment-chip.comment-type-intonation{background:#fde5c9}.comment-type-diction .comment-type-pill,.comment-chip.comment-type-diction{background:#d8edf1}.comment-type-expression .comment-type-pill,.comment-chip.comment-type-expression{background:#f0ddea}.comment-type-custom .comment-type-pill,.comment-chip.comment-type-custom{background:#e8def3}.comment-dock-mobile{margin-top:10px;display:flex;gap:8px;overflow:auto;padding:2px 2px 4px;scroll-snap-type:x proximity}.comment-chip{min-width:180px;max-width:260px;display:flex;flex-direction:column;gap:4px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:#fff7e8;color:var(--text);box-shadow:var(--shadow);text-align:left;flex:0 0 auto;scroll-snap-align:start}.comment-chip-type{font-size:.72rem;font-weight:700;color:#5e513e}.comment-chip-text{font-size:.8rem;line-height:1.35;color:var(--text)}.teacher-panel{margin-top:12px;padding:14px;border:1px solid var(--line);border-radius:18px;background:#f3ecdceb;box-shadow:var(--shadow)}.teacher-panel-header{margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:12px}.teacher-panel-header h3{margin:0;font-size:1.02rem}.teacher-toggle-btn{height:36px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:#f7f0e1;color:var(--text);cursor:pointer;font-size:.88rem}.teacher-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.teacher-field{display:flex;flex-direction:column;gap:6px}.teacher-field.compact{gap:6px}.teacher-field.full{grid-column:1/-1}.teacher-field label{font-size:.9rem;color:var(--muted);font-weight:700}.teacher-field textarea{min-height:92px;border:1px solid var(--line);border-radius:12px;background:#f7f0e1;color:var(--text);padding:10px 12px;outline:none}.selection-popover{position:fixed;z-index:60;transform:translate(-50%,-100%);display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--line);border-radius:16px;background:#f3ecdcfa;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:var(--shadow)}.selection-popover-btn{width:64px;min-height:64px;border-radius:14px;border:1px solid var(--line);background:#f7f0e1;color:var(--text);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;padding:6px 8px}.selection-popover-btn .svg-icon,.selection-popover-btn .custom-voice-icon{width:22px;height:22px}.selection-popover-btn span{font-size:.72rem;line-height:1;font-weight:700}.selection-popover-btn.tone-chest{color:rgb(var(--voice-chest-rgb));border-color:rgba(var(--voice-chest-rgb),.35)}.selection-popover-btn.tone-mix{color:rgb(var(--voice-mix-rgb));border-color:rgba(var(--voice-mix-rgb),.35)}.selection-popover-btn.tone-head{color:rgb(var(--voice-head-rgb));border-color:rgba(var(--voice-head-rgb),.35)}.selection-popover-btn.tone-note{color:#5d4d34;border-color:#5d4d3440}.selection-popover-btn.tone-clear{color:#4f4639}.selection-popover--bottom{inset:auto auto 14px 50%;transform:translate(-50%);width:calc(100vw - 28px);max-width:520px;justify-content:center;border-radius:18px;padding:12px}.songs-overlay{position:fixed;inset:0;background:#443a2b38;opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:39}.songs-overlay.is-open{opacity:1;pointer-events:auto}.songs-panel{position:fixed;top:0;right:0;width:360px;height:100vh;background:var(--panel-2);border-left:1px solid var(--line);box-shadow:var(--shadow);transform:translate(100%);transition:transform .2s ease;z-index:40;display:flex;flex-direction:column}.songs-panel.is-open{transform:translate(0)}.songs-panel-header{height:62px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 14px 0 18px;border-bottom:1px solid var(--line)}.songs-panel-header strong{font-size:1rem}.songs-panel-actions{display:flex;gap:8px}.drawer-mini-btn{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid var(--line);border-radius:10px;background:#f7f0e1;color:var(--text);cursor:pointer}.songs-panel-body{flex:1;overflow:auto;padding:14px}.songs-empty{color:var(--muted);margin:6px 0 0}.songs-list{display:flex;flex-direction:column;gap:10px}.song-item{width:100%;display:flex;flex-direction:column;gap:6px;text-align:left;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:#f7f0e1;color:var(--text);cursor:pointer;transition:.16s ease}.song-item-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.song-item strong{font-size:.98rem;line-height:1.2}.song-item span{font-size:.84rem;color:var(--muted)}.song-item.is-current{border-color:var(--line-2);box-shadow:0 0 0 1px #473a2214 inset}.difficulty-badge{width:12px;height:12px;min-width:12px;border-radius:999px;display:inline-block;box-shadow:0 0 0 1px #00000014 inset}.difficulty-badge.difficulty-beginner{background:#2d7d32}.difficulty-badge.difficulty-intermediate{background:#d48a12}.difficulty-badge.difficulty-advanced{background:#a32828}.status-strip{margin-top:12px;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border:1px solid var(--line);border-radius:16px;background:#f3ecdceb;color:var(--muted);box-shadow:var(--shadow)}.status-strip-actions{display:flex;flex-wrap:wrap;gap:8px}.mini-action{height:32px;padding:0 12px;border:1px solid var(--line);border-radius:999px;background:#f7f0e1;color:var(--text);cursor:pointer;font-size:.86rem;font-weight:700}.modal-backdrop{position:fixed;inset:0;background:#231d1447;display:flex;align-items:center;justify-content:center;padding:20px;z-index:100}.copy-modal{width:min(100%,460px);background:#f7f0e1;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:18px}.copy-modal h3{margin:0 0 8px;font-size:1.1rem}.copy-modal p{margin:0 0 14px;color:var(--muted)}.copy-modal-input{width:100%;height:42px;padding:0 12px;border:1px solid var(--line);border-radius:12px;background:#fffaf0;color:var(--text);outline:none}.copy-modal-actions{margin-top:14px;display:flex;justify-content:flex-end;gap:10px}.copy-modal-btn{height:40px;padding:0 14px;border:1px solid var(--line);border-radius:12px;background:#f2e9d5;color:var(--text);cursor:pointer}.copy-modal-btn--primary{background:#e8dbc0;font-weight:700}.comment-modal .comment-modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.comment-modal .teacher-field.full{grid-column:1/-1}.comment-modal .teacher-field textarea{min-height:110px}@media(max-width:1200px){.topbar-row{flex-direction:column;align-items:flex-start}.topbar-left,.topbar-right{width:100%}.teacher-grid{grid-template-columns:1fr}}@media(max-width:1024px){.app-shell{padding:10px}.topbar{top:6px;padding:10px}.topbar-row--main{flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:nowrap}.topbar-left,.topbar-right{width:auto;flex-wrap:nowrap}.toolbar-compact--actions{display:grid;grid-template-columns:repeat(5,42px);gap:8px;width:auto;justify-content:flex-start}.action-button{width:42px;height:42px;min-width:42px;padding:0;gap:0;justify-content:center;border:none;background:transparent;box-shadow:none}.action-label{display:none}.action-icon{width:18px;height:18px}.svg-icon,.custom-voice-icon{width:20px;height:20px}.mode-button,.songs-toggle-button{width:42px;min-width:42px;height:42px;padding:0;justify-content:center;border:none;background:transparent;box-shadow:none}.songs-toggle-button span{display:none}.editor-card{min-height:calc(100vh - 260px);padding:18px 16px 32px}.editor-card.has-comments-space{padding-right:16px}.ProseMirror,.editor-surface{min-height:calc(100vh - 340px);font-size:1.04rem}.selection-popover-btn{width:62px;min-height:62px;border-radius:16px}.selection-popover-btn .svg-icon,.selection-popover-btn .custom-voice-icon{width:24px;height:24px}.songs-panel{width:min(88vw,420px)}}@media(max-width:760px){.toolbar-compact--actions{grid-template-columns:repeat(5,40px);gap:8px}.action-button,.mode-button,.songs-toggle-button{width:40px;height:40px;min-width:40px}.song-title-inline.minimal{font-size:1rem}.song-meta-footer{gap:6px;font-size:.84rem}.songs-panel{top:auto;bottom:0;right:0;width:100%;height:min(72vh,560px);border-left:none;border-top:1px solid var(--line);border-radius:18px 18px 0 0;transform:translateY(100%)}.songs-panel.is-open{transform:translateY(0)}.selection-popover{gap:8px;padding:8px;border-radius:16px}.selection-popover-btn{width:56px;min-height:56px;border-radius:14px}.selection-popover-btn .svg-icon,.selection-popover-btn .custom-voice-icon{width:22px;height:22px}.selection-popover-btn span{font-size:.68rem}.selection-popover--bottom{width:calc(100vw - 20px);bottom:10px;padding:10px}.status-strip{flex-direction:column;align-items:flex-start}.copy-modal{padding:16px}.comment-modal .comment-modal-grid{grid-template-columns:1fr}}