/* 31판 phone polish: the slim top bar that replaces a screen's title once it scrolls away, sticky rows that sit under it,
   and fixes found while going through every screen at phone width */
.ctop{display:none}
@media (max-width:1099px){
  :root{--ctop-h:48px}
  .ctop{display:flex;position:fixed;left:0;right:0;top:0;z-index:32;align-items:center;gap:4px;height:calc(var(--ctop-h) + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) 8px 0 6px;box-sizing:border-box;
    background:color-mix(in srgb,var(--bg) 95%,transparent);-webkit-backdrop-filter:saturate(1.8) blur(16px);backdrop-filter:saturate(1.8) blur(16px);border-bottom:1px solid var(--line-2);
    transform:translateY(-100%);opacity:0;pointer-events:none;transition:transform .2s ease,opacity .16s ease}
  .ctop.on{transform:none;opacity:1;pointer-events:auto}
  .ctop-back{width:40px;height:40px;flex:none;color:var(--ink)}
  .ctop-pad{width:10px;flex:none}
  .ctop-t{flex:1;min-width:0;border:0;background:none;padding:0;text-align:left;font:inherit;font-size:16px;font-weight:800;letter-spacing:-.02em;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;height:40px}
  .ctop-pp{display:flex;align-items:center;gap:0;flex:none;font-size:13.5px;font-weight:700;color:var(--ink)}
  .ctop-pp .ibtn{width:32px;height:36px;color:var(--ink-2)}
  .ctop-pp span{white-space:nowrap;max-width:46vw;overflow:hidden;text-overflow:ellipsis}
  /* rows that stay on screen while the page scrolls sit right under the slim bar instead of under the home bar's height */
  .sticky-tabs{top:calc(var(--ctop-h) + env(safe-area-inset-top,0px))}
  .dayh{top:calc(var(--ctop-h) + env(safe-area-inset-top,0px));z-index:3}
  .b8-chips{top:calc(var(--ctop-h) + env(safe-area-inset-top,0px))}
}
@media (prefers-reduced-motion:reduce){.ctop{transition:none}}
/* 후잉 맞추기 without the connector: the explanation wrapped nowhere (the row's nowrap was inherited) and widened the page */
.wh-state .stack{white-space:normal;min-width:0}
/* 항목 관리's type tabs and 아이템 정리's search stay reachable through long lists */
@media (max-width:1099px){
  .set-sub .set-stick{position:sticky;top:calc(var(--ctop-h) + env(safe-area-inset-top,0px));z-index:6;background:var(--bg);margin:0 calc(-1 * var(--gut,16px));padding-left:var(--gut,16px)!important;padding-right:var(--gut,16px)!important}
  .set-sub .set-stick:has(.searchbox){padding-top:6px!important;padding-bottom:6px!important}
  .tx-list .dayh{position:sticky;background:var(--bg)}
}
@media (max-width:899px){
  /* 종목 편집 on a phone: the price and count boxes were too narrow for a six-digit 매입단가 */
  .mk-edr{grid-template-columns:18px minmax(0,1fr) 104px 30px}
  /* 금융자산: 다음 장부 반영 takes the whole row, so its note reads on one line */
  .mk-kpi:nth-child(4){grid-column:1/-1;padding:12px 0 0;border-left:0;border-top:1px solid var(--line-2)}
}
@media (max-width:1099px){
  /* 장부 감사: the four group counts sat in a row wider than the phone, the last one cut in half; two by two shows them all */
  .aud-ks{display:grid!important;grid-template-columns:1fr 1fr;gap:8px;overflow:visible;margin:0;padding:0 0 4px}
  .aud-ks .aud-k{min-width:0}
  /* 예산 설정's quick actions wrap instead of hiding the last one past the edge */
  .bs-tools{flex-wrap:wrap!important;overflow:visible;margin-right:0;padding-right:0}
}
/* tablets keep the slim rail on the left: the bar starts after it */
@media (min-width:768px) and (max-width:1099px){.ctop{left:96px;padding-left:10px}}