.reference-settings{display:grid;place-items:center;flex-shrink:0;width:38px;height:38px;min-height:38px;padding:0;border:0;background:transparent;color:#a8bfd9;font:29px/1 system-ui;cursor:pointer}
.reference-settings-dialog{color:#e9edf0;background:#051a29;border:1px solid #b99754;border-radius:10px;max-width:450px;width:calc(100vw - 32px);padding:25px;box-shadow:0 20px 80px #000a;font:16px/1.5 system-ui}
.reference-settings-dialog::backdrop{background:#000a;backdrop-filter:blur(4px)}
.reference-settings-dialog h2{font:600 23px Georgia,serif;color:#e4c784;margin:0 0 20px}
.reference-settings-dialog label{display:flex;align-items:center;gap:12px;color:#dbe7f1}
.reference-settings-dialog input{accent-color:#25cdef;width:18px;height:18px}
.reference-settings-dialog p{font-size:13px;color:#9fb5c5;margin:15px 0}
.reference-settings-dialog button{background:#173849;color:#f2e6c9;border:1px solid #aa8e58;border-radius:4px;padding:10px 24px;cursor:pointer}
.reference-click-pulse{position:fixed;z-index:2147483646;width:52px;height:52px;border-radius:50%;border:1px solid var(--ref-cyan,#d9c278);background:radial-gradient(circle,#b5f3ff55,transparent 70%);box-shadow:0 0 15px var(--ref-cyan,#c6b078);pointer-events:none;transform:translate(-50%,-50%)}
:is(.reference-lobby,.reference-ranked) :is(button,a,summary,select,input){transition:box-shadow .18s ease,border-color .18s ease,filter .18s ease,color .18s ease,background-color .18s ease;touch-action:manipulation}
:is(.reference-lobby,.reference-ranked) button:active:not(:disabled){filter:brightness(1.35)}
:is(.reference-lobby,.reference-ranked) :is(button,a,summary,select,input):focus-visible{outline:2px solid #a1efff;outline-offset:3px}
.reference-lobby .picker-card img,.reference-lobby .tile-art img{transition:transform .22s ease,filter .22s ease}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  :is(.reference-lobby,.reference-ranked) button:hover:not(:disabled){filter:brightness(1.2);box-shadow:0 0 12px #4cceff44}
  .reference-lobby #play .deck-tile:hover{border-color:#80cee5;box-shadow:inset 0 0 14px #1dbae21a,0 0 9px #1dbae222}
  .reference-lobby #play .deck-tile:hover .tile-art img,.reference-lobby #play .picker-card:hover img{transform:translateY(-2px) scale(1.06);filter:brightness(1.13)}
  .reference-lobby #play .standard-queues>button:hover{filter:brightness(1.27);box-shadow:0 0 12px #71daff88}
  .reference-ranked .tiers>div:hover{background-color:#184d633d;box-shadow:inset 0 0 18px #20baf722}
  .reference-ranked .tiers>div:hover img{transform:translateY(-4px) scale(1.08);filter:drop-shadow(0 0 9px #74bdf099) brightness(1.12)}
  :is(.reference-lobby,.reference-ranked) .primary:hover:not(:disabled){filter:brightness(1.25);text-shadow:0 0 10px #fff6a755}
}
@media(max-width:1250px){}
@media(max-width:800px){.reference-settings{width:32px}}
@media(prefers-reduced-motion:reduce){:is(.reference-lobby,.reference-ranked) *,:is(.reference-lobby,.reference-ranked) *::before,:is(.reference-lobby,.reference-ranked) *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reference-click-pulse{display:none}}
html[data-motion=reduced] :is(.reference-lobby,.reference-ranked) *,html[data-motion=reduced] :is(.reference-lobby,.reference-ranked) *::before,html[data-motion=reduced] :is(.reference-lobby,.reference-ranked) *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
html[data-motion=reduced] :is(.reference-lobby,.reference-ranked) .tiers img,html[data-motion=reduced] .reference-lobby .tile-art img,html[data-motion=reduced] .reference-lobby .picker-card img{transform:none!important}
@media(max-width:550px){}