.market-page-wrap{
  padding: 18px;
}
.market-page{
  display:grid;
  gap:18px;
}
.market-hero{
  display:grid;
  gap:12px;
}
.market-hero h1{
  margin:0;
}
.market-intro{
  margin:0;
  max-width:72ch;
}
.market-card{
  background:var(--surface);
  border:1px solid color-mix(in oklab, var(--text) 8%, transparent);
  border-radius:16px;
  padding:18px;
  box-shadow:var(--shadow-rest, var(--shadow-2));
}
.market-section-heading{
  margin-bottom:12px;
}
.market-section-heading h2,
.market-tips-card h2,
.market-next-card h2{
  margin:0 0 8px;
  font-size:clamp(1.06rem, 1rem + .4vw, 1.28rem);
}
.market-section-intro,
.market-note,
.market-next-card p{
  margin:0;
  color:var(--muted);
}
.market-table-wrap{
  width:100%;
  overflow:auto;
  overscroll-behavior-x:contain;
  border-radius:14px;
}
.market-table{
  width:100%;
  min-width:860px;
  border-collapse:separate;
  border-spacing:0;
  background:var(--bg);
  border:1px solid color-mix(in oklab, var(--text) 10%, transparent);
  border-radius:14px;
}
.market-table th,
.market-table td{
  padding:14px 16px;
  vertical-align:top;
  text-align:left;
  border-bottom:1px solid color-mix(in oklab, var(--text) 8%, transparent);
}
.market-mobile-label{
  display:none;
}
.market-cell-value{
  min-width:0;
}
.market-table thead th{
  background:color-mix(in oklab, var(--surface) 78%, var(--bg));
  font-size:.94rem;
  font-weight:700;
  color:color-mix(in oklab, var(--text) 78%, transparent);
}
.market-table tbody tr:last-child td{
  border-bottom:0;
}
.market-table tbody tr:nth-child(even):not(.is-featured) td{
  background:color-mix(in oklab, var(--surface) 30%, var(--bg));
}
.market-place-wrap,
.market-day-cell{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:flex-start;
}
.market-place,
.market-day,
.market-time,
.market-tip-text{
  overflow-wrap:anywhere;
}
.market-place{
  font-weight:780;
  line-height:1.35;
}
.market-day,
.market-time{
  font-weight:650;
}
.market-time,
.market-tip-text,
.market-type-pill{
  display:block;
}
.market-badge,
.market-day-meta,
.market-type-pill{
  display:inline-flex;
  align-items:center;
  padding:4px 8px;
  border-radius:999px;
  font-size:.78rem;
  font-weight:700;
  line-height:1.2;
}
.market-badge{
  background:color-mix(in oklab, var(--accent) 12%, var(--bg));
  color:var(--accent);
}
.market-day-meta{
  background:color-mix(in oklab, var(--accent-2) 12%, var(--bg));
  color:color-mix(in oklab, var(--text) 88%, transparent);
}
.market-type-pill{
  background:color-mix(in oklab, var(--surface-2) 84%, var(--bg));
  color:color-mix(in oklab, var(--text) 88%, transparent);
}
.market-route-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:44px;
  white-space:nowrap;
}
.market-route-btn svg{
  width:16px;
  height:16px;
  flex:0 0 16px;
}
@media (min-width:721px){
  .market-table th:nth-child(2),
  .market-table td.market-day-col{
    width:11rem;
    min-width:11rem;
  }
  .market-table th:nth-child(3),
  .market-table td.market-time-cell{
    width:14rem;
    min-width:14rem;
  }
  .market-table th:nth-child(6),
  .market-table td.market-action-cell{
    width:11.5rem;
    min-width:11.5rem;
  }
  .market-day-cell{
    display:grid;
    gap:6px;
    align-items:start;
  }
  .market-day{
    white-space:nowrap;
  }
  .market-day-meta{
    width:max-content;
  }
  .market-time{
    overflow-wrap:normal;
    word-break:normal;
    hyphens:none;
    line-height:1.4;
    font-variant-numeric:tabular-nums;
  }
}
.market-row.is-featured td{
  background:color-mix(in oklab, var(--accent) 7%, var(--bg));
}
.market-row.is-featured td:first-child{
  box-shadow:inset 3px 0 0 color-mix(in oklab, var(--accent) 42%, transparent);
}
.market-status-row td{
  padding:16px;
  color:var(--muted);
  background:var(--bg);
}
.market-tip-list{
  margin:0;
  padding-left:1.1rem;
  display:grid;
  gap:10px;
}
.market-tip-list li{
  padding-left:.2rem;
}
.market-next-card{
  display:grid;
  gap:12px;
}
.market-next-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.market-next-card .btn{
  min-width:160px;
}
.visually-hidden{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  white-space:nowrap !important;
  border:0 !important;
}
@media (max-width:880px){
  .market-card{
    padding:16px;
  }
  .market-table{
    min-width:720px;
  }
}
@media (max-width:720px){
  .market-page-wrap{
    padding:16px;
  }
  .market-card{
    padding:14px;
  }
  .market-table{
    min-width:0;
    border:0;
    background:transparent;
  }
  .market-table,
  .market-table tbody,
  .market-table tr,
  .market-table td{
    display:block;
    width:100%;
  }
  .market-table thead{
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    white-space:nowrap;
  }
  .market-table tbody{
    display:grid;
    gap:12px;
  }
  .market-table tr{
    border:1px solid color-mix(in oklab, var(--text) 10%, transparent);
    border-radius:14px;
    overflow:hidden;
    background:var(--bg);
    box-shadow:var(--shadow-rest, var(--shadow-2));
  }
  .market-table tr.is-featured{
    background:color-mix(in oklab, var(--accent) 7%, var(--bg));
  }
  .market-table td{
    display:grid !important;
    grid-template-columns:minmax(86px, 102px) minmax(0, 1fr);
    gap:12px;
    align-items:start;
    padding:12px 14px;
    text-align:left;
    border-bottom:1px solid color-mix(in oklab, var(--text) 8%, transparent);
    background:transparent !important;
  }
  .market-table td::before{
    content:none !important;
  }
  .market-mobile-label{
    display:block;
    margin:0;
    font-size:.82rem;
    font-weight:780;
    line-height:1.3;
    color:color-mix(in oklab, var(--text) 68%, transparent);
  }
  .market-cell-value{
    display:grid;
    gap:6px;
    min-width:0;
    justify-items:start;
    text-align:left;
  }
  .market-table td .market-place-wrap,
  .market-table td .market-day-cell{
    gap:6px;
  }
  .market-table td.market-action-cell .market-cell-value{
    width:100%;
  }
  .market-table td:last-child{
    border-bottom:0;
  }
  .market-table tr.is-featured td:first-child{
    box-shadow:inset 4px 0 0 color-mix(in oklab, var(--accent) 42%, transparent);
  }
  .market-route-btn{
    width:100%;
  }
}

/* Markets static HTML upgrade 2026-06-26 */
.market-hero{
  grid-template-columns:minmax(0,1.05fr) minmax(280px,.95fr);
  align-items:center;
  gap:22px;
}
.market-hero-copy{display:grid;gap:12px;}
.market-hero-media{
  display:block;
  overflow:hidden;
  border-radius:18px;
  min-height:260px;
  box-shadow:0 18px 42px rgba(15,23,42,.14);
  background:var(--surface-2);
}
.market-hero-media img{
  display:block;
  width:100%;
  height:100%;
  min-height:260px;
  object-fit:cover;
}
.market-hero-pills{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.market-hero-pills span,
.market-profile-kicker{
  display:inline-flex;
  align-items:center;
  gap:7px;
  width:max-content;
  max-width:100%;
  padding:7px 10px;
  border-radius:999px;
  background:color-mix(in oklab, var(--accent) 8%, var(--bg));
  color:color-mix(in oklab, var(--text) 86%, transparent);
  font-size:.86rem;
  font-weight:720;
}
.market-icon{
  width:17px;
  height:17px;
  flex:0 0 17px;
  vertical-align:-3px;
}
.market-place-wrap,
.market-day-cell,
.market-time,
.market-type-pill{
  align-items:center;
}
.market-time,
.market-type-pill{
  display:inline-flex;
  gap:7px;
}
.market-table{
  box-shadow:0 12px 30px rgba(15,23,42,.06);
}
.market-table thead th{
  position:sticky;
  top:0;
}
.market-type-pill{
  border:1px solid color-mix(in oklab, var(--text) 8%, transparent);
}
.market-route-btn{
  border-color:color-mix(in oklab, var(--accent) 22%, transparent) !important;
}
.market-route-btn:hover{
  transform:translateY(-1px);
  text-decoration:none;
}
.market-tip-grid,
.market-profile-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.market-tip-card,
.market-profile{
  display:grid;
  gap:9px;
  align-content:start;
  padding:14px;
  border:1px solid color-mix(in oklab, var(--text) 8%, transparent);
  border-radius:14px;
  background:color-mix(in oklab, var(--bg) 82%, var(--surface));
}
.market-tip-card{
  grid-template-columns:24px minmax(0,1fr);
}
.market-tip-card strong,
.market-profile h3{
  display:block;
  margin:0 0 4px;
}
.market-tip-card p,
.market-profile p{
  margin:0;
  color:var(--muted);
}
.market-profile .market-route-btn{
  width:max-content;
  margin-top:4px;
}
@media (max-width:920px){
  .market-hero{grid-template-columns:1fr;}
  .market-tip-grid,
  .market-profile-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:620px){
  .market-tip-grid,
  .market-profile-grid{grid-template-columns:1fr;}
  .market-hero-pills span{width:100%;}
  .market-hero-media,
  .market-hero-media img{min-height:220px;}
}

/* Markets table desktop polish 2026-06-26b */
@media (min-width:881px){
  .market-table{
    min-width:1060px;
    table-layout:fixed;
  }
  .market-table th,
  .market-table td{
    padding:16px 14px;
  }
  .market-table th:nth-child(1),
  .market-table td.market-place-cell{
    width:150px;
  }
  .market-table th:nth-child(2),
  .market-table td.market-day-col{
    width:128px;
    min-width:128px;
  }
  .market-table th:nth-child(3),
  .market-table td.market-time-cell{
    width:185px;
    min-width:185px;
  }
  .market-table th:nth-child(4),
  .market-table td.market-type-cell{
    width:145px;
  }
  .market-table th:nth-child(6),
  .market-table td.market-action-cell{
    width:150px;
    min-width:150px;
  }
  .market-place-wrap,
  .market-day-cell,
  .market-time{
    display:grid;
    grid-template-columns:18px minmax(0,1fr);
    column-gap:8px;
    row-gap:5px;
    align-items:start;
  }
  .market-place-wrap .market-badge{
    grid-column:2;
    width:max-content;
    max-width:100%;
  }
  .market-place,
  .market-day{
    line-height:1.32;
  }
  .market-time{
    white-space:normal;
    overflow-wrap:normal;
    word-break:normal;
  }
  .market-type-pill{
    display:inline-grid;
    grid-template-columns:16px minmax(0,1fr);
    gap:7px;
    align-items:center;
    max-width:100%;
    line-height:1.25;
  }
  .market-tip-text{
    max-width:34ch;
    line-height:1.42;
  }
  .market-action-cell .market-cell-value{
    display:flex;
    justify-content:flex-end;
  }
  .market-route-btn{
    min-width:128px;
    padding-inline:12px;
  }
}

@media (min-width:721px) and (max-width:880px){
  .market-table{
    min-width:980px;
  }
}