.mobile-community-board{
  display:none;
}

@media(max-width:768px){
  body.mobile-board-view{
    background:#fff !important;
    color:#20242b;
  }

  body.mobile-board-view .board-page{
    width:100%;
    max-width:430px !important;
    min-height:100vh;
    margin:0 auto !important;
    padding:86px 18px 54px !important;
    background:#fff !important;
  }

  body.mobile-board-view .board-main{
    width:100% !important;
    margin:0 !important;
  }

  body.mobile-board-view .board-header,
  body.mobile-board-view .board-category-bar,
  body.mobile-board-view .board-table,
  body.mobile-board-view .board-bottom,
  body.mobile-board-view .pagination{
    display:none !important;
  }

  body.mobile-board-view .mobile-community-board{
    display:block;
  }

  .mobile-board-appbar{
    display:none;
    height:0;
    align-items:center;
    justify-content:space-between;
    background:#fff;
  }

  .mobile-board-icon{
    width:42px;
    height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:0;
    background:transparent;
    color:#4b5563;
    cursor:pointer;
  }

  .mobile-board-icon svg{
    width:24px;
    height:24px;
    stroke:currentColor;
    stroke-width:2;
    fill:none;
  }

  .mobile-board-tabs{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    align-items:end;
    height:44px;
    border-bottom:1px solid #eceff3;
    background:#fff;
  }

  .mobile-board-tabs button{
    position:relative;
    height:44px;
    border:0;
    background:transparent;
    color:#111827;
    font-size:16px !important;
    font-weight:900 !important;
    line-height:1 !important;
    letter-spacing:0 !important;
    cursor:pointer;
  }

  .mobile-board-tabs button.active::after{
    content:"";
    position:absolute;
    left:10px;
    right:10px;
    bottom:-1px;
    height:2px;
    border-radius:999px;
    background:#ffd54a;
  }

  .mobile-board-subtabs{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:48px;
    padding:10px 8px;
    overflow-x:auto;
    background:#fafafa;
    -webkit-overflow-scrolling:touch;
  }

  .mobile-board-subtabs[hidden]{
    display:none !important;
  }

  .mobile-board-subtabs::-webkit-scrollbar{
    display:none;
  }

  .mobile-board-subtabs button{
    flex:0 0 auto;
    min-width:0;
    height:28px;
    padding:0 16px;
    border:0;
    border-radius:999px;
    background:transparent;
    color:#737b86;
    font-size:13px !important;
    font-weight:850 !important;
    line-height:1 !important;
    letter-spacing:0 !important;
    white-space:nowrap;
    cursor:pointer;
  }

  .mobile-board-subtabs button.active{
    background:#ffecad;
    color:#c4911f;
  }

  .mobile-board-actions{
    display:flex;
    justify-content:flex-end;
    padding:12px 2px 4px;
    background:#fff;
  }

  .mobile-board-write-btn{
    height:38px;
    padding:0 18px;
    border:0;
    border-radius:999px;
    background:#111;
    color:#fff;
    font-size:13px !important;
    font-weight:900 !important;
    line-height:1 !important;
    letter-spacing:0 !important;
    box-shadow:0 10px 20px rgba(0,0,0,.14);
    cursor:pointer;
  }

  .mobile-board-list{
    padding-top:12px;
    background:#fff;
  }

  .mobile-board-empty{
    padding:58px 8px;
    color:#a6adb6;
    font-size:14px;
    font-weight:800;
    text-align:center;
  }

  .mobile-post-card{
    display:block;
    width:100%;
    padding:15px 22px 17px 22px;
    border-bottom:1px solid #eef0f3;
    background:#fff;
    cursor:pointer;
  }

  .mobile-post-author{
    display:flex;
    align-items:center;
    gap:7px;
    margin-bottom:9px;
    color:#8e97a3;
    font-size:12px;
    font-weight:850;
    line-height:1.2;
  }

  .mobile-post-avatar{
    width:20px;
    height:20px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#f4f5f7;
    color:#9aa2ad;
    font-size:10px;
    font-weight:900;
    overflow:hidden;
  }

  .mobile-post-main{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
  }

  .mobile-post-text{
    min-width:0;
    flex:1 1 auto;
  }

  .mobile-post-title{
    margin:0;
    display:-webkit-box;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    color:#242a33;
    font-size:16px !important;
    font-weight:950 !important;
    line-height:1.34 !important;
    letter-spacing:0 !important;
    word-break:keep-all;
  }

  .mobile-post-new{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-left:6px;
    padding:3px 6px;
    border-radius:999px;
    background:#ffdf3f;
    color:#111;
    font-size:10px;
    font-weight:950;
    line-height:1;
    vertical-align:middle;
  }

  .mobile-post-category{
    display:block;
    margin-top:7px;
    color:#b0b7c0;
    font-size:12px;
    font-weight:850;
    line-height:1;
  }

  .mobile-post-thumb{
    flex:0 0 54px;
    width:54px;
    height:54px;
    overflow:hidden;
    border-radius:8px;
    background:#f3f4f6;
  }

  .mobile-post-thumb img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
  }

  .mobile-post-meta{
    display:flex;
    align-items:center;
    gap:14px;
    margin-top:15px;
    color:#c3c9d0;
    font-size:12px;
    font-weight:850;
    line-height:1;
  }

  .mobile-post-meta span{
    display:inline-flex;
    align-items:center;
    gap:4px;
    min-width:0;
  }

  .mobile-post-meta .point{
    color:#7f8791;
  }

  .mobile-post-meta .point.has-point{
    color:#3b82f6;
  }

  .mobile-request-status{
    min-width:112px;
    padding:7px 10px;
    border-radius:999px;
    background:#fff3c4;
    color:#8a6500;
    font-size:11px;
    font-weight:950;
    line-height:1;
    white-space:nowrap;
  }

  .mobile-request-status.done{
    background:#111;
    color:#fff;
  }

  .mobile-post-meta time{
    margin-left:auto;
    color:#b4bbc4;
    white-space:nowrap;
  }

  .mobile-board-loading{
    padding:50px 8px;
    color:#a6adb6;
    font-size:14px;
    font-weight:850;
    text-align:center;
  }
}

@media(max-width:390px){
  body.mobile-board-view .board-page{
    padding-left:14px !important;
    padding-right:14px !important;
  }

  .mobile-post-card{
    padding-left:20px;
    padding-right:14px;
  }

  .mobile-board-subtabs button{
    padding:0 13px;
    font-size:12px !important;
  }
}


/* ===== mobile pinned notice posts ===== */
@media(max-width:768px){
  .mobile-post-card.is-notice{
    border-left:4px solid #d2a81e;
    border-bottom-color:#ead68b;
    background:#fff9df;
  }

  .mobile-post-card.is-notice .mobile-post-title{
    color:#050505;
    font-weight:1000 !important;
  }

  .mobile-notice-prefix{
    color:#9a6700;
    font-weight:1000;
  }

  .mobile-post-card.is-notice .mobile-post-category{
    color:#80631a;
    font-weight:950;
  }
}

/* ===== compact mobile board list spacing ===== */
@media(max-width:768px){
  .mobile-board-list{
    padding-top:6px;
  }

  .mobile-post-card{
    padding:12px 14px 13px;
  }

  .mobile-post-author{
    gap:6px;
    margin-bottom:6px;
  }

  .mobile-post-main{
    gap:12px;
  }

  .mobile-post-title{
    font-size:15px !important;
    line-height:1.3 !important;
  }

  .mobile-post-category{
    margin-top:5px;
  }

  .mobile-post-thumb{
    flex-basis:48px;
    width:48px;
    height:48px;
    border-radius:6px;
  }

  .mobile-post-meta{
    gap:12px;
    margin-top:10px;
  }

  .mobile-request-status{
    min-width:96px;
    padding:6px 9px;
  }

  .mobile-post-card.is-notice{
    padding-top:12px;
    padding-bottom:13px;
  }
}

@media(max-width:390px){
  .mobile-post-card{
    padding-left:14px;
    padding-right:12px;
  }
}

/* ===== force white board navigation on mobile ===== */
@media(max-width:768px){
  body header,
  body.board-header-over-hero header{
    background:#050505 !important;
    border-bottom-color:rgba(255,255,255,.12) !important;
    box-shadow:none !important;
  }

  body.board-header-over-hero header{
    background:transparent !important;
  }

  body header .logo a,
  body header #logo-text{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
  }

  body header .mobile-menu-btn{
    border-color:rgba(255,255,255,.5) !important;
    background:rgba(0,0,0,.3) !important;
    color:#fff !important;
  }

  body header .mobile-menu-btn::before,
  body header .mobile-menu-btn::after,
  body header .mobile-menu-btn span{
    background:#fff !important;
    color:#fff !important;
  }
}


/* footprint intro: keep the header white and the scroll control at the hero bottom */
@media(max-width:768px){
  body.board-header-over-hero header{
    background:transparent !important;
  }

  .board-footprint-hero > .board-operation-scroll{
    left:50% !important;
    bottom:24px !important;
  }
}


/* ===== motion editorial board: mobile ===== */
@media(max-width:768px){
  .board-page{
    padding-top:76px !important;
    padding-bottom:60px !important;
  }

  .board-operation-hero.board-motion-hero{
    width:100vw;
    min-height:100svh;
    margin:-152px 0 0 calc(50% - 50vw);
    padding:150px 22px 124px;
    align-items:center;
  }

  .board-motion-hero::after{right:22px}

  .board-motion-hero #boardOperationTitle{
    font-size:clamp(50px,16.5vw,72px);
    letter-spacing:-.075em;
  }

  .board-operation-kicker{
    gap:9px;
    margin-bottom:23px;
    font-size:9px;
  }

  .board-operation-kicker i{width:22px}

  .board-motion-hero .board-operation-lead{
    margin-top:35px;
    font-size:23px;
  }

  .board-motion-hero .board-operation-lead span{
    display:block;
  }

  .board-motion-hero .board-operation-copy{
    margin-top:21px;
    font-size:13px;
    line-height:1.75;
    word-break:keep-all;
  }

  .board-motion-hero .board-operation-copy p + p{margin-top:5px}

  .board-motion-hero .board-operation-label{
    margin-top:27px;
    font-size:10px;
  }

  .board-hero-ghost{
    top:42%;
    font-size:92px;
  }

  .board-motion-hero > .board-operation-scroll{
    bottom:26px !important;
  }

  .board-motion-hero > .board-operation-scroll > i{
    width:46px;
    height:46px;
  }

  .board-content-shell{
    width:calc(100% - 32px);
    padding:76px 0 20px;
  }

  .board-content-shell .board-header{
    margin-bottom:34px;
    padding-bottom:28px;
    display:block;
  }

  .board-section-index{
    display:block;
    padding:0 0 18px;
  }

  .board-header-copy h1{
    font-size:42px;
  }

  .board-header-copy p{
    margin-top:17px;
    font-size:13px;
  }

  .board-toolbar{
    display:block;
    margin-bottom:16px;
  }

  .board-content-shell .board-category-bar{
    width:100%;
    overflow-x:auto;
    justify-content:flex-start;
    scrollbar-width:none;
  }

  .board-content-shell .board-category-bar::-webkit-scrollbar{display:none}

  .board-content-shell .board-category-bar button{
    flex:0 0 auto;
    height:44px;
    padding:0 15px;
    font-size:13px;
  }

  .board-content-shell .board-bottom{
    margin-top:14px;
  }

  .board-search-field{
    width:auto;
    flex:1 1 auto;
  }

  .board-search-field input,
  .board-content-shell .write-btn{
    height:44px;
  }

  .board-content-shell .write-btn{
    flex:0 0 auto;
    gap:10px;
  }

  .board-content-shell .board-table,
  .board-content-shell .pagination{
    display:none;
  }

  .mobile-community-board{
    width:calc(100% - 32px);
    margin:0 auto;
    background:transparent;
  }

  .mobile-board-list{background:transparent}

  .mobile-post-card{
    margin:0;
    padding:15px 4px 16px;
    border-bottom:1px solid #d9d8d2;
    background:transparent;
  }

  .mobile-post-card.is-notice{
    padding-left:12px;
    border-left:3px solid #111;
    background:#fff200;
  }

  .mobile-board-write-btn{display:none}
}

@media(max-width:390px){
  .board-motion-hero #boardOperationTitle{font-size:14.8vw}
  .board-content-shell{width:calc(100% - 28px)}
}