/* Desktop homepage: countdown at left, scratch result at right, full-width history. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
main.classic-main{padding:18px;background:#fff}main.classic-main #page{max-width:none}
.classic-home{color:#172033;font-size:13px;--classic-border:#dce5ee;--classic-blue:#1f5eff}
.classic-home button,.classic-home input,.classic-home select{border-radius:5px}
.classic-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin-bottom:10px}
.classic-card{height:196px;border:1px solid var(--classic-border);border-radius:6px;background:white;min-width:0;padding:12px 18px}
.classic-countdown{display:flex;flex-direction:column;justify-content:space-between;gap:8px}
.classic-card-top{display:flex;justify-content:space-between;gap:12px;color:#70839b;font-size:12px}
.classic-clock{display:block;align-self:center;text-align:center;font-size:30px;line-height:1.4;font-weight:750;color:var(--classic-blue);font-variant-numeric:tabular-nums}
.classic-countdown-meta{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:#70839b}
.classic-countdown progress{appearance:none;display:block;width:100%;height:10px;border:0;background:#e6edf5;border-radius:5px;overflow:hidden}
.classic-countdown progress::-webkit-progress-bar{background:#e6edf5;border-radius:5px}.classic-countdown progress::-webkit-progress-value{background:#1f5eff;border-radius:5px}.classic-countdown progress::-moz-progress-bar{background:#1f5eff;border-radius:5px}
.classic-draw{container-type:inline-size;display:flex;flex-direction:column;gap:6px;padding-bottom:12px}
.classic-draw-header{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:25px}
.classic-draw-header p{display:flex;align-items:center;gap:10px;white-space:nowrap;font-size:13px}.classic-draw-header p strong{font-weight:650;letter-spacing:.5px}.classic-draw-header p span{color:#70839b}
.scratch-controls{display:flex;align-items:center;flex:none}
.classic-home .classic-scratch-toggle{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:30px;height:30px;padding:0 11px;border:1px solid #dce1e7;border-radius:6px;background:#fff;color:#4b5563;font-size:12px;white-space:nowrap}
.classic-scratch-toggle svg{width:15px;height:15px;flex:none}
.classic-home .classic-scratch-toggle:hover{background:#f4f5f7;border-color:#bbc3cd}
.classic-home .classic-scratch-toggle.is-concealed{background:#f3f4f6;border-color:#cdd3db;color:#374151}
.classic-home .classic-scratch-toggle.is-concealed:hover{background:#e9ecef;border-color:#b7c0ca}
.classic-result{position:relative;display:flex;align-self:flex-start;min-height:76px;width:min(100%,300px);border-radius:6px}
#classic-result-content{display:flex;justify-content:center;gap:12px;align-items:center;min-height:76px;width:100%;padding:10px 12px;white-space:nowrap}
.classic-expression{font-size:28px;font-weight:700;color:#111827;letter-spacing:.5px}.classic-total{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#3478f6;color:white;font-size:28px;font-weight:750;flex:none}
.classic-result-tags{display:flex;gap:8px;margin-left:6px}.classic-tag{display:inline-grid;place-items:center;background:#1f5eff;color:white;border-radius:3px;padding:2px 7px;min-width:28px;line-height:1.6;font-size:13px;font-weight:400}.classic-tag.red{background:#f23b3b}.classic-tag.blue{background:#1f5eff}
#scratch-canvas{position:absolute;inset:0;width:100%;height:100%;border-radius:6px;touch-action:none;cursor:crosshair;user-select:none}
.classic-recent-values{display:flex;align-items:center;justify-content:center;gap:4px;min-width:0}
.classic-recent{border-top:1px solid #e5e9ef;margin-top:auto;padding-top:7px;display:flex;gap:8px;align-items:center;min-width:0}
.classic-recent>span{color:#70839b;font-size:11px;white-space:nowrap;flex:none}
#classic-recent-items{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;flex:1;min-width:0}
.classic-recent-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:3px 4px;border-radius:6px;background:#f6f7f9;min-width:0;height:40px;white-space:nowrap}
.classic-recent-item>span:first-child{color:#70839b;font-size:10px}.classic-recent-item strong{font-size:14px;font-weight:700;color:#20354f}.classic-recent-item .classic-tag{font-size:11px;padding:0 3px;min-width:18px;height:20px}.classic-recent-item .classic-concealed{font-size:10px;font-weight:500}
/* Six direct routes between the draw cards and history. */
.classic-shortcuts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:14px 0 10px}
.classic-shortcuts a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-width:0;min-height:94px;padding:14px 8px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--text);font-size:13px;font-weight:400;line-height:20px;transition:border-color .15s,background-color .15s}
.classic-shortcut-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:#eaf3ff;color:var(--classic-blue)}
.classic-shortcut-icon svg{width:19px;height:19px}
.classic-shortcuts a:hover{border-color:#b5ccff;background:#f8fbff;color:var(--classic-blue)}
.classic-shortcuts a:focus-visible{outline:2px solid var(--classic-blue);outline-offset:3px}
@media(max-width:767px){.classic-shortcuts{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.classic-shortcuts a{min-height:90px;padding:12px 6px;font-size:12px}}
/* Match the four-column history reference. */
.classic-history-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:10px 0;margin-bottom:6px;flex-wrap:wrap}
.classic-history-title,.classic-history-tools{display:flex;align-items:center;gap:12px;font-size:12px}
.classic-history-heading h2{font-size:16px;font-weight:650;color:#172033;white-space:nowrap}
.classic-history-title span{color:#7088a8;font-size:12px}
.classic-history-tools{gap:10px}.classic-history-tools a{padding:7px 12px;background:#fafbfe;color:#2463c6;white-space:nowrap}
.classic-history-tools label{margin:0;font-weight:400;color:#7088a8;white-space:nowrap}.classic-history-tools select{font-size:13px;min-height:32px;padding:5px 10px;border-color:#edf1f7;min-width:90px;background:#fafbfe;color:#164478}
.classic-table-wrap{border:1px solid #f3f6fb;border-radius:5px;overflow:auto}
.classic-table{width:100%;table-layout:fixed;border-collapse:collapse;font-size:14px;text-align:left}
.classic-table th{height:42px;background:#f9fbff;color:#5279ae;font-size:13px;font-weight:400;padding:10px 16px;border-bottom:1px solid #f1f5fc;letter-spacing:0}
.classic-table td{height:45px;padding:8px 16px;border:0;border-bottom:1px solid #f8faff;color:#172033;font-variant-numeric:tabular-nums}
.classic-table tbody tr:hover{background:#f5f9ff}.classic-table tr:last-child td{border-bottom:0}
.classic-table th:nth-child(1){width:24%}.classic-table th:nth-child(2){width:28%}.classic-table th:nth-child(3){width:34%}.classic-table th:nth-child(4){width:14%}.classic-table th:last-child,.classic-table td:last-child{text-align:right;padding-right:20px}
.classic-table td:nth-child(2){font-size:13px}
.classic-history-number{display:inline-flex;align-items:center;gap:5px}.classic-history-number strong{font-size:14px;letter-spacing:.2px;color:#101827;font-weight:650}
.classic-history-ball{display:inline-grid;place-items:center;width:28px;height:28px;flex:none;border-radius:50%;background:#3478ff;color:#fff;font-size:14px;font-weight:700}
.classic-history-tags{display:inline-flex;gap:6px}.classic-table .classic-tag{font-size:13px;min-width:30px;padding:0 6px;line-height:22px}
.classic-concealed{color:#70839b!important;font-weight:400}
.classic-inline-error{padding:10px 12px;border:1px solid #f0d8ad;color:#9a5a0a;background:#fff4df;border-radius:5px;margin-bottom:10px;font-size:12px}
@media(min-width:1300px){.classic-top{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media(max-width:1150px){.classic-card{padding-left:14px;padding-right:14px}.classic-draw{height:196px}.classic-recent-item{gap:5px}.classic-recent-item .classic-tag{min-width:18px}}
@media(max-width:767px){
 main.classic-main{padding:12px}.classic-top{gap:10px;grid-template-columns:1fr}.classic-card{height:170px;padding:15px}.classic-draw{height:auto;min-height:178px}
 .classic-draw-header{flex-wrap:wrap;gap:3px}.classic-draw-header p{font-size:12px;gap:8px}.classic-draw-header p span{font-size:10px}.scratch-controls{gap:6px}.scratch-controls label{font-size:12px;min-height:30px}.classic-home .classic-reveal{font-size:11px;min-height:30px}
 .classic-expression{font-size:28px}.classic-result-tags{gap:7px}.classic-recent{align-items:center;gap:6px}.classic-recent>span{padding-top:0;font-size:10px}
 .classic-recent-item{height:56px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;padding:3px;text-align:center}.classic-recent-item>span:first-child,.classic-recent-item strong{grid-column:1/-1}.classic-recent-item .classic-tag{justify-self:center}.classic-recent-item>span:first-child{width:100%;text-align:center;font-size:9px;line-height:1}.classic-recent-item strong{font-size:12px}.classic-recent-item .classic-tag{font-size:10px;min-width:14px;height:17px;padding:0 2px}.classic-recent-item .classic-concealed{font-size:9px}
 .classic-history-heading{gap:8px;padding:10px 0}.classic-history-title{gap:8px;flex-wrap:wrap}.classic-history-title span{font-size:11px}.classic-history-tools{gap:8px;width:100%;justify-content:space-between}.classic-history-tools a{padding:6px 8px}.classic-history-tools select{font-size:16px;min-height:36px;min-width:80px}
 .classic-table{min-width:0;font-size:12px}.classic-table th{font-size:11px;height:40px;padding:8px}.classic-table td{height:43px;padding:7px 8px}.classic-table td:nth-child(2){font-size:11px}.classic-history-number{gap:3px}.classic-history-number strong{font-size:12px}.classic-history-ball{width:25px;height:25px;font-size:12px}.classic-table .classic-tag{font-size:11px;min-width:24px;padding:0 4px}.classic-history-tags{gap:4px}
 .classic-table-footer{font-size:10px}.classic-table-footer>div{gap:6px}.classic-table-footer button{font-size:11px;padding:6px 8px}.classic-card-top,.classic-countdown-meta{font-size:12px}
}

/* Clear cell grid for the home draw history, matching the reference table. */
.classic-table-wrap{border-color:#dfe4eb}
.classic-table{border:1px solid #dfe4eb}
.classic-table th,.classic-table td{border:1px solid #e1e5eb}
.classic-table th{background:#f6f7f9;color:#41556f;font-weight:550}
.classic-table tr:last-child td{border-bottom:1px solid #e1e5eb}
.classic-table th,.classic-table td{text-align:center}
.classic-table th:last-child,.classic-table td:last-child{text-align:center;padding-right:16px}

/* Keep period, total, and tags on one line; reduce count before crowding. */
@media(min-width:768px){
 .classic-recent-item{flex-direction:row;gap:6px;height:34px;padding:4px}
 .classic-recent-values{flex:none;gap:4px}
 .classic-recent-item>span:first-child{flex:none}
 @container (max-width:644px){
  #classic-recent-items{grid-template-columns:repeat(4,minmax(0,1fr))}
  .classic-recent-item:nth-child(n+5){display:none}
 }
 @container (max-width:524px){
  #classic-recent-items{grid-template-columns:repeat(3,minmax(0,1fr))}
  .classic-recent-item:nth-child(n+4){display:none}
 }
 @container (max-width:404px){
  #classic-recent-items{grid-template-columns:repeat(2,minmax(0,1fr))}
  .classic-recent-item:nth-child(n+3){display:none}
 }
}
