:root{--bg: #0b0b0c;--bg-elevated: #17171a;--bg-hover: #222226;--border: #2b2b2f;--text: #f2f2f3;--text-secondary: #9a9aa2;--accent: #ff7a30;--danger: #ff5c5c;--radius: 10px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer}.app-root{height:100%;display:flex;flex-direction:column}.app-header{display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid var(--border);flex-shrink:0}.app-title{font-weight:700;letter-spacing:.02em}.back-button{background:none;border:none;color:var(--accent);font-size:.95em}.app-brand{margin-left:auto;display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--text-secondary);opacity:.85}.app-brand:hover{opacity:1}.app-brand-text{font-size:.75rem;white-space:nowrap}.app-brand-logo{height:20px;width:auto;filter:invert(1) brightness(1.3)}.app-columns{flex:1;min-height:0;display:grid;grid-template-columns:280px 1fr 1fr}.pane{display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--border)}.pane.notes{border-right:none}.pane-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--border);flex-shrink:0}.pane-header h2{font-size:1rem;margin:0;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pane-scroll{flex:1;overflow-y:auto;padding:6px 0}.toolbar-actions{display:flex;gap:6px}.icon-button{background:none;border:none;color:var(--text);font-size:1rem;padding:4px 8px;border-radius:6px}.icon-button:hover{background:var(--bg-hover)}.icon-button.subtle{color:var(--text-secondary);opacity:0}.row:hover .icon-button.subtle,.row-plain:hover .icon-button.subtle,.section-header:hover .icon-button.subtle{opacity:1}.empty-hint{color:var(--text-secondary);padding:16px;font-size:.9rem}.section{margin-bottom:8px}.section-header{position:relative;display:flex;align-items:center;justify-content:space-between;padding:10px 14px 4px;font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--text-secondary)}.row,.row-plain{position:relative;display:flex;align-items:center;gap:8px;padding:9px 14px}.row.selectable{cursor:pointer}.row.selectable:hover{background:var(--bg-hover)}.row.selected{background:var(--bg-elevated);box-shadow:inset 3px 0 0 var(--accent)}.row-title{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row-title.italic{font-style:italic;color:var(--text-secondary)}.row-icon{color:var(--text-secondary)}.row-duration{color:var(--text-secondary);font-variant-numeric:tabular-nums;font-size:.9em}.drag-handle{color:var(--text-secondary);cursor:grab}.row.dragging{opacity:.4}.add-row{background:none;border:none;color:var(--accent);text-align:left;width:100%;font-size:.9rem}.add-row:hover{background:var(--bg-hover)}.menu{position:absolute;right:12px;top:100%;z-index:20;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;min-width:140px;box-shadow:0 8px 24px #0006}.menu button{display:block;width:100%;text-align:left;background:none;border:none;color:var(--text);padding:9px 12px;font-size:.9rem}.menu button:hover{background:var(--bg-hover)}.menu button.destructive{color:var(--danger)}.timing-header{display:flex;justify-content:space-between;padding:8px 14px;border-bottom:1px solid var(--border);font-size:.85rem;color:var(--text-secondary);flex-shrink:0}.note-row{flex:1;padding:2px 0;white-space:pre-wrap}.note-row.toggle{display:flex;align-items:center;gap:8px;background:none;border:none;color:var(--text);text-align:left;font-size:1em;padding:0}.toggle-icon{color:var(--accent)}.modal-backdrop,.confirm-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:100}.modal{width:min(420px,90vw);background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--border)}.modal-title{font-weight:600}.modal-body{padding:14px;display:flex;flex-direction:column;gap:8px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}.field-label{font-size:.8rem;color:var(--text-secondary);margin-top:6px}.text-field{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:9px 10px;font-size:1rem;width:100%}.text-field.small{width:64px}.text-field.textarea{min-height:80px;resize:vertical;font-family:inherit}.duration-row{display:flex;align-items:center;gap:8px}.unit{color:var(--text-secondary)}.button{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:8px 14px}.button-primary{background:var(--accent);border-color:var(--accent);color:#1a0d00;font-weight:600}.button:disabled{opacity:.4;cursor:not-allowed}.link-button{background:none;border:none;padding:0;color:var(--accent);text-decoration:underline;cursor:pointer;font:inherit}.form-error{color:var(--danger);font-size:.9rem}.live-button{background:var(--accent);border-color:var(--accent);color:#1a0d00;font-weight:600;padding:6px 12px}.segmented{display:flex;border:1px solid var(--border);border-radius:8px;overflow:hidden}.segmented button{flex:1;background:var(--bg);border:none;color:var(--text-secondary);padding:8px}.segmented button.active{background:var(--accent);color:#1a0d00;font-weight:600}.toggle-row{display:flex;align-items:center;gap:8px;font-size:.95rem}.confirm-dialog{width:min(340px,90vw);background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);padding:16px;display:flex;flex-direction:column;gap:8px}.confirm-title{margin:0 0 4px;font-weight:600}.live-view{height:100%;display:flex;flex-direction:column;background:var(--bg)}.live-view:fullscreen{width:100%;height:100%;background:var(--bg)}.live-header{display:flex;align-items:center;gap:16px;padding:10px 16px;border-bottom:1px solid var(--border);flex-shrink:0}.live-title{font-weight:700;font-size:1.1rem;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.live-header .app-brand{margin-left:0}.live-header-timing{color:var(--text-secondary);font-size:.85rem;font-variant-numeric:tabular-nums;white-space:nowrap}.live-zoom-controls{display:flex;align-items:center;gap:6px;color:var(--text-secondary)}.live-zoom-value{min-width:3.5em;text-align:center;font-variant-numeric:tabular-nums;font-size:.85rem}.live-body{flex:1;min-height:0;display:flex}.live-list{flex:1;min-width:0;overflow-y:auto;padding:8px 0 40px}.live-tasks{width:300px;flex-shrink:0;border-left:1px solid var(--border);overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:8px}.live-tasks-header{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-secondary);padding:4px 4px 2px}.live-task-item{display:flex;flex-direction:column;gap:2px;text-align:left;border:none;border-radius:8px;padding:10px 12px;cursor:pointer;border-left:4px solid transparent}.live-task-item.armed{background:#3ddc7324;border-left-color:#3ddc73}.live-task-item.reverted{background:#ff5c5c24;border-left-color:#ff5c5c}.live-task-song{font-size:.75rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.03em}.live-task-text{font-weight:600;color:var(--text)}.live-nav{display:flex;gap:12px;padding:12px 16px;border-top:1px solid var(--border);flex-shrink:0}.live-nav-button{flex:1;padding:18px;font-size:1.15rem;font-weight:700;border-radius:12px}@media (max-width: 700px){.live-body{flex-direction:column}.live-tasks{width:100%;max-height:200px;border-left:none;border-top:1px solid var(--border)}}.live-alarm-trigger{border:none;border-radius:999px;padding:8px 16px;font-weight:700;font-size:.9rem;color:#240707;background:#ff5c5c;cursor:pointer;animation:live-alarm-trigger-pulse 1.1s ease-in-out infinite}@keyframes live-alarm-trigger-pulse{0%,to{box-shadow:0 0 #ff5c5cb3}50%{box-shadow:0 0 0 8px #ff5c5c00}}.live-alarm-window{position:fixed;width:min(400px,90vw);height:min(75vh,560px);min-width:280px;min-height:180px;max-width:95vw;max-height:90vh;resize:both;overflow:auto;background:var(--bg-elevated);border:1px solid var(--border);border-radius:16px;z-index:200;box-shadow:0 20px 60px #0000008c}.live-alarm-header{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border);background:var(--bg-elevated);font-size:1.1rem;font-weight:700;z-index:1;cursor:move;touch-action:none;-webkit-user-select:none;user-select:none}.live-alert-mode{color:var(--text-secondary);font-size:.85rem;white-space:nowrap}.live-alarm-list{padding:16px;display:flex;flex-direction:column;gap:14px}.live-alarm-item{display:flex;flex-direction:column;gap:4px;text-align:left;border:none;border-radius:14px;padding:20px 24px;cursor:pointer}.live-alarm-song{font-size:.85rem;text-transform:uppercase;letter-spacing:.04em;opacity:.85}.live-alarm-text{font-size:1.6rem;font-weight:800}.live-alarm-item.armed{background:#3ddc73;color:#06210f;animation:live-alarm-blink-green .9s ease-in-out infinite}.live-alarm-item.reverted{background:#ff5c5c;color:#240707;animation:live-alarm-blink-red .9s ease-in-out infinite}@keyframes live-alarm-blink-green{0%,to{background:#3ddc73;transform:scale(1);box-shadow:0 0 #3ddc73cc}50%{background:#1f8a49;transform:scale(1.03);box-shadow:0 0 0 14px #3ddc7300}}@keyframes live-alarm-blink-red{0%,to{background:#ff5c5c;transform:scale(1);box-shadow:0 0 #ff5c5ccc}50%{background:#b32323;transform:scale(1.03);box-shadow:0 0 0 14px #ff5c5c00}}.live-row{padding:calc(10px * var(--live-zoom, 1)) calc(18px * var(--live-zoom, 1));border-bottom:1px solid var(--border);cursor:pointer}.live-row:hover{background:var(--bg-hover)}.live-row.active{background:var(--bg-elevated);box-shadow:inset 4px 0 0 var(--accent)}.live-row-header{display:flex;align-items:center;gap:10px}.live-song-title{flex:1;font-size:calc(1.05rem * var(--live-zoom, 1));font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.live-row.active .live-song-title{color:var(--accent)}.live-song-title.italic{font-style:italic;font-weight:500;color:var(--text-secondary)}.live-duration{color:var(--text-secondary);font-variant-numeric:tabular-nums;font-size:calc(.9rem * var(--live-zoom, 1))}.live-edit-button{opacity:.5;font-size:calc(.85rem * var(--live-zoom, 1))}.live-edit-button:hover{opacity:1}.live-notes{margin-top:calc(6px * var(--live-zoom, 1));display:flex;flex-direction:column;gap:calc(6px * var(--live-zoom, 1));padding-left:calc(4px * var(--live-zoom, 1))}.live-note-plain{display:flex;align-items:center;gap:8px;color:var(--text-secondary);font-size:calc(.92rem * var(--live-zoom, 1))}.live-toggle-wrap{display:flex;align-items:center;gap:8px}.live-toggle-badge{border:none;border-radius:999px;padding:calc(5px * var(--live-zoom, 1)) calc(14px * var(--live-zoom, 1));font-weight:700;font-size:calc(.92rem * var(--live-zoom, 1));cursor:pointer;box-shadow:0 3px 10px #00000059}.live-toggle-badge.armed{background:#3ddc73;color:#06210f;animation:live-blink-green 1.4s ease-in-out infinite}.live-toggle-badge.reverted{background:#ff5c5c;color:#240707;animation:live-blink-red 1.4s ease-in-out infinite}@keyframes live-blink-green{0%,to{box-shadow:0 0 #3ddc73a6,0 3px 10px #00000059}50%{box-shadow:0 0 0 7px #3ddc7300,0 3px 10px #00000059}}@keyframes live-blink-red{0%,to{box-shadow:0 0 #ff5c5ca6,0 3px 10px #00000059}50%{box-shadow:0 0 0 7px #ff5c5c00,0 3px 10px #00000059}}@media (max-width: 860px){.app-columns{grid-template-columns:1fr}.pane{border-right:none}.app-root[data-mobile-step="0"] .pane.timeline,.app-root[data-mobile-step="0"] .pane.notes,.app-root[data-mobile-step="1"] .pane.sidebar,.app-root[data-mobile-step="1"] .pane.notes,.app-root[data-mobile-step="2"] .pane.sidebar,.app-root[data-mobile-step="2"] .pane.timeline{display:none}}