/* PM-OD Branch B: palette-neutral presentation layer.
   Geometry, typography and overflow only. All colors come from the unchanged
   original /css/app.css tokens (production charcoal theme and light-mode). */
html[data-theme-reference="production"]{--radius:9px}

body { font-family:Inter,"Noto Sans Thai","Leelawadee UI",system-ui,sans-serif; line-height:1.5; }
button,input,select,textarea { font:inherit; }
button { transition:background-color .15s ease,border-color .15s ease,color .15s ease; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible {
  outline:3px solid var(--primary); outline-offset:3px;
}
.topbar { border:1px solid var(--border); box-shadow:none; margin-top:16px; gap:20px; }
.brand-text h1 { font-size:17px; font-weight:650; letter-spacing:-.025em; }
.brand-sub { font-size:12px; }
.brand-meta { font-size:11px; }
.search-wrap,.filter-select,.btn-theme-pill,.user-trigger,.tenant-switcher-btn { border-radius:6px; }
.btn-add-pill,.btn-primary,.todo-quickadd button,.md-add-row button,.pf-submit { border-radius:6px; font-weight:600;
}
.btn-refresh-pill { border:1px solid var(--border); border-radius:6px; }
.user-avatar { box-shadow:none; }
.user-menu-dropdown,.tenant-switcher-menu { border-radius:8px; }
.main { min-width:0; }
.subtabs { gap:2px; overflow-x:auto; scrollbar-width:thin; }
.subtab { white-space:nowrap; flex:0 0 auto; border-radius:5px 5px 0 0; font-size:13px; padding:12px 14px; }
.subtab.active { border-bottom-color:var(--primary); }
.view h2 { letter-spacing:-.025em; font-size:22px; }
.row.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.row.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.row>*,.kpi-row>* { min-width:0; }
.card,.kpi-tile,.project-card,.pd-header,.pd-kpi,.pd-section,.md-card { box-shadow:var(--shadow); border-radius:9px; }
.card-title { font-size:13px; letter-spacing:0; text-transform:none; font-weight:600; }
.kpi-tile { border-top:3px solid var(--primary); }
.kpi-tile:nth-child(2) { border-top-color:var(--red); }
.kpi-tile:nth-child(3) { border-top-color:var(--amber); }
.kpi-tile:nth-child(4) { border-top-color:var(--green); }
.kpi-tile:nth-child(6) { border-top-color:var(--purple); }
.kpi-tile:hover { transform:none; box-shadow:var(--shadow); }
.kpi-head { font-size:11px; letter-spacing:.035em; }
.kpi-value,.pd-kpi-value,.engineer-stats dd,.bar-row .count { font-variant-numeric:tabular-nums; letter-spacing:-.035em; }
.kpi-value { font-size:32px; font-weight:650; margin:10px 0 8px; }
.kpi-foot { font-size:12px; }
.kpi-pulse { animation:none; }
.bar-row { grid-template-columns:minmax(60px,90px) minmax(0,1fr) 32px; gap:8px; }
.bar-track,.bar-fill { border-radius:4px; }
.table-wrap { max-width:100%; overflow:auto; border-radius:6px; }
table.data th { text-transform:none; letter-spacing:0; font-size:12px; font-weight:500; white-space:nowrap; }
table.data th,table.data td { border-right:1px solid var(--border); padding:11px 12px; }
table.data th:last-child,table.data td:last-child { border-right:0; }
.task-table { min-width:1000px; }
.task-table tbody tr.is-done { opacity:1; }
.tasks-scroll { max-width:100%; }
.pill { border-radius:4px; font-size:12px; font-weight:500; white-space:nowrap; }
.table-customer-pill { border-radius:4px; }
.icon-btn { border-radius:5px; }
.engineer-card h3 { font-size:15px; }
.engineer-stats dt { font-size:10px; letter-spacing:.025em; }
.engineer-stats dd { font-weight:600; }
.deadline-card,.todo-row,.ot-row,.md-row { border-radius:6px; box-shadow:none; }
.deadline-col-head,.todo-section-head { border-bottom:1px solid var(--border); padding-bottom:10px; }
.todo-row { border-left:3px solid var(--primary); }
.todo-row.completed { opacity:1; border-left-color:var(--green); }
.todo-priority { border-radius:4px; }
.ot-eng-chip,.engineer-chip { border-radius:4px; }
.project-meta-chip strong { margin-right:5px; font-weight:500; }
.project-card .name,.project-row-title { font-weight:600; }
.pd-title { font-weight:600; letter-spacing:-.03em; }
.pd-impl-tasks { overflow-x:auto; max-width:100%; }
.modal { backdrop-filter:blur(3px); }
.modal-panel,.cal-drawer { border:1px solid var(--border); border-radius:12px; box-shadow:var(--shadow-lg); }
.modal-head { border-bottom:1px solid var(--border); padding:18px 20px; }
.modal-head h3 { font-size:18px; letter-spacing:-.02em; }
.modal-body { padding:20px; }
.modal-body input:not([type=checkbox]):not([type=radio]),.modal-body select,.modal-body textarea,
.todo-quickadd input,.md-add-row input,.proj-filter-input { border:1px solid var(--border); border-radius:6px; }
.fc .fc-toolbar-title { font-size:19px; font-weight:600; }
.fc .fc-col-header-cell-cushion { font-weight:500; }
@media(max-width:1100px) {
  .topbar,.main { max-width:calc(100vw - 32px); }
  .main { padding-inline:12px; }
  .card { padding:16px; }
  .donut-wrap,.bar-chart-wrap { min-width:0; }
}
@media(max-width:700px) {
  .topbar { margin-top:8px; padding:16px; }
  .topbar,.main { max-width:calc(100vw - 16px); }
  .brand-block { flex:1 1 100%; width:100%; max-width:100%; flex-wrap:wrap; min-width:0; }
  .tenant-switcher { max-width:100%; }
  .tenant-switcher-btn { max-width:100%; }
  .tenant-switcher-label { min-width:0; overflow:hidden; text-overflow:ellipsis; }
  .header-controls { justify-content:flex-start; width:100%; }
  .search-wrap { flex:1 1 100%; min-width:0; }
  .search-wrap input { min-width:0; width:100%; }
  .subtabs { margin-bottom:16px; }
  .row.two,.row.three { grid-template-columns:minmax(0,1fr); }
  .kpi-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .filter-select { min-width:0; max-width:100%; }
  .brand-text h1 { font-size:16px; }
  .project-milestones li { flex-wrap:wrap; }
  .project-card .ms-dates { flex-shrink:1; min-width:0; white-space:normal; overflow-wrap:anywhere; }
  .pd-impl-row { grid-template-columns:minmax(0,1fr) minmax(50px,1fr) 68px; gap:8px; }
  .pd-impl-count { min-width:0; width:auto; }
  button,.filter-select { min-height:40px; }
  .subtab { min-height:44px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}

/* Sidebar surfaces reuse existing production topbar/field/status tokens. */
html[data-theme-reference="production"] .variant-sidebar{background:var(--tb-grad-start);color:var(--tb-fg)}
html[data-theme-reference="production"] .variant-sidebar .subtab.active{color:var(--text)}
html[data-theme-reference="production"] .variant-nav-toggle{background:var(--tb-field-bg);border-color:var(--tb-field-bd);color:var(--tb-fg)}