/* U7K MERLIN HQC // MOBILE + IPAD READABILITY PASS
   Loaded last. Touch-first sizing; desktop >1366 keeps compact HQ density. */

:root{--touch-target:44px}
@media(pointer:coarse){button,select,input{min-height:var(--touch-target)}}

@media(max-width:1366px){
  .ob-shell{padding:132px 16px 48px}
  .ob-topbar{height:116px;grid-template-columns:210px minmax(0,1fr);grid-template-rows:64px 52px}
  .ob-topbar .brand{grid-column:1;grid-row:1;padding:0 16px}
  .ob-top-title{grid-column:2;grid-row:1;padding:0 16px}
  .ob-top-title .eyebrow{font-size:.64rem}.ob-top-title strong{font-size:.82rem}
  .ob-topbar .statusbar{grid-column:1/-1;grid-row:2;min-width:0;min-height:52px;justify-content:flex-end;overflow-x:auto;border-top:1px solid rgba(121,215,232,.07);scrollbar-width:none}
  .ob-topbar .statusbar::-webkit-scrollbar{display:none}
  .brand-copy>small:first-child{font-size:.56rem}.brand-copy b{font-size:1.06rem}.brand-copy>small:last-child{font-size:.54rem}
  .health,.operator{min-height:52px;padding:0 14px}.health b,.operator b{font-size:.66rem}.health small,.operator small{font-size:.54rem}
  .logout{min-height:52px;padding:0 16px;font-size:.6rem}
  .server-selector{min-height:52px;flex:0 0 126px;min-width:126px;padding:0 12px}
  .server-selector small{font-size:.5rem}.server-selector select{min-height:30px;font-size:.62rem}
  .sos-control{min-width:82px;width:82px;min-height:52px;padding:8px 9px;text-align:center}.sos-control b{font-size:11px}.sos-control small{font-size:7px;max-width:64px;overflow:hidden;text-overflow:ellipsis}
  .hq-tabs{top:116px;gap:8px;margin-bottom:14px;padding:9px 0}
  .hq-tabs a{min-height:46px;padding:0 18px;font-size:.64rem}
  .eyebrow{font-size:.68rem}
  .ob-hero{min-height:170px;padding:24px 2px 20px}.ob-hero p,.engine-head p{font-size:.9rem;line-height:1.55}
  .ob-live{min-height:58px;padding:14px 16px}.ob-live small{font-size:.56rem}.ob-live strong{font-size:.78rem}
  .ob-identity>span{min-height:66px;padding:14px 16px}
  .ob-identity small,.ob-rows small,.metric-card small,.ob-board>header small,.command-controls>header small{font-size:.56rem}
  .ob-identity strong{font-size:.74rem}.metric-card{min-height:142px;padding:20px!important}.metric-card>span{font-size:.58rem}
  .ob-board>header{min-height:64px;padding:14px 16px}.ob-board>header strong,.command-controls>header strong{font-size:.82rem}
  .ob-board>header>b,.read-only,.command-controls>header b{font-size:.56rem}
  .ob-rows>span{min-height:50px;padding:14px 16px}.ob-rows b{font-size:.66rem}
  .ob-sos-board>p{font-size:.88rem}.sos-contract b{font-size:.68rem}
  .sos-contract small,.ob-note,.ob-roadmap small{font-size:.54rem}.ob-roadmap strong{font-size:.72rem}
  .engine-head{padding:28px 2px 22px}.engine-head h1{font-size:clamp(2.5rem,5vw,4.2rem)}
  .engine-badge{min-height:44px;display:flex;align-items:center;padding:0 14px;font-size:.56rem}
  .engine-toolbar{gap:10px;padding:12px}.engine-toolbar select,.engine-toolbar button{min-height:44px;padding:0 13px;font-size:.58rem}.engine-toolbar b{font-size:.54rem}
  .evidence-row summary{grid-template-columns:116px minmax(0,1fr) 92px 86px;gap:14px;min-height:62px;padding:13px 15px}
  .evidence-row time{font-size:.54rem}.evidence-row summary b{font-size:.66rem}
  .evidence-row summary small,.evidence-row summary em,.evidence-row summary strong{font-size:.5rem}
  .evidence-detail span{min-height:58px;padding:12px 14px}.evidence-detail small{font-size:.48rem}.evidence-detail b,.evidence-detail pre{font-size:.56rem}
  .board-tabs{gap:8px}.board-tabs button{min-height:44px;padding:0 14px;font-size:.54rem}
  .board-row{min-height:76px;padding:12px 15px}.board-name b{font-size:.68rem}.board-name small,.board-row>span small,.board-row>em{font-size:.48rem}.board-row>span b{font-size:.68rem}
  .engine-empty{padding:38px 24px;font-size:.58rem}
  .arc-command-grid input,.arc-command-grid select{min-height:46px;font-size:.68rem}
  .arc-command-grid label span,.arc-command-grid article small,.arc-command-status small{font-size:.54rem}.arc-command-status b{font-size:.66rem}
  .arc-command-actions button{min-height:46px;padding:0 16px;font-size:.58rem}.arc-command-actions small{font-size:.52rem}
}

@media(max-width:900px){
  .ob-shell{padding:132px 12px 44px}.ob-topbar{grid-template-columns:180px minmax(0,1fr)}
  .ob-top-title{gap:9px;padding:0 12px}.ob-top-title .eyebrow{display:none}.ob-topbar .statusbar{justify-content:flex-start}.operator{display:none}
  .hq-tabs{top:116px;overflow-x:auto;scrollbar-width:none}.hq-tabs::-webkit-scrollbar{display:none}.hq-tabs a{flex:0 0 auto;min-width:118px}
  .ob-hero{align-items:flex-start;flex-direction:column;gap:18px}.ob-live{width:100%}
  .ob-identity,.ob-metrics,.ob-roadmap,.arc-command-grid,.arc-command-status{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ob-grid,.ob-rows{grid-template-columns:1fr}
  .evidence-row summary{grid-template-columns:92px minmax(0,1fr) 82px}.evidence-row summary strong{display:none}.evidence-detail{grid-template-columns:1fr}
  .board-row{grid-template-columns:42px minmax(0,1fr) 88px}
}

@media(max-width:600px){
  .ob-shell{padding:128px 10px 38px}
  .ob-topbar{height:112px;min-height:112px;grid-template-columns:1fr;grid-template-rows:56px 56px}
  .ob-topbar .brand{grid-column:1;grid-row:1;min-height:56px}.ob-top-title{display:none}
  .ob-topbar .statusbar{grid-column:1;grid-row:2;min-height:56px}
  .server-selector{flex:0 0 104px;min-width:104px}.server-selector small,.health small,.sos-control small{display:none}
  .health{padding:0 10px}.health b{font-size:.62rem}.sos-control{min-width:78px;text-align:center;padding:8px 10px}.logout{padding:0 12px}
  .hq-tabs{top:112px;margin-left:-2px;margin-right:-2px}.hq-tabs a{min-width:104px;min-height:48px;padding:0 14px;font-size:.62rem}
  .ob-hero{min-height:0;padding-top:22px}.ob-hero h1,.engine-head h1{font-size:2.25rem}.ob-hero p,.engine-head p{font-size:.9rem}
  .ob-identity,.ob-metrics,.ob-roadmap,.arc-command-grid,.arc-command-status{grid-template-columns:1fr}.metric-card{min-height:116px}
  .ob-board>header,.command-controls>header,.engine-head{align-items:flex-start;flex-direction:column}
  .sos-contract{margin:12px 14px}
  .engine-toolbar{display:grid;grid-template-columns:1fr 1fr;overflow:visible}.engine-toolbar select,.engine-toolbar button{width:100%}.engine-toolbar b{grid-column:1/-1;margin:0;padding:4px 2px 0}
  .evidence-row summary{grid-template-columns:76px minmax(0,1fr);gap:10px;min-height:70px}.evidence-row summary em{grid-column:2;justify-self:start}.evidence-row time{align-self:start;padding-top:2px}
  .board-tabs{overflow-x:auto;scrollbar-width:none}.board-tabs::-webkit-scrollbar{display:none}.board-tabs button{flex:0 0 auto;min-width:110px}
  .board-row{grid-template-columns:36px minmax(0,1fr)}.board-row>span,.board-row>em{display:none}
  .arc-command-actions{align-items:stretch;flex-direction:column}.arc-command-actions button{width:100%}.arc-command-actions small{margin-left:0}
  .ob-footer{display:none}
}

@media(max-width:390px){
  .server-selector{flex-basis:94px;min-width:94px}.health{display:none}.hq-tabs a{min-width:96px}
}


/* HQC COMMAND WORKSPACE // COMPACT RESPONSIVE OVERRIDES */
@media(max-width:1366px){
  .ob-hero.ob-hero-compact{min-height:112px;padding:14px 2px 16px}
  .ob-hero.ob-hero-compact h1{font-size:clamp(2rem,4vw,3.4rem)}
  .hq-view[data-hq-view="command"] .metric-card{min-height:124px}
  .command-section-heading small{font-size:.54rem}.command-section-heading strong{font-size:.8rem}.command-section-heading>b{font-size:.52rem}
}
@media(max-width:900px){
  .ob-hero.ob-hero-compact{min-height:0;gap:12px;padding:18px 2px 14px}
  .command-control-grid{grid-template-columns:1fr}
  .command-section-heading{margin-top:16px}
}
@media(max-width:600px){
  .ob-hero.ob-hero-compact{padding-top:16px}
  .ob-hero.ob-hero-compact h1{font-size:2rem}
  .command-section-heading{align-items:flex-start;margin:14px 2px 6px;padding-bottom:7px}
  .command-section-heading small{font-size:.52rem}.command-section-heading strong{font-size:.76rem}
  .hq-view[data-hq-view="command"] .metric-card{min-height:110px}
}


/* HQC iPad header hard-stop: SOS must never force the status row wider. */
@media(max-width:1366px){
  .sos-control{min-width:68px!important;width:68px!important;padding-left:8px!important;padding-right:8px!important}
  .sos-control small{display:none!important}
}


/* iPad / touch stability mode.
   iPad can expose a desktop-width viewport, so width breakpoints alone are unreliable. */
html[data-touch-layout="true"] body{
  background-attachment:scroll!important;
}
html[data-touch-layout="true"] *{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
html[data-touch-layout="true"] .ob-shell{
  padding-top:78px!important;
}
html[data-touch-layout="true"] .ob-topbar{
  height:64px!important;
  min-height:64px!important;
  grid-template-columns:180px minmax(160px,1fr) auto!important;
  grid-template-rows:64px!important;
}
html[data-touch-layout="true"] .ob-topbar .brand{
  grid-column:1!important;
  grid-row:1!important;
  min-height:64px!important;
  padding:0 12px!important;
}
html[data-touch-layout="true"] .ob-top-title{
  display:flex!important;
  grid-column:2!important;
  grid-row:1!important;
  min-width:0!important;
  padding:0 12px!important;
}
html[data-touch-layout="true"] .ob-topbar .statusbar{
  grid-column:3!important;
  grid-row:1!important;
  min-width:0!important;
  min-height:64px!important;
  height:64px!important;
  display:flex!important;
  flex-wrap:nowrap!important;
  justify-content:flex-end!important;
  overflow:hidden!important;
  border-top:0!important;
}
html[data-touch-layout="true"] .operator{
  display:none!important;
}
html[data-touch-layout="true"] .health{
  min-height:64px!important;
  padding:0 9px!important;
}
html[data-touch-layout="true"] .health small{
  display:none!important;
}
html[data-touch-layout="true"] .server-selector{
  flex:0 0 96px!important;
  min-width:96px!important;
  min-height:64px!important;
  padding:0 7px!important;
}
html[data-touch-layout="true"] .server-selector small{
  display:none!important;
}
html[data-touch-layout="true"] .server-selector select{
  min-height:32px!important;
  font-size:.48rem!important;
}
html[data-touch-layout="true"] .sos-control{
  flex:0 0 60px!important;
  min-width:60px!important;
  width:60px!important;
  min-height:64px!important;
  padding:8px 6px!important;
  text-align:center!important;
}
html[data-touch-layout="true"] .sos-control small{
  display:none!important;
}
html[data-touch-layout="true"] .logout{
  flex:0 0 auto!important;
  min-height:64px!important;
  padding:0 10px!important;
  font-size:.48rem!important;
  white-space:nowrap!important;
}
html[data-touch-layout="true"] .hq-tabs{
  top:64px!important;
}

@media(max-width:900px){
  html[data-touch-layout="true"] .ob-topbar{
    grid-template-columns:160px minmax(0,1fr)!important;
  }
  html[data-touch-layout="true"] .ob-top-title{
    display:none!important;
  }
  html[data-touch-layout="true"] .ob-topbar .statusbar{
    grid-column:2!important;
  }
}


/* HQC view visibility contract: active page is always explicit.
   This avoids stale hidden/display state from legacy HQ stylesheets. */
.hq-view[data-active="true"]{display:block!important}
.hq-view[data-active="false"],.hq-view[hidden]{display:none!important}

/* Keep the right-side status cluster on one line on laptop/iPad widths. */
@media(max-width:1600px){
  .ob-topbar .statusbar{flex-wrap:nowrap!important;overflow:hidden!important}
  .ob-topbar .operator{display:none!important}
  .ob-topbar .health{flex:0 0 auto!important}
  .ob-topbar .server-selector{flex:0 0 104px!important;min-width:104px!important}
  .ob-topbar .sos-control{flex:0 0 62px!important;min-width:62px!important;width:62px!important}
  .ob-topbar .sos-control small{display:none!important}
  .ob-topbar .logout{flex:0 0 auto!important;white-space:nowrap!important}
}


/* HQ NAVIGATION RAIL // sticky theatre chip */
@media(max-width:1366px){
  .hq-navigation-rail{top:116px;padding:7px 0;margin-bottom:10px}
  .hq-navigation-rail .hq-tabs{top:auto!important;margin:0!important;padding:0!important}
  .hq-navigation-rail .hq-tabs a{min-height:42px;padding:0 14px;font-size:.6rem}
}
@media(max-width:820px){
  .hq-navigation-rail{top:112px;padding:6px 0;gap:6px}
  .hq-navigation-rail .hq-tabs a{min-width:94px;min-height:42px;padding:0 12px;font-size:.58rem}
  .hq-navigation-rail .theatre-context{min-height:42px}
  .hq-navigation-rail .theatre-context>span{display:none}
  .hq-navigation-rail .theatre-context a{min-height:32px}
}
html[data-touch-layout="true"] .hq-navigation-rail{top:64px!important}
html[data-touch-layout="true"] .hq-navigation-rail .hq-tabs{top:auto!important}


/* iPhone navigation: keep the iPad rail, but stop squeezing HQ tabs and theatre controls
   into one faux four-button row on phone widths. */
@media(max-width:600px){
  .hq-navigation-rail{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    align-items:stretch!important;
    gap:6px!important;
    padding:6px 0 8px!important;
  }
  .hq-navigation-rail .hq-tabs{
    width:100%!important;
    min-width:0!important;
    gap:6px!important;
    overflow-x:auto!important;
    overscroll-behavior-x:contain!important;
    scroll-snap-type:x proximity;
  }
  .hq-navigation-rail .hq-tabs a{
    flex:0 0 auto!important;
    min-width:92px!important;
    min-height:40px!important;
    padding:0 12px!important;
    font-size:.55rem!important;
    scroll-snap-align:start;
  }
  .hq-navigation-rail .theatre-context{
    width:100%!important;
    max-width:none!important;
    min-height:38px!important;
    margin:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:stretch!important;
    flex:none!important;
  }
  .hq-navigation-rail .theatre-context>div{
    min-width:0!important;
    padding:0 12px!important;
  }
  .hq-navigation-rail .theatre-context>span{
    display:none!important;
  }
  .hq-navigation-rail .theatre-context strong{
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:.56rem!important;
  }
  .hq-navigation-rail .theatre-context a{
    min-height:30px!important;
    margin:3px!important;
    padding:0 10px!important;
    font-size:.36rem!important;
  }
}
@media(max-width:390px){
  .hq-navigation-rail .hq-tabs a{min-width:86px!important;padding:0 10px!important}
  .hq-navigation-rail .theatre-context a{padding:0 8px!important;font-size:.34rem!important}
}


/* HQC HEADER // centre theatre strap removed everywhere */
.ob-top-title,
html[data-touch-layout="true"] .ob-top-title{
  display:none!important;
}


/* HQC UNIFIED HEADER // final responsive authority */
@media(max-width:1366px){
  .ob-shell{padding-top:72px!important}
  .ob-topbar.hq-unified-topbar{
    height:60px!important;
    min-height:60px!important;
    grid-template-columns:190px minmax(0,1fr) auto!important;
    grid-template-rows:60px!important;
  }
  .ob-topbar.hq-unified-topbar .brand{
    grid-column:1!important;
    grid-row:1!important;
    min-height:60px!important;
    padding:0 12px!important;
  }
  .ob-topbar.hq-unified-topbar .hq-navigation-rail{
    grid-column:2!important;
    grid-row:1!important;
    top:auto!important;
    height:60px!important;
    padding:7px 6px!important;
    margin:0!important;
  }
  .ob-topbar.hq-unified-topbar .hq-tabs{
    top:auto!important;
    height:46px!important;
    margin:0!important;
    padding:0!important;
  }
  .ob-topbar.hq-unified-topbar .statusbar{
    grid-column:3!important;
    grid-row:1!important;
    min-height:60px!important;
    height:60px!important;
    border-top:0!important;
    justify-content:flex-end!important;
    overflow:hidden!important;
  }
  .ob-topbar.hq-unified-topbar .health{min-height:60px!important}
  .ob-topbar.hq-unified-topbar .logout{min-height:60px!important}
}

html[data-touch-layout="true"] .ob-shell{padding-top:72px!important}
html[data-touch-layout="true"] .ob-topbar.hq-unified-topbar{
  height:60px!important;
  min-height:60px!important;
  grid-template-columns:180px minmax(0,1fr) auto!important;
  grid-template-rows:60px!important;
}
html[data-touch-layout="true"] .ob-topbar.hq-unified-topbar .brand{
  min-height:60px!important;
  padding:0 11px!important;
}
html[data-touch-layout="true"] .ob-topbar.hq-unified-topbar .hq-navigation-rail{
  grid-column:2!important;
  grid-row:1!important;
  height:60px!important;
  padding:7px 5px!important;
}
html[data-touch-layout="true"] .ob-topbar.hq-unified-topbar .statusbar{
  grid-column:3!important;
  grid-row:1!important;
  min-height:60px!important;
  height:60px!important;
}
html[data-touch-layout="true"] .ob-topbar.hq-unified-topbar .health{
  min-height:60px!important;
  padding:0 8px!important;
}
html[data-touch-layout="true"] .ob-topbar.hq-unified-topbar .logout{
  min-height:60px!important;
  padding:0 9px!important;
}

@media(max-width:900px){
  .ob-shell{padding-top:70px!important}
  .ob-topbar.hq-unified-topbar{
    grid-template-columns:160px minmax(0,1fr) auto!important;
  }
  .ob-topbar.hq-unified-topbar .hq-tabs a{
    min-width:72px!important;
    min-height:44px!important;
    padding:0 9px!important;
    font-size:.44rem!important;
  }
  .ob-topbar.hq-unified-topbar .theatre-context{
    min-height:44px!important;
    height:44px!important;
    max-width:205px!important;
  }
  .ob-topbar.hq-unified-topbar .theatre-context>span{display:none!important}
}

@media(max-width:600px){
  .ob-shell{padding-top:68px!important}
  .ob-topbar.hq-unified-topbar{
    height:58px!important;
    min-height:58px!important;
    grid-template-columns:128px minmax(0,1fr) 54px!important;
    grid-template-rows:58px!important;
  }
  .ob-topbar.hq-unified-topbar .brand{
    min-height:58px!important;
    padding:0 9px!important;
  }
  .ob-topbar.hq-unified-topbar .hq-navigation-rail{
    height:58px!important;
    padding:6px 4px!important;
    overflow-x:auto!important;
  }
  .ob-topbar.hq-unified-topbar .hq-tabs{
    height:44px!important;
    min-width:118px!important;
  }
  .ob-topbar.hq-unified-topbar .hq-tabs a{
    min-width:76px!important;
    min-height:44px!important;
    padding:0 9px!important;
    font-size:.41rem!important;
  }
  .ob-topbar.hq-unified-topbar .theatre-context{
    flex:0 0 152px!important;
    max-width:152px!important;
    min-height:44px!important;
    height:44px!important;
  }
  .ob-topbar.hq-unified-topbar .statusbar{
    grid-column:3!important;
    height:58px!important;
    min-height:58px!important;
  }
  .ob-topbar.hq-unified-topbar .health{display:none!important}
  .ob-topbar.hq-unified-topbar .logout{
    width:54px!important;
    min-height:58px!important;
    padding:0 5px!important;
    font-size:.34rem!important;
  }
}


/* MOBILE HAMBURGER // loaded last, overrides legacy phone rail */
@media(max-width:600px){
  .ob-topbar.hq-unified-topbar{
    grid-template-columns:128px minmax(92px,1fr) 52px 54px!important;
  }
  .ob-topbar.hq-unified-topbar .hq-mobile-theatre{
    display:grid!important;
    grid-column:2!important;
    grid-row:1!important;
  }
  .ob-topbar.hq-unified-topbar .hq-mobile-menu-toggle{
    display:grid!important;
    grid-column:3!important;
    grid-row:1!important;
  }
  .ob-topbar.hq-unified-topbar .statusbar{
    grid-column:4!important;
    grid-row:1!important;
    width:54px!important;
    min-width:54px!important;
  }
  .ob-topbar.hq-unified-topbar .hq-navigation-rail{
    position:fixed!important;
    left:8px!important;
    right:8px!important;
    top:64px!important;
    width:auto!important;
    height:auto!important;
    max-height:calc(100vh - 76px)!important;
    padding:8px!important;
    display:grid!important;
    overflow:auto!important;
  }
  .ob-topbar.hq-unified-topbar .hq-tabs{
    width:100%!important;
    height:auto!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .ob-topbar.hq-unified-topbar .theatre-context{
    flex:none!important;
    width:100%!important;
    max-width:none!important;
    height:auto!important;
    min-height:48px!important;
  }
}


/* MOBILE HAMBURGER // touch phones must show the complete permitted menu */
@media(max-width:600px){
  html[data-touch-layout="true"] .ob-topbar.hq-unified-topbar .hq-navigation-rail{
    height:auto!important;
    max-height:calc(100dvh - 76px)!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
  }
  html[data-touch-layout="true"] .ob-topbar.hq-unified-topbar .hq-tabs{
    height:auto!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    overflow:visible!important;
  }
  html[data-touch-layout="true"] .ob-topbar.hq-unified-topbar .hq-tabs a,
  html[data-touch-layout="true"] .ob-topbar.hq-unified-topbar .hq-tabs a[data-hq-tab="leaderboards"]{
    min-width:0!important;
    width:100%!important;
    min-height:48px!important;
  }
  html[data-touch-layout="true"] .ob-topbar.hq-unified-topbar .theatre-context{
    flex:none!important;
    width:100%!important;
    max-width:none!important;
    height:auto!important;
    min-height:48px!important;
  }
}