@import url('https://fonts.googleapis.com/css2?family=Russo+One&display=swap'); #radio-bingo-app {--rb-cyan:#00d7ff;--rb-blue:#0088ff;--rb-orange:#ff9b00;--rb-ink:#ecf6ff;--rb-muted:#a7c4df;--rb-glow:1;font-family:'Segoe UI',Arial,sans-serif;color:var(--rb-ink);color-scheme:dark;background:#05111f;border-radius:14px;overflow:hidden;position:relative;isolation:isolate;} #radio-bingo-app * {box-sizing:border-box;} #radio-bingo-app .rb-sitebar {height:72px;display:flex;align-items:center;gap:24px;padding:8px 24px;background:linear-gradient(110deg,#042037,#07131f 70%);border-bottom:1px solid #114260;} #radio-bingo-app .rb-site-logo {width:58px;height:58px;object-fit:contain;flex:none;} #radio-bingo-app .rb-nav {display:flex;gap:23px;font-size:12px;color:#b7cfe7;white-space:nowrap;} #radio-bingo-app .rb-preview {margin-left:auto;letter-spacing:1.3px;font-size:11px;color:#a4c1db;white-space:nowrap;} #radio-bingo-app .rb-stage {padding:16px 20px 24px;background:radial-gradient(ellipse at 0% 30%,#0464aa45,transparent 40%),radial-gradient(ellipse at 100% 60%,#b85b1933,transparent 45%),#040d17;position:relative;} #radio-bingo-app .rb-backdrop {position:absolute;inset:10px;z-index:-1;filter:blur(7px);opacity:.32;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;overflow:hidden;} #radio-bingo-app .rb-backdrop span {height:210px;background:linear-gradient(150deg,#035584,#082435 50%,#512937);border-radius:12px;} #radio-bingo-app .rb-backdrop span:nth-child(3n) {background:linear-gradient(35deg,#202454,#985010,#092237);} #radio-bingo-app .rb-window {position:relative;max-width:1240px;margin:auto;background:radial-gradient(ellipse at 20% 0%,#082741b0,transparent 55%),linear-gradient(135deg,#031423,#06121e 70%,#021321);border:1px solid #00b7f1;border-radius:19px;box-shadow:0 0 0 1px #0087fc40,0 25px 60px #0009,0 0 26px #007cdb17;overflow:hidden;} #radio-bingo-app .rb-heading {display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:20px;align-items:center;padding:22px 24px 17px;} #radio-bingo-app .rb-logo {width:108px;height:108px;object-fit:contain;} #radio-bingo-app .rb-titleblock {border-left:1px solid #21415b;padding-left:23px;} #radio-bingo-app h2 {margin:0 0 2px;font-size:54px;line-height:1.15;font-weight:800;letter-spacing:-1.7px;white-space:nowrap;text-shadow:0 3px 20px #14a8fc14;} #radio-bingo-app .rb-title-radio {background:linear-gradient(120deg,#009aff,#8cddff 65%,#f5f8ff);background-clip:text;-webkit-background-clip:text;color:transparent;} #radio-bingo-app .rb-title-bingo {background:linear-gradient(110deg,#ffe1bd,#ffba54 55%,#ffda67);background-clip:text;-webkit-background-clip:text;color:transparent;} #radio-bingo-app .rb-subtitle {color:#b8e7fb;font-size:16px;line-height:1.5;} #radio-bingo-app .rb-subtitle strong {color:#31e9f2;font-weight:600;} #radio-bingo-app .rb-timer {padding-left:19px;border-left:1px solid #1d394d;align-self:center;text-align:right;} #radio-bingo-app .rb-timer-label {font-size:12px;color:#b0c8df;} #radio-bingo-app .rb-time {font-size:30px;font-weight:700;letter-spacing:1px;font-variant-numeric:tabular-nums;line-height:1.4;white-space:nowrap;} #radio-bingo-app .rb-timer small {color:#93b4d5;font-size:12px;letter-spacing:1px;} #radio-bingo-app .rb-main {display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,1fr);gap:16px;padding:0 20px 20px;align-items:stretch;} #radio-bingo-app .rb-board {background:linear-gradient(145deg,#071b2a,#051521);border:1px solid #133a52;border-radius:12px;padding:13px 10px 16px;} #radio-bingo-app .rb-toast {min-height:48px;display:flex;align-items:center;gap:12px;margin:0 7% 17px;padding:8px 13px;border:1px solid #008bff;border-radius:11px;box-shadow:inset 0 0 17px #0082ff22,0 0 12px #0087ff1c;background:linear-gradient(120deg,#042647,#04172b 70%,#092741);font-size:14px;line-height:1.4;} #radio-bingo-app .rb-toast-icon {width:31px;height:31px;display:grid;place-items:center;flex:none;border-radius:50%;background:linear-gradient(150deg,#00e5ff,#0076ff 60%);box-shadow:0 0 15px #00b7ff80;} #radio-bingo-app i[data-lucide] {font-style:normal;font-size:24px;line-height:1;display:grid;place-items:center;} #radio-bingo-app .rb-grid {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;} #radio-bingo-app .rb-square {position:relative;min-width:0;min-height:99px;padding:11px 5px 9px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:1px solid #284a60;border-radius:9px;color:#f5faff;background:radial-gradient(ellipse at 50% -20%,#263f50 0,transparent 70%),linear-gradient(140deg,#132838,#0c1b27);font-family:inherit;box-shadow:inset 0 1px 1px #a8dbff0a,0 3px 7px #0003;transition:background .15s,box-shadow .15s;} #radio-bingo-app .rb-square:hover {border-color:#77dfff;box-shadow:inset 0 0 18px #1597ed26,0 0 10px #00c8ff29;} #radio-bingo-app .rb-square:focus-visible,#radio-bingo-app button:focus-visible {outline:3px solid #fff;outline-offset:2px;} #radio-bingo-app .rb-kind {font-size:11px;letter-spacing:.7px;line-height:1.2;text-transform:uppercase;color:#afd5f5;} #radio-bingo-app .rb-label {font-size:14px;line-height:1.25;font-weight:500;text-align:center;overflow-wrap:anywhere;} #radio-bingo-app .rb-check {display:none;width:21px;height:21px;border-radius:50%;place-items:center;background:#5cddff;color:#fff;font-size:17px;font-weight:800;line-height:1;box-shadow:0 0 9px #00ddff85;} #radio-bingo-app .rb-square.is-filled {background:radial-gradient(ellipse at 25% -10%,#03dfff 0,transparent 58%),linear-gradient(135deg,#008eea,#0051bc 75%,#0079dc);border-color:#00dfff;box-shadow:inset 0 0 17px #09b4ff7d,0 0 calc(8px * var(--rb-glow)) #009dff45;gap:6px;} #radio-bingo-app .rb-square.is-filled .rb-kind {color:#d9f3ff;} #radio-bingo-app .rb-square.is-filled .rb-check {display:grid;} #radio-bingo-app .rb-free {gap:2px;background:radial-gradient(ellipse at center,#00406a,#06131e 75%);} #radio-bingo-app .rb-free img {height:54px;width:54px;object-fit:contain;} #radio-bingo-app .rb-free strong {font-size:18px;line-height:1.1;letter-spacing:1px;} #radio-bingo-app .rb-rare {position:absolute;top:4px;right:5px;color:#ffd068;font-size:12px;} #radio-bingo-app .rb-board-note {font-size:11px;color:#8caecb;margin:13px 3px 0;display:flex;justify-content:space-between;gap:10px;line-height:1.5;} #radio-bingo-app .rb-side {display:flex;flex-direction:column;gap:12px;} #radio-bingo-app .rb-panel {padding:15px 16px;background:linear-gradient(130deg,#102739aa,#081724);border:1px solid #1d435d;border-radius:12px;box-shadow:inset 0 0 22px #00121b70;} #radio-bingo-app h3 {margin:0 0 14px;font-size:17px;font-weight:500;} #radio-bingo-app .rb-player {display:flex;gap:12px;align-items:center;margin-bottom:13px;} #radio-bingo-app .rb-avatar {height:48px;width:48px;border:2px solid #159bff;border-radius:50%;background:linear-gradient(140deg,#204566,#051f36);display:grid;place-items:center;color:#30b9ff;box-shadow:inset 0 0 0 2px #061d35;flex:none;} #radio-bingo-app .rb-avatar svg {width:29px;height:29px;} #radio-bingo-app .rb-player-label {font-size:14px;line-height:1.5;} #radio-bingo-app .rb-player-label small {font-size:11px;color:#9dbdd9;display:block;} #radio-bingo-app .rb-total {margin-left:auto;text-align:right;font-size:27px;line-height:1.1;font-weight:700;white-space:nowrap;} #radio-bingo-app .rb-total b {color:#38beff;font-weight:700;} #radio-bingo-app .rb-total small {font-size:11px;display:block;font-weight:400;color:#b0cbe3;margin-top:5px;} #radio-bingo-app .rb-meter {height:10px;background:#142431;border-radius:20px;overflow:hidden;} #radio-bingo-app .rb-meter span {height:100%;display:block;width:37.5%;border-radius:20px;background:linear-gradient(90deg,#006bff,#03cbff 45%,#c1edee 70%,#ffa400);box-shadow:0 0 10px #00c5ff55;transition:width .2s;} #radio-bingo-app .rb-achievements {flex:1;} #radio-bingo-app .rb-section-head {display:flex;align-items:center;justify-content:space-between;gap:8px;} #radio-bingo-app .rb-section-head small {font-size:11px;color:#71bbd8;} #radio-bingo-app .rb-achievement {display:flex;align-items:center;gap:11px;padding:10px 0;border-top:1px solid #1d3a4d;} #radio-bingo-app .rb-achievement:first-of-type {border-top:0;} #radio-bingo-app .rb-award {height:44px;width:44px;border:1px solid #274453;background:linear-gradient(130deg,#19313d,#091c29);border-radius:8px;flex:none;display:grid;place-items:center;color:#ffc533;filter:drop-shadow(0 2px 3px #0006);} #radio-bingo-app .rb-award svg {width:25px;height:25px;stroke-width:2.1;} #radio-bingo-app .rb-achievement strong {font-size:13px;line-height:1.4;font-weight:500;display:block;} #radio-bingo-app .rb-achievement small {font-size:11px;line-height:1.45;color:#9dbcd7;display:block;margin-top:3px;} #radio-bingo-app .rb-achievement .rb-ring {height:16px;width:16px;border:1.5px solid #4e7d9f;border-radius:50%;margin-left:auto;flex:none;} #radio-bingo-app .rb-achievement.earned .rb-ring {background:#00b4e8;border-color:#a5f4ff;box-shadow:0 0 8px #00cfff60;} #radio-bingo-app .rb-perks {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;} #radio-bingo-app .rb-perk {padding:9px 4px;min-height:61px;border:1px solid #1d435b;border-radius:9px;background:linear-gradient(#102636,#081723);text-align:center;color:#abc9e1;font-size:11px;line-height:1.5;} #radio-bingo-app .rb-perk strong {display:block;color:#19d2f3;font-size:12px;font-weight:500;} #radio-bingo-app .rb-footer {margin:0 20px;border-top:1px solid #123b54;padding:13px 3px 15px;display:flex;justify-content:space-between;gap:18px;font-size:11px;letter-spacing:1.2px;color:#a3c0dc;line-height:1.5;} #radio-bingo-app .rb-data-note {font-size:11px;color:#829fb8;line-height:1.6;padding:12px 24px 14px;text-align:center;background:#040e18;} #radio-bingo-app .rb-compact {display:none;} #radio-bingo-app .rb-heading {padding-top:26px;padding-bottom:23px;} #radio-bingo-app .rb-titleblock {padding-left:24px;} #radio-bingo-app .rb-eyebrow {color:#6ccfff;font-size:11px;font-weight:600;letter-spacing:3px;margin-bottom:7px;} #radio-bingo-app h2 {font-family:'Arial Black','Segoe UI',sans-serif;font-size:54px;font-weight:900;letter-spacing:-2px;line-height:1.05;margin-bottom:9px;} #radio-bingo-app .rb-title-radio {background:linear-gradient(#f1fbff,#93dfff 60%,#36aaff);background-clip:text;-webkit-background-clip:text;} #radio-bingo-app .rb-title-bingo {background:linear-gradient(#fff3c7,#ffd05e 60%,#ff9400);background-clip:text;-webkit-background-clip:text;} #radio-bingo-app .rb-subtitle {font-size:13px;color:#a9cbe5;} #radio-bingo-app .rb-titleblock::after {content:'';display:block;width:165px;height:2px;margin-top:14px;background:linear-gradient(90deg,#00baff,#ffb22d,transparent);} #radio-bingo-app .rb-square.is-line {background:radial-gradient(ellipse at 50% 0%,#ffe976,transparent 60%),linear-gradient(135deg,#ffc21d,#ff8500 65%,#ffb400);border-color:#fff28b;box-shadow:inset 0 0 15px #ffff6370,0 0 calc(13px * var(--rb-glow)) #ffad0060;} #radio-bingo-app .rb-square.is-line .rb-kind {color:#fffbe1;} #radio-bingo-app .rb-square.is-line .rb-check {background:#ffd354;box-shadow:0 0 12px #fff38c70;} #radio-bingo-app .rb-square.is-line .rb-label {text-shadow:0 1px 3px #8f3b00;} #radio-bingo-app .rb-square.is-wrong {background:linear-gradient(140deg,#b6283b,#6e1225)!important;border-color:#ff7085!important;box-shadow:inset 0 0 18px #ff6f7150,0 0 13px #f8264e70!important;} #radio-bingo-app .rb-square.is-wrong .rb-kind {color:#ffe6eb;} #radio-bingo-app .rb-toast.is-error {border-color:#f36379;background:linear-gradient(120deg,#4b192c,#211221);} #radio-bingo-app .rb-toast.is-error .rb-toast-icon {background:#c3324b;box-shadow:0 0 10px #ed315944;} #radio-bingo-app .rb-close-line {font-size:12px;color:#7edbff;margin-top:11px;line-height:1.5;} #radio-bingo-app .rb-playing .rb-section-head small {font-size:11px;} #radio-bingo-app .rb-song-title {font-size:17px;font-weight:600;color:#ecf7ff;line-height:1.4;} #radio-bingo-app .rb-song-artist {font-size:13px;color:#93bad9;margin-top:5px;} #radio-bingo-app .rb-click-hint {font-size:12px;line-height:1.6;color:#a2c6e1;margin-top:12px;} @media(prefers-reduced-motion:reduce) {#radio-bingo-app * {transition:none!important;}} /* Fixed desktop composition; the viewport-fit rule below keeps it visible in a popup. */ #radio-bingo-app {width:960px;min-width:960px;max-width:960px;height:890px;border-radius:19px;} #radio-bingo-app .rb-stage {width:960px;height:854px;padding:0;background:#040d17;} #radio-bingo-app .rb-window {width:960px;min-width:960px;max-width:960px;height:854px;margin:0;} #radio-bingo-app .rb-heading {height:160px;grid-template-columns:108px 510px 1fr;gap:18px;padding:20px 24px;} #radio-bingo-app h2 {font-size:54px;line-height:1.05;letter-spacing:-2px;} #radio-bingo-app .rb-main {height:650px;grid-template-columns:582px 320px;gap:16px;padding:0 20px;} #radio-bingo-app .rb-board {height:650px;padding:12px 10px;} #radio-bingo-app .rb-toast {height:44px;min-height:44px;margin:0 28px 12px;padding:6px 12px;font-size:13px;} #radio-bingo-app .rb-grid {grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(5,102px);gap:6px;} #radio-bingo-app .rb-square {height:102px;min-height:102px;padding:9px 5px;} #radio-bingo-app .rb-board-note {margin-top:12px;line-height:16px;gap:8px;} #radio-bingo-app .rb-side {display:grid;height:650px;grid-template-columns:320px;grid-template-rows:150px 330px 146px;gap:12px;} #radio-bingo-app .rb-panel {padding:12px;} #radio-bingo-app h3 {margin-bottom:10px;line-height:20px;} #radio-bingo-app .rb-player {gap:8px;margin-bottom:8px;} #radio-bingo-app .rb-player-label {font-size:12px;line-height:1.5;} #radio-bingo-app .rb-avatar {width:40px;height:40px;} #radio-bingo-app .rb-total {font-size:25px;} #radio-bingo-app .rb-meter {height:8px;} #radio-bingo-app .rb-close-line {margin-top:8px;} #radio-bingo-app .rb-achievement {height:69px;padding:10px 0;gap:10px;} #radio-bingo-app .rb-award {height:42px;width:42px;} #radio-bingo-app .rb-achievement strong {font-size:13px;} #radio-bingo-app .rb-achievement small {font-size:11px;} #radio-bingo-app .rb-click-hint {font-size:11px;line-height:1.5;margin-top:8px;} #radio-bingo-app .rb-song-title {font-size:17px;line-height:24px;} #radio-bingo-app .rb-song-artist {font-size:12px;line-height:18px;margin-top:3px;} #radio-bingo-app .rb-footer {height:42px;padding:0 3px;align-items:center;} #radio-bingo-app .rb-data-note {height:36px;padding:9px 12px;line-height:18px;} #radio-bingo-app .rb-heading {grid-template-columns:108px 510px 1fr;} #radio-bingo-app .rb-titleblock {position:relative;padding-left:25px;isolation:isolate;} #radio-bingo-app .rb-titleblock::before {content:'';position:absolute;inset:18px 0 8px 0;z-index:-2;background:radial-gradient(ellipse at 28% 50%,#008de21c,transparent 65%),radial-gradient(ellipse at 78% 50%,#ff8a0010,transparent 65%);pointer-events:none;} #radio-bingo-app .rb-eyebrow {display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:3.2px;font-weight:600;margin:0 0 9px 3px;color:#87cce8;} #radio-bingo-app .rb-eyebrow::before {content:'';height:2px;width:18px;background:#19c9ff;box-shadow:0 0 8px #00b7ff80;} #radio-bingo-app h2 {display:flex;align-items:baseline;gap:17px;width:max-content;font-family:'Russo One','Arial Black',sans-serif;font-size:57px;font-weight:400;line-height:1.15;letter-spacing:-1.5px;margin:0 0 12px;white-space:nowrap;transform:skewX(-6deg);transform-origin:left center;text-shadow:none;isolation:isolate;text-transform:uppercase;} #radio-bingo-app h2 > span {position:relative;display:inline-block;z-index:0;background:none;-webkit-text-fill-color:initial;-webkit-text-stroke:0;filter:none;color:inherit;} #radio-bingo-app .rb-title-face {position:relative;display:block;z-index:1;} #radio-bingo-app .rb-title-radio .rb-title-face {background:linear-gradient(180deg,#f3fdff 7%,#b4efff 31%,#65d4ff 47%,#1bb4f4 49%,#58d5ff 70%,#0885d1 100%);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;-webkit-text-stroke:.55px #9fe5ff;filter:drop-shadow(0 0 12px #0087ff24);} #radio-bingo-app .rb-title-bingo .rb-title-face {background:linear-gradient(180deg,#fff5d4 7%,#ffe69b 31%,#ffc657 47%,#f69c17 49%,#ffd369 70%,#f58b0a 100%);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;-webkit-text-stroke:.55px #ffe5a1;filter:drop-shadow(0 0 12px #ff8b0022);} #radio-bingo-app h2 > span::before {content:attr(data-word);position:absolute;inset:0;z-index:0;transform:translate(0,4px);background:none;-webkit-text-stroke:1px #002b49;-webkit-text-fill-color:#03436b;color:#03436b;text-shadow:0 2px 0 #021d32,0 6px 8px #0008;} #radio-bingo-app h2 > .rb-title-bingo::before {-webkit-text-stroke:1px #5b3209;-webkit-text-fill-color:#a85206;color:#a85206;text-shadow:0 2px 0 #472500,0 6px 8px #0008;} #radio-bingo-app .rb-subtitle {display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.25px;color:#a4c6dc;margin-left:3px;} #radio-bingo-app .rb-subtitle::before {content:'';width:30px;height:3px;background:linear-gradient(90deg,#00baff 0 46%,transparent 46% 54%,#ffb53a 54%);transform:skewX(-28deg);} #radio-bingo-app .rb-titleblock::after {display:none;} #radio-bingo-app {--rb-cyan:#00aaff;--rb-orange:#ff7a00;} #radio-bingo-app .rb-title-radio .rb-title-face {background:linear-gradient(180deg,#b3e8ff 0%,#38bdff 20%,#00aaff 42%,#008ed6 45%,#00aaff 64%,#0095e0 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-stroke:.45px #52c5ff;filter:drop-shadow(0 0 12px #00aaff20);} #radio-bingo-app .rb-title-bingo .rb-title-face {background:linear-gradient(180deg,#ffa34d 0%,#ff8a1f 20%,#ff7a00 42%,#e66e00 45%,#ff7a00 64%,#ed7100 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-stroke:.45px #ff9d45;filter:drop-shadow(0 0 12px #ff7a0020);} #radio-bingo-app h2 > .rb-title-bingo::before {-webkit-text-stroke:1px #612e00;-webkit-text-fill-color:#a34e00;color:#a34e00;text-shadow:0 2px 0 #4d2500,0 6px 8px #0008;} #radio-bingo-app .rb-subtitle::before {background:linear-gradient(90deg,#00aaff 0 46%,transparent 46% 54%,#ff7a00 54%);} #radio-bingo-app .rb-square.is-line {background:radial-gradient(ellipse at 50% 0%,#ff9b3d,transparent 64%),linear-gradient(135deg,#ff8a1f,#ff7a00 65%,#ed7100);border-color:#ffab60;box-shadow:inset 0 0 15px #ff9b3d70,0 0 calc(13px * var(--rb-glow)) #ff7a0040;} #radio-bingo-app .rb-square.is-line .rb-check {background:#ff9b3d;box-shadow:0 0 12px #ff9b3d70;} #radio-bingo-app .rb-square.is-line .rb-kind {color:#fff5ec;} #radio-bingo-app .rb-square.is-line .rb-label {text-shadow:0 1px 3px #8a4200;} #radio-bingo-app .rb-meter span {background:linear-gradient(90deg,#0088ff,#00aaff 45%,#83d5ff 70%,#ff7a00);} #radio-bingo-app .rb-footer {border-top:0;} #radio-bingo-app .rb-achievement {height:63px;gap:9px;padding:7px 0;} #radio-bingo-app .rb-veteran {height:84px;} #radio-bingo-app .rb-award {width:50px;height:50px;border:0;background:none;filter:none;box-shadow:none;} #radio-bingo-app .rb-award img {display:block;width:50px;height:50px;object-fit:contain;} #radio-bingo-app .rb-achievement-copy {flex:1;min-width:0;} #radio-bingo-app .rb-achievement:not(.earned) .rb-award img {filter:grayscale(1) blur(.3px);opacity:.64;} #radio-bingo-app .rb-veteran-progress {display:flex;align-items:center;gap:9px;margin-top:7px;} #radio-bingo-app .rb-veteran-track {height:7px;flex:1;overflow:hidden;border:0;border-radius:8px;background:#1b3040;} #radio-bingo-app .rb-veteran-track span {display:block;height:100%;width:30%;border-radius:8px;background:linear-gradient(90deg,#0088ff,#00aaff);transition:width .2s;} #radio-bingo-app .rb-veteran-count {font-size:11px;line-height:14px;color:#a7c4df;font-variant-numeric:tabular-nums;white-space:nowrap;} @media(prefers-reduced-motion:reduce) {#radio-bingo-app .rb-veteran-track span {transition:none;}} html,body{margin:0;min-width:960px;background:#040812}body{font-family:'Segoe UI',Arial,sans-serif} #radio-bingo-app{height:854px} #radio-bingo-app .rb-join{padding:80px 40px 100px;text-align:center;color:#ecf6ff} #radio-bingo-app .rb-join p{font-size:15px;line-height:1.6;color:#a7c4df;margin:15px 0 24px} #radio-bingo-app .rb-join button,#radio-bingo-app .rb-join a{display:inline-block;padding:13px 25px;border:1px solid #31baff;border-radius:9px;background:#087fc3;color:white;font:600 15px 'Segoe UI',sans-serif;text-decoration:none;cursor:pointer} #radio-bingo-app [hidden]{display:none!important} #radio-bingo-app .rb-square:not(.is-filled):disabled{opacity:.7} #radio-bingo-app .rb-square{cursor:pointer}#radio-bingo-app .rb-square:disabled{cursor:default} #radio-bingo-app .rb-subtitle{max-width:460px} #radio-bingo-app .rb-meter span,#radio-bingo-app .rb-veteran-track span{width:0} #radio-bingo-app .rb-avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%} #radio-bingo-app .rb-progress{position:relative}#radio-bingo-app .rb-leave{position:absolute;right:16px;top:17px;background:none;border:0;color:#8ddcff;font:11px Segoe UI,sans-serif;padding:0;cursor:pointer} #radio-bingo-app .rb-playing{position:relative}#radio-bingo-app .rb-playing.has-bingo>:not(.rb-bingo-call){visibility:hidden}#radio-bingo-app .rb-bingo-call{position:absolute;inset:0;width:100%;border:1px solid #ff7a00;border-radius:12px;background:linear-gradient(135deg,#082c43,#071323);color:#ff7a00;font:italic 900 48px 'Russo One','Segoe UI',sans-serif;letter-spacing:3px;text-shadow:0 2px 0 #953b00;box-shadow:inset 0 0 36px #ff7a0022,0 0 18px #ff7a0033;cursor:pointer}#radio-bingo-app .rb-bingo-call:disabled{font-size:24px;letter-spacing:1px;cursor:default;color:#00aaff;border-color:#00aaff;text-shadow:none;box-shadow:inset 0 0 26px #00aaff15} #radio-bingo-app .rb-chat-platform{position:absolute;right:55px;top:15px;width:92px;padding:2px 4px;border:1px solid #214b63;border-radius:4px;background:#081c2a;color:#a7dbf5;font:11px Segoe UI,sans-serif;cursor:pointer} #radio-bingo-app .rb-playing.is-guess-locked>:not(.rb-guess-lock){visibility:hidden}#radio-bingo-app .rb-guess-lock{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;border:1px solid #ff7a00;border-radius:12px;background:linear-gradient(135deg,#082c43,#071323);box-shadow:inset 0 0 36px #ff7a0022,0 0 18px #ff7a0033;text-align:center}#radio-bingo-app .rb-guess-lock strong{font:italic 400 46px/1 'Russo One','Segoe UI',sans-serif;color:#ff7a00;letter-spacing:1px;text-shadow:0 2px 0 #953b00}#radio-bingo-app .rb-guess-lock span{color:#eef8ff;font:13px/1.4 Segoe UI,sans-serif} #radio-bingo-app .rb-toast{height:44px;min-height:44px;margin:0 0 12px;padding:5px 12px;gap:11px;position:relative;overflow:hidden;border:1px solid #24546d;border-radius:8px;background:linear-gradient(110deg,#08293b,#081b29 70%);box-shadow:inset 0 1px 0 #7ad8ff0c;font-size:13px;line-height:17px}#radio-bingo-app .rb-toast::before{content:'';position:absolute;inset:9px auto 9px 0;width:3px;border-radius:0 3px 3px 0;background:#00aaff}#radio-bingo-app .rb-toast::after{content:'';position:absolute;right:12px;top:10px;width:17px;height:2px;background:linear-gradient(90deg,#00aaff 45%,transparent 45% 55%,#ff7a00 55%);transform:skewX(-25deg)}#radio-bingo-app .rb-toast-icon{width:27px;height:27px;border-radius:0;color:#00aaff;background:none;box-shadow:none}#radio-bingo-app .rb-toast-icon svg{display:block;width:27px;height:27px}#radio-bingo-app .rb-toast-copy{display:flex;flex-direction:column;min-width:0;padding-right:10px}#radio-bingo-app .rb-toast-copy small{font-size:8px;line-height:11px;font-weight:700;letter-spacing:1.5px;color:#80b5cf}#radio-bingo-app .rb-toast-text{color:#eef8ff}#radio-bingo-app .rb-toast.is-error{border-color:#a5465d;background:linear-gradient(110deg,#351a2a,#1c1523)}#radio-bingo-app .rb-toast.is-error::before{background:#f36379}#radio-bingo-app .rb-toast.is-error .rb-toast-icon{color:#f36379;background:none;box-shadow:none}#radio-bingo-app .rb-toast.is-error .rb-toast-copy small{color:#ee9fb0} #radio-bingo-app .rb-explorer-progress{display:flex;align-items:center;gap:8px;margin-top:4px}#radio-bingo-app .rb-explorer-track{display:block;height:5px;flex:1;overflow:hidden;border-radius:8px;background:#1b3040}#radio-bingo-app .rb-explorer-track span{display:block;height:100%;width:0;background:#00aaff;border-radius:8px}#radio-bingo-app .rb-explorer-count{font-size:10px;line-height:12px;color:#a7c4df;font-variant-numeric:tabular-nums} /* Completed games stay clearly closed when their saved card is reviewed. */ #radio-bingo-app.is-finished .rb-timer-label{color:#ffb879;font-weight:700;letter-spacing:1px}#radio-bingo-app.is-finished .rb-time{font:400 30px/1.4 'Russo One',sans-serif;color:#ff7a00;letter-spacing:2px}#radio-bingo-app.is-finished .rb-subtitle,#radio-bingo-app.is-finished .rb-close-line{color:#ffc08a}#radio-bingo-app.is-finished .rb-toast{border-color:#79502d}#radio-bingo-app.is-finished .rb-toast::before{background:#ff7a00}#radio-bingo-app.is-finished .rb-toast-copy small{color:#ffab60}#radio-bingo-app.is-finished .rb-square:not(.is-filled):disabled{opacity:.72}#radio-bingo-app .rb-results-open{margin-top:5px;padding:0;border:0;border-bottom:1px solid #00aaff70;color:#80d3ff;background:none;font:12px/1.5 'Segoe UI',sans-serif;letter-spacing:0;cursor:pointer} #radio-bingo-app .rb-results-overlay{position:absolute;inset:0;z-index:30;display:grid;place-items:center;padding:34px;background:#020b16d9;backdrop-filter:blur(3px)}#radio-bingo-app .rb-results-card{position:relative;width:630px;max-height:760px;overflow:auto;padding:32px 36px 28px;border:1px solid #1a9cce;border-radius:18px;background:radial-gradient(ellipse at 0 0,#00aaff1c,transparent 65%),linear-gradient(140deg,#082438,#061623 80%);box-shadow:0 20px 70px #0009,inset 0 1px 0 #ffffff0c;text-align:center}#radio-bingo-app .rb-results-card::before{content:'';position:absolute;top:0;left:30px;right:30px;height:3px;background:linear-gradient(90deg,#00aaff 0 48%,#ff7a00 52%);border-radius:0 0 4px 4px}#radio-bingo-app .rb-results-kicker{color:#8fd8f4;font-size:10px;font-weight:600;letter-spacing:2.5px;margin-bottom:13px}#radio-bingo-app .rb-results-card h2{display:block;width:auto;transform:skewX(-6deg);margin:0;color:#ff7a00;font:400 43px/1.2 'Russo One',sans-serif;letter-spacing:1px;text-shadow:0 3px 0 #783800;white-space:normal}#radio-bingo-app .rb-results-segment{color:#eef8ff;font-size:17px;font-weight:600;margin:17px 0 7px}#radio-bingo-app .rb-results-thanks{color:#a7c4df;font-size:13px;line-height:1.5;margin:0 0 17px}#radio-bingo-app .rb-results-personal{font-size:14px;font-weight:600;line-height:1.5;color:#a9e3ff;padding:12px;border:1px solid #20546a;border-radius:8px;background:#00aaff09;margin-bottom:19px}#radio-bingo-app .rb-results-table-wrap{min-height:110px}#radio-bingo-app .rb-results-table{width:100%;border-collapse:collapse;text-align:left;font-size:14px;font-variant-numeric:tabular-nums}#radio-bingo-app .rb-results-table caption{text-align:left;font-size:16px;font-weight:600;margin-bottom:13px;color:#ecf6ff}#radio-bingo-app .rb-results-table th{padding:0 8px 9px;font-size:10px;text-transform:uppercase;letter-spacing:1px;font-weight:600;color:#91b7ce;border-bottom:1px solid #24506a}#radio-bingo-app .rb-results-table td{padding:12px 8px;border-bottom:1px solid #153348}#radio-bingo-app .rb-results-table td:first-child{width:35px;color:#7dd0f4;font-family:'Russo One',sans-serif}#radio-bingo-app .rb-results-table td:nth-child(2){max-width:280px;overflow-wrap:anywhere}#radio-bingo-app .rb-results-table th:nth-child(n+3),#radio-bingo-app .rb-results-table td:nth-child(n+3){text-align:right;white-space:nowrap}#radio-bingo-app .rb-results-table td:nth-child(3){color:#ff9a40;font-weight:700}#radio-bingo-app .rb-results-table .is-you{background:#00aaff0c}#radio-bingo-app .rb-results-empty{color:#abc9e1;font-size:14px}#radio-bingo-app .rb-results-rules{font-size:11px;line-height:1.5;color:#92aec1;margin:15px 0 23px}#radio-bingo-app .rb-results-close{border:1px solid #00aaff;border-radius:8px;padding:12px 26px;color:white;background:linear-gradient(120deg,#007fbe,#00649c);font:600 14px/1.4 'Segoe UI',sans-serif;cursor:pointer}#radio-bingo-app .rb-results-close:hover{background:#008ccc} /* A wrong guess remains identifiable until the current music play changes. */ #radio-bingo-app .rb-square.is-attempted:not(.is-wrong)::before{content:'';position:absolute;inset:1px;border-radius:inherit;pointer-events:none;z-index:0;opacity:.3;background:repeating-linear-gradient(135deg,#ff7a00 0 3px,transparent 3px 13px,#00aaff 13px 16px,transparent 16px 26px)} #radio-bingo-app .rb-square.is-attempted .rb-kind,#radio-bingo-app .rb-square.is-attempted .rb-label{position:relative;z-index:1} /* Four badges per page, within the existing sidebar height. */ #radio-bingo-app .rb-achievements{display:grid;grid-template-rows:22px 252px 24px;gap:0;padding:12px;min-height:0} #radio-bingo-app .rb-achievement-list{min-height:0;overflow:hidden} #radio-bingo-app .rb-achievement-list .rb-achievement{height:63px;padding:6px 0;gap:8px;border-top:1px solid #1d3a4d} #radio-bingo-app .rb-achievement-list .rb-award,#radio-bingo-app .rb-achievement-list .rb-award img{width:46px;height:46px} #radio-bingo-app .rb-achievement-list .rb-achievement strong{font-size:12px;line-height:16px} #radio-bingo-app .rb-achievement-list .rb-achievement small{font-size:10px;line-height:13px;margin-top:2px} #radio-bingo-app .rb-achievement-list .rb-ring{width:14px;height:14px} #radio-bingo-app .rb-achievement-progress{display:flex;align-items:center;gap:6px;margin-top:3px} #radio-bingo-app .rb-achievement-track{display:block;flex:1;min-width:20px;height:5px;border-radius:5px;background:#1b3040;overflow:hidden} #radio-bingo-app .rb-achievement-track>span{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#0088ff,#00caff);transition:width .2s} #radio-bingo-app .rb-achievement-count{font-size:9px;color:#a7c4df;white-space:nowrap;font-variant-numeric:tabular-nums} #radio-bingo-app .rb-achievement-pages{display:flex;gap:5px;align-items:center;justify-content:center} #radio-bingo-app .rb-achievement-pages button{font:600 11px Segoe UI,sans-serif;line-height:20px;min-width:25px;height:23px;padding:0 6px;border:1px solid #24516a;border-radius:5px;background:#091e2c;color:#a7c4df;cursor:pointer} #radio-bingo-app .rb-achievement-pages button[aria-current=page]{border-color:#00baff;color:#fff;background:#063c57;box-shadow:inset 0 -2px #00aaff} #radio-bingo-app .rb-achievement-pages button.has-new{border-color:#ff7a00;box-shadow:0 0 7px #ff7a0060;color:#ffac68} #radio-bingo-app .rb-achievement-pages button:disabled{opacity:.35;cursor:default} #radio-bingo-app .rb-achievement-pages button:focus-visible{outline:2px solid #fff;outline-offset:2px} @media(prefers-reduced-motion:reduce){#radio-bingo-app .rb-achievement-track>span{transition:none}} /* Fit the complete game inside browser popups without page scrollbars. */ html,body{width:100%;height:100%;min-width:0;overflow:hidden} #radio-bingo-app{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--rb-fit,1));transform-origin:center} /* Three categories share a shape, with distinct colours and visible labels. */ #radio-bingo-app .tone-power{--ability:#49dcf5;--ability-rgb:73,220,245} #radio-bingo-app .tone-debuff{--ability:#ff7d91;--ability-rgb:255,125,145} #radio-bingo-app .tone-wild{--ability:#c3a0ff;--ability-rgb:195,160,255} #radio-bingo-app .rb-powers{position:relative;padding:10px 11px;background:radial-gradient(ellipse at 5% 0,#49dcf509,transparent 55%),radial-gradient(ellipse at 100% 100%,#c3a0ff0c,transparent 65%),#071926} #radio-bingo-app .rb-powers .rb-section-head{height:21px;margin-bottom:7px;align-items:center} #radio-bingo-app .rb-powers h3{font-size:15px;line-height:20px;margin:0;letter-spacing:-.15px} #radio-bingo-app .rb-ability-help{display:grid;place-items:center;width:19px;height:19px;padding:0;border:1px solid #365569;border-radius:50%;background:#102c3d;color:#b6d5e8;font:700 11px 'Segoe UI',sans-serif;cursor:pointer} #radio-bingo-app .rb-ability-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px} #radio-bingo-app .rb-ability-slot{position:relative;display:flex;align-items:center;flex-direction:column;justify-content:center;gap:3px;min-width:0;height:80px;padding:5px 3px 6px;overflow:hidden;border:1px solid rgba(var(--ability-rgb),.34);border-radius:9px;background:radial-gradient(ellipse at 50% 0,rgba(var(--ability-rgb),.15),transparent 90%),#091c29;box-shadow:inset 0 1px 0 rgba(var(--ability-rgb),.15);font-family:inherit;color:#eaf6ff;cursor:pointer;transition:transform .15s,border-color .15s,background .15s} #radio-bingo-app .rb-ability-slot::before{content:'';position:absolute;top:0;left:17%;right:17%;height:2px;border-radius:0 0 4px 4px;background:var(--ability);box-shadow:0 0 8px rgba(var(--ability-rgb),.3)} #radio-bingo-app .rb-ability-slot:hover:not(:disabled){transform:translateY(-2px);border-color:var(--ability);background:radial-gradient(ellipse at 50% 0,rgba(var(--ability-rgb),.24),transparent 90%),#0b2232} #radio-bingo-app .rb-ability-icon{display:grid;place-items:center;width:29px;height:29px;color:var(--ability);filter:drop-shadow(0 0 5px rgba(var(--ability-rgb),.17))} #radio-bingo-app .rb-ability-icon svg{width:25px;height:25px} #radio-bingo-app .rb-ability-slot strong{font-size:10px;line-height:12px;font-weight:650;text-align:center;max-width:88px;min-height:24px;display:flex;align-items:center;justify-content:center} #radio-bingo-app .rb-ability-slot small{font-size:8px;line-height:10px;color:var(--ability);letter-spacing:.4px;text-transform:uppercase} #radio-bingo-app .rb-ability-slot:disabled{cursor:default} #radio-bingo-app .rb-ability-slot.is-spent{opacity:.4;filter:saturate(.3)} #radio-bingo-app .rb-ability-effects{height:19px;display:flex;align-items:center;gap:5px;margin-top:5px;overflow:auto;scrollbar-width:none;white-space:nowrap} #radio-bingo-app .rb-ability-effects::-webkit-scrollbar{display:none} #radio-bingo-app .rb-effect{display:inline-block;color:var(--ability);background:rgba(var(--ability-rgb),.08);border:1px solid rgba(var(--ability-rgb),.2);border-radius:4px;padding:1px 5px;font-size:9px;line-height:13px} #radio-bingo-app .rb-no-effects{font-size:10px;line-height:15px;color:#8cacc1} #radio-bingo-app .rb-square.is-blocked:not(.is-filled){border-color:#b75d74;background:repeating-linear-gradient(135deg,#732c4317 0 8px,transparent 8px 16px),linear-gradient(140deg,#281d30,#122231)} #radio-bingo-app .rb-square.is-blocked:not(.is-filled)::after{content:'BLOCKED';position:absolute;bottom:5px;color:#ffadbc;font:700 8px/10px 'Segoe UI',sans-serif;letter-spacing:1px} #radio-bingo-app .rb-square.is-hinted:not(.is-filled){border-color:#49dcf5;outline:2px solid #49dcf570;outline-offset:-4px;animation:rb-hint 1.6s ease-in-out infinite} @keyframes rb-hint{50%{box-shadow:inset 0 0 28px #49dcf544,0 0 13px #49dcf533}} #radio-bingo-app .rb-toast.has-bingo .rb-toast-copy{padding-right:126px} #radio-bingo-app .rb-toast .rb-bingo-call{inset:5px 6px 5px auto;width:121px;border-radius:6px;background:linear-gradient(130deg,#41301b,#172635);font:italic 400 21px/1 'Russo One','Segoe UI',sans-serif;letter-spacing:1px;text-shadow:none;box-shadow:inset 0 0 12px #ff7a0015} #radio-bingo-app .rb-toast .rb-bingo-call:disabled{font:700 10px/1.3 'Segoe UI',sans-serif;letter-spacing:.5px;color:#53ddf5;border-color:#49dcf580} #radio-bingo-app .rb-toast .rb-guess-lock{border:0;inset:0;border-radius:7px;flex-direction:row;gap:12px;padding:6px 12px;justify-content:flex-start;box-shadow:none;text-align:left;background:linear-gradient(110deg,#302033,#101d2d)} #radio-bingo-app .rb-toast .rb-guess-lock strong{font:italic 400 23px/1 'Russo One','Segoe UI',sans-serif;letter-spacing:0;text-shadow:none} #radio-bingo-app .rb-toast .rb-guess-lock span{font-size:12px;line-height:15px} #radio-bingo-app .rb-toast.is-guess-locked .rb-toast-copy,#radio-bingo-app .rb-toast.is-guess-locked .rb-toast-icon{visibility:hidden} #radio-bingo-app .rb-toast.is-major-oops{border-color:#ff7d9180;background:linear-gradient(110deg,#392033,#141d2d)} #radio-bingo-app .rb-toast.is-major-oops::before{background:#ff7d91} #radio-bingo-app .rb-ability-modal{position:absolute;inset:0;z-index:40;display:grid;place-items:center;padding:28px;background:#020b16db;backdrop-filter:blur(5px)} #radio-bingo-app .rb-ability-dialog{position:relative;width:430px;max-height:790px;overflow:auto;padding:30px;border:1px solid rgba(var(--ability-rgb,73,220,245),.48);border-radius:17px;background:radial-gradient(ellipse at 50% 0,rgba(var(--ability-rgb,73,220,245),.12),transparent 65%),linear-gradient(145deg,#0a2639,#071622);box-shadow:0 24px 65px #0008,inset 0 1px 0 #ffffff0c;text-align:center;scrollbar-width:thin} #radio-bingo-app .rb-ability-close{position:absolute;right:12px;top:10px;width:28px;height:28px;border:1px solid #365168;border-radius:7px;background:#112a3b;color:#b9d6e6;font:22px/20px 'Segoe UI',sans-serif;cursor:pointer} #radio-bingo-app .rb-ability-hero{width:72px;height:72px;margin:0 auto 15px;display:grid;place-items:center;border:1px solid rgba(var(--ability-rgb,73,220,245),.3);border-radius:20px;color:var(--ability,#49dcf5);background:rgba(var(--ability-rgb,73,220,245),.08);box-shadow:inset 0 0 22px rgba(var(--ability-rgb,73,220,245),.05)} #radio-bingo-app .rb-ability-hero svg{width:42px;height:42px} #radio-bingo-app .rb-ability-category{color:var(--ability,#88cde5);font-size:10px;font-weight:650;letter-spacing:2px;text-transform:uppercase;margin:0 0 8px} #radio-bingo-app .rb-ability-dialog h2{display:block;margin:0;color:#eff8ff;background:none;transform:none;text-transform:none;white-space:normal;font:600 27px/1.2 'Segoe UI',sans-serif;letter-spacing:-.5px;text-shadow:none} #radio-bingo-app .rb-ability-description{font-size:14px;line-height:1.7;color:#bed3e1;margin:18px 0 24px} #radio-bingo-app .rb-ability-dialog label{display:block;text-align:left;font-size:12px;color:#bfd9e6;margin-top:16px} #radio-bingo-app .rb-ability-dialog select{display:block;width:100%;margin-top:7px;padding:11px 10px;border:1px solid #365d75;border-radius:7px;background:#0a1c2a;color:#f1f8fc;font:13px 'Segoe UI',sans-serif} #radio-bingo-app .rb-ability-error{color:#ffafbb;font-size:12px;line-height:1.5;margin:14px 0;min-height:18px} #radio-bingo-app .rb-ability-buttons{display:flex;justify-content:center;gap:10px} #radio-bingo-app .rb-ability-buttons button{border:1px solid #3a5b70;border-radius:8px;padding:11px 14px;font:600 12px 'Segoe UI',sans-serif;cursor:pointer;background:#102737;color:#bed3df} #radio-bingo-app .rb-ability-buttons .rb-ability-use{border-color:var(--ability);background:rgba(var(--ability-rgb),.13);color:var(--ability)} #radio-bingo-app .rb-ability-buttons button:disabled{opacity:.45;cursor:wait} #radio-bingo-app .rb-ability-dialog.is-library{width:860px;padding:28px;text-align:left;border-color:#365d75} #radio-bingo-app .is-library .rb-ability-hero{display:none} #radio-bingo-app .is-library .rb-ability-category{color:#9cbed1;font-size:9px} #radio-bingo-app .rb-collection-intro{max-width:720px;font-size:12px;line-height:1.7;color:#9cbbce;margin:12px 0 20px} #radio-bingo-app .rb-ability-collection{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start} #radio-bingo-app .rb-collection-group{border:1px solid rgba(var(--ability-rgb),.25);border-radius:10px;overflow:hidden;background:rgba(var(--ability-rgb),.025)} #radio-bingo-app .rb-collection-group h4{margin:0;padding:12px 13px;color:var(--ability);font:650 14px 'Segoe UI',sans-serif;background:rgba(var(--ability-rgb),.07);border-bottom:1px solid rgba(var(--ability-rgb),.18)} #radio-bingo-app .rb-collection-group article{padding:12px 10px;display:flex;gap:9px;border-top:1px solid #c7e9ff0b} #radio-bingo-app .rb-collection-group article:first-of-type{border:0} #radio-bingo-app .rb-collection-icon{color:var(--ability);flex:none;padding-top:1px} #radio-bingo-app .rb-collection-icon svg{width:22px;height:22px} #radio-bingo-app .rb-collection-group strong{font-size:12px;line-height:16px;color:#e8f5ff} #radio-bingo-app .rb-collection-group p{font-size:11px;line-height:1.55;color:#9ebacd;margin:4px 0 0} @media(prefers-reduced-motion:reduce){#radio-bingo-app .rb-square.is-hinted{animation:none;box-shadow:inset 0 0 20px #49dcf533}#radio-bingo-app .rb-ability-slot{transition:none}} /* Category identity remains visible through filled, line, hint and blocked states. */ #radio-bingo-app .rb-square[data-kind="Mood"]{--square-category:#c9a6ff} #radio-bingo-app .rb-square[data-kind="Genre"]{--square-category:#50dfcf} #radio-bingo-app .rb-square[data-kind="Tempo"]{--square-category:#ffd074} #radio-bingo-app .rb-square[data-kind="Artist"]{--square-category:#80c6ff} #radio-bingo-app .rb-square[data-kind="Length"]{--square-category:#cad5e1} #radio-bingo-app .rb-square[data-kind="Vocals"]{--square-category:#ffacd7} #radio-bingo-app .rb-square[data-kind="Language"]{--square-category:#9de28c} #radio-bingo-app .rb-category-corner{position:absolute;top:4px;right:4px;width:12px;height:12px;background:var(--square-category,#cad5e1);clip-path:polygon(0 0,100% 0,100% 100%);border-radius:0 3px 0 0;pointer-events:none;z-index:2} #radio-bingo-app .rb-square[data-kind] .rb-kind{color:var(--square-category,#cad5e1);padding:2px 5px;border-radius:4px;background:transparent;font-size:10px;line-height:12px;letter-spacing:.7px} #radio-bingo-app .rb-square[data-kind] .rb-rare{top:3px;right:20px;line-height:14px} /* The close symbol uses symmetric vector geometry, independent of font metrics. */ #radio-bingo-app .rb-ability-close{display:grid;place-items:center;padding:0;line-height:1} #radio-bingo-app .rb-ability-close svg{display:block;width:14px;height:14px;pointer-events:none} /* Browser game effects controls. No overlay uses this player stylesheet. */ #radio-bingo-app .rb-sound-controls{display:flex;align-items:center;gap:12px;letter-spacing:0;font-size:11px;color:#a7c4df} #radio-bingo-app .rb-sound-toggle{display:flex;align-items:center;justify-content:center;width:32px;height:30px;padding:4px;border:0;border-radius:6px;background:transparent;color:#b9d4e1;cursor:pointer} #radio-bingo-app .rb-sound-toggle[aria-pressed="true"]{color:#67d9ee} #radio-bingo-app .rb-sound-toggle:hover{background:#153245} #radio-bingo-app .rb-sound-toggle svg{display:block;width:22px;height:22px;flex:none} #radio-bingo-app .rb-sound-toggle[aria-pressed="false"] .rb-speaker-on,#radio-bingo-app .rb-sound-toggle[aria-pressed="true"] .rb-speaker-off{display:none} #radio-bingo-app .rb-sound-volume-label{display:flex;align-items:center;gap:6px} #radio-bingo-app .rb-sound-volume{width:72px;height:24px;margin:0;accent-color:#00caff;cursor:pointer} #radio-bingo-app .rb-sound-toggle:focus-visible,#radio-bingo-app .rb-sound-volume:focus-visible{outline:2px solid #67d9ee;outline-offset:2px} /* Personal recent events, shared with no OBS surface. */ #radio-bingo-app .rb-toast::after{display:none} #radio-bingo-app .rb-toast-copy{padding-right:38px} #radio-bingo-app .rb-toast.has-bingo .rb-toast-copy{padding-right:168px} #radio-bingo-app .rb-toast .rb-bingo-call{right:46px} #radio-bingo-app .rb-toast .rb-guess-lock{padding-right:50px} #radio-bingo-app .rb-events-open{position:absolute;right:7px;top:6px;z-index:3;display:grid;place-items:center;width:30px;height:30px;padding:5px;border:0;border-radius:5px;background:transparent;color:#9dc8df;cursor:pointer} #radio-bingo-app .rb-events-open:hover,#radio-bingo-app .rb-events-open[aria-expanded="true"]{color:#67dcf4;background:#15374b} #radio-bingo-app .rb-events-open svg{display:block;width:20px;height:20px;fill:currentColor} #radio-bingo-app .rb-events-dot{position:absolute;right:3px;top:3px;width:5px;height:5px;border-radius:50%;background:#ff9d45;box-shadow:0 0 0 2px #0b2030} #radio-bingo-app .rb-events-open:focus-visible,#radio-bingo-app .rb-events-close:focus-visible{outline:2px solid #67dcf4;outline-offset:2px} #radio-bingo-app .rb-events-overlay{position:absolute;inset:0;z-index:50;display:grid;place-items:center;padding:30px;background:#020b16d9;backdrop-filter:blur(4px)} #radio-bingo-app .rb-events-dialog{position:relative;display:flex;flex-direction:column;width:610px;max-width:100%;max-height:720px;min-height:230px;border:1px solid #28627c;border-radius:15px;background:radial-gradient(ellipse at 0 0,#00aaff16,transparent 65%),#071a29;box-shadow:0 24px 65px #0008;overflow:hidden} #radio-bingo-app .rb-events-header{padding:25px 26px 20px;border-bottom:1px solid #1e3d50} #radio-bingo-app .rb-events-kicker{display:block;margin-bottom:7px;font-size:9px;font-weight:700;letter-spacing:2px;color:#63cbe8} #radio-bingo-app .rb-events-dialog h2{margin:0 38px 7px 0;color:#eaf6ff;font:700 25px/1.25 'Segoe UI',Arial,sans-serif;letter-spacing:-.4px;white-space:normal;text-shadow:none} #radio-bingo-app .rb-events-header p{margin:0;color:#a6bfd0;font:13px/1.5 'Segoe UI',Arial,sans-serif} #radio-bingo-app .rb-events-close{position:absolute;right:16px;top:17px;display:grid;place-items:center;width:30px;height:30px;padding:7px;border:1px solid #31546a;border-radius:7px;background:#0e293a;color:#bddae7;cursor:pointer} #radio-bingo-app .rb-events-close svg{display:block;width:14px;height:14px} #radio-bingo-app .rb-events-summary{display:flex;justify-content:space-between;gap:12px;padding:12px 26px 8px;color:#7fa4bb;font-size:10px;letter-spacing:.3px} #radio-bingo-app .rb-events-list{list-style:none;margin:0;padding:0 26px 18px;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#315870 transparent;min-height:0} #radio-bingo-app .rb-event{--event:#ac98e5;display:flex;align-items:flex-start;gap:12px;padding:15px 0;border-bottom:1px solid #17394b} #radio-bingo-app .rb-event:last-child{border-bottom:0} #radio-bingo-app .rb-event.tone-power,#radio-bingo-app .rb-event.kind-guess{--event:#65d8eb} #radio-bingo-app .rb-event.tone-debuff,#radio-bingo-app .rb-event.kind-wrong,#radio-bingo-app .rb-event.kind-oops{--event:#fa8fa5} #radio-bingo-app .rb-event.tone-wild{--event:#bd9cf5} #radio-bingo-app .rb-event.kind-line,#radio-bingo-app .rb-event.kind-bingo{--event:#ffb45d} #radio-bingo-app .rb-event-icon{display:grid;place-items:center;flex:none;width:33px;height:33px;border:1px solid #2a465b;border-radius:9px;color:var(--event);background:#102535} #radio-bingo-app .rb-event-icon svg{display:block;width:19px;height:19px} #radio-bingo-app .rb-event-copy{flex:1;min-width:0} #radio-bingo-app .rb-event-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:4px} #radio-bingo-app .rb-event-heading strong{color:var(--event);font:600 13px/1.4 'Segoe UI',Arial,sans-serif} #radio-bingo-app .rb-event-heading time{flex:none;color:#89a8ba;font:10px/1.4 'Segoe UI',Arial,sans-serif;font-variant-numeric:tabular-nums} #radio-bingo-app .rb-event p{margin:0;color:#d1e3ee;font:13px/1.5 'Segoe UI',Arial,sans-serif;overflow-wrap:anywhere} #radio-bingo-app .rb-events-empty{padding:30px 26px 42px;text-align:center;color:#93b4c8;font:13px/1.6 'Segoe UI',Arial,sans-serif} /* Ability feed direction and player-to-player routes. */ #radio-bingo-app .rb-event-label{display:flex;align-items:center;gap:8px;min-width:0} #radio-bingo-app .rb-event-direction{flex:none;border:1px solid #375568;border-radius:4px;padding:1px 5px;color:#adbecb;font:600 9px/1.4 'Segoe UI',Arial,sans-serif;letter-spacing:.3px} #radio-bingo-app .rb-event-direction.direction-sent{color:#77d8ed;border-color:#286477;background:#0b3544} #radio-bingo-app .rb-event-direction.direction-received{color:#ffa4b5;border-color:#874557;background:#402332} #radio-bingo-app .rb-event p.rb-event-route{margin:3px 0 4px;color:#f0f7fc;font-weight:600;font-size:14px} /* Recharge stays inside the existing ability icon; no overlay audio or modal. */ #radio-bingo-app .rb-ability-slot.is-recharging{opacity:1;filter:none;border-color:var(--ability);box-shadow:inset 0 0 15px rgba(var(--ability-rgb),.12)} #radio-bingo-app .is-recharging .rb-ability-icon{display:block;position:relative;overflow:hidden;mask-image:linear-gradient(transparent,#000 15%,#000 85%,transparent)} #radio-bingo-app .rb-recharge-reel{display:block;position:absolute;top:0;left:0;width:29px;will-change:transform} #radio-bingo-app .rb-recharge-symbol{display:grid;place-items:center;width:29px;height:29px} #radio-bingo-app .rb-ability-slot.is-recharged{opacity:1;filter:none;border-color:var(--ability);box-shadow:0 0 12px rgba(var(--ability-rgb),.22)} /* Radio Bingo scoring and personal hints, rules version 2. */ #radio-bingo-app.has-scoring .rb-square{gap:4px;padding-bottom:24px} #radio-bingo-app .rb-square-meta{position:absolute;bottom:4px;display:flex;align-items:center;justify-content:center;gap:4px;min-height:14px;padding:0 5px;border-radius:4px;background:#08243e;color:#d7e8f5;pointer-events:none} #radio-bingo-app .rb-square-points{font:600 9px/14px 'Segoe UI',sans-serif;color:inherit} #radio-bingo-app .rb-square[data-kind] .rb-square-meta .rb-rare{position:static;display:block;background:none;padding:0;border-radius:0;font-size:11px;line-height:14px} #radio-bingo-app .rb-square[data-tier="rare"] .rb-rare,#radio-bingo-app .rb-rare-key{color:#62b7ff} #radio-bingo-app .rb-square[data-tier="uncommon"] .rb-rare,#radio-bingo-app .rb-uncommon-key{color:#66dc91} #radio-bingo-app .rb-square.is-filled .rb-rare{background:#08243e;border-radius:3px;padding:0 2px} #radio-bingo-app .rb-square[data-kind="Combination"]{--square-category:#d0b4fa} #radio-bingo-app .rb-square[data-kind="Title"]{--square-category:#c5d9ed} #radio-bingo-app .rb-square[data-kind="Content"]{--square-category:#f1bf9e} #radio-bingo-app .rb-score{font:600 12px/18px 'Segoe UI',sans-serif;color:#ecf6ff;margin-top:6px} #radio-bingo-app .rb-use-hint{width:100%;border:1px solid #347e9b;border-radius:6px;background:#103448;color:#eaf8ff;font:600 12px/20px 'Segoe UI',sans-serif;padding:3px 8px;margin-top:7px;cursor:pointer} #radio-bingo-app .rb-use-hint:disabled{opacity:.5;cursor:default} #radio-bingo-app .rb-use-hint[hidden],#radio-bingo-app .rb-score[hidden]{display:none} #radio-bingo-app.has-scoring .rb-board-note{font-size:10px} #radio-bingo-app.has-scoring .rb-side{grid-template-rows:170px 276px 180px} #radio-bingo-app.has-scoring .rb-achievements{grid-template-rows:22px 206px 24px} #radio-bingo-app.has-scoring .rb-achievement-list .rb-achievement{height:51.5px;padding:4px 0} #radio-bingo-app.has-scoring .rb-achievement-list .rb-award,#radio-bingo-app.has-scoring .rb-achievement-list .rb-award img{width:38px;height:38px}