/* Analysis tools must shrink within their grid tracks on phones and tablets. */
.tools-page{min-width:0}
.tools-page .tool-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 28px}
.tools-page .tool-card{min-width:0;overflow-wrap:anywhere;line-height:1.5}
.tools-page .tool-preview{width:100%;min-width:0;max-width:100%;margin-bottom:10px}
.tools-page .tool-preview:not(.matrix-preview):not(.pattern-preview):not(.cycle-preview) span{flex:1 1 0;min-width:0;max-width:5px}
.tools-page .pattern-preview span{flex:none}
.tools-page .bar-chart:not(.frequency){gap:8px;width:100%}
.tools-page .bar-chart:not(.frequency) .bar-item{flex:1 1 0;min-width:0;max-width:60px}
.tools-page .scroll-x,.tools-page .bar-chart{min-width:0;max-width:100%;overscroll-behavior-x:contain}
.tools-page .filters{gap:10px}
.tools-page .filters label{display:flex;align-items:center;gap:5px}

/* Soi cầu: the supplied blue panels, form controls and two-column results. */
.patterns-page{padding:16px 12px 24px;background:#e7eef4;color:#102d50}
.pattern-workbench{font:16px/1.5 Arial,Helvetica,sans-serif;min-width:0}
.pattern-controls,.pattern-result-card,.pattern-repeat-card,.pattern-tool-links{min-width:0;background:linear-gradient(110deg,#fff,#fbfdff);border:1px solid #c4d4e3;border-radius:4px;box-shadow:0 0 0 1px #e6edf3}
.pattern-tabs{gap:4px;margin:0;padding:11px 10px 0;border-bottom:1px solid #bfd3e9;background:linear-gradient(#f9fcff,#eff6fd)}
.pattern-tabs a{font-size:21px;line-height:1.3;padding:14px 24px;color:#005bac;border:1px solid #bfd0e3;border-bottom:0;border-radius:4px 4px 0 0;background:linear-gradient(#fff,#f0f6fd)}
.pattern-tabs a.active{background:linear-gradient(#0079df,#0061bd);color:#fff;border-color:#0068c8;border-radius:4px 4px 0 0}
.pattern-form{padding:11px}
.pattern-filter-bar{display:flex;align-items:center;flex-wrap:wrap;gap:14px 22px;border:1px solid #d3dee8;border-radius:3px;padding:14px 16px;background:linear-gradient(#fafbfc,#f2f5f7)}
.pattern-length-filter{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.pattern-length-filter>b,.pattern-length-filter>label:first-child{color:#102f58}
.pattern-form select,.pattern-form input[type=date],.pattern-form input[name=pair]{height:39px;border-color:#8393a2;border-radius:3px;background:#fff;box-shadow:inset 0 1px 2px #0001;color:#111;padding:5px 8px;font-size:16px;max-width:100%;min-width:0}
.pattern-length-filter>select{width:163px}
.pattern-length-value{display:flex;align-items:center;gap:8px;white-space:nowrap}
.pattern-length-value select{width:66px}
.pattern-form .pattern-options{display:flex;flex:1 1 auto;gap:10px;align-items:center;flex-wrap:wrap;padding:9px;background:#fff7e8;border:1px solid #ffd18c;border-radius:3px;font-size:15px;min-width:0}
.pattern-options label{display:flex;align-items:center;gap:5px;white-space:nowrap}
.pattern-options .pattern-date{gap:8px}
.pattern-date{display:flex;align-items:center}
.pattern-date-field{display:flex;align-items:center;position:relative;min-width:0;width:156px}
.pattern-form .pattern-date-field>input[type=text]{width:100%;height:39px;min-width:0;padding:5px 29px 5px 8px;border-color:#8393a2;font-size:16px;box-shadow:inset 0 1px 2px #0001}
.pattern-date-picker{position:absolute;right:3px;top:6px;height:27px;width:26px;padding:4px;background:none;color:#30455b;border:0}
.pattern-date-picker:hover{background:#edf4fc;color:#123f75}
.pattern-form .pattern-date-field>input.pattern-native-date{position:absolute;left:0;bottom:0;width:1px;height:1px;padding:0;opacity:0;pointer-events:none}
.pattern-options input[type=date]{width:146px}
.pattern-options select{width:101px}
.pattern-options input[type=checkbox],.pattern-options input[type=radio]{margin:0;width:19px;height:19px;flex:none}
.pattern-pair-filter{display:flex;align-items:center;gap:8px;flex-basis:100%;font-weight:bold}
.pattern-pair-filter input{width:66px}
.pattern-submit{margin:11px 3px 3px;padding:9px 30px;min-width:158px;font-size:21px;line-height:1.4;background:linear-gradient(#0079df,#0061bd);border:1px solid #0078df;border-radius:4px}
.pattern-output-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:12px;align-items:stretch;margin-top:14px}
.pattern-results{font:inherit;max-width:none}
.pattern-result-card,.pattern-repeat-card{padding:11px}
.pattern-run-card{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:6px;border:1px solid #c6d9ec;border-radius:3px;background:linear-gradient(110deg,#f3f9ff,#eaf3fe)}
.pattern-run-days{min-width:0;flex:1}
.pattern-run-card h2{margin:0 3px 10px;font-size:18px;line-height:1.4}
.pattern-run-card .length-tabs{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:2px;margin:0;max-width:480px}
.pattern-run-card .length-tabs a{font-size:18px;font-style:italic;color:#73879a;line-height:1.4;min-width:0;padding:5px 2px;border-bottom:3px solid #a8afb4}
.pattern-run-card .length-tabs a.active{color:#007eff;border-color:#ff7900}
.pattern-position-toggle{background:linear-gradient(#fff,#dcecff);color:#183b63;border:1px solid #569ef0;box-shadow:0 0 0 2px #eef6ff;padding:6px 12px;white-space:nowrap;font-size:16px;font-weight:bold;border-radius:3px}
.pattern-position-toggle:hover{background:#dcecff;color:#14395f}
.pattern-position-panel{margin-top:14px}
.pattern-position-panel .position-table{min-width:480px}
.pattern-matches{margin-top:24px}
.pattern-matches>h2,.pattern-repeat-card>h2{margin:0;background:linear-gradient(110deg,#e5f3ff,#d6e9ff);border:1px solid #b8d5fa;color:#002580;font-size:18px;line-height:1.5;padding:8px 9px;border-radius:3px 3px 0 0}
.pattern-count{color:red}
.pattern-chips{gap:7px;margin:14px 5px 24px}
.pattern-chips a{font:16px/25px Arial,Helvetica,sans-serif;padding:4px 6px;border:1px solid #81b4ff;background:linear-gradient(#f0f7ff,#cfe5ff);color:#003a9e;min-width:32px;text-align:center}
.pattern-chips a.long{font-weight:bold;background:linear-gradient(#b5c7ff,#92aaf8)}
.pattern-summary{padding:0 4px}
.pattern-summary p{margin:10px 0;font-size:16px;line-height:1.6}
.pattern-summary b{color:#001d75}
.pattern-summary .pink,.pattern-summary .pink b{color:#cf00f2}
.pattern-path-details{margin:15px 4px 0;font-size:13px}
.pattern-path-details>summary{cursor:pointer;color:#005be1}
.pattern-path-details .rules{max-width:none;margin-top:12px}
.pattern-path-details .rules>details{scroll-margin-top:15px}
.pattern-path-details .position-table{min-width:440px}
.pattern-path-details .notice{font-size:12px}
.pattern-repeat-card>h2{border-radius:0;color:#103557;font-size:18px;margin-bottom:12px}
.pattern-repeats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:6px}
.pattern-repeats table{width:100%;background:linear-gradient(110deg,#f3f9ff,#fff);font-size:16px;font-weight:bold}
.pattern-repeats td{border:1px solid #accdff;padding:8px 5px;white-space:nowrap;text-align:center;color:green}
.pattern-repeats td:first-child{color:#ce4b00;background:linear-gradient(110deg,#eaf5ff,#fff)}
.pattern-tool-links{padding:10px 16px;margin-top:16px;color:#162737}
.pattern-tool-links p{margin:5px 0;font-size:17px}
.pattern-tool-links a{font-weight:bold;text-decoration:underline}
.chat-member{color:green;font-weight:bold}
.chat-number{color:#e000cf}
.ranking-table .member-name{color:#39629c}
.account-history{margin-top:28px}
.account-history .data-table{min-width:520px}
@media(min-width:1200px){
 .pattern-filter-bar{flex-wrap:nowrap;gap:14px;padding:14px 10px}
 .pattern-length-filter{gap:8px;flex:none;font-size:17px}
 .pattern-length-filter>select{width:155px}
 .pattern-length-value select{width:58px}
 .pattern-form .pattern-options{gap:8px;padding:8px;font-size:16px}
 .pattern-options input[type=date]{width:140px;font-size:15px}
 .pattern-options select{width:92px;font-size:15px}
 .pattern-filter-bar:has(.pattern-pair-filter){flex-wrap:wrap}
}
@media(max-width:1050px){
 .tools-page .tool-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
 .pattern-filter-bar{padding:12px}
 .pattern-length-filter{flex-basis:100%}
 .pattern-form .pattern-options{flex-basis:100%}
 .pattern-tabs a{font-size:19px;padding:13px 20px}
 .pattern-output-grid{grid-template-columns:minmax(0,1.75fr) minmax(0,1fr)}
 .pattern-run-card{flex-wrap:wrap;gap:8px}
 .pattern-run-days{flex-basis:100%}
 .pattern-run-card .length-tabs{max-width:none}
 .pattern-position-toggle{margin:4px}
 .pattern-matches>h2,.pattern-repeat-card>h2{font-size:16px}
 .pattern-repeats{gap:4px}
 .pattern-repeats td{font-size:13px;padding:8px 3px}
}
@media(max-width:800px){
 .tools-page .tool-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px;margin:10px 2px}
 .tools-page .tool-preview{height:134px}
 .pattern-output-grid{grid-template-columns:minmax(0,1fr)}
 .pattern-run-card{flex-wrap:nowrap}
 .pattern-run-days{flex-basis:auto}
 .pattern-run-card h2{font-size:18px}
 .pattern-run-card .length-tabs{max-width:480px}
 .pattern-repeats{gap:8px}
 .pattern-repeats td{font-size:16px;padding:9px 6px}
}
@media(max-width:540px){
 .tools-page .tool-grid{gap:20px 12px}
 .tools-page .tool-preview{height:110px;padding:8px}
 .tools-page .tool-card{font-size:12px}
 .tools-page .bar-chart:not(.frequency){gap:5px;padding-left:4px;padding-right:4px}
 .tools-page .bar-item small{font-size:10px}
 .tools-page .bar-item b{font-size:11px}
 .tools-page .filters label{flex-wrap:wrap;white-space:normal}
 .patterns-page{padding:8px 5px 18px}
 .pattern-workbench{font-size:14px}
 .pattern-tabs{gap:4px;padding:7px 6px 0}
 .pattern-tabs a{flex:1;min-width:0;font-size:15px;padding:11px 8px;text-align:center}
 .pattern-form{padding:8px}
 .pattern-filter-bar{gap:12px;padding:10px}
 .pattern-length-filter{gap:8px}
 .pattern-length-filter>label:first-child{flex-basis:100%;font-size:16px}
 .pattern-length-filter>select{flex:1;width:auto;min-width:0}
 .pattern-length-value select{width:57px}
 .pattern-form .pattern-options{gap:12px 10px;padding:9px;font-size:13px}
 .pattern-options .pattern-date{flex-basis:100%;white-space:normal}
 .pattern-date-field{flex:1;width:auto}
 .pattern-form .pattern-date-field>input[type=text]{font-size:16px}
 .pattern-options input[type=date]{flex:1;min-width:0;width:100%;font-size:16px}
 .pattern-options select{font-size:15px;width:92px}
 .pattern-submit{font-size:18px;min-width:136px;padding:8px 24px;margin-left:0}
 .pattern-output-grid{margin-top:10px;gap:10px}
 .pattern-result-card,.pattern-repeat-card{padding:8px}
 .pattern-run-card{flex-wrap:wrap;gap:6px}
 .pattern-run-days{flex-basis:100%}
 .pattern-run-card h2{font-size:16px;margin-bottom:7px}
 .pattern-run-card .length-tabs a{font-size:16px;padding:5px 1px}
 .pattern-position-toggle{font-size:14px;padding:6px 10px}
 .pattern-matches{margin-top:16px}
 .pattern-matches>h2,.pattern-repeat-card>h2{font-size:16px;padding:7px}
 .pattern-chips{gap:6px;margin:12px 1px 16px}
 .pattern-chips a{font-size:15px;line-height:24px;min-width:31px;padding:3px 5px}
 .pattern-summary{padding:0 2px}
 .pattern-summary p{font-size:14px;line-height:1.6}
 .pattern-repeats{gap:5px}
 .pattern-repeats td{font-size:13px;padding:8px 3px}
 .pattern-tool-links{padding:9px 12px;margin-top:12px}
 .pattern-tool-links p{font-size:14px;line-height:1.7}
}
@media(max-width:359px){
 .tools-page .tool-grid{grid-template-columns:minmax(0,1fr);margin:8px 12px}
 .tools-page .tool-preview{height:134px}
 .pattern-tabs a{font-size:14px;padding:11px 6px}
 .pattern-repeats td{font-size:12px;padding:7px 2px}
}
@media print{
 .pattern-controls,.pattern-position-toggle,.pattern-path-details,.pattern-tool-links{display:none}
 .patterns-page{background:#fff}
 .pattern-output-grid{grid-template-columns:2fr 1fr}
}