:root { --acog-gold:#f2c23e; --acog-red:#ff3b3b; --acog-blue:#1f9dff; --acog-green:#19bf63; } #acog-scoreboard-app * { box-sizing:border-box; } #acog-scoreboard-app { min-height:100vh; color:white; font-family:Arial, Helvetica, sans-serif; background:radial-gradient(circle at 14% 0%, rgba(0,119,255,.24), transparent 32%), radial-gradient(circle at 88% 18%, rgba(242,194,62,.16), transparent 28%), linear-gradient(135deg,#01030c,#071336 52%,#020617); padding:0; overflow-x:hidden; } .acog-header { display:grid; grid-template-columns:1fr auto; align-items:center; gap:15px; padding:20px 22px 10px; } .acog-title-wrap { text-align:center; } .acog-title-small { font-size:clamp(20px,2.2vw,34px); font-weight:900; letter-spacing:9px; } .acog-title-big { font-size:clamp(58px,6vw,94px); font-weight:1000; letter-spacing:4px; line-height:.9; text-shadow:0 8px 22px rgba(0,0,0,.55); } .acog-top-actions { display:flex; justify-content:flex-end; gap:10px; } .acog-glow-line { grid-column:1/-1; width:100%; height:2px; margin:4px auto 0; background:linear-gradient(90deg,transparent,var(--acog-gold),#2ba7ff,transparent); box-shadow:0 0 22px #2ba7ff; } .acog-main { display:grid; grid-template-columns:330px 1fr 330px; gap:16px; padding:12px 20px; } .acog-card { border:1px solid rgba(255,255,255,.13); border-radius:16px; background:rgba(3,10,35,.78); box-shadow:0 0 35px rgba(0,0,0,.42); backdrop-filter:blur(12px); } .acog-team-card { padding:18px; height:650px; min-height:650px; max-height:650px; overflow:hidden; display:flex; flex-direction:column; } .acog-red { border-color:rgba(255,59,59,.82); background:linear-gradient(180deg,rgba(255,0,0,.18),rgba(3,10,35,.82)); } .acog-blue { border-color:rgba(31,157,255,.88); background:linear-gradient(180deg,rgba(0,100,255,.22),rgba(3,10,35,.82)); } .acog-team-header { display:flex; align-items:center; gap:13px; margin-bottom:22px; } .acog-icon-circle { width:70px; height:70px; border-radius:50%; display:grid; place-items:center; font-size:34px; box-shadow:0 0 24px currentColor; } .acog-red .acog-icon-circle { color:var(--acog-red); border:1px solid var(--acog-red); background:rgba(255,0,0,.14); } .acog-blue .acog-icon-circle { color:var(--acog-blue); border:1px solid var(--acog-blue); background:rgba(0,100,255,.16); } .acog-team-name { font-size:38px; font-weight:1000; letter-spacing:-2px; } .acog-section-title { text-align:center; color:var(--acog-red); font-size:18px; font-weight:900; letter-spacing:1px; margin:8px 0 14px; text-transform:uppercase; display:flex; align-items:center; gap:12px; justify-content:center; } .acog-section-title:before,.acog-section-title:after { content:""; height:1px; flex:1; background:currentColor; opacity:.7; } .acog-blue .acog-section-title { color:var(--acog-blue); } .acog-member-list { height:340px; min-height:340px; max-height:340px; overflow-y:auto; overflow-x:hidden; padding-right:8px; margin-bottom:10px; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.35) rgba(255,255,255,.08); } .acog-member { display:grid; grid-template-columns:1fr 34px 34px; gap:6px; align-items:center; padding:7px 0; border-bottom:1px solid rgba(255,255,255,.08); font-size:18px; } .acog-member button { padding:5px; font-size:14px; border-radius:8px; } .acog-add-player-inline { margin-top:10px; width:100%; color:inherit; background:rgba(0,0,0,.22); } .acog-score-box { margin-top:auto; border:1px solid rgba(255,255,255,.13); border-radius:13px; text-align:center; padding:18px 12px; background:rgba(0,0,0,.3); } .acog-score-number { font-size:92px; font-weight:1000; line-height:.9; font-variant-numeric:tabular-nums; transition:transform .28s ease, text-shadow .28s ease; } .acog-score-number.acog-bump { transform:scale(1.16); text-shadow:0 0 36px currentColor; } .acog-score-label { color:var(--acog-red); font-size:23px; font-weight:900; } .acog-blue .acog-score-label { color:var(--acog-blue); } .acog-center-card { overflow:hidden; } .acog-current-game { padding:18px 22px; display:grid; grid-template-columns:1.3fr 320px; gap:20px; border-bottom:1px solid rgba(255,255,255,.13); } .acog-current-label { color:white; font-size:14px; font-weight:900; letter-spacing:1px; } .acog-current-title { margin-top:8px; font-size:29px; font-weight:1000; letter-spacing:-1px; } .acog-progress-bar { margin-top:14px; height:10px; border-radius:999px; background:rgba(255,255,255,.09); overflow:hidden; } .acog-progress-fill { height:100%; width:0%; border-radius:999px; background:linear-gradient(90deg,#2ba7ff,#0f6bff); box-shadow:0 0 18px rgba(43,167,255,.8); } .acog-timer-panel { display:grid; grid-template-columns:1fr 110px; gap:12px; align-items:end; } .acog-timer-box { border:1px solid rgba(31,157,255,.65); border-radius:12px; padding:7px 12px; text-align:center; background:rgba(0,0,0,.28); } .acog-timer-time { font-size:52px; font-weight:1000; line-height:1; font-variant-numeric:tabular-nums; } .acog-table-head, .acog-game-row { display:grid; grid-template-columns:30px 42px 34px 1.4fr 90px 150px 150px 88px; align-items:center; gap:8px; } .acog-presentation-mode .acog-table-head, .acog-presentation-mode .acog-game-row { grid-template-columns:42px 34px 1.4fr 90px 150px 150px; } .acog-table-head { padding:13px 16px; font-size:14px; font-weight:900; color:white; background:rgba(255,255,255,.035); letter-spacing:.7px; } .acog-game-row { padding:8px 16px; border-top:1px solid rgba(255,255,255,.08); } .acog-game-row.acog-active { border:1px solid rgba(31,157,255,.8); background:rgba(31,157,255,.08); border-radius:10px; margin:4px; } .acog-drag-handle { cursor:grab; color:rgba(255,255,255,.55); font-size:20px; user-select:none; } .acog-game-icon { width:42px; height:42px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.24); border-radius:8px; font-size:23px; background:rgba(255,255,255,.06); } #acog-scoreboard-app input, #acog-scoreboard-app select, #acog-scoreboard-app textarea { background:rgba(255,255,255,.08); color:white; border:1px solid rgba(255,255,255,.16); border-radius:9px; padding:8px; font-size:14px; outline:none; width:100%; } #acog-scoreboard-app select option { color:#111; } .acog-point-control { display:grid; grid-template-columns:40px 1fr 40px; gap:5px; align-items:center; } .acog-point-display { font-size:22px; font-weight:1000; text-align:center; } .acog-small-btn { padding:7px 9px; border-radius:8px; font-size:18px; } .acog-winner-bar { margin-top:12px; padding:15px 20px; display:grid; grid-template-columns:100px 1fr; gap:15px; align-items:center; font-size:24px; font-weight:1000; border:1px solid rgba(242,194,62,.38); border-radius:13px; background:rgba(0,0,0,.34); } .acog-trophy { font-size:46px; color:var(--acog-gold); text-align:center; } .acog-winner-message { display:grid; grid-template-columns:220px 1fr; align-items:center; gap:14px; } .acog-winner-label { color:var(--acog-gold); } .acog-winner-small { font-size:13px; color:var(--acog-gold); margin-top:5px; } .acog-controls { display:grid; grid-template-columns:1fr auto auto auto auto auto auto; gap:12px; padding:12px 20px; margin:12px 20px 22px; align-items:center; } #acog-scoreboard-app button { border:1px solid rgba(255,255,255,.16); background:linear-gradient(180deg,#0d2d78,#071a46); color:white; border-radius:10px; padding:13px 16px; font-size:14px; font-weight:900; cursor:pointer; white-space:nowrap; } #acog-scoreboard-app button:hover { transform:translateY(-1px); filter:brightness(1.12); } #acog-scoreboard-app .acog-gold { background:linear-gradient(180deg,#f2c23e,#94680c); color:#111; } #acog-scoreboard-app .acog-redbtn { background:linear-gradient(180deg,#9e1d28,#4a0610); } #acog-scoreboard-app .acog-bluebtn { background:linear-gradient(180deg,#0765d8,#07306e); } #acog-scoreboard-app .acog-greenbtn { background:linear-gradient(180deg,#1fb65e,#0b5a2c); } .acog-control-title { font-size:20px; font-weight:1000; } .acog-editor { display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; padding:0 20px 24px; } .acog-editor-panel { padding:18px; } .acog-editor-panel h2 { margin:0 0 12px; } .acog-hidden { display:none !important; } .acog-presentation-mode .acog-edit-only { display:none !important; } .acog-presentation-mode input, .acog-presentation-mode select { pointer-events:none; border-color:transparent !important; background:transparent !important; font-weight:900; appearance:none; } .acog-winner-overlay { position:fixed; inset:0; z-index:100000; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,.82); backdrop-filter:blur(10px); text-align:center; } .acog-winner-overlay.acog-show { display:flex; animation:acogFadeIn .25s ease; } .acog-winner-box { width:min(1050px,92vw); border:2px solid rgba(242,194,62,.7); border-radius:32px; padding:58px 30px; background:radial-gradient(circle at top, rgba(242,194,62,.25), transparent 35%), linear-gradient(145deg,rgba(5,18,50,.95),rgba(0,0,0,.9)); box-shadow:0 0 80px rgba(242,194,62,.32); } .acog-big { font-size:clamp(60px,10vw,150px); font-weight:1000; line-height:.92; letter-spacing:-5px; } .acog-small { font-size:clamp(24px,4vw,52px); font-weight:900; color:var(--acog-gold); margin-bottom:18px; } .acog-alarm-overlay { position:fixed; inset:0; z-index:90000; display:none; align-items:center; justify-content:center; background:rgba(100,0,0,.36); pointer-events:none; } .acog-alarm-overlay.acog-show { display:flex; animation:acogAlarmFlash .45s infinite; } .acog-alarm-text { font-size:clamp(70px,11vw,160px); font-weight:1000; color:white; text-shadow:0 0 35px red; } .acog-confetti { position:fixed; top:-20px; width:12px; height:18px; opacity:.95; z-index:120000; animation:acogFall linear forwards; } @keyframes acogFall { to { transform:translateY(110vh) rotate(720deg); opacity:1; } } @keyframes acogFadeIn { from { opacity:0; } to { opacity:1; } } @keyframes acogAlarmFlash { 0%,100% { opacity:.15; } 50% { opacity:1; } } @media(max-width:1280px) { .acog-header { grid-template-columns:1fr; text-align:center; } .acog-top-actions { justify-content:center; } .acog-main { grid-template-columns:1fr; } .acog-team-card { min-height:auto; } .acog-editor { grid-template-columns:1fr; } .acog-controls { grid-template-columns:1fr 1fr; } .acog-current-game { grid-template-columns:1fr; } } /* WordPress theme/container breakout fix */ #acog-scoreboard-app { width:100vw !important; max-width:100vw !important; margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important; position:relative; } /* Remove extra WordPress page padding around the shortcode where possible */ .entry-content:has(#acog-scoreboard-app), .wp-block-post-content:has(#acog-scoreboard-app), .page-content:has(#acog-scoreboard-app) { max-width:none !important; width:100% !important; padding-left:0 !important; padding-right:0 !important; margin-left:0 !important; margin-right:0 !important; } /* Public display should fit the browser better */ .acog-presentation-mode .acog-header { padding-top:10px; padding-bottom:4px; } .acog-presentation-mode .acog-title-big { font-size:clamp(44px,5.1vw,78px); } .acog-presentation-mode .acog-title-small { font-size:clamp(15px,1.7vw,25px); letter-spacing:7px; } .acog-presentation-mode .acog-main { grid-template-columns:minmax(250px, 22vw) minmax(520px, 1fr) minmax(250px, 22vw); gap:12px; padding:10px 14px; } .acog-presentation-mode .acog-team-card { height:590px !important; min-height:590px !important; max-height:590px !important; padding:14px; } .acog-presentation-mode .acog-member-list { height:295px !important; min-height:295px !important; max-height:295px !important; } .acog-presentation-mode .acog-team-name { font-size:clamp(26px,2.5vw,36px); } .acog-presentation-mode .acog-score-number { font-size:clamp(56px,6vw,86px); } /* Fix cramped game columns on public display */ .acog-presentation-mode .acog-table-head, .acog-presentation-mode .acog-game-row { grid-template-columns:34px 44px minmax(180px, 1.5fr) 78px 90px 120px !important; gap:8px; } .acog-presentation-mode .acog-current-game { grid-template-columns:1fr 250px; padding:14px 18px; } .acog-presentation-mode .acog-current-title { font-size:clamp(22px,2.5vw,32px); } .acog-presentation-mode .acog-timer-time { font-size:clamp(36px,4vw,52px); } .acog-presentation-mode .acog-winner-bar { padding:12px 16px; font-size:clamp(18px,2vw,26px); } .acog-presentation-mode .acog-winner-message { grid-template-columns:180px 1fr; } .acog-presentation-mode .acog-game-row { min-height:58px; } .acog-presentation-mode .acog-game-icon { width:38px; height:38px; } /* Safari/WordPress fallback for smaller screens */ @media(max-width:1180px) { .acog-presentation-mode .acog-main { grid-template-columns:1fr !important; } .acog-presentation-mode .acog-team-card { height:auto !important; min-height:0 !important; max-height:none !important; } .acog-presentation-mode .acog-member-list { height:220px !important; min-height:220px !important; max-height:220px !important; } } .acog-live-status { font-size:12px; color:#7dffb2; margin-top:4px; font-weight:800; letter-spacing:.5px; } /* v1.0.3 WordPress Admin Dashboard Fit Fix */ body.wp-admin #acog-scoreboard-app { width:100% !important; max-width:100% !important; margin-left:0 !important; margin-right:0 !important; min-height:auto !important; } body.wp-admin .wrap { margin-right:12px !important; } body.wp-admin #acog-scoreboard-app .acog-header { grid-template-columns:1fr auto !important; padding:10px 12px 6px !important; } body.wp-admin #acog-scoreboard-app .acog-title-big { font-size:clamp(42px,4.8vw,72px) !important; letter-spacing:2px !important; } body.wp-admin #acog-scoreboard-app .acog-title-small { font-size:clamp(14px,1.6vw,22px) !important; letter-spacing:5px !important; } body.wp-admin #acog-scoreboard-app .acog-main { grid-template-columns:minmax(220px, 24%) minmax(520px, 1fr) minmax(220px, 24%) !important; gap:10px !important; padding:8px 10px !important; } body.wp-admin #acog-scoreboard-app .acog-team-card { height:590px !important; min-height:590px !important; max-height:590px !important; padding:12px !important; } body.wp-admin #acog-scoreboard-app .acog-team-name { font-size:clamp(24px,2vw,32px) !important; } body.wp-admin #acog-scoreboard-app .acog-icon-circle { width:56px !important; height:56px !important; font-size:28px !important; } body.wp-admin #acog-scoreboard-app .acog-member-list { height:285px !important; min-height:285px !important; max-height:285px !important; } body.wp-admin #acog-scoreboard-app .acog-member { font-size:15px !important; grid-template-columns:1fr 32px 32px !important; } body.wp-admin #acog-scoreboard-app .acog-score-number { font-size:68px !important; } body.wp-admin #acog-scoreboard-app .acog-score-label { font-size:18px !important; } body.wp-admin #acog-scoreboard-app .acog-current-game { grid-template-columns:1fr 260px !important; padding:12px 16px !important; } body.wp-admin #acog-scoreboard-app .acog-current-title { font-size:24px !important; } body.wp-admin #acog-scoreboard-app .acog-timer-time { font-size:44px !important; } body.wp-admin #acog-scoreboard-app .acog-table-head, body.wp-admin #acog-scoreboard-app .acog-game-row { grid-template-columns:24px 30px 38px minmax(110px, 1fr) 82px 130px 130px 78px !important; gap:6px !important; } body.wp-admin #acog-scoreboard-app .acog-game-row { padding:7px 10px !important; } body.wp-admin #acog-scoreboard-app .acog-game-icon { width:36px !important; height:36px !important; font-size:20px !important; } body.wp-admin #acog-scoreboard-app .acog-point-control { grid-template-columns:32px 1fr 32px !important; } body.wp-admin #acog-scoreboard-app .acog-point-display { font-size:19px !important; } body.wp-admin #acog-scoreboard-app button { padding:10px 12px !important; font-size:12px !important; } body.wp-admin #acog-scoreboard-app input, body.wp-admin #acog-scoreboard-app select, body.wp-admin #acog-scoreboard-app textarea { font-size:12px !important; padding:7px !important; } body.wp-admin #acog-scoreboard-app .acog-winner-bar { padding:10px 14px !important; font-size:20px !important; } body.wp-admin #acog-scoreboard-app .acog-winner-message { grid-template-columns:160px 1fr !important; } body.wp-admin #acog-scoreboard-app .acog-controls { grid-template-columns:1fr repeat(6, auto) !important; margin:8px 10px 14px !important; padding:10px !important; gap:8px !important; } body.wp-admin #acog-scoreboard-app .acog-editor { grid-template-columns:1fr 1fr 1fr !important; padding:0 10px 14px !important; gap:10px !important; } @media(max-width:1500px) { body.wp-admin #acog-scoreboard-app .acog-main { grid-template-columns:1fr !important; } body.wp-admin #acog-scoreboard-app .acog-team-card { height:auto !important; min-height:0 !important; max-height:none !important; } body.wp-admin #acog-scoreboard-app .acog-member-list { height:180px !important; min-height:180px !important; max-height:180px !important; } body.wp-admin #acog-scoreboard-app .acog-controls { grid-template-columns:1fr 1fr 1fr !important; } } /* v1.0.5 Mobile Phone Layout */ @media(max-width:767px) { html, body { overflow-x:hidden !important; } #acog-scoreboard-app { width:100vw !important; max-width:100vw !important; margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important; min-height:100vh !important; padding-bottom:24px !important; } #acog-scoreboard-app .acog-header { display:block !important; padding:14px 12px 8px !important; text-align:center !important; } #acog-scoreboard-app .acog-title-small { font-size:13px !important; letter-spacing:4px !important; line-height:1.2 !important; } #acog-scoreboard-app .acog-title-big { font-size:38px !important; letter-spacing:1px !important; line-height:1 !important; } #acog-scoreboard-app .acog-top-actions { margin-top:10px !important; justify-content:center !important; flex-wrap:wrap !important; } #acog-scoreboard-app .acog-glow-line { margin-top:10px !important; } #acog-scoreboard-app .acog-main { display:flex !important; flex-direction:column !important; gap:12px !important; padding:10px !important; } /* Put current game first, then scores */ #acog-scoreboard-app main { order:1 !important; } #acog-scoreboard-app .acog-red { order:2 !important; } #acog-scoreboard-app .acog-blue { order:3 !important; } #acog-scoreboard-app .acog-current-game { display:flex !important; flex-direction:column !important; gap:12px !important; padding:14px !important; } #acog-scoreboard-app .acog-current-label { font-size:11px !important; letter-spacing:1.5px !important; } #acog-scoreboard-app .acog-current-title { font-size:25px !important; line-height:1.1 !important; margin-top:4px !important; } #acog-scoreboard-app .acog-progress-bar { margin-top:10px !important; } #acog-scoreboard-app .acog-timer-panel { grid-template-columns:1fr !important; gap:8px !important; } #acog-scoreboard-app .acog-timer-box { padding:10px !important; } #acog-scoreboard-app .acog-timer-time { font-size:56px !important; } #acog-scoreboard-app #acog-timerToggleBtn { width:100% !important; } /* Team cards become compact score cards */ #acog-scoreboard-app .acog-team-card { height:auto !important; min-height:0 !important; max-height:none !important; padding:14px !important; display:block !important; } #acog-scoreboard-app .acog-team-header { margin-bottom:10px !important; gap:10px !important; } #acog-scoreboard-app .acog-icon-circle { width:50px !important; height:50px !important; font-size:24px !important; } #acog-scoreboard-app .acog-team-name { font-size:30px !important; letter-spacing:-1px !important; } #acog-scoreboard-app .acog-score-box { margin-top:10px !important; padding:14px 10px !important; } #acog-scoreboard-app .acog-score-number { font-size:72px !important; } #acog-scoreboard-app .acog-score-label { font-size:16px !important; } #acog-scoreboard-app .acog-section-title { font-size:13px !important; margin:12px 0 8px !important; } #acog-scoreboard-app .acog-member-list { height:160px !important; min-height:160px !important; max-height:160px !important; } #acog-scoreboard-app .acog-member { font-size:15px !important; grid-template-columns:1fr 30px 30px !important; padding:6px 0 !important; } /* Game table becomes readable mobile cards */ #acog-scoreboard-app .acog-table-head { display:none !important; } #acog-scoreboard-app .acog-game-row { display:grid !important; grid-template-columns:40px 44px 1fr !important; gap:8px !important; padding:12px !important; margin:8px !important; border:1px solid rgba(255,255,255,.12) !important; border-radius:12px !important; background:rgba(255,255,255,.04) !important; } #acog-scoreboard-app .acog-game-row.acog-active { border-color:rgba(31,157,255,.85) !important; background:rgba(31,157,255,.1) !important; } #acog-scoreboard-app .acog-game-row > div:nth-child(1) { grid-column:1 !important; grid-row:1 !important; } #acog-scoreboard-app .acog-game-row > div:nth-child(2) { grid-column:1 !important; grid-row:1 !important; font-size:18px !important; align-self:center !important; } #acog-scoreboard-app .acog-game-row > div:nth-child(3) { grid-column:2 !important; grid-row:1 / span 2 !important; align-self:center !important; } #acog-scoreboard-app .acog-game-row > div:nth-child(4) { grid-column:3 !important; grid-row:1 !important; font-size:17px !important; font-weight:900 !important; align-self:center !important; } #acog-scoreboard-app .acog-game-row > div:nth-child(5) { grid-column:1 / span 2 !important; grid-row:3 !important; font-size:13px !important; } #acog-scoreboard-app .acog-game-row > div:nth-child(6) { grid-column:3 !important; grid-row:2 !important; } #acog-scoreboard-app .acog-game-row > div:nth-child(7) { grid-column:1 / -1 !important; grid-row:4 !important; } #acog-scoreboard-app .acog-game-row > div:nth-child(8) { grid-column:1 / -1 !important; grid-row:5 !important; } #acog-scoreboard-app .acog-game-icon { width:42px !important; height:42px !important; font-size:22px !important; } #acog-scoreboard-app .acog-point-control { grid-template-columns:42px 1fr 42px !important; max-width:170px !important; margin-left:auto !important; } #acog-scoreboard-app .acog-point-display { font-size:22px !important; } #acog-scoreboard-app input, #acog-scoreboard-app select, #acog-scoreboard-app textarea { font-size:15px !important; min-height:42px !important; } #acog-scoreboard-app .acog-winner-bar { grid-template-columns:58px 1fr !important; margin:10px 0 0 !important; padding:12px !important; font-size:18px !important; } #acog-scoreboard-app .acog-trophy { font-size:38px !important; } #acog-scoreboard-app .acog-winner-message { display:block !important; } #acog-scoreboard-app .acog-winner-label { font-size:16px !important; } #acog-scoreboard-app #acog-overallWinner { font-size:18px !important; margin-top:4px !important; } #acog-scoreboard-app .acog-winner-small { font-size:11px !important; line-height:1.25 !important; } #acog-scoreboard-app .acog-controls { display:grid !important; grid-template-columns:1fr 1fr !important; gap:8px !important; margin:10px !important; padding:10px !important; } #acog-scoreboard-app .acog-control-title, #acog-scoreboard-app .acog-live-status { grid-column:1 / -1 !important; } #acog-scoreboard-app button { white-space:normal !important; min-height:44px !important; font-size:12px !important; padding:10px !important; } #acog-scoreboard-app .acog-editor { grid-template-columns:1fr !important; padding:0 10px 16px !important; } #acog-scoreboard-app .acog-editor-panel { padding:12px !important; } #acog-scoreboard-app .acog-winner-box { width:94vw !important; padding:34px 14px !important; } #acog-scoreboard-app .acog-big { font-size:52px !important; letter-spacing:-2px !important; } #acog-scoreboard-app .acog-small { font-size:24px !important; } } /* Extra-small phones */ @media(max-width:390px) { #acog-scoreboard-app .acog-title-big { font-size:32px !important; } #acog-scoreboard-app .acog-team-name { font-size:25px !important; } #acog-scoreboard-app .acog-timer-time { font-size:48px !important; } #acog-scoreboard-app .acog-score-number { font-size:60px !important; } } /* v1.0.8 Sound Toggle Button */ .acog-enable-sound { position:fixed !important; right:18px !important; bottom:18px !important; z-index:130000 !important; color:white !important; border:1px solid rgba(255,255,255,.25) !important; box-shadow:0 0 24px rgba(242,194,62,.35) !important; } .acog-enable-sound.acog-sound-enabled { background:linear-gradient(180deg,#1fb65e,#0b5a2c) !important; color:white !important; } .acog-enable-sound.acog-sound-disabled { background:linear-gradient(180deg,#8b1e2d,#430810) !important; color:white !important; } @media(max-width:767px) { .acog-enable-sound { right:12px !important; bottom:12px !important; width:auto !important; max-width:calc(100vw - 24px) !important; font-size:12px !important; padding:11px 13px !important; } } /* v1.0.9 Action/Delete column fix */ .acog-table-head, .acog-game-row { overflow:visible !important; } .acog-game-row { padding-right:18px !important; } .acog-game-row > div:last-child { min-width:92px !important; display:flex !important; justify-content:center !important; overflow:visible !important; } .acog-game-row > div:last-child button { width:100% !important; min-width:88px !important; } body.wp-admin #acog-scoreboard-app .acog-table-head, body.wp-admin #acog-scoreboard-app .acog-game-row { grid-template-columns:24px 30px 38px minmax(110px, 1fr) 82px 130px 150px 100px !important; } .acog-admin-mode .acog-table-head, .acog-admin-mode .acog-game-row { grid-template-columns:30px 42px 34px 1.4fr 90px 150px 170px 100px !important; } @media(max-width:767px) { .acog-game-row > div:last-child { min-width:100% !important; } .acog-game-row > div:last-child button { width:100% !important; } } /* v1.1.0 Backend-only sound + game table fit */ #acog-scoreboard-app.acog-presentation-mode .acog-enable-sound { display:none !important; } /* Make admin dashboard fit on one screen better */ body.wp-admin #acog-scoreboard-app .acog-main { grid-template-columns:22% 56% 22% !important; gap:8px !important; padding:8px !important; } body.wp-admin #acog-scoreboard-app .acog-center-card { min-width:0 !important; overflow:hidden !important; } body.wp-admin #acog-scoreboard-app .acog-table-head, body.wp-admin #acog-scoreboard-app .acog-game-row { grid-template-columns:20px 24px 34px minmax(90px, 1fr) 72px 112px 112px 54px !important; gap:5px !important; padding-left:8px !important; padding-right:8px !important; } body.wp-admin #acog-scoreboard-app .acog-game-row { margin:3px !important; } body.wp-admin #acog-scoreboard-app .acog-game-icon { width:32px !important; height:32px !important; font-size:18px !important; } body.wp-admin #acog-scoreboard-app .acog-point-control { grid-template-columns:30px 1fr 30px !important; gap:4px !important; } body.wp-admin #acog-scoreboard-app .acog-point-display { font-size:18px !important; } body.wp-admin #acog-scoreboard-app .acog-game-row > div:last-child { min-width:54px !important; width:54px !important; justify-content:center !important; } body.wp-admin #acog-scoreboard-app .acog-delete-game-btn { width:52px !important; min-width:52px !important; max-width:52px !important; padding:8px 6px !important; font-size:11px !important; } body.wp-admin #acog-scoreboard-app input, body.wp-admin #acog-scoreboard-app select { padding:6px !important; font-size:12px !important; } body.wp-admin #acog-scoreboard-app .acog-team-card { padding:10px !important; } body.wp-admin #acog-scoreboard-app .acog-team-name { font-size:28px !important; } body.wp-admin #acog-scoreboard-app .acog-member { font-size:14px !important; } body.wp-admin #acog-scoreboard-app .acog-current-game { grid-template-columns:1fr 240px !important; padding:10px 14px !important; } body.wp-admin #acog-scoreboard-app .acog-timer-panel { grid-template-columns:1fr 100px !important; } body.wp-admin #acog-scoreboard-app .acog-timer-time { font-size:40px !important; } body.wp-admin #acog-scoreboard-app .acog-current-title { font-size:22px !important; } /* Public viewer pages should not show the sound control at all */ #acog-scoreboard-app.acog-presentation-mode #acog-enableSoundBtn, #acog-scoreboard-app:not(.acog-admin-mode) #acog-enableSoundBtn { display:none !important; } /* v1.1.1 Public viewer cleanup + responsive game rows */ /* Force viewer mode to NEVER show edit/action controls, even if logged in */ #acog-scoreboard-app.acog-presentation-mode .acog-edit-only, #acog-scoreboard-app.acog-presentation-mode .acog-cell-action, #acog-scoreboard-app.acog-presentation-mode .acog-drag-handle, #acog-scoreboard-app.acog-presentation-mode .acog-enable-sound { display:none !important; } /* Desktop/tablet public viewer grid: no hidden action column */ #acog-scoreboard-app.acog-presentation-mode .acog-table-head, #acog-scoreboard-app.acog-presentation-mode .acog-game-row { grid-template-columns:44px 48px minmax(190px, 1.4fr) 90px 110px 145px !important; gap:10px !important; align-items:center !important; } #acog-scoreboard-app.acog-presentation-mode .acog-game-row { padding:12px 16px !important; min-height:70px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-num { grid-column:auto !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-icon { grid-column:auto !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-game { font-size:18px !important; font-weight:900 !important; white-space:normal !important; overflow:visible !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-timer, #acog-scoreboard-app.acog-presentation-mode .acog-cell-points, #acog-scoreboard-app.acog-presentation-mode .acog-cell-winner { font-size:18px !important; font-weight:900 !important; } /* Backend/admin grid: keep all columns visible */ #acog-scoreboard-app.acog-admin-mode .acog-table-head, #acog-scoreboard-app.acog-admin-mode .acog-game-row { grid-template-columns:24px 30px 38px minmax(100px, 1fr) 80px 118px 130px 58px !important; gap:6px !important; align-items:center !important; } #acog-scoreboard-app.acog-admin-mode .acog-cell-action { min-width:58px !important; width:58px !important; } #acog-scoreboard-app.acog-admin-mode .acog-delete-game-btn { min-width:52px !important; width:52px !important; padding:8px 6px !important; font-size:11px !important; } /* Phone viewer: true stacked cards */ @media(max-width:767px) { #acog-scoreboard-app.acog-presentation-mode .acog-table-head { display:none !important; } #acog-scoreboard-app.acog-presentation-mode .acog-game-row { display:grid !important; grid-template-columns:52px 1fr auto !important; grid-template-areas: "icon game timer" "icon winner winner" "num points points" !important; gap:8px 10px !important; padding:14px !important; margin:8px !important; min-height:auto !important; border:1px solid rgba(255,255,255,.14) !important; border-radius:14px !important; background:rgba(255,255,255,.045) !important; } #acog-scoreboard-app.acog-presentation-mode .acog-game-row.acog-active { border-color:rgba(31,157,255,.9) !important; background:rgba(31,157,255,.1) !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-num { grid-area:num !important; font-size:14px !important; opacity:.9 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-num::before { content:"Game "; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-icon { grid-area:icon !important; width:50px !important; height:50px !important; font-size:25px !important; align-self:start !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-game { grid-area:game !important; font-size:20px !important; line-height:1.08 !important; font-weight:900 !important; align-self:center !important; white-space:normal !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-timer { grid-area:timer !important; font-size:18px !important; font-weight:1000 !important; align-self:center !important; text-align:right !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-points { grid-area:points !important; display:block !important; text-align:right !important; max-width:none !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-points::before { content:"Points: "; font-size:13px !important; color:rgba(255,255,255,.7); margin-right:4px; } #acog-scoreboard-app.acog-presentation-mode .acog-point-display { display:inline !important; font-size:28px !important; font-weight:1000 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-winner { grid-area:winner !important; font-size:18px !important; text-align:right !important; align-self:center !important; color:white !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-winner::before { content:"Winner: "; font-size:13px !important; color:rgba(255,255,255,.7); } #acog-scoreboard-app.acog-presentation-mode .acog-cell-action, #acog-scoreboard-app.acog-presentation-mode .acog-cell-drag { display:none !important; } } /* Phone admin still keeps controls, but readable */ @media(max-width:767px) { #acog-scoreboard-app.acog-admin-mode .acog-game-row { display:grid !important; grid-template-columns:34px 34px 44px 1fr !important; grid-template-areas: "drag num icon game" "timer timer points points" "winner winner winner action" !important; gap:8px !important; padding:12px !important; } #acog-scoreboard-app.acog-admin-mode .acog-cell-drag { grid-area:drag !important; } #acog-scoreboard-app.acog-admin-mode .acog-cell-num { grid-area:num !important; } #acog-scoreboard-app.acog-admin-mode .acog-cell-icon { grid-area:icon !important; } #acog-scoreboard-app.acog-admin-mode .acog-cell-game { grid-area:game !important; } #acog-scoreboard-app.acog-admin-mode .acog-cell-timer { grid-area:timer !important; } #acog-scoreboard-app.acog-admin-mode .acog-cell-points { grid-area:points !important; max-width:none !important; margin:0 !important; } #acog-scoreboard-app.acog-admin-mode .acog-cell-winner { grid-area:winner !important; } #acog-scoreboard-app.acog-admin-mode .acog-cell-action { grid-area:action !important; width:100% !important; min-width:0 !important; } #acog-scoreboard-app.acog-admin-mode .acog-delete-game-btn { width:100% !important; min-width:0 !important; } } /* v1.1.2 Phone game card overlap fix */ @media(max-width:767px) { #acog-scoreboard-app.acog-presentation-mode .acog-game-row { display:grid !important; grid-template-columns:42px 58px 1fr 82px !important; grid-template-areas: "num icon game timer" "num icon game timer" "points points points winner" !important; column-gap:10px !important; row-gap:12px !important; align-items:center !important; min-height:122px !important; padding:14px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-num { grid-area:num !important; position:static !important; align-self:start !important; justify-self:center !important; font-size:14px !important; line-height:1.1 !important; color:rgba(255,255,255,.82) !important; white-space:nowrap !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-num::before { content:"Game" !important; display:block !important; font-size:11px !important; line-height:1 !important; opacity:.7 !important; margin-bottom:2px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-icon { grid-area:icon !important; position:static !important; align-self:start !important; justify-self:center !important; width:54px !important; height:54px !important; font-size:25px !important; margin:0 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-game { grid-area:game !important; position:static !important; align-self:center !important; justify-self:start !important; font-size:20px !important; line-height:1.05 !important; font-weight:900 !important; white-space:normal !important; overflow-wrap:anywhere !important; word-break:normal !important; margin:0 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-timer { grid-area:timer !important; position:static !important; align-self:start !important; justify-self:end !important; text-align:right !important; font-size:18px !important; line-height:1 !important; font-weight:1000 !important; white-space:nowrap !important; margin:0 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-points { grid-area:points !important; position:static !important; justify-self:start !important; text-align:left !important; display:block !important; max-width:none !important; margin:0 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-points::before { content:"Points: " !important; font-size:13px !important; color:rgba(255,255,255,.65) !important; margin-right:6px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-point-display { display:inline !important; font-size:30px !important; font-weight:1000 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-winner { grid-area:winner !important; position:static !important; justify-self:end !important; text-align:right !important; font-size:16px !important; line-height:1.15 !important; white-space:nowrap !important; margin:0 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-winner::before { content:"" !important; } } @media(max-width:390px) { #acog-scoreboard-app.acog-presentation-mode .acog-game-row { grid-template-columns:38px 50px 1fr 70px !important; column-gap:8px !important; padding:12px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-icon { width:48px !important; height:48px !important; font-size:22px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-game { font-size:18px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-timer { font-size:16px !important; } } /* v1.1.3 Clean mobile viewer game cards - final override */ @media(max-width:767px) { /* Keep desktop/admin unaffected; only public viewer cards */ #acog-scoreboard-app.acog-presentation-mode .acog-game-row, #acog-scoreboard-app.acog-presentation-mode .acog-game-row > div { position:static !important; float:none !important; transform:none !important; } #acog-scoreboard-app.acog-presentation-mode .acog-game-row { display:grid !important; grid-template-columns:52px 1fr 70px !important; grid-template-areas: "icon title timer" "icon meta points" "winner winner winner" !important; gap:8px 12px !important; align-items:center !important; padding:14px 16px !important; margin:10px 8px !important; min-height:112px !important; border-radius:18px !important; border:1px solid rgba(255,255,255,.16) !important; background:rgba(255,255,255,.045) !important; } #acog-scoreboard-app.acog-presentation-mode .acog-game-row.acog-active { border-color:rgba(31,157,255,.95) !important; background:rgba(31,157,255,.1) !important; } /* Hide raw number cell; we will show it cleanly inside the icon badge */ #acog-scoreboard-app.acog-presentation-mode .acog-cell-num { display:none !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-icon { grid-area:icon !important; width:52px !important; height:52px !important; min-width:52px !important; max-width:52px !important; border-radius:14px !important; font-size:24px !important; display:flex !important; align-items:center !important; justify-content:center !important; align-self:start !important; justify-self:start !important; margin:0 !important; padding:0 !important; overflow:hidden !important; } /* Remove old Game label/number overlays from earlier versions */ #acog-scoreboard-app.acog-presentation-mode .acog-cell-icon::before, #acog-scoreboard-app.acog-presentation-mode .acog-cell-icon::after, #acog-scoreboard-app.acog-presentation-mode .acog-cell-num::before, #acog-scoreboard-app.acog-presentation-mode .acog-cell-num::after { content:none !important; display:none !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-game { grid-area:title !important; font-size:18px !important; line-height:1.12 !important; font-weight:900 !important; letter-spacing:-.3px !important; white-space:normal !important; overflow-wrap:break-word !important; word-break:normal !important; align-self:end !important; justify-self:start !important; margin:0 !important; padding:0 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-timer { grid-area:timer !important; font-size:17px !important; line-height:1 !important; font-weight:1000 !important; text-align:right !important; justify-self:end !important; align-self:start !important; white-space:nowrap !important; margin:0 !important; padding:0 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-points { grid-area:points !important; display:block !important; justify-self:end !important; align-self:end !important; text-align:right !important; margin:0 !important; padding:0 !important; max-width:none !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-points::before { content:"Pts " !important; font-size:12px !important; color:rgba(255,255,255,.62) !important; font-weight:800 !important; margin-right:3px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-point-display { display:inline !important; font-size:24px !important; line-height:1 !important; font-weight:1000 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-winner { grid-area:winner !important; justify-self:stretch !important; text-align:left !important; font-size:14px !important; line-height:1.1 !important; color:rgba(255,255,255,.9) !important; border-top:1px solid rgba(255,255,255,.08) !important; padding-top:8px !important; margin-top:2px !important; white-space:normal !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-winner::before { content:"Winner: " !important; font-size:12px !important; color:rgba(255,255,255,.55) !important; font-weight:800 !important; } /* Small meta label replaces the ugly overlapping Game 1 text */ #acog-scoreboard-app.acog-presentation-mode .acog-cell-game::after { content:"Game" !important; grid-area:meta !important; display:block !important; font-size:11px !important; color:rgba(255,255,255,.45) !important; font-weight:800 !important; letter-spacing:.5px !important; margin-top:5px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-action, #acog-scoreboard-app.acog-presentation-mode .acog-cell-drag, #acog-scoreboard-app.acog-presentation-mode .acog-drag-handle, #acog-scoreboard-app.acog-presentation-mode .acog-edit-only { display:none !important; } } @media(max-width:390px) { #acog-scoreboard-app.acog-presentation-mode .acog-game-row { grid-template-columns:48px 1fr 62px !important; gap:7px 10px !important; padding:12px !important; min-height:106px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-icon { width:48px !important; height:48px !important; min-width:48px !important; max-width:48px !important; font-size:22px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-game { font-size:16px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-timer { font-size:15px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-point-display { font-size:22px !important; } } /* v1.1.4 Mobile winner badge + mobile timer sound support */ @media(max-width:767px) { #acog-scoreboard-app.acog-presentation-mode .acog-cell-winner { grid-area:winner !important; display:block !important; justify-self:stretch !important; text-align:center !important; font-size:16px !important; font-weight:900 !important; line-height:1.15 !important; padding:9px 10px !important; margin-top:4px !important; border-radius:999px !important; border:1px solid rgba(255,255,255,.14) !important; background:rgba(255,255,255,.07) !important; color:white !important; white-space:normal !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-winner::before { content:"Winner: " !important; font-size:12px !important; color:rgba(255,255,255,.65) !important; font-weight:800 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-winner:empty::after { content:"Winner: —"; color:rgba(255,255,255,.6); } /* Admin mobile: keep sound toggle visible and easy to tap */ #acog-scoreboard-app.acog-admin-mode .acog-enable-sound { display:block !important; position:fixed !important; right:12px !important; bottom:12px !important; z-index:130000 !important; } } /* v1.1.5 Current Game winner display */ .acog-current-winner { margin-top:8px; display:inline-block; color:rgba(255,255,255,.72); font-size:15px; font-weight:900; letter-spacing:.3px; padding:6px 12px; border-radius:999px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.06); } .acog-current-winner-red { color:#ff6b6b; border-color:rgba(255,59,59,.45); background:rgba(255,59,59,.12); } .acog-current-winner-blue { color:#45b9ff; border-color:rgba(31,157,255,.45); background:rgba(31,157,255,.12); } @media(max-width:767px) { #acog-scoreboard-app .acog-current-winner { display:block !important; width:100% !important; margin-top:10px !important; text-align:center !important; font-size:17px !important; padding:10px 12px !important; } } /* v1.1.6 Mobile per-game winner display fix */ @media(max-width:767px) { #acog-scoreboard-app.acog-presentation-mode .acog-game-row { display:grid !important; grid-template-columns:54px 1fr 76px !important; grid-template-areas: "icon title timer" "icon points points" "winner winner winner" !important; gap:9px 12px !important; align-items:center !important; min-height:126px !important; padding:14px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-num { display:none !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-icon { grid-area:icon !important; width:54px !important; height:54px !important; min-width:54px !important; max-width:54px !important; justify-self:start !important; align-self:start !important; margin:0 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-game { grid-area:title !important; font-size:18px !important; line-height:1.12 !important; font-weight:900 !important; align-self:center !important; margin:0 !important; padding:0 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-game::after { content:"" !important; display:none !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-timer { grid-area:timer !important; font-size:17px !important; font-weight:1000 !important; text-align:right !important; justify-self:end !important; align-self:start !important; margin:0 !important; padding:0 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-points { grid-area:points !important; display:flex !important; justify-content:flex-end !important; align-items:center !important; gap:6px !important; max-width:none !important; width:100% !important; margin:0 !important; padding:0 !important; text-align:right !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-points::before { content:"Points:" !important; font-size:13px !important; color:rgba(255,255,255,.62) !important; font-weight:800 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-point-display { display:inline-block !important; font-size:28px !important; line-height:1 !important; font-weight:1000 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-winner { grid-area:winner !important; display:block !important; width:100% !important; min-width:0 !important; max-width:100% !important; justify-self:stretch !important; align-self:center !important; text-align:center !important; font-size:15px !important; line-height:1.15 !important; font-weight:900 !important; color:white !important; white-space:normal !important; overflow:visible !important; border:1px solid rgba(255,255,255,.14) !important; background:rgba(255,255,255,.075) !important; border-radius:999px !important; padding:9px 12px !important; margin:4px 0 0 0 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-winner::before { content:"Winner: " !important; font-size:12px !important; color:rgba(255,255,255,.65) !important; font-weight:800 !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-action, #acog-scoreboard-app.acog-presentation-mode .acog-cell-drag, #acog-scoreboard-app.acog-presentation-mode .acog-drag-handle, #acog-scoreboard-app.acog-presentation-mode .acog-edit-only { display:none !important; } } @media(max-width:390px) { #acog-scoreboard-app.acog-presentation-mode .acog-game-row { grid-template-columns:50px 1fr 68px !important; padding:12px !important; gap:8px 10px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-icon { width:50px !important; height:50px !important; min-width:50px !important; max-width:50px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-game { font-size:16px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-timer { font-size:15px !important; } #acog-scoreboard-app.acog-presentation-mode .acog-cell-winner { font-size:14px !important; } }