/* Readable controls; fit the desktop board and scroll on smaller screens. */
html{--analysis-text:17px;--analysis-small:15px}
#analytics,#flow,#advanced,.gdl_journey{font-size:var(--analysis-text);line-height:1.75;scroll-margin-top:100px}
#analytics :is(p,label,select,input,button),#flow :is(p,label,select,input,button),#advanced :is(p,label,select,input,button){font-size:var(--analysis-text)!important;line-height:1.65}
#analytics :is(small,summary,.field-help),#flow :is(small,summary),#advanced :is(small,summary){font-size:var(--analysis-small)!important;line-height:1.7}
#analytics :is(button,select,input:not([type=checkbox])),#flow :is(button,select),#advanced :is(button,select,input:not([type=checkbox])){min-height:48px}
#analytics input[type=checkbox],#flow input[type=checkbox],#advanced input[type=checkbox]{width:24px;height:24px;flex-shrink:0;accent-color:#086b62}
#analytics :is(h1,h2),#flow :is(h1,h2){font-size:clamp(25px,4vw,34px)!important;line-height:1.45;white-space:normal!important;word-break:keep-all}
#advanced h3,#analytics h3{font-size:22px!important;line-height:1.5}
#advanced .advanced-rule-range{display:grid;grid-template-columns:minmax(0,1fr) 16px minmax(0,1fr);flex:0 0 100%;width:100%;max-width:240px;gap:8px;align-items:center;min-width:0;margin:0;opacity:1}
#advanced .advanced-rule-range input{box-sizing:border-box;flex:none;width:100%!important;min-width:0;max-width:none;height:48px;font-weight:700;font-variant-numeric:tabular-nums;color:#203c4d;text-align:center;padding:8px!important}
#advanced .advanced-rule-range i{width:16px;min-width:0;text-align:center;font-size:16px;line-height:1;color:#526573}
#advanced .advanced-rules{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))!important;gap:14px}
#advanced .advanced-rules>label{min-width:0;display:flex;flex-wrap:wrap;gap:12px;padding:18px!important;background:#fff;border:1px solid #bac9cd;border-radius:10px;cursor:pointer}
#advanced .advanced-rules>label:has(input:checked){border:2px solid #086b62;background:#edf7f3}
#advanced .advanced-rules b{font-size:20px!important}
#advanced .advanced-rules.is-simple>label:nth-child(n+4):not(:has(input:checked)){display:none}
#advanced :is(.advanced-options,.ai-analysis-controls){gap:16px}
#advanced .advanced-controls>header{display:block;margin-bottom:20px}
#advanced .advanced-controls>header b{display:block;font-size:24px;margin-bottom:10px}
#advanced .advanced-controls>header span{font-size:var(--analysis-text);line-height:1.7}
#advanced .advanced-result-actions{display:flex;flex-wrap:wrap;gap:12px}
#advanced .advanced-result-actions button{flex:1 1 220px;height:auto;padding:14px;white-space:normal}
#advanced .advanced-combination{display:flex;flex-wrap:wrap;gap:12px;padding:20px 14px!important}
#advanced .advanced-combination .balls{display:flex;gap:6px;flex-wrap:wrap}
#advanced .advanced-combination .balls i{width:36px;height:36px;font-size:18px!important}
#advanced .advanced-combination small{flex-basis:100%;color:#43535e!important}
#advanced :is(#advancedStatus,#aiAnalysisStatus){padding:14px;background:#f0f5f3;border-radius:8px;color:#263c45}
#advanced :is(#runAdvancedAnalysis,#runAiAnalysis){height:auto;padding:16px 20px;background:#086b62;color:#fff;border-radius:10px;font-size:20px!important;font-weight:700}
.gdl_journey p,.gdl_journey li{font-size:var(--analysis-text)}
.gdl_journey small,.gdl_journey nav,.gdl_journey_actions{font-size:var(--analysis-small)}
.gdl_journey details{margin:14px 0}.gdl_journey summary{cursor:pointer;font-size:18px;min-height:44px}
.gdl_trial_notice{padding:16px 20px;margin:16px auto;background:#edf6f2;color:#25433b;border:1px solid #c4d8cf;border-radius:10px;font-size:18px;line-height:1.75}
.gdl_trial_notice a{color:#086b62;text-decoration:underline}
#advanced .advanced-access{display:flex;flex-wrap:wrap;gap:12px}
#advanced .advanced-access :is(b,span){font-size:var(--analysis-small)!important;white-space:normal}
#advanced #toggleExtraRules{background:#fff;color:#24534d;border:1px solid #9bb1b7;margin-bottom:16px;padding:12px;border-radius:8px}
#analytics .analytics-answer{display:block}
#analytics .analytics-answer summary{cursor:pointer;font-weight:700;min-height:48px;padding:10px 0}
.gdl_cart_link{display:inline-block;padding:12px 0;font-size:18px;color:#086b62;text-decoration:underline}
#analytics :is(.analysis-pick-guide,.number-pick-panel) :is(b,span){font-size:var(--analysis-small)!important;line-height:1.65}
/* The dense data grid has its own scale, independent of form buttons. */
#flow .flow-scroll{overflow-x:auto!important}
#flow .flow-board{grid-template-columns:88px repeat(45,28px)!important;width:1348px!important;min-width:1348px!important}
#flow .flow-cell{width:auto!important;height:32px!important;min-height:32px!important;font-size:12px!important;line-height:1!important;padding:0}
#flow .flow-cell.row-label{display:flex;flex-direction:column;justify-content:center;gap:3px}
#flow .flow-cell.row-label b,#flow .flow-cell.row-label small{font-size:12px!important;line-height:1.1!important;white-space:nowrap}
#flow .flow-cell.history-cell:not(.hit):not(.bonus):not(.recommend-option){font-size:0!important;color:transparent}
#flow .flow-cell.header{font-size:11px!important}
#flow .flow-verification summary :is(b,span,time){font-size:14px;line-height:1.5}
#advanced .advanced-rules b{font-size:18px!important}
#advanced .advanced-controls>header b{font-size:22px}
#advanced :is(#runAdvancedAnalysis,#runAiAnalysis){font-size:18px!important}
.gdl_trial_notice,.gdl_cart_link{font-size:17px}
@media(min-width:1024px){
  #flow .flow-scroll{container-type:inline-size}
  #flow .flow-board{width:100%!important;min-width:0!important;grid-template-columns:70px repeat(45,minmax(0,1fr))!important}
  #flow .flow-cell{min-width:0!important;font-size:clamp(9px,.95cqw,12px)!important}
  #flow .flow-cell.header{font-size:clamp(9px,.85cqw,11px)!important}
  #flow .flow-scroll-controls{display:none!important}
}

@media(max-width:780px){
  .page-jump{position:static;flex-direction:row;justify-content:center;margin:20px auto;opacity:1;visibility:visible;transform:none}
  .page-jump .section-up{display:none}
  .page-jump .back-to-top{min-height:48px;font-size:16px;padding:10px 24px}
  #analytics .analysis-pick-guide{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
  #analytics>.shell,#advanced>.shell{padding-inline:16px!important}
  #flow.shell{width:calc(100% - 32px);padding-inline:0!important}
  #analytics .section-heading,#flow .section-heading{display:block}
  #analytics .filter-row,#flow .flow-toolbar,#flow .flow-actions{display:flex;flex-wrap:wrap;gap:14px}
  #analytics :is(.focus-detail-grid,.latest-draws),#advanced :is(.advanced-panel,.ai-score-groups,.ai-timeseries-guide dl){grid-template-columns:minmax(0,1fr)!important}
  #advanced :is(.advanced-rules,.advanced-options,.ai-analysis-controls){grid-template-columns:minmax(0,1fr)!important}
  #advanced .advanced-controls{padding:20px 16px!important}
  #analytics .number-pick-balls{grid-template-columns:repeat(auto-fit,minmax(48px,1fr))!important;gap:10px 6px}
  #analytics .number-pick-balls button span{width:44px;height:44px;font-size:20px}
  #flow .section-heading.compact>div:first-child{display:block!important;width:100%;min-width:0}
  #flow .section-heading.compact{background:#f0f5f3;color:#213b42;box-shadow:none;padding:18px}
  #flow .section-heading.compact h1{color:#213b42;width:100%;max-width:none}
  #flow .section-heading.compact h1 em{display:inline;background:none;color:#086b62}
  #flow .flow-mobile-lead{color:#43535e}
  #flow .flow-cell.row-label{flex-direction:column;justify-content:center;padding:2px}
  #flow .flow-cell.row-label b{font-size:16px!important}
  #flow :is(.flow-toolbar>div>span,.start-flow-filter>header span,.flow-scroll-controls output){font-size:var(--analysis-small)!important}
  #flow .start-flow-filter>header>div:first-child{display:block}
  #flow .flow-board{grid-template-columns:84px repeat(45,48px)!important;width:2244px!important;min-width:2244px!important}
  #flow .flow-cell{width:auto!important;min-height:48px!important;height:48px!important;font-size:18px!important;line-height:1.3}
  #flow .flow-cell small{font-size:14px!important}
  #flow .flow-scroll{overflow-x:auto!important;touch-action:pan-x pan-y}
  #flow .flow-toolbar>div,#flow .start-flow-filter>header>div{min-width:0}
  #flow .start-flow-filter>header{display:block}
  #flow .start-flow-modes{margin-top:14px}
  #flow .start-flow-modes button{min-width:0;padding:10px}
  #analytics .analytics-answer nav{display:none}
  #analytics .latest-numbers i{width:32px;height:32px;font-size:16px!important}
  #analytics .latest-draw header,#analytics .latest-draw header b{font-size:16px}
  .candidate-cart,.candidate-cart.collapsed{position:static!important;width:calc(100% - 32px)!important;max-width:600px!important;margin:20px auto;scroll-margin-top:100px}
  .candidate-cart header b,.candidate-cart footer,.candidate-cart header button,.candidate-cart footer button{font-size:16px;line-height:1.6}
  .candidate-cart button{min-height:48px}
  .candidate-cart .candidate-items{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
  .candidate-cart .candidate-items button{font-size:20px}
  #top{padding-bottom:100px}
}
