:root{--bg-body:#fff;--bg-stage:#fff;--color-text:#1a1a2e;--color-text-odd:#000;--color-text-even:#1565c0;--color-title:#c00;--color-chord:#c20;--color-meta:#222;--color-singer-tone:#1565c0;--color-op-title:#c00;--color-op-meta:#333;--color-op-chord:#c62828;--color-op-end:#ff3b30;--color-marquee:#c20;--bg-one-page:#fff;--bg-login:linear-gradient(135deg, #e8f0fe 0%, #d4e4fc 50%, #e0ecff 100%);--bg-login-card:#ffffffeb;--border-login-card:#64b4ff59;--color-login-label:#1565c0;--color-login-subtitle:#546e7a;--color-remember:#1565c0;--bg-search-dropdown:#fff;--color-ss-title:#1a1a2e;--color-ss-meta:#475569;--color-ss-snippet:#64748b;--border-search-dropdown:#64b4ff59;--singer-btn-bg:#add8ff59;--singer-btn-border:#64b4ff66;--singer-btn-color:#1565c0;--singer-btn-active-bg:#fffffff2;--singer-btn-active-border:#90caf9;--singer-btn-active-color:#0d47a1;--singer-hint-color:#78909c;--yt-header-bg:#e6f0fffa;--yt-title-color:#1565c0;--yt-close-color:#00000080;--bg-login-input:#ffffffe6;--border-login-input:#64b4ff66;--color-login-input:#1a1a2e;--color-stage-logo-filter:drop-shadow(0 4px 10px #00000014)}body:not(.theme-dark) #slide-content{font-weight:600}body:not(.theme-dark) .chord{font-weight:700}body:not(.theme-dark) .op-line,body:not(.theme-dark) .op-chord{font-weight:600}body.theme-dark{--bg-body:#0f1117;--bg-stage:#12141c;--color-text:#e8eaf6;--color-text-odd:#e8eaf6;--color-text-even:#90caf9;--color-title:#ff6b6b;--color-chord:#ff8c42;--color-meta:#c5cae9;--color-singer-tone:#90caf9;--color-op-title:#ff3b30;--color-op-meta:#b0bec5;--color-op-chord:#ff8c42;--color-op-end:#ff3b30;--color-marquee:#ff8c42;--bg-one-page:#12141c;--bg-login:linear-gradient(135deg, #0f1117 0%, #1a1f35 50%, #0d1526 100%);--bg-login-card:#12141ef7;--border-login-card:#64b4ff33;--color-login-label:#90caf9;--color-login-subtitle:#78909c;--color-remember:#90caf9;--bg-search-dropdown:#1a1f35;--color-ss-title:#e8eaf6;--color-ss-meta:#90a4ae;--color-ss-snippet:#78909c;--border-search-dropdown:#64b4ff33;--singer-btn-bg:#1a1f35e6;--singer-btn-border:#64b4ff40;--singer-btn-color:#90caf9;--singer-btn-active-bg:#3b82f640;--singer-btn-active-border:#3b82f6;--singer-btn-active-color:#bfdbfe;--singer-hint-color:#546e7a;--yt-header-bg:#12141efa;--yt-title-color:#90caf9;--yt-close-color:#ffffff80;--bg-login-input:#ffffff0f;--border-login-input:#64b4ff40;--color-login-input:#e8eaf6;--color-stage-logo-filter:drop-shadow(0 4px 10px #0006) brightness(1.1)}html,body{background:var(--bg-body);width:100%;height:100%;color:var(--color-text);font-family:Inter,Segoe UI,system-ui,sans-serif;transition:background .3s,color .3s;overflow:hidden}#login-view{background:var(--bg-login);z-index:10000;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .4s,background .3s;display:flex;position:fixed;inset:0}#login-view.hidden{display:none}.login-card{background:var(--bg-login-card);border:1px solid var(--border-login-card);-webkit-backdrop-filter:blur(12px);border-radius:16px;width:400px;padding:40px 36px;transition:background .3s,border-color .3s;box-shadow:0 20px 60px #0000002e}.login-card h1{color:var(--color-login-label);text-align:center;margin-bottom:8px;font-size:24px}.login-card .subtitle{color:var(--color-login-subtitle);text-align:center;margin-bottom:30px;font-size:13px}.login-form-group{margin-bottom:16px}.login-form-group label{color:var(--color-login-label);margin-bottom:6px;font-size:13px;font-weight:600;display:block}.login-form-group input{background:var(--bg-login-input);border:1px solid var(--border-login-input);width:100%;color:var(--color-login-input);border-radius:8px;outline:none;padding:12px 14px;font-family:Inter,Segoe UI,sans-serif;font-size:15px;transition:background .3s,border-color .3s,color .3s}.login-form-group input:focus{border-color:#64b4ffb3;box-shadow:0 0 0 3px #3b82f633}.login-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#2563eb,#3b82f6);border:none;border-radius:8px;width:100%;margin-top:8px;padding:13px;font-family:Inter,Segoe UI,sans-serif;font-size:15px;font-weight:600;transition:opacity .2s}.login-btn:hover{opacity:.85}.login-btn:disabled{opacity:.5;cursor:not-allowed}.remember-row{align-items:center;gap:8px;margin:8px 0 0;display:flex}.remember-row input[type=checkbox]{accent-color:#3b82f6;cursor:pointer;width:16px;height:16px}.remember-row label{color:var(--color-remember);cursor:pointer;-webkit-user-select:none;user-select:none;font-size:13px}.error-msg{color:#fca5a5;text-align:center;margin-top:12px;font-size:13px;display:none}.error-msg.show{display:block}#app-view{width:100%;height:100%;display:none;position:fixed;inset:0}#app-view.active{display:block}#control-bar-trigger{z-index:3001;background:0 0;height:75px;position:fixed;top:0;left:0;right:0}#control-bar{z-index:3000;-webkit-backdrop-filter:blur(12px);opacity:1;background:#060c23fa;border-bottom:1px solid #64b4ff2e;flex-wrap:wrap;align-items:center;gap:8px;min-height:52px;padding:7px 16px;transition:transform .4s cubic-bezier(.16,1,.3,1),opacity .3s;display:flex;position:fixed;top:0;left:0;right:0;transform:translateY(0);box-shadow:0 2px 16px #00000080}#control-bar.hidden{opacity:0;pointer-events:none;transform:translateY(-100%)}.ctrl-divider{background:linear-gradient(#0000 0%,#64b4ff59 25% 75%,#0000 100%);flex-shrink:0;width:1px;height:32px;margin:0 4px}.ctrl-group{align-items:center;gap:6px;display:flex}.ctrl-btn{color:#d4e9ff;cursor:pointer;white-space:nowrap;background:#64b4ff14;border:1px solid #64b4ff38;border-radius:9px;flex-shrink:0;align-items:center;gap:6px;height:36px;padding:7px 13px;font-family:Inter,Segoe UI,sans-serif;font-size:13px;font-weight:500;line-height:1;transition:all .18s;display:inline-flex}.ctrl-btn:hover{color:#fff;background:#64b4ff33;border-color:#64b4ffa6;transform:translateY(-1px);box-shadow:0 0 10px #3b82f640}.ctrl-btn:active{transform:translateY(0)}.ctrl-btn.active{color:#7dd3fc;background:#3b82f633;border-color:#64b4ffbf;box-shadow:0 0 10px #3b82f633,inset 0 0 6px #3b82f61a}.ctrl-btn-sm{text-align:center;min-width:34px;height:36px;padding:6px 10px;font-size:15px;font-weight:700}.ctrl-btn-primary{color:#93c5fd!important;background:#3b82f633!important;border-color:#3b82f680!important;font-weight:600!important}.ctrl-btn-primary:hover{color:#fff!important;background:#3b82f659!important;border-color:#3b82f6cc!important;box-shadow:0 0 14px #3b82f659!important}.ctrl-label{color:#93c5fd;white-space:nowrap;flex-shrink:0;font-size:12px}#font-size-display,#transpose-display{color:#bfdbfe;white-space:nowrap;text-align:center;letter-spacing:.3px;min-width:56px;font-family:Inter,Segoe UI,sans-serif;font-size:13px;font-weight:600}.ctrl-btn-stack{flex-direction:column;justify-content:center;align-items:center;gap:2px;display:inline-flex}.ctrl-btn-stacked{color:#d4e9ff;cursor:pointer;background:#64b4ff14;border:1px solid #64b4ff38;border-radius:4px;justify-content:center;align-items:center;width:24px;height:17px;padding:0;transition:all .15s;display:flex}.ctrl-btn-stacked:hover{color:#fff;background:#64b4ff33;border-color:#64b4ffa6;box-shadow:0 0 6px #3b82f633}.ctrl-btn-stacked:active{transform:scale(.95)}.ctrl-btn-stacked svg{pointer-events:none}.ctrl-btn-icon-only{border-radius:50%!important;justify-content:center!important;align-items:center!important;width:36px!important;height:36px!important;padding:0!important}.ctrl-btn-chord{border-radius:20px;align-items:center;gap:7px;height:36px;padding:7px 16px;font-size:13px;font-weight:600;transition:all .25s;display:flex}.ctrl-btn-chord svg{flex-shrink:0;width:18px;height:18px}.ctrl-btn-chord .chord-label{letter-spacing:.8px;text-transform:uppercase;font-size:12px;font-weight:700}.ctrl-btn-chord.active{color:#93c5fd;background:#3b82f640;border-color:#64b4ffcc;box-shadow:0 0 12px #3b82f64d,inset 0 0 8px #3b82f61a}.ctrl-btn-chord:not(.active){color:#fca5a5;background:#ef44441f;border-color:#ef444466}.ctrl-btn-chord:not(.active):hover{color:#fecaca;background:#ef444433;border-color:#ef4444b3}.ctrl-btn-fullscreen{border-radius:20px;align-items:center;gap:7px;height:36px;padding:7px 16px;font-size:13px;font-weight:600;transition:all .25s;display:flex}.ctrl-btn-fullscreen svg{flex-shrink:0;width:18px;height:18px}.ctrl-btn-fullscreen .fullscreen-label{letter-spacing:.8px;text-transform:uppercase;font-size:12px;font-weight:700}.ctrl-btn-fullscreen.active{color:#93c5fd;background:#3b82f640;border-color:#64b4ffcc;box-shadow:0 0 12px #3b82f64d,inset 0 0 8px #3b82f61a}.ctrl-btn-fullscreen:not(.active){color:#d4e9ff;background:#64b4ff14;border-color:#64b4ff38}.ctrl-btn-theme{border-radius:20px;align-items:center;gap:6px;height:36px;padding:7px 13px;font-size:13px;font-weight:600;display:inline-flex}.ctrl-btn-theme svg{flex-shrink:0;width:18px;height:18px;transition:transform .4s cubic-bezier(.34,1.56,.64,1)}.ctrl-btn-theme:hover svg{transform:rotate(20deg)scale(1.15)}.ctrl-btn-theme .theme-label{letter-spacing:.5px;text-transform:uppercase;font-size:12px;font-weight:700}.ctrl-btn-one-page{align-items:center;gap:6px;font-weight:600;display:inline-flex}.ctrl-btn-one-page svg{flex-shrink:0;width:17px;height:17px}#search-wrap{flex:2;align-items:center;gap:4px;min-width:280px;max-width:900px;display:flex;position:relative}#search-input{color:#fff;background:#ffffff14;border:1px solid #64b4ff40;border-radius:8px;outline:none;width:100%;height:38px;padding:0 12px;font-family:Inter,Segoe UI,sans-serif;font-size:16px;transition:border-color .2s,background .2s}#search-input::placeholder{color:#ffffff59}#search-input:focus{background:#ffffff1f;border-color:#64b4ff99;box-shadow:0 0 0 2px #3b82f61f}.ctrl-btn-voice{color:#8ab4f8;cursor:pointer;background:#64b4ff14;border:1px solid #64b4ff40;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:38px;min-width:38px;height:38px;padding:0;transition:all .3s;display:flex;position:relative;overflow:hidden}.ctrl-btn-voice:hover{color:#fff;background:#64b4ff2e;border-color:#64b4ff80;box-shadow:0 0 10px #3b82f633}.ctrl-btn-voice .mic-icon{z-index:2;transition:transform .2s;position:relative}.ctrl-btn-voice:hover .mic-icon{transform:scale(1.1)}.ctrl-btn-voice.recording{color:#fca5a5;background:#ef444440;border-color:#ef4444b3;animation:1.5s ease-in-out infinite voice-pulse;box-shadow:0 0 16px #ef44444d}.ctrl-btn-voice.recording .mic-icon{color:#fca5a5}.voice-ripple{opacity:0;pointer-events:none;z-index:1;border:2px solid #ef444480;border-radius:50%;position:absolute;inset:-4px}.ctrl-btn-voice.recording .voice-ripple{animation:1.5s ease-out infinite voice-ripple-anim}@keyframes voice-pulse{0%,to{box-shadow:0 0 8px #ef444433}50%{box-shadow:0 0 20px #ef444473}}@keyframes voice-ripple-anim{0%{opacity:.7;transform:scale(.8)}to{opacity:0;transform:scale(1.6)}}#search-dropdown{background:var(--bg-search-dropdown);border:1px solid var(--border-search-dropdown);z-index:9999;border-radius:10px;max-height:420px;transition:background .3s;display:none;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto;box-shadow:0 12px 40px #00000040}#search-dropdown.open{display:block}.ss-item{cursor:pointer;border-bottom:1px solid #0000000f;flex-direction:column;padding:14px 18px;transition:background .15s,color .15s;display:flex}.ss-item:last-child{border-bottom:none}.ss-item:hover,.ss-item.active{background:#1e40af}.ss-item:hover .ss-title,.ss-item.active .ss-title{color:#fff}.ss-item:hover .ss-meta,.ss-item.active .ss-meta{color:#bfdbfe}.ss-item:hover .ss-snippet,.ss-item.active .ss-snippet{color:#e2e8f0}.ss-item:hover .ss-title mark,.ss-item.active .ss-title mark{color:gold}.ss-title{color:var(--color-ss-title);white-space:nowrap;text-overflow:ellipsis;font-size:15px;font-weight:600;transition:color .15s;overflow:hidden}.ss-title mark{color:#1565c0;background:0 0;font-weight:700}body.theme-dark .ss-title mark{color:#90caf9}.ss-meta{color:var(--color-ss-meta);white-space:nowrap;text-overflow:ellipsis;margin-top:4px;font-size:12.5px;transition:color .15s;overflow:hidden}.ss-snippet{color:var(--color-ss-snippet);white-space:pre-wrap;-webkit-line-clamp:4;-webkit-box-orient:vertical;margin-top:6px;font-size:12px;line-height:1.5;transition:color .15s;display:-webkit-box;overflow:hidden}.ss-loading,.ss-empty{text-align:center;color:#78909c;padding:16px;font-size:13px}#marquee-input{color:#fff;background:#ffffff14;border:1px solid #64b4ff40;border-radius:8px;outline:none;width:180px;height:34px;padding:0 10px;font-family:Inter,Segoe UI,sans-serif;font-size:13px;transition:border-color .2s}#marquee-input::placeholder{color:#ffffff59}#marquee-input:focus{border-color:#64b4ff99;box-shadow:0 0 0 2px #3b82f61f}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#6496c84d;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#6496c880}#stage-area{background:var(--bg-stage);transition:background .3s;position:fixed;inset:0;overflow:hidden}.slide-container{z-index:2;width:100%;height:100%;display:none;position:relative}#title-slide{text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:5vh 5vw;display:none}#title-slide.active{display:flex}#title{color:var(--color-title);text-shadow:none;-webkit-text-stroke:0px;margin-bottom:3vh;font-family:Lobster,Brush Script MT,cursive;font-size:clamp(48px,8vw,120px);line-height:1.2;transition:color .3s}#metadata{flex-direction:column;align-items:center;gap:1.5vh;display:flex}#author-rhythm{color:var(--color-meta);-webkit-text-stroke:0px;text-shadow:none;flex-direction:row;gap:1vw;font-family:Noto Serif,Georgia,serif;font-size:clamp(20px,3vw,40px);font-style:italic;transition:color .3s;display:flex}#singer-tone{color:var(--color-singer-tone);-webkit-text-stroke:0px;text-shadow:none;flex-direction:row;gap:.5vw;font-family:Noto Serif,Georgia,serif;font-size:clamp(20px,3vw,40px);transition:color .3s;display:flex}#singer-label{color:var(--color-singer-tone);font-style:normal;font-weight:500}#inline-singer-tones{flex-wrap:wrap;justify-content:center;gap:12px;width:100%;max-width:80vw;margin-top:1.5vh;display:flex}#inline-singer-tones.hidden{display:none!important}.singer-hints{flex-direction:column;align-items:center;gap:4px;margin-top:1.5vh;display:flex}.singer-hint{color:var(--singer-hint-color);letter-spacing:.02em;align-items:center;gap:4px;font-family:Inter,Segoe UI,sans-serif;font-size:clamp(12px,1.5vmin,16px);font-style:italic;display:flex}.yt-hint-icon{vertical-align:middle;flex-shrink:0;width:38px;height:38px}.singer-tone-btn{background:var(--singer-btn-bg)!important;border:1px solid var(--singer-btn-border)!important;cursor:pointer!important;color:var(--singer-btn-color)!important;border-radius:12px!important;align-items:center!important;gap:16px!important;padding:12px 24px!important;transition:all .2s!important;display:inline-flex!important}.singer-tone-btn:hover{background:#add8ff80!important;border-color:#64b4ff99!important}.singer-tone-btn.active{background:var(--singer-btn-active-bg)!important;border-color:var(--singer-btn-active-border)!important;color:var(--singer-btn-active-color)!important}.singer-name-text{font-family:Noto Serif,Georgia,serif;font-size:clamp(24px,3.5vmin,38px);line-height:1}#lyric-slide{flex-direction:column;justify-content:flex-end;height:100%;padding:0 4vw 6vh;display:none;position:absolute;bottom:0;left:0;right:0}#lyric-slide.active{display:flex}#slide-content{width:100%;font-family:Noto Serif,Georgia,serif;font-size:var(--font-size,4.5vmin);color:var(--color-text);-webkit-text-stroke:0px;text-shadow:none;text-align:center;white-space:pre-wrap;word-break:break-word;line-height:var(--line-height,2);flex-direction:column;align-items:center;transition:color .3s;animation:.15s ease-out slideIn;display:flex}@keyframes slideIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.lyric-line{margin-bottom:.1em;display:block;position:relative}.chord-row{height:1em;margin-bottom:-.2em;line-height:1;position:relative}.chord{font-family:Noto Serif,Georgia,serif;font-size:calc(var(--font-size,4.5vmin) * .7);color:var(--color-chord);-webkit-text-stroke:0px;text-shadow:none;white-space:nowrap;transform:translate(var(--chord-shift-x,0px), calc(-100% + 1.25em));pointer-events:none;transition:color .3s;position:absolute}.text-row{white-space:pre-wrap;color:var(--color-text);font-family:Noto Serif,Georgia,serif;font-weight:450;transition:color .3s;display:block}body.pm-chords-hidden .chord-row{display:none!important}#one-page-overlay{z-index:2000;background:var(--bg-one-page);box-sizing:border-box;padding:6vh 5vw;transition:background .3s;display:none;position:absolute;inset:0}#one-page-overlay.active{display:block}body.one-page-active #lyric-slide,body.one-page-active #title-slide{visibility:hidden}#one-page-body{width:100%;height:100%;color:var(--color-text);-webkit-text-stroke:0px;text-shadow:none;box-sizing:border-box;font-family:Noto Serif,Georgia,serif;transition:color .3s;position:relative}#one-page-overlay.mode-1p{-webkit-overflow-scrolling:touch;--op-text-align:center;--op-stanza-gap:.425em;overflow:hidden auto}#one-page-overlay.mode-2p{--op-text-align:left;--op-stanza-gap:.425em;overflow:hidden}#one-page-body.mode-2p{column-count:2;column-fill:auto;column-gap:4vw;overflow:hidden}#one-page-body.mode-1p{column-count:1;height:auto}body.one-page-active #stage-area{bottom:0}.op-title,.op-meta,.op-line{box-sizing:border-box;width:100%;max-width:100%}.op-title{color:var(--color-op-title);break-inside:avoid;-webkit-column-break-inside:avoid;margin-bottom:.1em;font-family:Lobster,Brush Script MT,cursive;font-size:clamp(24px,4.5vmin,48px);font-weight:700;transition:color .3s}.op-meta{color:var(--color-op-meta);break-inside:avoid;-webkit-column-break-inside:avoid;margin-bottom:.8em;font-family:Noto Serif,Georgia,serif;font-size:clamp(14px,2.5vmin,26px);font-style:italic;transition:color .3s}.op-title,.op-meta{text-align:var(--op-text-align,left)}.op-line{break-inside:avoid;-webkit-column-break-inside:avoid;white-space:pre-wrap;word-break:break-word;line-height:1.5em;font-size:var(--op-font-size,3.4vmin);text-align:var(--op-text-align,left);color:var(--color-text);margin:0 0 .25em;font-family:Noto Serif,Georgia,serif;font-weight:450;transition:color .3s}.op-line-empty{height:0;min-height:0;margin:0 0 var(--op-stanza-gap,.425em) 0;line-height:0;overflow:hidden}.op-stanza{margin-bottom:var(--op-stanza-gap,.425em)}.op-stanza:last-child{margin-bottom:0}.op-stanza:nth-child(odd) .op-line{color:var(--color-text-odd)}.op-stanza:nth-child(2n) .op-line{color:var(--color-text-even)}.op-end-dot{color:var(--color-op-end);margin-left:.5em;font-weight:700}.op-chord{color:var(--color-op-chord);-webkit-text-stroke:0px;text-shadow:none;font-size:.8em;font-weight:300;transition:color .3s}body.one-page-chords-hidden .op-chord{display:none}.end-inline{color:var(--color-chord);font-family:Noto Serif,Georgia,serif;font-size:calc(var(--font-size,4.5vw) * .75);-webkit-text-stroke:0px;text-shadow:none;vertical-align:baseline;margin-left:.25em;font-weight:450;transition:color .3s}.yt-mini-btn{color:#fff;cursor:pointer;opacity:.9;background:red;border:none;border-radius:4px;justify-content:center;align-items:center;width:22px;height:22px;padding:3px;transition:all .2s;display:flex}.yt-mini-btn:hover{opacity:1;background:#f33;transform:scale(1.15)}.yt-mini-btn svg{width:14px;height:14px}.yt-float{aspect-ratio:16/9;border-radius:12px;flex-direction:column;width:480px;max-width:50vw;margin-top:2vh;display:flex;overflow:hidden}.yt-float.hidden{display:none!important}.yt-float-header{background:var(--yt-header-bg);-webkit-user-select:none;user-select:none;border-bottom:1px solid #64b4ff40;flex-shrink:0;justify-content:space-between;align-items:center;padding:5px 10px;transition:background .3s;display:flex}.yt-float-title{color:var(--yt-title-color);font-family:Segoe UI,sans-serif;font-size:13px;font-weight:600}.yt-float-close{color:var(--yt-close-color);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:2px 6px;font-size:18px;line-height:1}.yt-float-close:hover{color:#c62828;background:#ff3c3c26}.yt-float-body{background:#000;flex:1;position:relative}.yt-float-body iframe{border:none;width:100%;height:100%}#marquee-track{white-space:nowrap;will-change:transform;pointer-events:none;z-index:2500;display:none;position:absolute;bottom:0;left:0;right:0}#marquee-track.visible{display:block}#marquee-text{font-family:Noto Serif,Georgia,serif;font-size:calc(var(--font-size,4.5vmin) * .7);color:var(--color-marquee);text-shadow:none;-webkit-text-stroke:0px;letter-spacing:.03em;padding-right:80px;font-style:italic;transition:color .3s;display:inline-block}@keyframes marquee-scroll{0%{opacity:1;transform:translate(100vw)}49%{opacity:1;transform:translate(-100%)}50%{opacity:0;transform:translate(-100%)}99%{opacity:0;transform:translate(100vw)}to{opacity:1;transform:translate(100vw)}}#marquee-track.running{animation:80s linear infinite marquee-scroll}.modal-overlay{z-index:9000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000a6;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.modal-card{background:#141428;border:1px solid #ffd70040;border-radius:14px;flex-direction:column;width:90%;max-width:720px;max-height:85vh;display:flex;overflow:hidden;box-shadow:0 20px 60px #0009}.modal-header{background:#1a1a36;border-bottom:1px solid #ffd7001f;flex-shrink:0;justify-content:space-between;align-items:center;padding:14px 18px;display:flex}.modal-header h2{color:gold;margin:0;font-size:16px;font-weight:600}.modal-close-btn{color:#777;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:0 4px;font-size:26px;line-height:1}.modal-close-btn:hover{color:#fff}.modal-body{flex-direction:column;flex:1;gap:12px;padding:18px;display:flex;overflow-y:auto}.modal-footer{background:#1a1a36;border-top:1px solid #ffd70014;flex-shrink:0;justify-content:space-between;align-items:center;gap:10px;padding:12px 18px;display:flex}.modal-status{color:#777;flex:1;font-size:12px}.modal-status.ok{color:#4caf50}.modal-status.error{color:#f44336}.modal-status.saving{color:gold}.form-row{gap:12px;display:flex}.form-group{flex-direction:column;flex:1;gap:4px;display:flex}.flex-1{flex:1}.flex-2{flex:2}.form-group label{color:#8a8aaa;font-size:12px;font-weight:500}.form-group .required{color:gold}.form-group input,.form-group textarea{color:#e0e0f0;background:#0d0d1e;border:1px solid #ffffff1a;border-radius:6px;outline:none;width:100%;padding:8px 10px;font-family:Inter,Segoe UI,sans-serif;font-size:13px;transition:border-color .2s}.form-group input:focus,.form-group textarea:focus{border-color:#ffd70080}.form-group input::placeholder,.form-group textarea::placeholder{color:#4a4a6a}.form-group textarea{resize:vertical;min-height:160px;font-family:Consolas,Courier New,monospace;font-size:12px;line-height:1.6}.form-hint{color:#4a4a6a;font-size:11px}.hidden{display:none!important}#session-conflict-modal,#kicked-modal{z-index:11000;background:#000000bf}*{box-sizing:border-box;margin:0;padding:0}body{color:#e0f0ff;background:linear-gradient(135deg,#0d1b3e 0%,#1a3a6b);min-height:100vh;font-family:Segoe UI,sans-serif}header{background:#0000004d;border-bottom:1px solid #64b4ff33;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}header h1{color:#93c5fd;font-size:20px}header .user-info{color:#64748b;font-size:13px}.header-actions{align-items:center;gap:12px;display:flex}.container{max-width:960px;margin:0 auto;padding:24px}.stats{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px;display:grid}.stat-card{text-align:center;background:#ffffff0f;border:1px solid #64b4ff33;border-radius:12px;padding:20px}.stat-card .num{color:#93c5fd;font-size:32px;font-weight:700}.stat-card .label{color:#64748b;margin-top:4px;font-size:12px}.section-title{color:#93c5fd;justify-content:space-between;align-items:center;margin-bottom:12px;font-size:16px;display:flex}table{border-collapse:collapse;background:#ffffff0a;border-radius:12px;width:100%;overflow:hidden}th{color:#93c5fd;text-align:left;background:#64b4ff1a;padding:12px 16px;font-size:13px}td{border-top:1px solid #ffffff0d;padding:12px 16px;font-size:13px}tr:hover td{background:#64b4ff0f}.role-badge{border-radius:12px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-block}.role-badge.admin{color:#fca5a5;background:#ef444433}.role-badge.user{color:#93c5fd;background:#3b82f633}.expired{color:#fca5a5}.actions button{color:#e0f0ff;cursor:pointer;background:#64b4ff1a;border:1px solid #64b4ff4d;border-radius:6px;margin-right:4px;padding:4px 10px;font-size:12px}.actions button.delete{color:#fca5a5;background:#ef44441a;border-color:#ef444466}.btn-add{color:#93c5fd;cursor:pointer;background:#3b82f633;border:1px solid #3b82f666;border-radius:7px;padding:7px 16px;font-size:13px}.btn-add:hover{background:#3b82f659}.modal-overlay{z-index:1000;background:#000000b3;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.modal-overlay.open{display:flex}.modal-card{background:#1a2a4a;border:1px solid #64b4ff4d;border-radius:14px;width:440px;padding:28px}.modal-card h2{color:#93c5fd;margin-bottom:20px}.modal-card .form-group{margin-bottom:14px}.modal-card label{color:#93c5fd;margin-bottom:4px;font-size:12px;font-weight:600;display:block}.modal-card input,.modal-card select{color:#fff;background:#ffffff12;border:1px solid #64b4ff4d;border-radius:6px;outline:none;width:100%;padding:10px 12px;font-size:14px}.modal-card input:focus,.modal-card select:focus{border-color:#64b4ffb3}.modal-actions{justify-content:flex-end;gap:10px;margin-top:20px;display:flex}.btn-primary{color:#fff;cursor:pointer;background:linear-gradient(135deg,#2563eb,#3b82f6);border:none;border-radius:7px;padding:9px 20px;font-weight:600}.btn-secondary{color:#e0f0ff;cursor:pointer;background:#ffffff14;border:1px solid #64b4ff4d;border-radius:7px;padding:9px 20px}.btn-logout{color:#fca5a5;cursor:pointer;background:#ef444426;border:1px solid #ef444459;border-radius:7px;padding:7px 16px;font-size:13px}.btn-logout:hover{background:#ef444440}.btn-settings{color:#93c5fd;cursor:pointer;background:#64b4ff1a;border:1px solid #64b4ff4d;border-radius:7px;padding:7px 14px;font-size:13px}.btn-settings:hover{background:#64b4ff33}.settings-modal{background:#111b33;border:1px solid #64b4ff4d;border-radius:16px;flex-direction:column;width:90%;max-width:1000px;height:85vh;display:flex;overflow:hidden}.settings-header{background:#0003;border-bottom:1px solid #64b4ff26;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.settings-tabs{background:#0000001a;border-bottom:1px solid #64b4ff1a;padding:0 16px;display:flex}.tab-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;padding:12px 24px;font-size:14px;font-weight:600;transition:all .2s}.tab-btn.active{color:#93c5fd;border-bottom-color:#3b82f6}.tab-content{flex:1;padding:24px;display:none;overflow-y:auto}.tab-content.active{display:block}.upload-zone{text-align:center;background:#64b4ff08;border:2px dashed #64b4ff4d;border-radius:12px;margin-bottom:24px;padding:40px}.upload-zone p{color:#94a3b8;margin-bottom:16px}.batch-results{background:#0003;border-radius:8px;max-height:200px;padding:16px;font-family:monospace;font-size:12px;line-height:1.6;overflow-y:auto}.log-entry.success{color:#4ade80}.log-entry.skip{color:#fbbf24}.log-entry.error{color:#f87171}.progress-bar{background:#ffffff1a;border-radius:3px;height:6px;margin:16px 0;display:none;overflow:hidden}.progress-fill{background:#3b82f6;width:0%;height:100%;transition:width .1s}.stage-logo{width:auto;height:clamp(100px,15vw,160px);filter:var(--color-stage-logo-filter);margin-bottom:4vh;transition:filter .3s}.ctrl-btn-theme.dark-active{color:#ff8c42;background:#ff8c4226;border-color:#ff8c4266}.ctrl-btn-theme.dark-active:hover{color:#ffb380;background:#ff8c4240}.online-users-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin-top:16px;display:grid}.online-user-card{background:#ffffff0d;border:1px solid #64b4ff2e;border-radius:12px;align-items:center;gap:12px;padding:16px;transition:background .2s;display:flex;position:relative}.online-user-card:hover{background:#64b4ff17}.online-user-avatar{color:#fff;background:linear-gradient(135deg,#3b82f6,#1d4ed8);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:18px;font-weight:700;display:flex;position:relative}.online-user-avatar:after{content:"";border:2px solid #111b33;border-radius:50%;width:11px;height:11px;position:absolute;bottom:1px;right:1px}.online-user-card.status-online .online-user-avatar:after{background:#4ade80;box-shadow:0 0 6px #4ade8099}.online-user-card.status-offline .online-user-avatar:after{background:#64748b}.online-user-info{flex:1;min-width:0}.online-user-name{color:#e0f0ff;white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600;overflow:hidden}.online-user-email{color:#64748b;white-space:nowrap;text-overflow:ellipsis;margin-top:2px;font-size:11px;overflow:hidden}.online-user-status{align-items:center;gap:4px;margin-top:4px;font-size:11px;display:flex}.online-user-card.status-online .online-user-status{color:#4ade80}.online-user-card.status-offline .online-user-status{color:#64748b}.online-dot{border-radius:50%;width:6px;height:6px;display:inline-block}.status-online .online-dot{background:#4ade80;animation:2s infinite pulse-dot}.status-offline .online-dot{background:#64748b}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.4}}.online-user-role-badge{border-radius:10px;padding:2px 7px;font-size:10px;font-weight:600;position:absolute;top:10px;right:12px}.online-user-role-badge.admin{color:#fca5a5;background:#ef444433;border:1px solid #ef444440}.online-user-role-badge.user{color:#93c5fd;background:#3b82f626;border:1px solid #3b82f633}.online-summary{flex-wrap:wrap;gap:16px;margin-bottom:16px;display:flex}.online-summary-chip{border-radius:20px;align-items:center;gap:6px;padding:6px 14px;font-size:13px;font-weight:600;display:flex}.online-summary-chip.chip-online{color:#4ade80;background:#4ade801f;border:1px solid #4ade804d}.online-summary-chip.chip-offline{color:#94a3b8;background:#64748b1f;border:1px solid #64748b4d}.online-summary-chip.chip-total{color:#93c5fd;background:#3b82f61f;border:1px solid #3b82f64d}.online-filter-row{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px;display:flex}.online-filter-btn{color:#64748b;cursor:pointer;background:0 0;border:1px solid #64b4ff40;border-radius:16px;padding:5px 14px;font-size:12px;transition:all .2s}.online-filter-btn.active{color:#93c5fd;background:#3b82f633;border-color:#3b82f680}.online-filter-btn:hover{color:#c5d8f0;background:#64b4ff1a}.online-last-seen{color:#4b5563;margin-top:2px;font-size:10px}.login-logo-wrap{justify-content:center;align-items:center;margin-bottom:20px;display:flex}.login-logo{filter:drop-shadow(0 4px 8px #0000000f);width:auto;height:90px}
