/* ── Full timeshare demo visual system v1 (2026-09-21) ── */
:root{
  --radius:8px;
  --radius-sm:6px;
  --radius-lg:8px;
  --shadow-sm:0 0 0 1px rgba(0,0,0,.04),0 2px 2px rgba(0,0,0,.08);
  --shadow:0 0 0 1px rgba(0,0,0,.04),0 2px 2px rgba(0,0,0,.08);
  --shadow-header:0 4px 10px rgba(78,89,105,.06);
}
html,body{font-family:'PingFang SC',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important}
body{background:#F5F6F7!important;color:rgba(17,17,17,.8)!important}
.side{width:220px!important;border-right:0!important;box-shadow:1px 0 0 #E5E6EB!important}
.brand{height:60px!important;padding:0 24px!important;border-bottom:1px solid #E5E6EB!important}
.menu{padding:12px 12px 22px!important;gap:4px!important}
.mitem{min-height:36px!important;border-radius:8px!important;padding:0 12px!important}
.mitem.active{background:var(--accent-soft)!important;color:var(--accent)!important}
.mitem.active::before{background:var(--accent)!important}
.topbar{height:60px!important;padding:0 24px!important;background:#fff!important;backdrop-filter:none!important;box-shadow:var(--shadow-header)!important;border-bottom:0!important}
.main>.content{background:#F5F6F7!important}
.page-head{background:#F5F6F7!important;padding-top:0!important}
.page-head h2{font-size:16px!important;line-height:26px!important;font-weight:500!important;color:rgba(0,0,0,.8)!important}
.page-head p{font-size:12px!important;line-height:20px!important;color:rgba(17,17,17,.6)!important}
.card,.tbl-wrap,.toolbar,.f2-filterbar,.fill-layout,.flow-card,.cycle-card{border-radius:8px!important;box-shadow:none!important;border-color:#E5E6EB!important;background:#fff!important}
.btn.primary{background:var(--accent)!important;border-color:var(--accent)!important}
.btn.primary:hover{background:var(--accent-hover)!important;border-color:var(--accent-hover)!important}
.btn,.btn.secondary,.btn.ghost,.btn.outline{border-radius:6px!important}
.tbl-wrap{overflow:hidden!important}
.tbl-scroll{overflow:auto!important}
table{border-collapse:collapse!important}
th{background:#F5F6F7!important;color:rgba(17,17,17,.6)!important;border-bottom:1px solid #E5E6EB!important;font-weight:500!important}
td{border-bottom:1px solid #E5E6EB!important}
.pill.blue,.pill.primary{background:var(--accent-soft)!important;color:var(--accent)!important}
.fill-step-dock,.fill-submit-dock{border-radius:0 0 8px 8px!important;box-shadow:0 -1px 0 #E3E4E5!important;background:#fff!important}
@media(max-width:900px){.side{width:200px!important}.brand{padding:0 16px!important}.topbar{padding:0 16px!important}}

/* All content pages use a shared title band without taking over their scroll host. */
body[data-current-page] .main>.content>.page.show>.page-head{background:#F5F6F7!important}
body[data-current-page="fill2"] .main>.content>.page.show>.fill2-page-head{position:sticky!important;top:0!important;z-index:42!important}
body[data-current-page="dashboard"] .main>.content>.page.show>.page-head,
body[data-current-page="workconfirm"] .main>.content>.page.show>.page-head,
body[data-current-page="task"] .main>.content>.page.show>.page-head,
body[data-current-page="taskconfig"] .main>.content>.page.show>.page-head,
body[data-current-page="deptpermissions"] .main>.content>.page.show>.page-head,
body[data-current-page="deptprojects"] .main>.content>.page.show>.page-head,
body[data-current-page="roles"] .main>.content>.page.show>.page-head,
body[data-current-page="roster"] .main>.content>.page.show>.page-head,
body[data-current-page="log"] .main>.content>.page.show>.page-head{position:relative!important;top:auto!important;z-index:1!important}
body[data-current-page="dashboard"] .main>.content>.page.show .tbl-scroll,
body[data-current-page="workconfirm"] .main>.content>.page.show .tbl-scroll,
body[data-current-page="deptpermissions"] .main>.content>.page.show .tbl-scroll,
body[data-current-page="deptprojects"] .main>.content>.page.show .tbl-scroll,
body[data-current-page="roster"] .main>.content>.page.show .tbl-scroll{scrollbar-gutter:stable}
.app-status-empty{padding:40px 16px;text-align:center;color:#86909C;font-size:14px}
.app-status-empty b{display:block;margin-bottom:4px;color:rgba(17,17,17,.8);font-weight:500}
.app-status-error{padding:24px;text-align:center;border:1px solid #F5C2C7;border-radius:8px;background:#FFF5F5;color:#C9374A}
.app-status-error button{margin-top:12px}
@media(max-width:900px){body[data-current-page] .main>.content>.page.show>.page-head{position:relative!important;top:auto!important}}
