.sr-shell{max-width:1760px;margin:auto;display:grid;gap:14px;color:#edf4ff}.sr-topbar,.sr-panel,.sr-card,.sr-modal{border:1px solid #223b59;background:linear-gradient(145deg,#0c1c2f,#081624);border-radius:16px}.sr-topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px}.sr-title{display:flex;align-items:center;gap:13px}.sr-title>.material-symbols-rounded{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#ffb0201c;color:#ffbd4a;font-size:29px}.sr-title h1{font-size:21px;margin:0 0 3px}.sr-title p{margin:0;color:#899bb3}.sr-actions,.sr-tabs,.sr-row,.sr-card-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.sr-button,.sr-tab,.sr-input,.sr-select,.sr-textarea{min-height:38px;border:1px solid #2b4565;border-radius:10px;background:#0a1828;color:#eef4ff;padding:8px 11px;font:650 13px Inter,sans-serif}.sr-button,.sr-tab{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px}.sr-button.primary,.sr-tab.active{background:#6958ed;border-color:#9185ff;color:#fff}.sr-button.success{background:#087866;border-color:#23d5b0}.sr-button.danger{background:#401725;border-color:#a93e59;color:#ff9caf}.sr-button.warn{background:#6f4410;border-color:#f1a629;color:#ffe1a1}.sr-button:disabled{opacity:.45;cursor:not-allowed}.sr-tabs{padding:5px;background:#071421;border:1px solid #1e3652;border-radius:13px}.sr-tabs .sr-tab{border:0;background:transparent}.sr-tabs .sr-tab.active{background:#6958ed}.sr-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:14px}.sr-panel{padding:14px;min-width:0}.sr-toolbar{display:flex;align-items:center;gap:9px;justify-content:space-between;margin-bottom:12px;flex-wrap:wrap}.sr-toolbar h2{font-size:17px;margin:0}.sr-queue{display:grid;gap:10px}.sr-task{display:grid;grid-template-columns:6px 48px minmax(180px,1fr) minmax(180px,.75fr) auto;align-items:center;gap:11px;padding:11px;border:1px solid #213c5a;background:#071523;border-radius:14px;overflow:hidden}.sr-task-bar{align-self:stretch;border-radius:99px;background:var(--sr-color,#6d5dfb)}.sr-task-avatar{width:44px;height:44px;border-radius:50%;object-fit:cover;background:#172b42}.sr-task-main{min-width:0}.sr-task-main strong,.sr-task-main span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sr-task-main strong{font-size:15px}.sr-task-main span{color:#8fa2bc;font-size:12px;margin-top:4px}.sr-task-meta{display:grid;gap:4px;color:#9cb0c8;font-size:12px}.sr-task-meta b{color:#f5c766}.sr-task.completed{border-color:#20b893;background:#073229}.sr-task.cancelled{opacity:.55}.sr-empty{padding:38px 18px;text-align:center;color:#7f94ae;border:1px dashed #2d4a6d;border-radius:14px}.sr-player{position:sticky;top:0;height:max-content}.sr-player-display{border-radius:14px;padding:18px;background:radial-gradient(circle at top,#6d5dfb33,#081625 66%);text-align:center}.sr-player-display .material-symbols-rounded{font-size:58px;color:#a79eff}.sr-player-display h2{font-size:18px;margin:8px 0 4px}.sr-player-display p{color:#879bb5;margin:0}.sr-progress{height:7px;background:#1b314a;border-radius:99px;overflow:hidden;margin:15px 0 6px}.sr-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,#5f51eb,#25dfbc)}.sr-times{display:flex;justify-content:space-between;font-variant-numeric:tabular-nums;color:#8298b4}.sr-times strong{color:#ffd166}.sr-now-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.sr-now-actions .wide{grid-column:1/-1}.sr-table-wrap{overflow:auto;max-height:600px}.sr-table{width:100%;border-collapse:collapse;min-width:880px}.sr-table th,.sr-table td{padding:10px;border-bottom:1px solid #1b324d;text-align:left;font-size:12px}.sr-table th{position:sticky;top:0;background:#10223a;color:#a99dff;z-index:1}.sr-gift-cell{display:flex;align-items:center;gap:7px}.sr-gift-cell img{width:30px;height:30px;object-fit:contain}.sr-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr));gap:10px;margin-bottom:14px}.sr-metric{padding:14px;border:1px solid #263f5e;border-radius:13px;background:#091929}.sr-metric span{display:block;color:#8296b0;font-size:12px}.sr-metric strong{display:block;font-size:25px;margin-top:4px}.sr-rule-list{display:grid;gap:11px}.sr-rule{border:1px solid #274361;border-radius:14px;padding:12px;background:#081726}.sr-rule-head{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-bottom:10px}.sr-rule-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.sr-rule-grid label{display:grid;gap:5px;color:#91a4bd;font-size:12px}.sr-rule-grid .wide{grid-column:1/-1}.sr-check{display:flex!important;align-items:center;gap:7px}.sr-check input{accent-color:#6d5dfb}.sr-gift-chips{display:flex;gap:6px;flex-wrap:wrap;min-height:38px;padding:5px;border:1px solid #294362;border-radius:10px}.sr-gift-chip{display:flex;align-items:center;gap:5px;padding:4px 8px;border-radius:999px;background:#162b43;color:#dce7f5;font-size:11px}.sr-gift-chip img{width:22px;height:22px;object-fit:contain}.sr-modal-backdrop{position:fixed;inset:0;z-index:10030;background:#010812d9;display:grid;place-items:center;padding:15px;backdrop-filter:blur(7px)}.sr-modal-backdrop[hidden]{display:none!important}.sr-modal{width:min(920px,100%);max-height:92vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 100px #000b}.sr-modal>header,.sr-modal>footer{padding:15px 18px;display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #203953}.sr-modal>footer{border-top:1px solid #203953;border-bottom:0;justify-content:flex-end}.sr-modal h2{margin:0;font-size:20px}.sr-modal-body{padding:14px 18px;overflow:auto}.sr-gift-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px;margin-top:11px}.sr-gift-option{display:grid;grid-template-columns:24px 38px minmax(0,1fr);align-items:center;gap:8px;padding:8px;border:1px solid #223d5b;border-radius:11px;background:#091827;cursor:pointer}.sr-gift-option.selected{border-color:#7c6eff;background:#6d5dfb1d}.sr-gift-option img{width:38px;height:38px;object-fit:contain}.sr-gift-option strong,.sr-gift-option small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sr-gift-option small{color:#f3c45c}.sr-filter{display:grid;grid-template-columns:minmax(180px,1fr) 240px;gap:8px}.sr-toast{position:fixed;right:18px;bottom:18px;z-index:10050;padding:12px 16px;border:1px solid #3a5877;border-radius:12px;background:#12263d;box-shadow:0 16px 45px #0009}.sr-toast.error{border-color:#e44c69}.sr-toast.success{border-color:#28cea9}
.sr-nav-badge{min-width:20px;height:20px;padding:0 6px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:#ff2f5d;color:#fff;border:2px solid #071322;box-shadow:0 0 0 1px #ff7895,0 5px 14px #ff174d66;font:800 11px/1 Inter,sans-serif;font-variant-numeric:tabular-nums}.sr-nav-badge[hidden]{display:none!important}.has-pending .sr-nav-badge{animation:sr-badge-pop .32s ease-out}.sr-display-name{display:grid;gap:5px;margin-bottom:12px;color:#91a4bd;font-size:12px}.sr-display-name-control{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.sr-display-name-control .sr-input[readonly]{color:#b8c5d6;background:#071421;border-color:#21364f;cursor:default}.sr-display-name-control .sr-button{min-width:112px}.sr-audio-control{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}.sr-audio-control .sr-select{width:100%;min-width:0}.sr-audio-preview{min-width:104px}.sr-audio-preview.playing{background:#b5183c;border-color:#ff5f7e;color:#fff}.sr-rule-switch{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;margin-bottom:10px;border:1px solid #294362;border-radius:12px;background:#091929;min-height:50px}.sr-enable-left{display:flex;align-items:center;gap:10px;min-width:0}.sr-ios-switch{position:relative;display:inline-flex!important;flex:0 0 auto;cursor:pointer}.sr-ios-switch input{position:absolute;inline-size:1px;block-size:1px;opacity:0;pointer-events:none}.sr-ios-track{position:relative;width:44px;height:24px;border-radius:999px;background:#40516a;border:1px solid #60738d;box-shadow:inset 0 1px 3px #0006;transition:background .2s ease,border-color .2s ease,box-shadow .2s ease}.sr-ios-track::after{content:"";position:absolute;width:20px;height:20px;left:1px;top:1px;border-radius:50%;background:#fff;box-shadow:0 2px 6px #0007;transition:transform .2s cubic-bezier(.2,.8,.2,1)}.sr-ios-switch input:checked+.sr-ios-track{background:#18b99a;border-color:#38e1bd;box-shadow:inset 0 0 0 1px #ffffff20,0 0 0 2px #18b99a20}.sr-ios-switch input:checked+.sr-ios-track::after{transform:translateX(20px)}.sr-ios-switch input:focus-visible+.sr-ios-track{outline:3px solid #8e83ff;outline-offset:3px}.sr-enable-copy{min-width:0}.sr-enable-title{display:flex;align-items:center;gap:5px}.sr-enable-title>strong{color:#edf4ff;font-size:12px}.sr-info-wrap{position:relative;display:inline-flex}.sr-info-button{width:24px;height:24px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:transparent;color:#7890ad;cursor:pointer}.sr-info-button:hover,.sr-info-button:focus-visible,.sr-info-wrap.open .sr-info-button{color:#b8adff;background:#6d5dfb26;outline:none}.sr-info-button .material-symbols-rounded{font-size:17px}.sr-info-popover{position:absolute;left:50%;bottom:calc(100% + 8px);z-index:20;width:260px;padding:9px 11px;border:1px solid #3a5575;border-radius:10px;background:#10243a;color:#dce7f5;font-size:11px;line-height:1.45;box-shadow:0 12px 35px #000a;opacity:0;visibility:hidden;transform:translate(-50%,5px);transition:opacity .16s ease,transform .16s ease,visibility .16s}.sr-info-wrap:hover .sr-info-popover,.sr-info-wrap:focus-within .sr-info-popover,.sr-info-wrap.open .sr-info-popover{opacity:1;visibility:visible;transform:translate(-50%,0)}.sr-rule-status{flex:0 0 auto;padding:5px 8px;border-radius:999px;font-size:10px;text-transform:uppercase;letter-spacing:.04em}.sr-rule-status.on{color:#4ff0c5;background:#0b493d;border:1px solid #1ba989}.sr-rule-status.off{color:#ff9eae;background:#4a1724;border:1px solid #a43a55}@keyframes sr-badge-pop{0%{transform:scale(.65)}70%{transform:scale(1.16)}100%{transform:scale(1)}}
.sr-avatar-viewer-settings{display:grid;gap:11px;margin:0 0 12px;padding:12px;border:1px solid #294362;border-radius:13px;background:#091929}.sr-avatar-viewer-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.sr-avatar-viewer-heading>div{display:grid;gap:3px}.sr-avatar-viewer-heading strong{font-size:13px;color:#edf4ff}.sr-avatar-viewer-heading small{color:#8296b0;font-size:11px}.sr-avatar-name-toggle{display:flex;align-items:center;gap:10px;color:#dce7f5;font-size:12px;font-weight:700;cursor:pointer}.sr-avatar-headline-field{display:grid;grid-template-columns:minmax(190px,280px) minmax(0,1fr);align-items:center;gap:10px;color:#91a4bd;font-size:12px}.sr-avatar-headline-field .sr-input{width:100%;min-width:0}
.sr-qualification{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px;border:1px solid #4b438c;border-radius:12px;background:linear-gradient(135deg,#6d5dfb18,#071523)}.sr-qualification>div,.sr-condition-preview{grid-column:1/-1}.sr-qualification>div{display:grid;gap:3px}.sr-qualification>div>strong{color:#f2efff;font-size:13px}.sr-qualification>div>small{color:#91a4bd;font-size:11px}.sr-qualification .sr-check{min-height:42px;padding:9px 11px;border:1px solid #2a4464;border-radius:10px;background:#0a1a2b;color:#dce7f5;font-weight:700}.sr-points-field{display:grid!important;grid-column:1/-1;grid-template-columns:minmax(140px,220px) minmax(180px,320px) minmax(0,1fr);align-items:center;gap:10px;padding-top:2px}.sr-points-field.disabled{opacity:.55}.sr-points-field small{color:#8296b0}.sr-condition-preview{margin:0;padding:9px 11px;border-radius:9px;background:#6d5dfb1c;color:#b8c8dc;font-size:12px;line-height:1.45}.sr-condition-preview b{color:#b8adff}.sr-task-qualified,.sr-qualification-result.qualified{color:#43e8bc!important}.sr-qualification-result{min-width:240px;white-space:normal;line-height:1.4}
.sr-side-stack{display:grid;align-content:start;gap:14px;position:sticky;top:0;height:max-content}.sr-side-stack .sr-player{position:static}.sr-auto-queue{border:1px solid #2a4666;background:linear-gradient(145deg,#0c1c2f,#081624);border-radius:16px;padding:14px;min-width:0}.sr-auto-queue.paused{border-color:#db3158;box-shadow:0 0 0 1px #db315833}.sr-auto-queue>header{display:flex;align-items:center;justify-content:space-between;gap:9px}.sr-auto-queue h3{font-size:15px;margin:3px 0 0}.sr-kicker{font-size:10px;letter-spacing:.08em;color:#8fa4bf;font-weight:800}.sr-auto-queue-summary{display:flex;justify-content:space-between;gap:8px;margin:12px 0 9px;padding:9px 10px;border-radius:10px;background:#091929;color:#98abc3;font-size:11px}.sr-auto-queue-summary strong{color:#f5c766;text-align:right}.sr-auto-current{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px;border:1px solid #1aa88b;border-radius:10px;background:#0a302b;margin-bottom:8px}.sr-auto-current[hidden]{display:none}.sr-auto-current>.material-symbols-rounded{color:#43e2bb}.sr-auto-current div{min-width:0}.sr-auto-current small,.sr-auto-current strong{display:block}.sr-auto-current small{color:#43e2bb;font-size:9px;font-weight:800}.sr-auto-current strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sr-auto-current>b{color:#fff}.sr-auto-queue-list{display:grid;gap:6px;list-style:none;padding:0;margin:0}.sr-auto-queue-list li{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:8px;padding:8px;border:1px solid #213a58;border-radius:10px;background:#071523}.sr-auto-queue-list li>b{width:23px;height:23px;display:grid;place-items:center;border-radius:7px;background:#233b5a;color:#cdd9e8;font-size:10px}.sr-auto-queue-list li>div{min-width:0}.sr-auto-queue-list li strong,.sr-auto-queue-list li span{display:block}.sr-auto-queue-list li div>strong,.sr-auto-queue-list li div>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sr-auto-queue-list li div>strong{font-size:11px}.sr-auto-queue-list li div>span{font-size:10px;color:#8298b4;margin-top:2px}.sr-auto-queue-list .sr-auto-queue-time{text-align:right}.sr-auto-queue-list .sr-auto-queue-time>strong{color:#f5c766}.sr-auto-queue-list li.empty{display:flex;justify-content:center;color:#7188a5;padding:15px}.sr-auto-queue-note{display:block;color:#6f849e;line-height:1.4;margin-top:9px}.sr-auto-queue.paused .sr-auto-queue-summary{background:#3b1520}.sr-auto-queue.paused #sr-auto-queue-status{color:#ff9caf}
@media(max-width:1050px){.sr-layout{grid-template-columns:1fr}.sr-player,.sr-side-stack{position:static}.sr-task{grid-template-columns:6px 44px minmax(150px,1fr) auto}.sr-task-meta{grid-column:3/-1}.sr-stats-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.sr-topbar{align-items:flex-start;flex-direction:column}.sr-actions{width:100%}.sr-actions .sr-button{flex:1}.sr-task{grid-template-columns:5px 38px minmax(0,1fr)}.sr-task-avatar{width:36px;height:36px}.sr-task-meta,.sr-card-actions{grid-column:2/-1}.sr-card-actions .sr-button{flex:1}.sr-rule-grid,.sr-filter,.sr-qualification{grid-template-columns:1fr}.sr-rule-grid .wide,.sr-qualification>div,.sr-condition-preview{grid-column:auto}.sr-points-field{grid-column:auto;grid-template-columns:1fr}.sr-stats-grid{grid-template-columns:1fr 1fr}.sr-modal-backdrop{padding:5px}.sr-modal{max-height:96vh}.sr-gift-picker{grid-template-columns:1fr 1fr}.sr-title h1{font-size:18px}.sr-audio-control{grid-template-columns:1fr}.sr-audio-preview{width:100%}.sr-rule-switch{align-items:center}.sr-info-popover{left:0;transform:translate(0,5px);width:min(250px,75vw)}.sr-info-wrap:hover .sr-info-popover,.sr-info-wrap:focus-within .sr-info-popover,.sr-info-wrap.open .sr-info-popover{transform:translate(0,0)}.sr-auto-queue>header,.sr-auto-queue-summary{align-items:stretch;flex-direction:column}.sr-auto-queue>header .sr-button{width:100%}.sr-auto-queue-summary strong{text-align:left}.sr-avatar-viewer-heading{align-items:flex-start;flex-direction:column}.sr-avatar-name-toggle{width:100%;justify-content:space-between}.sr-avatar-headline-field{grid-template-columns:1fr;gap:5px}}

@media (min-width: 681px) and (max-width: 1366px) and (any-pointer: coarse) {
  .sr-button,
  .sr-tab,
  .sr-input,
  .sr-select { min-height: 44px; }
  .sr-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
  }
  .sr-tabs::-webkit-scrollbar { display: none; }
  .sr-tabs .sr-tab {
    flex: 0 0 auto;
    padding-inline: 15px;
    white-space: nowrap;
    touch-action: manipulation;
  }
}
