:root{font-family:Inter,"Noto Sans KR",sans-serif;color:#edf3fb;background:#080b11;color-scheme:dark;--panel:#111722;--line:#293347;--muted:#8491a5;--mint:#67e3cf;--blue:#63a8ff}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:#080b11}.topbar,.popupbar{min-height:58px;display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid #202938;background:#0d121b}.topbar>strong,.popupbar>strong{font-size:15px;margin-right:auto}.connection-wrap{position:relative}.connection{display:block;font-size:11px;padding:7px 10px;border:1px solid;border-radius:8px;cursor:help}.connection.online{color:#7af0cb;border-color:#286354;background:#12332b}.connection.offline{color:#a9b4c5;border-color:#3a4659;background:#171e29}.server-tooltip{position:absolute;z-index:30;top:calc(100% + 8px);right:0;width:280px;padding:14px;border:1px solid #3a485e;border-radius:12px;background:#101823;box-shadow:0 18px 55px #000b;opacity:0;visibility:hidden;transform:translateY(-4px);transition:.15s;pointer-events:none}.connection-wrap:hover .server-tooltip,.connection-wrap:focus-within .server-tooltip{opacity:1;visibility:visible;transform:none}.server-tooltip>strong{font-size:13px}.server-tooltip dl{display:grid;gap:7px;margin:12px 0}.server-tooltip dl div{display:flex;justify-content:space-between;gap:12px}.server-tooltip dt{font-size:10px;color:#8997aa}.server-tooltip dd{margin:0;font-size:11px;font-weight:800}.server-tooltip small{display:block;color:#6f7e92;font-size:9px;line-height:1.4}.lag-good{color:#72e5bd}.lag-normal{color:#a8d88d}.lag-high{color:#ffc46b}.lag-severe{color:#ff8796}button{border:0;border-radius:8px;padding:9px 13px;background:var(--mint);color:#07120f;font-weight:850;cursor:pointer}button.secondary{color:#d2dbea;border:1px solid #354157;background:#1a2330}button.secondary.active{color:#07120f;border-color:var(--mint);background:var(--mint)}button:disabled{opacity:.45;cursor:wait}main{width:calc(100% - 24px);margin:18px auto 50px}.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}.tabs button{display:flex;justify-content:center;align-items:center;gap:8px;padding:13px;color:#9daabd;border:1px solid #2a3446;background:#111722}.tabs button.active{color:#07120f;border-color:var(--mint);background:var(--mint)}.tabs span{min-width:21px;padding:2px 5px;border-radius:99px;background:#ffffff1a;font-size:10px}.view{display:none;border:1px solid var(--line);border-radius:14px;background:var(--panel);padding:16px}.view.active{display:block}.view-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:16px}.view-head h1{font-size:17px;margin:0}.view-mode{display:flex;align-items:center;gap:6px}.view-mode>span{font-size:11px;color:var(--muted);margin-right:5px}.view-mode button{padding:7px 10px;color:#9ba8ba;border:1px solid #344057;background:#171f2b}.view-mode button.active{color:#06110e;border-color:#5bd8c4;background:#67e3cf}.event-list{display:grid;gap:10px}.event-list.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.event-card{display:grid;grid-template-columns:30px minmax(0,1fr) auto 58px 42px;align-items:center;gap:10px;min-width:0;padding:13px;border:1px solid #2c374a;border-radius:11px;background:#0b1119}.event-card>strong{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.event-number{color:#69788e;font:800 11px ui-monospace}.event-keys{display:flex;flex-wrap:wrap;gap:5px}.shortcut-key-button{padding:5px 8px;border:1px solid #4aa69a;background:#173c39;color:#75ead8;font-size:10px}.shortcut-key-button:hover{background:#20504b}.event-play-count{width:56px;padding:9px 6px;border:1px solid #334057;border-radius:9px;background:#080e16;color:#edf3fb;text-align:center;font-weight:850}.event-play-count:disabled{opacity:.55}.play-button{width:40px;height:40px;padding:0;border-radius:10px;background:linear-gradient(145deg,var(--mint),var(--blue));font-size:14px}.event-list.cards .event-card{grid-template-columns:1fr 58px 44px;grid-template-rows:auto auto 1fr;min-height:130px;padding:16px}.event-list.cards .event-number{grid-column:1/-1}.event-list.cards .event-card>strong{font-size:15px}.event-list.cards .event-keys{grid-column:1/-1;grid-row:3;align-self:start}.event-list.cards .event-play-count{grid-column:2;grid-row:2}.event-list.cards .play-button{grid-column:3;grid-row:2;width:44px;height:44px}.monitor-list{display:grid;gap:8px}.monitor-row{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:12px 13px;border:1px solid #2a3548;border-radius:9px;background:#0b1119}.monitor-row strong{font-size:12px}.monitor-row time{font-size:10px;color:#768499}.job-status,.gift-sender,.row-detail{font-size:10px;color:#9ba9bc}.job-status.completed{color:#70e6be}.job-status.failed,.row-error{color:#ff93a1}.row-detail,.row-error{grid-column:1/-1}.row-error{font-size:10px}.empty{grid-column:1/-1;text-align:center;padding:34px;color:#748196;border:1px dashed #2d384a;border-radius:10px}.error{margin:0 0 14px;padding:10px 12px;color:#ff9aa7;border:1px solid #623540;border-radius:9px;background:#28151c;font-size:11px}.restart-vote-card{display:flex;align-items:center;gap:14px;margin-top:16px;padding:14px;border:1px solid #5a3b43;border-radius:12px;background:#211319}.restart-vote-card>div{display:flex;min-width:0;flex:1;flex-direction:column;gap:5px}.restart-vote-card strong{font-size:13px}.restart-vote-card span{color:#ffb2bd;font-size:12px;font-weight:800}.restart-vote-card small{color:#9b8087;font-size:9px;line-height:1.45}.danger-button{flex:0 0 auto;color:#fff0f2;border:1px solid #894957;background:#74323f}dialog{width:min(430px,calc(100% - 32px));padding:0;border:1px solid #344158;border-radius:16px;background:#101720;color:#eef3fb;box-shadow:0 28px 90px #000b}dialog::backdrop{background:#02050bcc}.shortcut-form{padding:22px}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.dialog-head h2{margin:0;font-size:20px}.icon-button{width:34px;height:34px;padding:0;border-radius:50%;background:#1b2635;color:#d9e2ef;font-size:22px}.shortcut-form label{display:grid;gap:8px;margin-top:22px;color:#a8b5c7;font-size:13px}.shortcut-form select{width:100%;padding:12px;border:1px solid #344158;border-radius:10px;background:#090f17;color:#f2f6fc}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.dialog-actions button{min-width:120px}.popup-mode .topbar,.popup-mode .tabs,.popup-mode .view-head,.popup-mode #queue-view,.popup-mode #logs-view{display:none}.popup-mode main{width:calc(100% - 20px);margin:10px auto}.popup-mode .view{padding:10px;border:0;background:transparent}.popup-mode .event-list{grid-template-columns:1fr}.popup-mode .event-card{grid-template-columns:26px minmax(0,1fr) auto 52px 40px;grid-template-rows:auto;min-height:0;padding:10px}.popup-mode .event-card .event-number{grid-column:auto}.popup-mode .event-card .event-keys{grid-column:auto}.popup-mode .event-card .event-play-count{grid-column:auto;grid-row:auto;width:50px}.popup-mode .play-button{grid-column:auto;grid-row:auto;width:38px;height:38px}@media(max-width:620px){.topbar,.popupbar{flex-wrap:wrap;padding:10px 12px}.topbar>strong,.popupbar>strong{width:100%;margin:0}.topbar button,.popupbar button{flex:1}.connection-wrap{margin-left:auto}.tabs{grid-template-columns:repeat(3,1fr)}.view-head{align-items:flex-start;flex-direction:column}.event-list.cards{grid-template-columns:1fr}.monitor-row{grid-template-columns:1fr auto}.monitor-row time{grid-column:1/-1}.dialog-actions{flex-direction:column}.dialog-actions button{width:100%}.restart-vote-card{align-items:stretch;flex-direction:column}.restart-vote-card button{width:100%}}