/* Mobile-only overrides. Desktop and tablet stay unchanged. */
.mobile-header,
.mobile-run-sheet,
.mobile-dock,
.mobile-more-sheet,
.strategy-mobile-tabs{
  display:none;
}

@media (max-width:1024px){
  :root{
    --mobile-dock-h:72px;
    --mobile-footer-h:24px;
    --mobile-pad:12px;
  }

  html,
  body{
    width:100%;
    max-width:100%;
    min-width:0;
    overflow:hidden;
    overscroll-behavior:none;
  }

  body{
    padding:0!important;
  }

  body.mobile-sheet-open{
    overflow:hidden;
  }

  /* Desktop side rail is replaced by the thumb-friendly bottom dock. */
  .side{
    display:none!important;
  }

  body .nav{
    min-height:56px;
    height:56px;
    padding:0 10px;
    flex-wrap:nowrap;
    overflow:hidden;
    gap:8px;
    background:rgba(255,253,250,.94);
    border-bottom:1px solid var(--shell-border,var(--b1));
    box-shadow:0 6px 22px rgba(76,54,35,.06);
  }

  body .nav .nav-brand{
    display:flex!important;
    min-width:0!important;
    width:auto;
    flex:0 0 auto!important;
    margin:0!important;
  }

  body .nav .nav-brand svg{
    width:116px;
    max-width:116px;
    height:42px;
  }

  body .nav .nav-title,
  body .nav .top-console-group,
  body .nav .top-user-group,
  body .nav #navUser,
  body .nav .log-chip{
    display:none!important;
  }

  body .nav .nav-r.top-actions{
    order:0;
    flex:1 1 auto;
    flex-basis:auto;
    min-width:0;
    padding:0;
    overflow:visible;
    justify-content:flex-end;
    gap:5px;
  }

  body .nav .top-group{
    height:32px;
    padding:3px;
    flex:0 0 auto;
  }

  body .nav .top-status-group .top-duo{
    display:none;
  }

  body .nav #runBadge{
    min-width:54px;
  }

  body .nav .nav-mode-badge{
    max-width:92px;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .page,
  .page.active{
    min-width:0;
    width:100%;
  }

  .page.active{
    display:flex;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch;
    padding-bottom:calc(var(--mobile-dock-h) + var(--mobile-footer-h) + env(safe-area-inset-bottom));
    scroll-padding-bottom:calc(var(--mobile-dock-h) + var(--mobile-footer-h) + env(safe-area-inset-bottom));
  }

  .card,
  .panel,
  section,
  article{
    min-width:0;
  }

  button,
  [role="button"],
  input,
  select,
  textarea{
    touch-action:manipulation;
  }

  body.mobile-layout label:has(input[type="checkbox"]),
  body.mobile-layout label:has(input[type="radio"]){
    min-width:44px;
    min-height:44px;
  }

  button,
  .btn,
  [role="button"]{
    min-height:44px;
  }

  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea{
    min-height:44px;
    font-size:16px!important;
  }

  /* Bottom dock */
  .mobile-dock{
    position:fixed;
    left:8px;
    right:8px;
    bottom:calc(4px + env(safe-area-inset-bottom));
    z-index:9100;
    height:var(--mobile-dock-h);
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    align-items:center;
    gap:4px;
    padding:7px;
    border:1px solid rgba(221,205,184,.9);
    border-radius:22px;
    background:rgba(255,253,250,.94);
    box-shadow:0 16px 42px rgba(77,52,31,.18),inset 0 1px 0 rgba(255,255,255,.92);
    backdrop-filter:blur(18px) saturate(1.12);
  }

  .mobile-dock-item{
    appearance:none;
    border:0;
    border-radius:16px;
    background:transparent;
    color:var(--t3,#6B5F52);
    display:flex;
    min-width:0;
    min-height:56px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:3px;
    font-size:10.5px;
    font-weight:800;
    letter-spacing:.01em;
    transition:transform .14s ease,background .14s ease,color .14s ease,box-shadow .14s ease;
  }

  .mobile-dock-item:active{
    transform:scale(.94);
  }

  .mobile-dock-item.active{
    color:#C7345B;
    background:linear-gradient(145deg,#FDEBF1,#FFF8FA);
    box-shadow:inset 0 0 0 1px rgba(199,52,91,.16),0 7px 18px rgba(199,52,91,.12);
  }

  .mobile-dock-ico{
    display:grid;
    place-items:center;
    height:23px;
    min-width:24px;
    font-size:17px;
    line-height:1;
    font-weight:900;
  }

  /* More sheet */
  .mobile-more-sheet{
    position:fixed;
    inset:0;
    z-index:12000;
    display:block;
    visibility:hidden;
    pointer-events:none;
  }

  .mobile-more-sheet.show{
    visibility:visible;
    pointer-events:auto;
  }

  .mobile-more-backdrop{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    border:0;
    border-radius:0;
    background:rgba(48,35,25,.38);
    opacity:0;
    transition:opacity .2s ease;
    backdrop-filter:blur(2px);
  }

  .mobile-more-sheet.show .mobile-more-backdrop{
    opacity:1;
  }

  .mobile-more-panel{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    max-height:min(82vh,720px);
    overflow-y:auto;
    padding:8px 14px calc(18px + env(safe-area-inset-bottom));
    border:1px solid rgba(225,210,190,.94);
    border-bottom:0;
    border-radius:28px 28px 0 0;
    background:linear-gradient(180deg,#FFFDFA 0%,#FBF5ED 100%);
    box-shadow:0 -24px 64px rgba(70,48,30,.2);
    transform:translateY(105%);
    transition:transform .24s cubic-bezier(.2,.8,.2,1);
  }

  .mobile-more-sheet.show .mobile-more-panel{
    transform:translateY(0);
  }

  .mobile-sheet-handle{
    width:42px;
    height:5px;
    margin:0 auto 12px;
    border-radius:999px;
    background:#DCCDBB;
  }

  .mobile-more-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:12px;
  }

  .mobile-more-head h2{
    margin:2px 0 0;
    font-size:22px;
    line-height:1.2;
    color:var(--t1,#2D2A26);
  }

  .mobile-more-eyebrow{
    color:#C7345B;
    font-size:10px;
    font-weight:900;
    letter-spacing:.18em;
  }

  .mobile-sheet-close{
    width:44px;
    height:44px;
    border:1px solid var(--b1);
    border-radius:14px;
    background:#fff;
    color:var(--t2);
    font-size:25px;
    line-height:1;
    box-shadow:0 6px 18px rgba(90,65,45,.08);
  }

  .mobile-account{
    display:none;
    grid-template-columns:46px minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
    margin-bottom:12px;
    padding:11px;
    border:1px solid #E7DACA;
    border-radius:18px;
    background:rgba(255,255,255,.82);
    box-shadow:0 8px 24px rgba(130,100,70,.07);
  }

  .mobile-account.on{
    display:grid;
  }

  .mobile-account-avatar{
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    border-radius:15px;
    color:#fff;
    background:linear-gradient(145deg,#EF5B78,#8B6EE8);
    font-size:18px;
    font-weight:900;
    box-shadow:0 8px 18px rgba(199,52,91,.2);
  }

  .mobile-account-copy{
    display:flex;
    min-width:0;
    flex-direction:column;
    gap:3px;
  }

  .mobile-account-copy strong{
    overflow:hidden;
    color:var(--t1);
    font-size:14px;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .mobile-account-copy span{
    color:var(--t3);
    font-size:11px;
  }

  .mobile-account-status{
    padding:4px 8px;
    border:1px solid #B6E0C8;
    border-radius:999px;
    color:#2A7A50;
    background:#E7F5EE;
    font-size:10px;
    font-weight:800;
  }

  .mobile-more-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }

  .mobile-more-item{
    display:grid;
    grid-template-columns:36px minmax(0,1fr);
    grid-template-rows:auto auto;
    column-gap:9px;
    align-items:center;
    min-width:0;
    min-height:76px;
    padding:10px;
    text-align:left;
    border:1px solid #E7DACA;
    border-radius:18px;
    color:var(--t1);
    background:rgba(255,255,255,.86);
    box-shadow:0 7px 20px rgba(115,84,57,.07);
  }

  .mobile-more-item:active{
    transform:scale(.97);
    background:#FDEEF3;
  }

  .mobile-more-item > span{
    grid-row:1 / 3;
    display:grid;
    place-items:center;
    width:36px;
    height:36px;
    border-radius:12px;
    background:#F6EFE7;
    font-size:19px;
  }

  .mobile-more-item b{
    align-self:end;
    overflow:hidden;
    font-size:13px;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .mobile-more-item small{
    align-self:start;
    overflow:hidden;
    color:var(--t3);
    font-size:10px;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .mobile-logout{
    width:100%;
    margin-top:12px;
    border:1px solid #F0C1CD;
    border-radius:16px;
    color:#B6294D;
    background:#FDEBF1;
    font-size:13px;
    font-weight:800;
  }


  /* Independent mobile shell replaces desktop navigation in touch layout. */
  body.mobile-layout{
    --mobile-header-h:78px;
    --mobile-footer-h:0px;
    padding:0!important;
  }
  body.mobile-layout .side,
  body.mobile-layout .nav{
    display:none!important;
  }
  body.mobile-layout .mobile-header{
    display:flex;
  }
  body.mobile-layout .mobile-run-sheet{
    display:block;
  }
  body.mobile-layout .fb-fab,
  body.mobile-layout #beianFooter{
    display:none!important;
  }

  .mobile-header{
    position:relative;
    z-index:9050;
    flex:0 0 auto;
    min-height:var(--mobile-header-h);
    padding:calc(10px + env(safe-area-inset-top)) 12px 10px;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    background:rgba(255,253,250,.96);
    border-bottom:1px solid rgba(226,211,192,.94);
    box-shadow:0 8px 26px rgba(76,54,35,.08);
    backdrop-filter:blur(18px) saturate(1.08);
  }
  .mobile-header-copy{min-width:0;display:grid;gap:3px}
  .mobile-header-eyebrow{font-size:9px;font-weight:900;letter-spacing:.16em;color:#B580E8}
  .mobile-header h1{min-width:0;max-width:100%;font-size:19px;line-height:1.15;color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mobile-header-status{display:flex;align-items:center;gap:6px;min-width:0;flex-wrap:wrap}
  .mobile-state{display:inline-flex;align-items:center;gap:5px;min-width:0;color:var(--t3);font-size:10.5px;line-height:1.2}
  .mobile-state i{width:7px;height:7px;border-radius:50%;background:#9B938B;box-shadow:0 0 0 3px rgba(155,147,139,.12)}
  .mobile-state b{font-weight:800;max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mobile-state.mode-live{color:#C1274B}.mobile-state.mode-live i{background:#EF5B78;box-shadow:0 0 0 3px rgba(239,91,120,.14)}
  .mobile-state.mode-paper{color:#2A7A50}.mobile-state.mode-paper i{background:#52B788;box-shadow:0 0 0 3px rgba(82,183,136,.14)}
  .mobile-state.run-on{color:#2A7A50}.mobile-state.run-on i{background:#52B788;box-shadow:0 0 0 3px rgba(82,183,136,.15)}
  .mobile-state.run-stop{color:#8A5D66}.mobile-state.run-stop i{background:#EF5B78;box-shadow:0 0 0 3px rgba(239,91,120,.12)}
  .mobile-header-control{
    width:58px;min-width:58px;min-height:52px;border:1px solid rgba(199,52,91,.22);border-radius:16px;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
    background:linear-gradient(145deg,#FDEBF1,#FFF9FB);color:#C7345B;box-shadow:0 8px 20px rgba(199,52,91,.10);
  }
  .mobile-header-control span{font-size:19px;line-height:1}.mobile-header-control b{font-size:10px}

  .mobile-run-sheet{position:fixed;inset:0;z-index:9800;display:block;visibility:hidden;pointer-events:none}
  .mobile-run-sheet.show{visibility:visible;pointer-events:auto}
  .mobile-run-backdrop{position:absolute;inset:0;width:100%;height:100%;border:0;background:rgba(37,27,20,.42);opacity:0;transition:opacity .2s ease}
  .mobile-run-sheet.show .mobile-run-backdrop{opacity:1}
  .mobile-run-panel{
    position:absolute;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));
    max-height:calc(var(--mobile-viewport-height,100dvh) - 16px - env(safe-area-inset-top));overflow-y:auto;
    padding:8px 14px 14px;border:1px solid rgba(221,205,184,.94);border-radius:24px;
    background:#FFFDFA;box-shadow:0 24px 70px rgba(57,39,24,.28);
    transform:translateY(calc(100% + 24px));transition:transform .24s cubic-bezier(.22,.78,.2,1);
  }
  .mobile-run-sheet.show .mobile-run-panel{transform:translateY(0)}
  .mobile-run-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 12px}
  .mobile-run-head h2{font-size:20px;color:var(--t1)}
  .mobile-run-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px}
  .mobile-run-card{min-width:0;padding:12px;border:1px solid var(--b1);border-radius:16px;background:linear-gradient(145deg,#fff,#FFF8F3)}
  .mobile-run-card span{display:block;margin-bottom:5px;font-size:10px;color:var(--t3);font-weight:800;letter-spacing:.06em}
  .mobile-run-card strong{display:block;font-size:14px;line-height:1.4;overflow-wrap:anywhere}
  .mobile-run-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .mobile-run-actions button,.mobile-run-execution{min-height:50px;border-radius:15px;font-size:14px;font-weight:900}
  .mobile-run-start{border:1px solid #A8D8BD;background:#EAF8F0;color:#217347}
  .mobile-run-stop{border:1px solid #F0B5C4;background:#FDECF1;color:#B92F54}
  .mobile-run-execution{width:100%;margin-top:8px;padding:0 14px;border:1px solid var(--b1);display:flex;align-items:center;justify-content:space-between;background:#fff;color:var(--t1)}
  .mobile-run-execution span{font-size:24px;color:#C7345B}
  .mobile-legal{display:flex;flex-wrap:wrap;justify-content:center;gap:5px 10px;padding:10px 6px 2px;font-size:10px;line-height:1.5}
  .mobile-legal a{color:var(--t3);text-decoration:none;overflow-wrap:anywhere}

}

@media (max-width:380px){
  .mobile-header{padding-left:9px;padding-right:9px;gap:8px}
  .mobile-header h1{font-size:17px}
  .mobile-state b{max-width:88px}
  .mobile-header-control{width:52px;min-width:52px}
}
