/* ==========================================================================
   内页滚动（顶栏固定、内容区滚动）
   --------------------------------------------------------------------------
   解决的问题：
   整页滚动时，浏览器滚动条从「视口最顶端」开始画 —— 而顶栏是从 32px 往下开始的
   （桌面客户端顶部那 32px 拖拽条），于是滚动条的上箭头悬在标题栏那一行，
   和顶栏底边对不齐，视觉上很别扭；而且那条 15px 宽的系统滚动条又重又显眼。

   做法：
   1) 页面本身不滚（body overflow:hidden + flex 竖排），滚动交给 main.wrap；
      滚动条顶端自然落在顶栏底边上。
   2) 滚动条重画为 10px 细滑块、透明轨道、无上下箭头，与目录树/看板一致。

   用法：<link rel="stylesheet" href="/static/scrollfix.css">
        前提：页面结构为 <header class="topbar"> + <main class="wrap">，
              且 body 上由 shell.css 提供 padding-left/padding-top。
        页面对 .wrap 的 max-width / padding 自定义不受影响
        （本文件只给 width:100%，特异性高于 .wrap）。
   ========================================================================== */

html,body{height:100%}
body{box-sizing:border-box;overflow:hidden;display:flex;flex-direction:column}
.topbar{flex:none}

main.wrap{flex:1;min-height:0;width:100%;overflow-y:auto;overflow-x:auto}

main.wrap::-webkit-scrollbar{width:10px;height:10px}
main.wrap::-webkit-scrollbar-track{background:transparent}
main.wrap::-webkit-scrollbar-thumb{
  background:#d3d9e2;border-radius:5px;
  border:3px solid transparent;background-clip:content-box}
main.wrap::-webkit-scrollbar-thumb:hover{
  background:#c2cad6;border:3px solid transparent;background-clip:content-box}
main.wrap::-webkit-scrollbar-corner{background:transparent}