.odds-modern{
  background:#eef1f5;
}
.odds-modern .cs-hero{
  margin-bottom:70px;
}
.oa-root-links{
  padding:8px 12px;
  font-size:12px;
}
.oa-root-links a{
  margin-right:12px;
}
.oa-shell{
  max-width:1180px;
  margin:0 auto 24px;
}
.oa-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.oa-toolbar-title{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.oa-toolbar-title strong{
  color:#16203a;
  font-size:18px;
  line-height:1.25;
}
.oa-toolbar-title span{
  color:#8b93a6;
  font-size:12px;
  font-weight:600;
}
.oa-toolbar-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
}
.oa-toolbar-actions .btn{
  margin:0 !important;
}
.oa-market-tabs-wrap{
  position:sticky;
  top:58px;
  z-index:50;
}
.oa-market-tabs{
  display:flex;
  gap:5px;
  overflow-x:auto;
  padding:5px;
  margin-bottom:12px;
  border:1px solid #e5e8ee;
  border-radius:10px;
  background:#fff;
  box-shadow:0 1px 2px rgba(16,24,40,.05);
  -webkit-overflow-scrolling:touch;
}
.oa-market-tabs::-webkit-scrollbar{
  display:none;
}
.oa-market-tabs-hint{
  display:none;
}
.oa-market-tab{
  flex:1 0 auto;
  min-width:92px;
  min-height:32px;
  padding:6px 11px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:#475069;
  font-size:12px;
  font-weight:750;
  line-height:18px;
  white-space:nowrap;
}
.oa-market-tab:hover,
.oa-market-tab:focus{
  background:#f1f4f8;
  color:#16203a;
  outline:0;
}
.oa-market-tab.active{
  background:#2f5fc9;
  color:#fff;
  box-shadow:0 1px 2px rgba(47,95,201,.25);
}
.oa-market-panel{
  display:none;
}
.oa-market-panel.active{
  display:block;
}
.oa-panel-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  padding:2px 2px 10px;
}
.oa-panel-head h2{
  margin:0;
  color:#16203a;
  font-size:18px;
  font-weight:850;
  line-height:1.25;
}
.oa-panel-head p{
  margin:0;
  color:#8b93a6;
  font-size:12px;
  font-weight:600;
}
.oa-major{
  margin-bottom:12px;
  padding:12px;
  border:1px solid #e5e8ee;
  border-radius:10px;
  background:#fff;
  box-shadow:0 1px 2px rgba(16,24,40,.04);
}
.oa-major-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.oa-major-head strong{
  color:#16203a;
  font-size:13px;
  font-weight:800;
  line-height:1.25;
}
.oa-major-head span{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:3px 8px;
  border-radius:999px;
  background:#eef3ff;
  color:#2f5fc9;
  font-size:11px;
  font-weight:850;
  line-height:16px;
}
.oa-handicap-major .oa-major-head,
.oa-goals-major .oa-major-head,
.oa-corners-major .oa-major-head,
.oa-cards-major .oa-major-head{
  flex-wrap:nowrap;
}
.oa-handicap-major .oa-major-head strong,
.oa-goals-major .oa-major-head strong,
.oa-corners-major .oa-major-head strong,
.oa-cards-major .oa-major-head strong{
  flex:0 0 auto;
}
.oa-handicap-controls,
.oa-goals-controls,
.oa-corners-controls,
.oa-cards-controls{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:nowrap;
  gap:10px;
  min-width:0;
  margin:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.oa-handicap-controls::-webkit-scrollbar,
.oa-goals-controls::-webkit-scrollbar,
.oa-corners-controls::-webkit-scrollbar,
.oa-cards-controls::-webkit-scrollbar{
  display:none;
}
.oa-handicap-controls .oa-detail-segment,
.oa-goals-controls .oa-detail-segment,
.oa-corners-controls .oa-detail-segment,
.oa-cards-controls .oa-detail-segment{
  flex:0 0 auto;
}
.oa-major-list{
  overflow-x:auto;
  border:1px solid #eef0f4;
  border-radius:8px;
  background:#fff;
  -webkit-overflow-scrolling:touch;
}
.oa-handicap-snapshot,
.oa-goals-snapshot,
.oa-corners-snapshot,
.oa-cards-snapshot{
  display:none;
}
.oa-handicap-snapshot.active,
.oa-goals-snapshot.active,
.oa-corners-snapshot.active,
.oa-cards-snapshot.active{
  display:block;
}
.oa-major-subtitle{
  min-width:620px;
  padding:8px 10px;
  background:#fff;
  border-bottom:1px solid #eef0f4;
  color:#16203a;
  font-size:12px;
  font-weight:850;
  line-height:16px;
}
.oa-major-subtitle-spaced{
  border-top:8px solid #f8fafd;
}
.oa-major-table-head,
.oa-major-table-subhead,
.oa-major-row{
  display:grid;
  grid-template-columns:minmax(72px,.82fr) minmax(210px,3fr) minmax(210px,3fr) 18px;
  align-items:center;
  min-width:620px;
}
.oa-major-table-head{
  background:#f5f7fb;
  border-bottom:1px solid #e6eaf1;
}
.oa-major-table-subhead{
  background:#f8fafd;
  border-bottom:1px solid #e9edf3;
  padding-top:7px;
  padding-bottom:7px;
}
.oa-major-table-subhead .oa-major-group span{
  font-size:12px;
}
.oa-major-row{
  background:#fff;
  border-bottom:1px solid #eef0f4;
  cursor:pointer;
  transition:background-color .12s ease;
}
.oa-major-row:last-child{
  border-bottom:0;
}
.oa-major-row:hover,
.oa-major-row:focus{
  background:#f9fbff;
  outline:0;
}
.oa-major-row.is-expanded{
  background:#f7faff;
}
.oa-major-company,
.oa-major-group-title,
.oa-major-group span,
.oa-major-arrow{
  min-width:0;
  padding:5px 6px;
  color:#475069;
  font-size:11px;
  font-weight:800;
  line-height:14px;
  text-align:center;
}
.oa-major-row .oa-major-company,
.oa-major-row .oa-major-group span,
.oa-major-row .oa-major-arrow{
  min-height:30px;
  color:#16203a;
  font-weight:650;
}
.oa-major-company,
.oa-major-group-title,
.oa-major-group span,
.oa-major-arrow{
  display:flex;
  align-items:center;
  justify-content:center;
}
.oa-major-row .oa-major-group span{
  font-size:13px;
  font-weight:400;
}
/* Max/Min/Avg summary rows — paired with oa_stat_rows() in odds_analysis.ctp */
.oa-major-stat{
  background:#f8faff;
}
.oa-major-stat .oa-major-company strong{
  color:#2f5fc9;
  font-size:11px;
  font-weight:800;
}
.oa-major-stat .oa-major-group span{
  font-weight:600;
}
.oa-major-company{
  border-right:1px solid #e6eaf1;
}
.oa-major-company strong{
  display:block;
  overflow:hidden;
  color:#16203a;
  font-size:11px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.oa-major-company span{
  display:block;
  overflow:hidden;
  color:#8b93a6;
  font-size:10px;
  font-weight:700;
  line-height:14px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.oa-major-group{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  border-right:1px solid #e6eaf1;
}
.oa-major-table-subhead .oa-major-group:nth-child(3),
.oa-major-row .oa-major-group:nth-child(3){
  border-right:0;
}
.oa-major-group span{
  overflow:hidden;
  border-right:1px solid #eef0f4;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.oa-major-sort{
  width:100%;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  line-height:inherit;
  text-align:center;
  cursor:pointer;
}
.oa-major-sort:after{
  content:"";
  display:inline-block;
  width:15px;
  height:15px;
  margin-left:3px;
  vertical-align:middle;
  background:no-repeat center / 15px 15px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23bbbbbb' d='M12 6l4 5H8z'/%3E%3Cpath fill='%23bbbbbb' d='M12 18l4-5H8z'/%3E%3C/svg%3E");
}
.oa-major-sort:hover,
.oa-major-sort:focus,
.oa-major-sort.active{
  color:#2f5fc9;
  outline:0;
}
.oa-major-sort.active.asc:after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233b82f6' d='M12 8l5 6H7z'/%3E%3C/svg%3E");
}
.oa-major-sort.active.desc:after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233b82f6' d='M12 16l5-6H7z'/%3E%3C/svg%3E");
}
.oa-major-group span:last-child{
  border-right:0;
}
.oa-major-closing span{
  font-weight:850;
}
.up{
  color:#d94949;
}
.down{
  color:#15965b;
}
.oa-major-arrow{
  padding-left:0;
  padding-right:0;
  color:#9aa3b5;
  font-size:17px;
  font-weight:650;
  transition:transform .14s ease,color .14s ease;
}
.oa-major-row:hover .oa-major-arrow,
.oa-major-row:focus .oa-major-arrow,
.oa-major-row.is-expanded .oa-major-arrow{
  color:#2f5fc9;
}
.oa-major-row.is-expanded .oa-major-arrow{
  transform:rotate(90deg);
}
.oa-major-detail{
  min-width:620px;
  padding:8px 12px 10px;
  border-bottom:1px solid #eef0f4;
  background:#f7faff;
}
.oa-major-detail-title{
  margin-bottom:6px;
  color:#16203a;
  font-size:11px;
  font-weight:850;
}
.oa-major-detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.oa-major-detail-block{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  align-items:center;
}
.oa-major-detail-label{
  flex:0 0 100%;
  color:#8b93a6;
  font-size:10px;
  font-weight:800;
}
.oa-major-detail-pill{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:22px;
  padding:3px 7px;
  border:1px solid #e2e8f4;
  border-radius:999px;
  background:#fff;
  color:#16203a;
  font-size:11px;
  font-weight:700;
}
.oa-major-detail-pill b{
  color:#697389;
  font-size:10px;
}
.oa-major-empty{
  padding:14px;
  border-top:1px dashed #d9e0eb;
  color:#8b93a6;
  text-align:center;
  font-size:12px;
  font-weight:800;
}
.oa-card-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.oa-odds-card{
  min-width:0;
  overflow:hidden;
  border:1px solid #e5e8ee;
  border-radius:10px;
  background:#fff;
  box-shadow:0 1px 2px rgba(16,24,40,.04);
}
.oa-odds-card-wide{
  grid-column:span 2;
}
.oa-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-height:46px;
  padding:10px 12px;
  border-bottom:1px solid #eef0f4;
  background:#fff;
}
.oa-card-head .titleSpan{
  color:#16203a;
  font-size:14px;
  font-weight:850;
  line-height:1.25;
}
.oa-card-head .btn-group{
  flex:0 0 auto;
}
.oa-card-head .btn{
  padding:4px 10px !important;
  border-color:#dfe4ed !important;
  color:#475069;
  font-size:12px;
  font-weight:800;
}
.oa-card-head .btn-primary{
  background:#2f5fc9 !important;
  border-color:#2f5fc9 !important;
  color:#fff !important;
}
.oa-odds-card .tableExBody{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.oa-odds-card table{
  width:100%;
  margin:0 !important;
  border:0 !important;
  border-collapse:separate;
  border-spacing:0;
}
.oa-odds-card table th,
.oa-odds-card table td{
  padding:7px 8px !important;
  border-color:#eef0f4 !important;
  color:#16203a;
  font-size:12px;
  text-align:center;
  vertical-align:middle !important;
  white-space:nowrap;
}
.oa-odds-card table thead th{
  background:#f3f6fa !important;
  color:#475069;
  font-weight:800;
}
.oa-odds-card table tbody tr:hover td{
  background:#f9fbfe;
}
.oa-odds-card table tbody tr:last-child td{
  border-bottom:0 !important;
}
.oa-empty{
  grid-column:1 / -1;
  padding:22px;
  border:1px dashed #d9e0eb;
  border-radius:10px;
  background:#fff;
  color:#8b93a6;
  text-align:center;
  font-size:13px;
  font-weight:700;
}
.oa-detail-app{
  border:1px solid #e5e8ee;
  border-radius:10px;
  background:#fff;
  box-shadow:0 1px 2px rgba(16,24,40,.04);
  overflow:hidden;
}
.oa-detail-controls{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px;
  border-bottom:1px solid #eef0f4;
  background:#fff;
}
.oa-detail-segment{
  display:flex;
  gap:4px;
  overflow-x:auto;
  padding:3px;
  border:1px solid #e5e8ee;
  border-radius:8px;
  background:#f7f9fc;
  -webkit-overflow-scrolling:touch;
}
.oa-detail-segment::-webkit-scrollbar{
  display:none;
}
.oa-detail-segment button{
  flex:0 0 auto;
  min-height:28px;
  padding:5px 10px;
  border:0;
  border-radius:6px;
  background:transparent;
  color:#475069;
  font-size:12px;
  font-weight:850;
  line-height:18px;
  white-space:nowrap;
}
.oa-detail-segment button.active{
  background:#2f5fc9;
  color:#fff;
  box-shadow:0 1px 2px rgba(47,95,201,.22);
}
.oa-detail-layout{
  display:grid;
  grid-template-columns:92px minmax(0,1fr);
  min-height:360px;
}
.oa-detail-companies{
  overflow-y:auto;
  border-right:1px solid #eef0f4;
  background:#f5f7fa;
}
.oa-detail-companies button{
  display:none;
  width:100%;
  min-height:34px;
  padding:7px 8px;
  border:0;
  border-bottom:1px solid #e9edf3;
  background:transparent;
  color:#667085;
  font-size:12px;
  font-weight:800;
  line-height:18px;
  text-align:left;
}
.oa-detail-companies button.active{
  background:#fff;
  color:#16203a;
  box-shadow:inset 3px 0 0 #2f5fc9;
}
.oa-detail-table-pane{
  min-width:0;
  overflow-x:auto;
  background:#fff;
  -webkit-overflow-scrolling:touch;
}
.oa-detail-loading,
.oa-detail-empty{
  display:none;
  padding:28px 16px;
  color:#98a2b3;
  font-size:13px;
  font-weight:800;
  text-align:center;
}
.oa-detail-table{
  display:none;
  min-width:640px;
}
.oa-detail-table.active{
  display:block;
}
.oa-detail-table-head,
.oa-detail-row{
  display:grid;
  grid-template-columns:.6fr 1fr 1fr 1fr 1.2fr .8fr;
  align-items:center;
}
.oa-detail-table-head{
  position:sticky;
  top:0;
  z-index:1;
  min-height:32px;
  border-bottom:1px solid #e5e8ee;
  background:#f7f9fc;
}
.oa-detail-table-head span{
  padding:7px 8px;
  color:#667085;
  font-size:11px;
  font-weight:850;
  line-height:16px;
  text-align:center;
  white-space:nowrap;
}
.oa-detail-row{
  min-height:32px;
  border-bottom:1px solid #f0f2f6;
}
.oa-detail-row:hover{
  background:#fbfcfe;
}
.oa-detail-row span{
  min-width:0;
  padding:6px 8px;
  color:#263149;
  font-size:12px;
  font-weight:650;
  line-height:18px;
  text-align:center;
  white-space:nowrap;
}
.oa-detail-row span.up{
  color:#d94949;
}
.oa-detail-row span.down{
  color:#15965b;
}
.oa-detail-row .oa-detail-minute.live{
  color:#d69a00;
  font-weight:850;
}
.oa-detail-row .oa-detail-minute.pre,
.oa-detail-row .oa-detail-time{
  color:#98a2b3;
  font-size:11px;
  font-weight:700;
}
.oa-detail-row .oa-detail-minute.pre{
  white-space:pre-line;
}
.oa-detail-row .oa-detail-score.changed{
  justify-self:center;
  min-width:34px;
  margin:0 auto;
  padding:2px 6px;
  border-radius:5px;
  background:#d94949;
  color:#fff;
}

@media (max-width:767px){
  .odds-modern{
    padding-left:8px !important;
    padding-right:8px !important;
  }
  .odds-modern .cs-hero{
    margin-bottom:14px;
  }
  .oa-shell{
    width:100%;
    min-width:0;
    margin-bottom:18px;
  }
  .oa-toolbar{
    align-items:flex-start;
    flex-direction:column;
  }
  .oa-toolbar-actions{
    justify-content:flex-start;
    width:100%;
  }
  .oa-market-tabs-wrap{
    top:56px;
  }
  .oa-market-tabs{
    margin-left:-2px;
    margin-right:-2px;
  }
  .oa-market-tabs-hint{
    position:absolute;
    top:0;
    z-index:51;
    width:34px;
    height:44px;
    pointer-events:none;
  }
  .oa-market-tabs-has-left .oa-market-tabs-hint-left,
  .oa-market-tabs-has-right .oa-market-tabs-hint-right{
    display:block;
  }
  .oa-market-tabs-hint-left{
    left:-2px;
    border-radius:10px 0 0 10px;
    background:linear-gradient(to left, rgba(255,255,255,0), #fff 62%);
  }
  .oa-market-tabs-hint-right{
    right:-2px;
    border-radius:0 10px 10px 0;
    background:linear-gradient(to right, rgba(255,255,255,0), #fff 62%);
  }
  .oa-market-tabs-hint:after{
    content:"";
    position:absolute;
    top:50%;
    width:6px;
    height:6px;
    border-top:1.5px solid #667085;
    border-right:1.5px solid #667085;
    opacity:.66;
  }
  .oa-market-tabs-hint-left:after{
    left:9px;
    transform:translateY(-50%) rotate(-135deg);
  }
  .oa-market-tabs-hint-right:after{
    right:9px;
    transform:translateY(-50%) rotate(45deg);
  }
  .oa-market-tab{
    flex:0 0 auto;
    min-width:112px;
    width:max-content;
    min-width:max-content;
    padding-left:10px;
    padding-right:10px;
  }
  .oa-panel-head{
    align-items:flex-start;
    flex-direction:column;
    gap:3px;
  }
  .oa-major{
    padding:10px;
    min-width:0;
  }
  .oa-major-head{
    align-items:flex-start;
    flex-direction:column;
  }
  .oa-handicap-controls,
  .oa-goals-controls,
  .oa-corners-controls,
  .oa-cards-controls{
    justify-content:flex-start;
    width:100%;
    gap:6px;
  }
  .oa-corners-major .oa-major-head{
    align-items:flex-start;
    flex-wrap:wrap;
  }
  .oa-corners-controls{
    justify-content:flex-start;
    flex-wrap:wrap;
    width:100%;
    overflow-x:visible;
  }
  .oa-handicap-controls .oa-detail-segment,
  .oa-goals-controls .oa-detail-segment,
  .oa-corners-controls .oa-detail-segment,
  .oa-cards-controls .oa-detail-segment{
    flex:0 0 auto;
  }
  .oa-corners-controls .oa-detail-segment{
    flex:1 1 auto;
    justify-content:center;
    max-width:100%;
  }
  .oa-handicap-controls .oa-detail-segment button,
  .oa-goals-controls .oa-detail-segment button,
  .oa-corners-controls .oa-detail-segment button,
  .oa-cards-controls .oa-detail-segment button{
    flex:0 0 auto;
  }
  .oa-corners-controls .oa-detail-segment button{
    flex:1 1 0;
    min-width:0;
    padding-left:6px;
    padding-right:6px;
  }
  .oa-major-list{
    width:100%;
    overflow-x:hidden;
  }
  .oa-major-table-head,
  .oa-major-table-subhead,
  .oa-major-row{
    grid-template-columns:minmax(52px,.72fr) minmax(98px,1.62fr) minmax(98px,1.62fr) 12px;
    width:100%;
    min-width:0;
  }
  .oa-major-subtitle{
    min-width:0;
  }
  .oa-major-detail{
    min-width:0;
    padding:7px 9px 9px;
  }
  .oa-major-detail-grid{
    grid-template-columns:1fr;
    gap:7px;
  }
  .oa-major-company,
  .oa-major-group-title,
  .oa-major-group span,
  .oa-major-arrow{
    padding:4px 3px;
    font-size:10px;
  }
  .oa-major-row .oa-major-group span{
    font-size:11px;
  }
  .oa-major-company strong{
    font-size:10px;
  }
  .oa-card-grid{
    grid-template-columns:1fr;
  }
  .oa-odds-card-wide{
    grid-column:auto;
  }
  .oa-card-head{
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
  }
  .oa-card-head .btn-group{
    width:100%;
  }
  .oa-card-head .btn-group .btn{
    width:50%;
  }
  .oa-detail-controls{
    align-items:stretch;
    flex-direction:column;
    gap:7px;
    padding:8px;
  }
  .oa-detail-controls .oa-detail-segment{
    width:100%;
  }
  .oa-detail-market-switch{
    overflow-x:hidden;
  }
  .oa-detail-market-switch button{
    flex:1 1 0;
    min-width:0;
    padding-left:4px;
    padding-right:4px;
    font-size:11.5px;
  }
  .oa-detail-layout{
    display:block;
    min-height:0;
  }
  .oa-detail-companies{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    max-height:126px;
    overflow-x:hidden;
    overflow-y:auto;
    border-right:0;
    border-bottom:1px solid #eef0f4;
    background:#f7f9fc;
    -webkit-overflow-scrolling:touch;
  }
  .oa-detail-companies button{
    width:100%;
    min-width:0;
    border-bottom:0;
    border-right:1px solid #e9edf3;
    text-align:center;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .oa-detail-companies button.active{
    box-shadow:inset 0 -3px 0 #2f5fc9;
  }
  .oa-detail-table{
    min-width:100%;
  }
  .oa-detail-table-head,
  .oa-detail-row{
    grid-template-columns:36px repeat(3,minmax(32px,1fr)) 66px 50px;
  }
  .oa-detail-table-head span,
  .oa-detail-row span{
    padding-left:3px;
    padding-right:3px;
    font-size:10.5px;
    line-height:16px;
  }
  .oa-detail-row .oa-detail-minute.pre,
  .oa-detail-row .oa-detail-time{
    font-size:10px;
  }
  .oa-detail-row .oa-detail-time{
    padding-right:8px;
    text-align:right;
  }
  .oa-detail-row .oa-detail-score{
    justify-self:end;
    width:42px;
    padding-left:4px;
    padding-right:4px;
  }
}

/* ── Bookmaker View (ported from app) ── */
.oa-pattern{ margin:0 0 12px; padding:12px; border:1px solid #e5e8ee; border-radius:8px; background:#fff; box-shadow:0 1px 2px rgba(16,24,40,.04); }
.oa-pattern-head{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.oa-pattern-head strong, .oa-pattern-head .oa-pat-title{ color:#16203a; font-size:14px; font-weight:850; margin:0; display:inline; }
.oa-pattern-badges{ display:inline-flex; align-items:center; gap:6px; flex-wrap:wrap; }
.oa-pattern-badge{ display:inline-flex; align-items:center; height:20px; padding:0 7px; border-radius:999px; background:#f3f6fa; color:#697389; font-size:11px; font-weight:800; }
.oa-pattern-conf{ display:inline-flex; align-items:center; height:20px; padding:0 8px; border-radius:999px; font-size:11px; font-weight:850; color:#fff; }
.oa-pattern-conf-high{ background:#2f5fc9; }
.oa-pattern-conf-med{ background:#d69a00; }
.oa-pattern-conf-low{ background:#8b93a6; }
.oa-pattern-vip{ min-height:auto; padding:6px 0 0; }
.oa-pattern-hint{ margin-bottom:12px; padding:9px 11px; border:1px solid #f4d9b0; border-radius:8px; background:#fff8ee; color:#a06200; font-size:12px; line-height:1.5; }
.oa-pattern-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:12px; }
.oa-pattern-card{ position:relative; display:flex; flex-direction:column; align-items:center; gap:3px; padding:10px 6px; border:1px solid #edf1f7; border-radius:8px; background:#f8fafd; text-align:center; }
.oa-pattern-card--pick{ border-color:#b6e3c9; background:#eafaf1; }
.oa-pattern-pick{ position:absolute; top:-1px; right:-1px; padding:1px 6px; border-radius:0 8px 0 8px; background:#27AE60; color:#fff; font-size:9px; font-weight:850; }
.oa-pattern-card-lbl{ color:#566078; font-size:12px; font-weight:800; }
.oa-pattern-card-val{ white-space:nowrap; }
.oa-pattern-card-val b{ color:#16203a; font-size:11px; font-weight:850; }
.oa-pattern-card-val i{ color:#8b93a6; font-size:9px; font-style:normal; }
.oa-pattern-rows{ padding:0 2px; margin-bottom:10px; border:1px solid #eef1f7; border-radius:8px; }
.oa-pattern-row{ display:grid; grid-template-columns:108px repeat(3,1fr); align-items:center; padding:7px 8px; }
.oa-pattern-row + .oa-pattern-row{ border-top:1px dashed #e5e8ee; }
.oa-pattern-row-lbl{ color:#697389; font-size:12px; font-weight:800; }
.oa-pattern-cell{ display:inline-flex; align-items:center; justify-content:center; gap:5px; }
.oa-pattern-cell b{ font-size:12px; font-weight:850; }
.oa-pattern-tag{ padding:0 4px; border-radius:3px; font-size:9px; font-weight:800; font-style:normal; }
.oa-pat-up{ color:#E74C3C; }
.oa-pat-down{ color:#27AE60; }
.oa-pat-mid{ color:#666; }
.oa-pat-mut{ color:#757575; }
.oa-pattern-tag.oa-pat-up{ background:#fdecea; }
.oa-pattern-tag.oa-pat-mut{ background:#eef0f3; }
.oa-pattern-dist{ border-top:1px solid #eef1f7; padding-top:8px; }
.oa-pattern-dist > summary{ color:#566078; font-size:12px; font-weight:800; cursor:pointer; list-style:none; padding:2px 0; }
.oa-pattern-dist > summary::-webkit-details-marker{ display:none; }
.oa-pattern-dist > summary::before{ content:"\25B8"; margin-right:5px; color:#8b93a6; }
.oa-pattern-dist[open] > summary::before{ content:"\25BE"; }
.oa-pattern-dist-row{ display:grid; grid-template-columns:48px 56px 1fr; align-items:center; gap:6px; margin-top:9px; }
.oa-pattern-dist-lbl{ color:#566078; font-size:12px; font-weight:700; }
.oa-pattern-dist-cnt{ color:#8b93a6; font-size:11px; }
.oa-pattern-dist-bar{ display:flex; height:22px; overflow:hidden; border-radius:5px; background:#eef1f5; }
.oa-pattern-dist-bar i{ display:flex; align-items:center; justify-content:center; height:100%; color:#fff; font-size:10px; font-weight:800; font-style:normal; overflow:hidden; }
.oa-pat-bg-up{ background:#E74C3C; }
.oa-pat-bg-mid{ background:#95a5a6; }
.oa-pat-bg-down{ background:#27AE60; }
@media (max-width:767px){
  .oa-pattern-row{ grid-template-columns:84px repeat(3,1fr); }
  .oa-pattern-cell b{ font-size:11px; }
}