/* «Quando giocare per trovare più gente»: blocco statico sulle schede (scripts/quando.py) e classifica notturna in
   record.html (js/quando.js). Testi in px fissi, niente stili inline. */
#game-quando{margin:28px 0 4px}
#game-quando h2{margin-top:0}
#game-quando p{margin:0 0 6px;font-size:15px}
.qd-n,.qd-wait span,.qd-src{color:var(--mut,#a9b0cf);font-size:13px}
#game-quando .qd-src,#quando .qd-src{font-size:12px;margin-top:8px}
.qd-sep{color:var(--mut,#a9b0cf);margin:0 4px}
.qd-how{margin:8px 0 0;font-size:13px;color:var(--mut,#a9b0cf);max-width:70ch}
.qd-how summary{cursor:pointer;color:var(--acc2,#22d3ee);font-weight:600}
.qd-how p{margin:6px 0 0;font-size:13px;line-height:1.5}
#quando{margin:28px 0}
#quando h2{margin:0 0 8px}
.qd-notice{margin:0 0 10px;padding:10px 14px;border-radius:10px;border:1px solid var(--acc2,#22d3ee);background:rgba(34,211,238,.08);font-size:15px;line-height:1.45;color:var(--txt,#f5f7ff)}
.qd-table{width:100%;border-collapse:collapse;font-size:14px}
.qd-table th,.qd-table td{padding:7px 10px;text-align:left;border-bottom:1px solid rgba(255,255,255,.07)}
.qd-table th{font-size:13px;color:var(--mut,#a9b0cf);font-weight:600}
.qd-table .num{text-align:right}
.qd-table td a{overflow-wrap:anywhere}
.qd-s{display:none}
.qd-more{margin:8px 0 0;font-size:13px;color:var(--mut,#a9b0cf)}
.qd-empty p{margin:0;font-size:15px}
.qd-empty span{color:var(--mut,#a9b0cf);font-size:13px}
@media (max-width:480px){.qd-l{display:none}.qd-s{display:inline}.qd-table th,.qd-table td{padding:6px 6px;font-size:13px}.qd-table td.num{text-align:right}}
/* Tabella delle 8 fasce sulla scheda gioco: barre a larghezza per classi (qd-w0 ... qd-w20, passi del 5%), niente stili inline. */
.qd-wrap{max-width:640px;margin:10px 0 0}
.qd-bands{width:100%;border-collapse:collapse;font-size:14px}
.qd-bands th,.qd-bands td{padding:6px 8px;text-align:left;border-bottom:1px solid rgba(255,255,255,.07);font-weight:400;vertical-align:middle}
.qd-bands thead th{font-size:12px;color:var(--mut,#a9b0cf);font-weight:600}
.qd-bands tbody th{white-space:nowrap;font-variant-numeric:tabular-nums}
.qd-bands .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.qd-bands .qd-na{color:var(--mut,#a9b0cf);font-size:13px;text-align:left}
.qd-bar-c{width:46%;white-space:nowrap}
.qd-bar{display:inline-block;height:10px;border-radius:2px;background:#2f73b3;vertical-align:middle;margin-right:8px}
.qd-row-best .qd-bar{background:#5fe6ef}
.qd-row-worst .qd-bar{background:#36509a}
.qd-pct{font-size:13px;color:var(--mut,#a9b0cf);font-variant-numeric:tabular-nums}
.qd-tag{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:999px;font-size:11px;font-weight:600;line-height:1.5;vertical-align:1px}
.qd-tag-best{background:rgba(95,230,239,.15);color:#5fe6ef}
.qd-tag-worst{background:rgba(169,176,207,.12);color:var(--mut,#a9b0cf)}
.qd-row-best th,.qd-row-best td.num{font-weight:600}
.qd-w0{width:0}.qd-w1{width:3.5%}.qd-w2{width:7%}.qd-w3{width:10.5%}.qd-w4{width:14%}.qd-w5{width:17.5%}.qd-w6{width:21%}
.qd-w7{width:24.5%}.qd-w8{width:28%}.qd-w9{width:31.5%}.qd-w10{width:35%}.qd-w11{width:38.5%}.qd-w12{width:42%}.qd-w13{width:45.5%}
.qd-w14{width:49%}.qd-w15{width:52.5%}.qd-w16{width:56%}.qd-w17{width:59.5%}.qd-w18{width:63%}.qd-w19{width:66.5%}.qd-w20{width:70%}
@media (max-width:480px){.qd-bands th,.qd-bands td{padding:6px 4px;font-size:13px}.qd-bands thead th{font-size:11px}.qd-tag{display:block;margin:2px 0 0;width:max-content}.qd-bar-c{width:40%}.qd-bar{margin-right:4px}.qd-bands td:last-child{padding-right:8px}}
/* telefono: «Più gente» e «Più vuoto» su due righe, senza il «·» che altrimenti apre la seconda riga */
@media (max-width:480px){.qd-sep{display:none}.qd-line .qd-best,.qd-line .qd-worst{display:block}}