:root{--bg: #0f1115;--bg-elev: #171a21;--bg-elev2: #1f232c;--border: #2a2f3a;--text: #e8eaed;--text-dim: #9aa1ad;--accent: #ff5a3c;--accent-2: #4c8dff;--ok: #35c46b;--warn: #f5b93b;--radius: 14px;--shadow: 0 6px 24px rgba(0, 0, 0, .35);--topbar-h: 52px}*{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;touch-action:manipulation;-webkit-text-size-adjust:100%;text-size-adjust:100%;overscroll-behavior-y:none}button{font:inherit;cursor:pointer;border:none;border-radius:10px;padding:10px 14px;background:var(--bg-elev2);color:var(--text);transition:filter .15s ease,transform .05s ease}button:hover{filter:brightness(1.15)}button:active{transform:translateY(1px)}button.primary{background:var(--accent);color:#fff;font-weight:600}button.ghost{background:transparent;border:1px solid var(--border)}button.small{padding:6px 10px;font-size:.85rem}button.danger{background:transparent;border:1px solid #5b2b2b;color:#ff8a7a}button:disabled{opacity:.4;cursor:not-allowed}input,select,textarea{font:inherit;color:var(--text);background:var(--bg-elev);border:1px solid var(--border);border-radius:10px;padding:10px 12px;width:100%}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent-2);border-color:transparent}a{color:var(--accent-2)}.app{max-width:860px;margin:0 auto;padding:calc(var(--topbar-h) + env(safe-area-inset-top) + 16px) 16px calc(96px + env(safe-area-inset-bottom));min-height:100dvh}.topbar{position:fixed;top:0;left:0;right:0;z-index:20;box-sizing:border-box;min-height:var(--topbar-h);display:flex;align-items:center;gap:12px;padding:14px 16px;padding-top:calc(14px + env(safe-area-inset-top));background:#0f1115f5;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}.brand{font-weight:800;letter-spacing:.5px}.brand .dot{color:var(--accent)}.topbar .spacer{flex:1}.nav{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px}.nav a{text-decoration:none;padding:8px 14px;border-radius:999px;border:1px solid var(--border);color:var(--text-dim);font-size:.9rem}.nav a.active{background:var(--accent);border-color:var(--accent);color:#fff}.card{background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:14px}.row{display:flex;align-items:center;gap:12px}.wrap{flex-wrap:wrap}.spacer{flex:1}.muted{color:var(--text-dim)}.small{font-size:.85rem}.pill{display:inline-block;padding:2px 8px;border-radius:999px;background:var(--bg-elev2);border:1px solid var(--border);font-size:.78rem;color:var(--text-dim)}h1{font-size:1.5rem;margin:4px 0 12px}h2{font-size:1.15rem;margin:0 0 8px}.grid-form{display:grid;grid-template-columns:1fr 1fr;gap:10px}label.field{display:block;margin-bottom:10px}label.field span{display:block;font-size:.82rem;color:var(--text-dim);margin-bottom:4px}.song{display:flex;align-items:center;gap:12px;padding:12px;background:var(--bg-elev);border:1px solid var(--border);border-radius:12px;margin-bottom:8px}.song .title{font-weight:600}.song .sub{color:var(--text-dim);font-size:.85rem}.song .meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:2px}.song .idx{width:28px;height:28px;flex:none;display:grid;place-items:center;border-radius:8px;background:var(--bg-elev2);font-variant-numeric:tabular-nums;font-weight:700;color:var(--text-dim)}.drag-handle{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;color:var(--text-dim);padding:4px 8px;font-size:1.2rem}.break-row{background:#4c8dff1f;border-color:#4c8dff59}.break-idx{background:#4c8dff40;color:var(--accent-2);font-size:1.1rem}.break-name-input{flex:1;min-width:0;background:transparent;border:1px solid transparent;border-radius:8px;font-weight:700;font-size:1.05rem;color:var(--accent-2);padding:6px 8px;width:auto}.break-name-input:hover{border-color:#4c8dff59}.break-name-input:focus{outline:none;background:var(--bg);border-color:var(--accent-2)}.break-name-input::placeholder{color:var(--accent-2);opacity:.6}.break-time{display:flex;align-items:center;gap:6px;flex:none}.break-time input{width:64px;text-align:center;padding:8px}.encore-row{border-color:#4a3a1a;background:#1c1a14}.song-selected{border-color:var(--accent);background:#ff5a3c1f}.selectbar{gap:12px}.select-cta{display:block;width:100%;background:#e5484d;color:#fff;font-weight:700;font-size:1.1rem;padding:16px;border-radius:14px;margin:14px 0}.select-cta:hover{filter:brightness(1.1)}.eye-btn{font-size:1.15rem;padding:8px 12px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:flex-end;justify-content:center;z-index:50;padding:0}.modal-card{background:var(--bg-elev);border:1px solid var(--border);border-radius:18px 18px 0 0;padding:20px 18px calc(20px + env(safe-area-inset-bottom));width:100%;max-width:520px;max-height:80vh;overflow-y:auto}@media(min-width:620px){.modal-backdrop{align-items:center}.modal-card{border-radius:18px}}.picker-list{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}.picker-row{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--bg-elev2);border:1px solid var(--border);border-radius:12px;padding:14px 16px;text-align:left;font-weight:600;width:100%}.picker-new{color:var(--accent);border-color:#ff5a3c66;margin-top:4px}.sortable-item{list-style:none}.swipe-host{position:relative}.swipe-bg{position:absolute;top:0;right:0;bottom:8px;left:0;background:#b3382f;color:#fff;border-radius:12px;display:flex;align-items:center;justify-content:flex-end;padding-right:22px;font-weight:700;transition:opacity .15s ease;pointer-events:none}.swipe-host .song,.swipe-host .card{position:relative;touch-action:pan-y}.swipe-host:has(>.card){margin-bottom:14px}.swipe-host:has(>.card)>.card{margin-bottom:0}.swipe-host:has(>.card)>.swipe-bg{top:0;right:0;bottom:0;left:0}.encore-badge{color:var(--warn);border-color:#4a3a1a}.totalbar{position:sticky;bottom:0;display:flex;align-items:center;gap:14px;background:var(--bg-elev2);border:1px solid var(--border);border-radius:12px;padding:12px 16px;margin-top:10px;box-shadow:var(--shadow)}.totalbar .big{font-size:1.4rem;font-weight:800}.stage{position:fixed;top:0;right:0;bottom:0;left:0;height:100dvh;margin:0;padding:24px;padding-top:calc(24px + env(safe-area-inset-top));padding-bottom:calc(24px + env(safe-area-inset-bottom));padding-left:calc(24px + env(safe-area-inset-left));padding-right:calc(24px + env(safe-area-inset-right));display:flex;flex-direction:column;background:#000;color:#fff;overflow:hidden;overscroll-behavior:none;touch-action:none}.stage .stage-top{display:flex;align-items:center;gap:10px;position:relative;z-index:2;flex:none}.stage-quit{background:transparent;color:#888;border:1px solid #444;min-height:56px;padding:14px 22px;font-size:clamp(1.05rem,4vw,1.3rem);font-weight:600;border-radius:14px}.stage-quit:hover{filter:none;color:#bbb;border-color:#666}.stage-count{color:#888;font-size:clamp(1.05rem,4vw,1.3rem)}.stage .now{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;justify-content:center;text-align:center;cursor:pointer}.stage .now .n-idx{color:var(--accent);font-weight:800;letter-spacing:2px;font-size:clamp(1.1rem,4.5vw,1.6rem)}.stage .now .n-title{font-size:clamp(2.6rem,12vw,6rem);font-weight:800;line-height:1.05;margin:10px 0}.stage .now .n-artist{font-size:clamp(1.3rem,5.5vw,2.1rem);color:#bbb}.stage .now .n-meta{margin-top:24px;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}.stage .now .chip{font-size:clamp(1.2rem,5.5vw,1.9rem);background:#16181d;border-radius:14px;padding:10px 20px}.stage .now .chip b{color:var(--accent)}.stage .next{flex:none;text-align:center;color:#888;padding:16px;font-size:clamp(1.15rem,4.5vw,1.6rem);border-top:1px solid #222}.stage .stage-controls{flex:none;display:flex;gap:12px;justify-content:center;padding-top:14px}.stage .note{color:var(--warn);font-size:clamp(1.15rem,4vw,1.6rem);margin-top:16px}.stage-btn{flex:1;max-width:320px;min-height:72px;font-size:clamp(1.1rem,4vw,1.5rem);font-weight:700;border-radius:18px}.empty{text-align:center;color:var(--text-dim);padding:40px 16px}.simple-row{display:flex;align-items:center;gap:12px;padding:12px 4px;border-bottom:1px solid var(--border)}.simple-row:last-child{border-bottom:none}.simple-title{font-weight:600}.simple-artist{color:var(--text-dim)}.simple-dur{color:var(--text-dim);font-variant-numeric:tabular-nums;flex:none}.simple-break{background:#4c8dff14;border-radius:10px}.simple-break .simple-title{color:var(--accent-2);font-weight:700}.simple-encore-label{color:var(--warn);font-weight:700;text-transform:uppercase;font-size:.85rem;letter-spacing:.5px;margin:14px 0 4px}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background:var(--ok);color:#04220f;font-weight:600;padding:10px 18px;border-radius:999px;box-shadow:var(--shadow);z-index:50}@media(max-width:560px){.grid-form{grid-template-columns:1fr}}@media print{.no-print{display:none!important}body{background:#fff;color:#000}.app{max-width:none}.print-sheet{padding:0}.print-song{display:flex;gap:12px;padding:6px 0;border-bottom:1px solid #ddd;font-size:14pt}.print-song .p-idx{width:28px;font-weight:700}.print-song .p-title{font-weight:700}.print-song .p-meta{margin-left:auto;color:#555;font-size:11pt}.print-encore{margin-top:10px;font-weight:700;text-transform:uppercase}h1.print-title{font-size:22pt}}