/* Predict2U v229 — mobile-only board control redesign
   Desktop/tablet toolbar remains untouched. Phones use a dedicated stacked control surface. */

.p2u-mobile-board-controls,
.p2u-mobile-filter-sheet{display:none}

@media (max-width:720px){
  body.p2u-mobile-filter-open{overflow:hidden!important;touch-action:none}

  #board.p2u-board-shell{
    width:100%!important;
    margin:0 0 26px!important;
    padding:18px 14px 22px!important;
    border-radius:24px!important;
    overflow:hidden!important;
  }

  #board .p2u-board-head{
    display:block!important;
    margin:0 0 16px!important;
  }

  #board .p2u-board-heading{
    display:grid!important;
    grid-template-columns:52px minmax(0,1fr)!important;
    align-items:start!important;
    gap:13px!important;
    min-width:0!important;
  }

  #board .p2u-board-icon{
    width:52px!important;height:52px!important;flex-basis:52px!important;
    border-radius:16px!important;font-size:20px!important;
  }

  #board .p2u-board-heading-copy{min-width:0!important;width:100%!important}
  #board .p2u-board-heading .t-h2{
    margin:0!important;
    font-size:clamp(29px,8.4vw,36px)!important;
    line-height:1.02!important;
    letter-spacing:-.045em!important;
  }

  #board .p2u-board-subline{
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    gap:8px!important;
    margin-top:11px!important;
    font-size:11.5px!important;
    line-height:1.45!important;
  }
  #board .p2u-board-subline #board-sub{
    flex:0 0 100%!important;
    color:#a9b4c3!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  #board .p2u-board-fresh-dot{width:8px!important;height:8px!important;flex:0 0 8px!important}
  #board #board-analysed{min-width:0!important;color:#8e9aaa!important;white-space:normal!important}

  /* The old desktop toolbar and search panel are removed from the phone layout. */
  #board .p2u-board-toolbar,
  #board .p2u-board-search-panel{display:none!important}

  #board .p2u-mobile-board-controls{
    display:block!important;
    margin:0 0 16px!important;
    padding:12px!important;
    border-radius:20px!important;
    background:linear-gradient(180deg,rgba(8,19,31,.94),rgba(5,14,24,.98))!important;
    border:1px solid rgba(255,255,255,.07)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 14px 30px rgba(0,0,0,.18)!important;
  }

  #board .p2u-mobile-control-label{
    margin:0 0 9px!important;
    color:#758396!important;
    font-size:10px!important;
    font-weight:850!important;
    letter-spacing:.12em!important;
    text-transform:uppercase!important;
  }

  #board .p2u-mobile-view-tabs{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
  }

  #board .p2u-mobile-view-tab{
    position:relative!important;
    min-width:0!important;
    min-height:84px!important;
    margin:0!important;
    padding:10px 8px!important;
    border-radius:16px!important;
    border:1px solid #203348!important;
    background:rgba(5,15,26,.82)!important;
    color:#dce4ed!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:8px!important;
    overflow:hidden!important;
    box-shadow:none!important;
  }

  #board .p2u-mobile-view-tab.is-active{
    border-color:rgba(180,239,49,.55)!important;
    background:linear-gradient(180deg,rgba(119,196,28,.16),rgba(52,92,15,.08))!important;
    color:#c9ff43!important;
    box-shadow:inset 0 0 0 1px rgba(180,239,49,.06),0 8px 20px rgba(119,196,28,.08)!important;
  }

  #board .p2u-mobile-view-icon{
    width:30px!important;height:30px!important;border-radius:10px!important;
    display:grid!important;place-items:center!important;
    background:rgba(255,255,255,.045)!important;
    color:#9eabbc!important;font-size:13px!important;
  }
  #board .p2u-mobile-view-tab.is-active .p2u-mobile-view-icon{background:rgba(180,239,49,.14)!important;color:#c9ff43!important}

  #board .p2u-mobile-view-copy{display:flex!important;flex-direction:column!important;align-items:flex-start!important;min-width:0!important}
  #board .p2u-mobile-view-copy strong{font-size:12px!important;font-weight:850!important;line-height:1.1!important;white-space:nowrap!important}
  #board .p2u-mobile-view-copy small{display:none!important}

  #board .p2u-mobile-view-count{
    position:absolute!important;top:9px!important;right:9px!important;
    min-width:24px!important;height:24px!important;padding:0 6px!important;
    border-radius:999px!important;display:grid!important;place-items:center!important;
    background:#172636!important;color:#eef4fa!important;font-size:10px!important;font-weight:900!important;
  }
  #board .p2u-mobile-view-tab.is-active .p2u-mobile-view-count{background:rgba(180,239,49,.17)!important;color:#d4ff62!important}

  #board .p2u-mobile-filter-launch{
    width:100%!important;min-height:58px!important;margin:10px 0 0!important;padding:9px 12px!important;
    border-radius:16px!important;border:1px solid #203348!important;
    background:rgba(5,15,26,.82)!important;color:#eef3f8!important;
    display:grid!important;grid-template-columns:36px minmax(0,1fr) 18px!important;align-items:center!important;gap:10px!important;
    text-align:left!important;box-shadow:none!important;
  }
  #board .p2u-mobile-filter-launch-icon{width:36px!important;height:36px!important;border-radius:12px!important;display:grid!important;place-items:center!important;background:rgba(119,196,28,.12)!important;color:#b9f336!important}
  #board .p2u-mobile-filter-launch-copy{min-width:0!important;display:flex!important;flex-direction:column!important;gap:3px!important}
  #board .p2u-mobile-filter-launch-copy strong{font-size:12.5px!important;font-weight:850!important;line-height:1.15!important}
  #board .p2u-mobile-filter-launch-copy small{font-size:10.5px!important;color:#7f8c9d!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  #board .p2u-mobile-filter-chevron{font-size:11px!important;color:#667486!important;justify-self:end!important}

  .p2u-mobile-filter-sheet{
    display:block!important;
    position:fixed!important;inset:0!important;z-index:9996!important;
    visibility:hidden!important;pointer-events:none!important;opacity:0!important;
    transition:opacity .2s ease,visibility .2s ease!important;
  }
  .p2u-mobile-filter-sheet.is-open{visibility:visible!important;pointer-events:auto!important;opacity:1!important}
  .p2u-mobile-filter-backdrop{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:rgba(0,4,10,.68)!important;backdrop-filter:blur(8px)!important}
  .p2u-mobile-filter-panel{
    position:absolute!important;left:0!important;right:0!important;
    bottom:max(78px,calc(68px + env(safe-area-inset-bottom)))!important;
    max-height:calc(100dvh - 110px)!important;overflow:auto!important;
    padding:10px 16px calc(18px + env(safe-area-inset-bottom))!important;
    border-radius:26px 26px 0 0!important;
    background:linear-gradient(180deg,#0b1522 0%,#07101b 100%)!important;
    border:1px solid rgba(255,255,255,.08)!important;border-bottom:0!important;
    box-shadow:0 -22px 55px rgba(0,0,0,.45)!important;
    transform:translateY(105%)!important;transition:transform .24s ease!important;
  }
  .p2u-mobile-filter-sheet.is-open .p2u-mobile-filter-panel{transform:translateY(0)!important}
  .p2u-mobile-filter-handle{width:42px!important;height:4px!important;border-radius:99px!important;background:#334255!important;margin:2px auto 14px!important}
  .p2u-mobile-filter-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:16px!important;margin-bottom:18px!important}
  .p2u-mobile-filter-kicker{display:block!important;color:#a9e52a!important;font-size:9px!important;font-weight:900!important;letter-spacing:.14em!important;margin-bottom:5px!important}
  .p2u-mobile-filter-head h3{margin:0!important;font-size:23px!important;line-height:1.05!important;letter-spacing:-.035em!important}
  .p2u-mobile-filter-close{width:42px!important;height:42px!important;min-height:42px!important;padding:0!important;border-radius:50%!important;border:1px solid #26394d!important;background:#0b1b2a!important;color:#dfe7ef!important;display:grid!important;place-items:center!important}

  .p2u-mobile-filter-field{display:block!important;margin:0 0 14px!important;color:#a9b5c4!important;font-size:11px!important;font-weight:800!important}
  .p2u-mobile-filter-field>span{display:flex!important;align-items:center!important;gap:8px!important;margin:0 0 7px!important}
  .p2u-mobile-filter-field>span i{color:#aeea2d!important}
  .p2u-mobile-filter-field select,
  .p2u-mobile-filter-field input{
    width:100%!important;height:52px!important;min-height:52px!important;margin:0!important;padding:0 14px!important;
    border-radius:15px!important;border:1px solid #26394d!important;background:#091826!important;color:#f4f7fa!important;
    font-size:13px!important;outline:0!important;box-shadow:none!important;
  }
  .p2u-mobile-filter-field input:focus,
  .p2u-mobile-filter-field select:focus{border-color:rgba(180,239,49,.65)!important;box-shadow:0 0 0 3px rgba(180,239,49,.08)!important}
  .p2u-mobile-filter-actions{display:grid!important;grid-template-columns:1fr 1.35fr!important;gap:10px!important;margin-top:18px!important}
  .p2u-mobile-filter-actions button{width:100%!important;min-height:50px!important;margin:0!important;padding:0 14px!important;border-radius:15px!important;font-size:12px!important;font-weight:900!important}
  .p2u-mobile-filter-reset{border:1px solid #2a3a4c!important;background:#0a1825!important;color:#c4cdd8!important}
  .p2u-mobile-filter-done{border:1px solid #b6ee32!important;background:linear-gradient(145deg,#c9ff3d,#79c51c)!important;color:#07130a!important}

  #board .date-strip,
  #board #engine-pills{
    display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;
    scrollbar-width:none!important;-webkit-overflow-scrolling:touch!important;scroll-snap-type:x proximity!important;
  }
  #board .date-strip::-webkit-scrollbar,#board #engine-pills::-webkit-scrollbar{display:none!important}
  #board .date-strip{margin-left:-14px!important;margin-right:-14px!important;padding-left:14px!important;padding-right:14px!important;gap:10px!important}
  #board .date-chip{flex:0 0 124px!important;min-width:124px!important;scroll-snap-align:start!important}
  #board #engine-pills{margin-left:-14px!important;margin-right:-14px!important;padding-left:14px!important;padding-right:14px!important;gap:9px!important}
  #board #engine-pills .pill{flex:0 0 auto!important;min-width:max-content!important;scroll-snap-align:start!important}

  #board .p2u-personalization-bar{padding:12px!important;border-radius:18px!important}
  #board .p2u-personal-left{display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px!important;width:100%!important}
  #board .p2u-my-board,#board .p2u-personalize-button{width:100%!important;min-width:0!important;min-height:46px!important;padding:0 9px!important;border-radius:14px!important;font-size:11px!important;overflow:hidden!important;text-overflow:ellipsis!important}
  #board .p2u-personal-summary{grid-column:1/-1!important;white-space:normal!important}
  #board .p2u-view-switch{width:100%!important;min-width:0!important;justify-content:space-between!important;padding:7px!important;border-radius:16px!important}

  body.p2u-v227-ready #p2u-slip-fab{right:max(14px,env(safe-area-inset-right))!important}
}

@media (max-width:380px){
  #board.p2u-board-shell{padding-left:12px!important;padding-right:12px!important}
  #board .p2u-board-heading{grid-template-columns:46px minmax(0,1fr)!important;gap:11px!important}
  #board .p2u-board-icon{width:46px!important;height:46px!important;flex-basis:46px!important}
  #board .p2u-board-heading .t-h2{font-size:28px!important}
  #board .p2u-mobile-board-controls{padding:10px!important}
  #board .p2u-mobile-view-tabs{gap:6px!important}
  #board .p2u-mobile-view-tab{min-height:78px!important;padding:9px 7px!important;border-radius:14px!important}
  #board .p2u-mobile-view-copy strong{font-size:11px!important}
  #board .date-chip{flex-basis:112px!important;min-width:112px!important}
}

@media (max-height:560px) and (orientation:landscape) and (max-width:920px){
  .p2u-mobile-filter-panel{bottom:0!important;max-height:92dvh!important;border-radius:22px 22px 0 0!important}
  #board .p2u-mobile-view-tabs{grid-template-columns:repeat(3,minmax(110px,1fr))!important;overflow-x:auto!important}
}