:root{--stage:#f4f5f7;--panel:#fff;--raised:#eef0f3;--line:#e2e5ea;--text:#1c1d24;--dim:#697280;--accent:#e8752b;--accent-2:#2f9e6b;--danger:#d64545;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--stage);color:var(--text);-webkit-font-smoothing:antialiased;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.brand{letter-spacing:.02em;font-weight:800}.brand span{color:var(--accent)}.brand em{color:var(--dim);letter-spacing:.14em;text-transform:uppercase;font-size:.72em;font-style:normal;font-weight:500}.brand.big{margin-bottom:6px;font-size:24px}.center{place-items:center;min-height:100vh;padding:24px;display:grid}.card{background:var(--panel);border:1px solid var(--line);text-align:center;border-radius:16px;max-width:420px;padding:28px}.card.signin p{margin:8px 0 20px}.steps{text-align:left;color:var(--dim);margin:12px 0 0;padding-left:18px;font-size:14px;line-height:1.6}.steps code{background:var(--raised);border-radius:5px;padding:1px 5px;font-size:12px}.admin{min-height:100vh;display:flex}.sidebar{background:var(--panel);border-right:1px solid var(--line);flex-direction:column;flex-shrink:0;width:232px;height:100vh;display:flex;position:sticky;top:0}.side-brand{letter-spacing:.02em;border-bottom:1px solid var(--line);padding:18px 18px 16px;font-size:18px;font-weight:800}.side-brand span{color:var(--accent)}.side-brand em{color:var(--dim);letter-spacing:.18em;text-transform:uppercase;margin-top:3px;font-size:10px;font-style:normal;font-weight:500;display:block}.side-nav{flex-direction:column;flex:1;gap:2px;padding:10px 8px;display:flex}.navitem{width:100%;color:var(--dim);text-align:left;cursor:pointer;background:0 0;border:none;border-radius:9px;align-items:center;gap:11px;padding:10px 12px;font-size:14.5px;font-weight:600;display:flex}.navitem:hover{background:var(--raised);color:var(--text)}.navitem.active{background:var(--raised);color:var(--text);box-shadow:inset 3px 0 0 var(--accent)}.navitem .ico{text-align:center;width:18px;color:var(--accent);font-size:15px}.side-secondary{border-top:1px solid var(--line);padding:6px 8px}.side-user{border-top:1px solid var(--line);align-items:center;gap:10px;padding:12px 14px;display:flex}.side-user img{border-radius:50%;width:32px;height:32px}.side-user .nm{font-size:13px;font-weight:600}.link{color:var(--accent);cursor:pointer;background:0 0;border:none;padding:0;font-size:12px}.content{flex:1;min-width:0;padding:26px 30px 80px}.view-head{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.view-head h1{margin:0;font-size:22px}.count{color:var(--dim);margin-left:6px;font-size:15px;font-weight:500}.empty{padding:32px 0}.list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.list li{background:var(--panel);border:1px solid var(--line);cursor:pointer;border-radius:12px;padding:12px 14px;transition:border-color .12s}.list li:hover{border-color:var(--accent)}.list .ttl{font-weight:600}.list .meta{color:var(--dim);align-items:center;gap:8px;margin-top:3px;font-size:13px;display:flex}.pill{background:var(--raised);color:var(--accent-2);border-radius:999px;padding:1px 8px;font-size:11px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;margin-bottom:16px;padding:18px 20px}.panel h2{margin:0 0 12px;font-size:15px}.account{align-items:center;gap:12px;margin-bottom:14px;display:flex}.account img{border-radius:50%;width:44px;height:44px}.account .nm{font-weight:600}.sync-badge{color:var(--accent-2);font-size:13px}.sheet-backdrop{z-index:50;background:#0000008c;place-items:end center;display:grid;position:fixed;inset:0}.sheet{background:var(--panel);border:1px solid var(--line);border-radius:16px 16px 0 0;flex-direction:column;gap:14px;width:min(720px,100%);max-height:92vh;padding:16px 20px 28px;display:flex;overflow:auto}.sheet.wide{width:min(920px,100%)}.sheet-head{background:var(--panel);justify-content:space-between;align-items:center;margin:-16px 0 0;padding:8px 0;display:flex;position:sticky;top:-16px}.sheet label{color:var(--dim);text-transform:uppercase;letter-spacing:.06em;flex-direction:column;gap:5px;font-size:12px;display:flex}.sheet .row{gap:12px;display:flex}.sheet .row label{flex:1}.sheet .row label.narrow{flex:0 0 90px}.small{font-size:12px}.two-pane{grid-template-columns:1fr 1fr;gap:16px;display:grid}@media (width<=720px){.two-pane{grid-template-columns:1fr}}.pane{background:var(--raised);border:1px solid var(--line);border-radius:12px;padding:12px}.pane-title{text-transform:uppercase;letter-spacing:.06em;color:var(--dim);margin-bottom:10px;font-size:12px}.set-items{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.set-items li{background:var(--panel);border:1px solid var(--line);border-radius:8px;align-items:center;gap:8px;padding:7px 9px;display:flex}.set-items .pos{color:var(--dim);width:18px;font-family:ui-monospace,monospace;font-size:12px}.grow{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}button.icon{border:1px solid var(--line);color:var(--text);background:0 0;border-radius:6px;padding:3px 7px;font-size:11px}button.icon.danger{color:var(--danger);border-color:var(--danger)}button.icon:disabled{opacity:.3}.search{margin-bottom:8px}.pick-list{flex-direction:column;gap:4px;max-height:320px;margin:0;padding:0;list-style:none;display:flex;overflow:auto}.pick-list li{background:var(--panel);border:1px solid var(--line);cursor:pointer;border-radius:8px;align-items:center;padding:7px 9px;display:flex}.pick-list li:hover{border-color:var(--accent)}.pick-list .add{color:var(--accent);font-size:12px;font-weight:600}.table-search{max-width:520px;margin-bottom:12px}.table-wrap{border:1px solid var(--line);border-radius:12px;overflow:hidden}table.grid{border-collapse:collapse;width:100%;font-size:14px}table.grid thead th{text-align:left;text-transform:uppercase;letter-spacing:.06em;color:var(--dim);background:var(--panel);border-bottom:1px solid var(--line);padding:10px 14px;font-size:11px;font-weight:600}table.grid tbody td{border-bottom:1px solid var(--line);padding:11px 14px}table.grid tbody tr{cursor:pointer}table.grid tbody tr:last-child td{border-bottom:none}table.grid tbody tr:hover td{background:var(--panel)}table.grid tbody tr.norow{cursor:default}table.grid tbody tr.norow:hover td{background:0 0}table.grid .strong{font-weight:600}.col-narrow{width:84px}.back{padding-left:6px}.head-actions{gap:8px;display:flex}.head-actions button.danger{align-self:auto}.form-page{flex-direction:column;gap:16px;display:flex}.form-page label{color:var(--dim);text-transform:uppercase;letter-spacing:.06em;flex-direction:column;gap:5px;font-size:12px;display:flex}.form-page .row{gap:12px;display:flex}.form-page .row label{flex:1}.form-page .row label.narrow{flex:0 0 110px}label.block{color:var(--dim);text-transform:uppercase;letter-spacing:.06em;flex-direction:column;gap:5px;max-width:520px;margin-bottom:16px;font-size:12px;display:flex}.two-pane.tall{grid-template-columns:minmax(240px,300px) 1fr}@media (width<=860px){.two-pane.tall{grid-template-columns:1fr}}.two-pane.tall .pane{min-height:60vh}.pane.lib{flex-direction:column;display:flex}.lib-controls{align-items:center;gap:10px;margin-bottom:10px;display:flex}.lib-controls .search{flex:1;margin:0}.lib-controls .table-search{flex:1;max-width:520px;margin:0}.table-block{position:relative}.col-adjust{width:40px;text-align:right!important;padding-right:12px!important}button.cadj{color:var(--dim);cursor:pointer;background:0 0;border:none;padding:2px;display:inline-flex}button.cadj:hover{color:var(--accent)}.col-menu.table-menu{position:absolute;top:42px;right:6px}.col-btn-wrap{position:relative}.menu-backdrop{z-index:40;position:fixed;inset:0}.col-menu{z-index:41;background:var(--panel);border:1px solid var(--line);border-radius:10px;min-width:190px;padding:8px;position:absolute;top:calc(100% + 6px);right:0;box-shadow:0 14px 34px #00000026}.col-menu-title{text-transform:uppercase;letter-spacing:.06em;color:var(--dim);padding:4px 8px 8px;font-size:11px}.col-opt{cursor:pointer;border-radius:7px;align-items:center;gap:8px;padding:6px 8px;font-size:14px;display:flex}.col-opt:hover{background:var(--raised)}.col-opt input{width:auto}.sortby{text-transform:uppercase;letter-spacing:.05em;color:var(--dim);white-space:nowrap;align-items:center;gap:6px;font-size:11px;display:inline-flex}.sortby select{width:auto;padding:7px 9px;font-size:13px}.lib-table-wrap{border:1px solid var(--line);border-radius:10px;flex:1;max-height:66vh;overflow:auto}.lib-grid{font-size:13px}.lib-grid thead th{z-index:1;position:sticky;top:0}.lib-grid .sub{color:var(--dim);margin-top:1px;font-size:12px}.lib-grid .c-dur{width:56px;color:var(--dim);font-family:ui-monospace,monospace}.lib-grid .c-genre{width:110px}.lib-grid .c-notes{text-overflow:ellipsis;white-space:nowrap;max-width:220px;color:var(--dim);overflow:hidden}.tags{flex-wrap:wrap;gap:4px;display:flex}.tag{background:var(--stage);border:1px solid var(--line);color:var(--dim);border-radius:999px;padding:1px 7px;font-size:11px}.pane.drop-active{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.draggable{cursor:grab}.draggable:active{cursor:grabbing}.drag{color:var(--dim);cursor:grab;font-size:13px}.set-items li.drop-before{box-shadow:inset 0 2px 0 var(--accent)}.sheet-block{flex-direction:column;gap:8px;display:flex}.sheet-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.sheet-bar .lbl{color:var(--dim);text-transform:uppercase;letter-spacing:.06em;font-size:12px}.sheet-bar .hint{text-transform:none;letter-spacing:0;color:var(--dim);opacity:.7;margin-left:8px;font-size:11px}.sheet-tools{align-items:center;gap:10px;display:flex}.transpose{align-items:center;gap:6px;display:inline-flex}.transpose .tval{color:var(--dim);text-align:center;min-width:22px;font-family:ui-monospace,monospace;font-size:12px}.seg{border:1px solid var(--line);border-radius:8px;display:inline-flex;overflow:hidden}.seg button{background:var(--raised);color:var(--dim);border:none;border-radius:0;padding:6px 14px;font-size:13px}.seg button.on{background:var(--accent);color:#1a120b}.song-editor .view-head{margin-bottom:14px}.editor-grid{grid-template-columns:minmax(0,1fr) 340px;align-items:start;gap:20px;display:grid}@media (width<=900px){.editor-grid{grid-template-columns:1fr}}.editor-main{flex-direction:column;gap:8px;min-width:0;display:flex}.song-title-input{background:0 0;border:none;padding:4px 2px;font-size:22px;font-weight:700}.song-artist-input{color:var(--dim);background:0 0;border:none;margin-top:-4px;padding:2px;font-size:14px}.song-title-input:focus,.song-artist-input:focus{outline:none}.editor-toolbar{border-top:1px solid var(--line);border-bottom:1px solid var(--line);align-items:center;gap:12px;margin-bottom:4px;padding:8px 0;display:flex}.sheet-input{flex:1;min-height:60vh}.sheet-preview{background:var(--panel);border:1px solid var(--line);border-radius:10px;min-height:60vh;padding:14px 16px;overflow:auto}.cp-sheet{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:14px;line-height:1.4}.cp-row{align-items:flex-start;display:flex}.cp-num{text-align:right;color:var(--dim);opacity:.55;-webkit-user-select:none;user-select:none;flex:0 0 34px;padding:2px 14px 0 0;font-size:12px}.cp-content{flex:1;min-width:0}.cp-line{flex-wrap:wrap;align-items:flex-end;display:flex}.cp-col{flex-direction:column;display:inline-flex}.cp-chord{color:var(--accent);white-space:pre;min-height:1.2em;font-weight:700;line-height:1.1}.cp-lyric{white-space:pre}.cp-plain{white-space:pre-wrap}.cp-comment{color:var(--dim);font-style:italic}.cp-blank{height:.9em;display:block}.cp-sec{text-transform:uppercase;letter-spacing:.05em;border-radius:6px;margin:6px 0 2px;padding:2px 10px;font-family:system-ui,sans-serif;font-size:11px;font-weight:700;display:inline-block}.sec-intro{color:#6b3fa0;background:#efe6fb}.sec-verse{color:#2f8f5b;background:#e3f5ea}.sec-chorus{color:#b57d19;background:#fdf0d9}.sec-bridge{color:#3667b0;background:#e5eefb}.sec-outro,.sec-other{color:#566072;background:#eceef1}.editor-side{background:var(--panel);border:1px solid var(--line);border-radius:12px;position:sticky;top:20px;overflow:hidden}.side-tabs{border-bottom:1px solid var(--line);display:flex}.side-tabs button{letter-spacing:.04em;text-transform:uppercase;color:var(--dim);background:0 0;border:none;border-radius:0;flex:1;padding:12px 8px;font-size:12px;font-weight:700}.side-tabs button.on{color:var(--text);box-shadow:inset 0 -2px 0 var(--accent)}.side-body{flex-direction:column;gap:14px;padding:16px;display:flex}.side-body label{color:var(--dim);text-transform:uppercase;letter-spacing:.05em;flex-direction:column;gap:5px;font-size:12px;display:flex}.frow{gap:10px;display:flex}.frow label{flex:1}.field{flex-direction:column;gap:6px;display:flex}.flabel{color:var(--dim);text-transform:uppercase;letter-spacing:.05em;font-size:12px}.track-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.track-list li{background:var(--raised);border:1px solid var(--line);border-radius:8px;align-items:center;gap:8px;padding:7px 9px;font-size:13px;display:flex}.panel-grid{grid-template-columns:1fr 1fr;align-items:start;gap:16px;margin-top:8px;display:grid}@media (width<=760px){.panel-grid{grid-template-columns:1fr}}.panel label{color:var(--dim);text-transform:uppercase;letter-spacing:.05em;flex-direction:column;gap:5px;margin-bottom:12px;font-size:12px;display:flex}.panel label:last-child{margin-bottom:0}.panel label.check{text-transform:none;letter-spacing:normal;color:var(--text);flex-direction:row;align-items:center;gap:8px;font-size:14px}.panel label.check input{width:auto}.badge{text-transform:capitalize;border-radius:999px;padding:2px 9px;font-size:11px;font-weight:700;display:inline-block}.st-confirmed{color:#2f8f5b;background:#e3f5ea}.st-cancelled{color:#c0392b;background:#fbe6e6}.st-done{color:#3667b0;background:#e5eefb}.st-pending{color:#b57d19;background:#fdf0d9}.st-enquiry{color:#566072;background:#eceef1}.view.narrow{max-width:680px}.panel>label{color:var(--dim);text-transform:uppercase;letter-spacing:.05em;flex-direction:column;gap:5px;margin-bottom:12px;font-size:12px;display:flex}.form-error{color:var(--danger);margin:4px 0;font-size:13px}input,textarea,select{background:var(--raised);border:1px solid var(--line);color:var(--text);font:inherit;text-transform:none;letter-spacing:normal;border-radius:9px;width:100%;padding:9px 11px;font-size:15px}textarea{resize:vertical;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:13px;line-height:1.5}input:focus,textarea:focus{border-color:var(--accent);outline:none}button{font:inherit;cursor:pointer;border:1px solid #0000;border-radius:9px;padding:9px 16px;font-weight:600}button.primary{background:var(--accent);color:#1a120b}button.ghost{border-color:var(--line);color:var(--text);background:0 0}button.danger{border-color:var(--danger);color:var(--danger);background:0 0;align-self:flex-start}.muted{color:var(--dim)}
